@charset "utf-8";

@import url("popup.css");

/* common */
.subTit {
    margin: 15px 0 20px;
    padding-bottom: 20px;
    background: url(../img/main/bg_info.gif) 0 100% repeat-x;
    font-size: 30px;
    font-weight: bold;
    color: #333;
    line-height: 30px;
}
.containerWrap.searchArea .content .subTit {
    margin: 15px 0 0;
    padding-bottom: 10px;
    background: none;
    border-bottom: 2px solid #4b4d54;
    font-size: 18px;
}
.content .btn_casting {
    width: 205px;
    float: right;
}
.ui-datepicker .ui-datepicker-select-year td a {
    padding: 0 !important;
}

/* ------- 페이지 리뉴얼(2023) { ------- */

/* 리뉴얼 카테고리 */
.cate-wrap .depth {
    display: flex;
    flex-wrap: wrap;
}
.cate-wrap .depth li:last-child {
    margin-right: 0;
}
.cate-wrap .depth li {
    margin: 3px 0;
    margin-right: 10px;
    font-size: 16px;
}
.cate-wrap .depth1 li a {
    display: block;
    font-weight: 600;
    line-height: 50px;
    color: #333;
    padding: 0 25px;
    border: 1px solid #e6e6e6;
    border-radius: 25px;
    transition: all 0.4s;
    background-color: #e6e6e6;
}
.cate-wrap .depth1 li.on a,
.cate-wrap .depth1 li:hover a {
    color: #fff;
    background-color: #333;
    border-color: #333;
}
.cate-wrap .depth2 {
    margin-top: 5px;
}
.cate-wrap .depth2 li a {
    display: block;
    font-weight: 600;
    line-height: 50px;
    color: #333;
    padding: 0 17px;
    text-align: center;
    min-width: 80px;
    background-color: #f7f7f7;
    border: 1px solid #f7f7f7;
    border-radius: 10px;
    transition: all 0.4s;
}
.cate-wrap .depth2 li.on a,
.cate-wrap .depth2 li:hover a {
    color: #12b3fb;
    background-color: #fff;
    border-color: #12b3fb;
}

/* 리뉴얼 카테고리 - select-box */
.cate-slctWrap {
    margin: 20px 0 30px;
}
.cate-slctWrap .inner {
    display: flex;
}
.cate-slctWrap .slctBox {
    position: relative;
    min-width: 200px;
    height: 45px;
    margin-left: 5px;
    padding: 0 25px;
    border: 1px solid #d8e1e5;
    border-radius: 22.5px;
    cursor: pointer;
}
.cate-slctWrap .slctBox:nth-of-type(1) {
    margin-left: 0;
}
.cate-slctWrap .slctBox select {
    width: 100%;
    height: 100%;
    font-size: 16px;
    font-weight: 600;
    padding: 0 15px 0 0;
    border: none;
    background: none;
    font-family: inherit;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
}
.cate-slctWrap .slctBox option {
    color: #000;
}
.cate-slctWrap .slctBox .arrow {
    position: absolute;
    top: 18px;
    right: 22px;
}
.cate-slctWrap .slctBox.type2 {
    background-color: #333;
    border-color: #333;
}
.cate-slctWrap .slctBox.type2 select {
    color: #fff;
}
.cate-slctWrap .slctBox.type2 .arrow {
    stroke: #fff;
}

.dft-top {
    position: relative;
    max-width: 1920px;
    height: 150px;
    margin: 18px auto 70px;
}
.dft-top .inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding-left: 30px;
}
.dft-top .tag {
    display: inline-block;
    width: fit-content;
    margin-bottom: 15px;
    font-size: 16px;
    padding: 5px 10px;
}
.dft-top .tag.new {
    color: #fff;
    background-color: #f59d62;
}
.dft-top .tag.best {
    color: #fff;
    background-color: #cc7676;
}
.dft-top h2 {
    font-size: 30px;
    line-height: 100%;
    padding-top: 12px;
}
.dft-top .sub {
    font-size: 16px;
    line-height: 1.5em;
    margin-top: 18px;
}
.dft-top.premium_title h2,
.dft-top.premium_title .sub {
    color: #fff;
}
.dft-top .bg {
    display: flex;
    justify-content: center;
    overflow: hidden;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: -1;
}
.dft-top .bg img {
    display: block;
}

.lecSlide {
    position: relative;
    margin-top: 50px;
}
.lecSlide .swiper-slide {
    height: 200px;
}
.lecSlide .navi {
    position: absolute;
    top: 75px;
}
.lecSlide .navi.swiper-button-prev2 {
    left: -75px;
}
.lecSlide .navi.swiper-button-next2 {
    right: -75px;
}

.listTop {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    margin-top: 30px;
}
.listTop .right {
}
.listTop .sub {
    font-size: 18px;
    display: inline-flex;
    align-items: center;
}
.listTop .sub::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    background: #ccc url("/img/common/icon_mark.png") no-repeat center center;
    margin-right: 10px;
}

.orderBox ul {
    display: flex;
    gap: 10px;
}
.orderBox ul li {
}
.orderBox ul li a {
    background-color: #f2f2f2;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-align: center;
    padding: 6px 12px;
}
.orderBox ul li.on a {
    color: #fff;
    background-color: #333;
    border: 1px solid #333;
}

.classList ul {
    display: flex;
    flex-wrap: wrap;
}
.classList .liOver {
    width: 216px;
    margin-right: 25px;
    margin-bottom: 45px;
    color: #0d0d0d;
}
.classList .liOver:nth-of-type(5n) {
    margin-right: 0;
}
/* .classList .liOver:nth-of-type(20n + 1),
.classList .liOver:nth-of-type(20n + 2),
.classList .liOver:nth-of-type(20n + 3),
.classList .liOver:nth-of-type(20n + 4),
.classList .liOver:nth-of-type(20n + 5) {
    margin-top: 105px;
} 더보기 클릭 시 20개마다 간격 조정 */
.classList .liOver:nth-child(-n + 5) {
    margin-top: 0;
}

.classList .liOver .frame {
    overflow: hidden;
    position: relative;
    height: 140px;
    margin-bottom: 15px;
    border-radius: 5px;
    transition: transform 0.4s;
}
.classList .liOver .frame .labels {
    position: absolute;
    top: 10px;
    left: 5px;
}
.classList .liOver .frame .labels .lbl {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 23px;
    font-size: 13px;
    border-radius: 12px;
}
.classList .liOver .frame .labels .lbl .ico {
    width: unset;
    height: unset;
    margin-right: 3px;
}
.classList .liOver .frame .labels .lbl.live {
    color: #fff;
    background-color: #e64040;
}
.classList .liOver .tit {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4em;
    height: 44px;
}
.classList .liOver .price {
    margin-top: 15px;
}
.classList .liOver:hover .frame {
    transform: scale(1.05);
}
.classList .price li {
    margin: 3px 0;
    color: #0d0d0d;
    text-align: right;
}
.classList .price li .lft {
    position: relative;
    font-size: 12px;
}
.classList .price li .lft::before {
    display: block;
    position: absolute;
    top: -3px;
    left: -8px;
    content: "·";
}
.classList .price li .rgt {
    display: inline-block;
    width: 100px;
    vertical-align: middle;
    font-size: 15px;
    letter-spacing: 0;
}
.classList .price li .rgt .total {
    font-size: 18px;
    font-weight: 600;
    vertical-align: bottom;
}
.classList .price li .rgt .disc {
    font-weight: 500;
    text-decoration: line-through;
}
.classList .liOver .labels02 {
    display: flex;
    min-height: 20px;
    margin-top: 7px;
}
.classList .liOver .labels02 .lbl {
    min-width: 52px;
    height: 20px;
    margin-right: 3px;
    font-size: 12px;
    text-align: center;
    border: 1px solid;
    border-radius: 4px;
}
.classList .liOver .labels02 .lbl.best {
    color: #36c8f4;
    background-color: #f2f8fa;
    border-color: #a2e1f5;
}
.classList .liOver .labels02 .lbl.new {
    color: #ff8c1a;
    background-color: #faf7f2;
    border-color: #f5ba7f;
}
.classList .liOver .labels02 .lbl.close {
    color: #d20cec;
    background-color: #faf3f2;
    border-color: #d20cec;
}
.classList .liOver .labels02 .lbl.hot {
    color: #ff0000;
    background-color: #faf3f2;
    border-color: #f71212;
}
.classList .flag {
    width: 30px;
    text-align: center;
    padding-top: 8px;
    margin-bottom: 8px;
    border-top: 1px solid #000;
}
.classList .flag .num {
    font-size: 18px;
    color: #000;
    font-weight: 500;
}

.btn_more {
    width: 175px;
    margin: 40px auto 0;
}
.btn_more a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 45px;
    background-color: #f7f7f7;
    border: 1px solid #f7f7f7;
    font-size: 15px;
    font-weight: 600;
    border-radius: 10px;
    transition: background-color 0.4s;
}
.btn_more .ico {
    display: block;
    margin-left: 7px;
    position: relative;
    width: 9px;
    height: 1px;
    background-color: #333;
    transition: transform 0.4s;
}
.btn_more .ico::after {
    display: block;
    position: absolute;
    top: -4px;
    left: 4px;
    width: 1px;
    height: 9px;
    background-color: #333;
    content: "";
}
.btn_more:hover a {
    background-color: #fff;
}
.btn_more:hover .ico {
    transform: rotate(180deg);
}

/* view */
.viewTop {
    display: flex;
    justify-content: space-between;
    margin-bottom: 35px;
}
.viewTop .lft {
    width: 850px;
}

.itemInfo {
    display: flex;
}
.itemInfo .itemImg {
    width: 310px;
    margin-right: 30px;
}
.itemInfo .itemImg img {
    display: block;
    width: 100%;
}
.itemInfo .itemTxt {
    width: 510px;
}
.itemInfo .itemTxt .tit {
    display: block;
    font-size: 24px;
    color: #000;
    line-height: 1.4em;
    font-weight: bold;
    word-break: keep-all;
}
.itemInfo .itemTxt .txtSumm {
    font-size: 14px;
    margin-top: 10px;
    word-break: keep-all;
}
.itemInfo .itemTxt dl.detail {
    display: flex;
    flex-wrap: wrap;
    margin-top: 25px;
}
.itemInfo .itemTxt dl.detail dt {
    font-size: 14px;
    width: 80px;
    margin: 5px 0;
}
.itemInfo .itemTxt dl.detail dd {
    position: relative;
    min-width: 145px;
    max-width: 200px;
    font-size: 14px;
    font-weight: 600;
    margin: 5px 0;
}
.itemInfo .itemTxt dl.detail dd.orgPrice span {
    text-decoration: line-through;
}
.itemInfo .itemTxt dl.detail dd.newPrice strong {
    font-size: 18px;
}
dl.detail .coupon {
    font-size: 13px;
    font-weight: 400;
    border: 1px solid #ccc;
    border-radius: 2px;
    padding: 1px 7px;
}
dl.detail .coupon .ico {
    margin-left: 3px;
}
.itemInfo .itemTxt dl dt.w50 {
    width: 65px;
}
.itemInfo .itemTxt dl dd.w50 {
    width: 385px;
}
.itemInfo .itemTxt dl dd a {
    display: inline-block;
    margin-left: 5px;
}
.itemInfo .itemTxt dl dd.price strong {
    font-family: Tahoma;
    font-size: 18px;
    color: #eb5456;
}
.itemInfo .itemTxt dl dd.moreTeacher {
    position: relative;
}
.itemInfo .itemTxt dl dd .teacherLayer {
    z-index: 10;
    position: absolute;
    left: 46px;
    top: 29px;
    width: 184px;
    background: #fff;
    border: 2px solid #9b837f;
}
.itemInfo .itemTxt dl dd .teacherLayer ul li {
    padding: 10px 18px;
    border-top: 1px solid #e8e8e8;
    font-size: 14px;
    font-weight: bold;
    color: #333;
}
.itemInfo .itemTxt dl dd .teacherLayer ul li:first-child {
    border-top: none;
}
.itemInfo .itemTxt dl dd .teacherLayer ul li a {
    display: inline;
}
.itemInfo .itemTxt dl dd .teacherLayer .btnClose {
    position: absolute;
    right: 0;
    top: 0;
}

.optInput label {
    width: 82px;
    margin: 3px 0;
    margin-right: 2px;
    line-height: 36px;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    border: 1px solid #e5e5e5;
    border-radius: 5px;
    cursor: pointer;
    transition: border-color 0.4s;
}
.optInput label:last-of-type {
    margin-right: 0;
}
.optInput input:checked + label {
    border-color: #000;
    font-weight: 600;
}

.dftBtn {
    display: block;
    position: relative;
    width: 300px;
    line-height: 45px;
    color: #0d0d0d;
    font-size: 16px;
    text-align: center;
    font-weight: 600;
    border: 1px solid #ccc;
    border-radius: 5px;
}
.dftBtn.btnApply {
    color: #fff;
    font-weight: 700;
    background-color: #12b3fb;
    border-color: #12b3fb;
}

.lecbtnBox {
    display: flex;
    border: 1px solid #ccc;
    border-radius: 5px;
}
.lecbtnBox a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-basis: 45px;
    flex-grow: 1;
    height: 45px;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    border-left: 1px solid #e6e6e6;
}
.lecbtnBox a:first-of-type {
    border-left: none;
}
.lecbtnBox a img {
    margin: 0 6px;
}
.lecbtnBox .btn-share {
    flex-grow: unset;
    flex-basis: 45px;
}

.viewTop .rgt {
    width: 300px;
}
.viewTop .rgt .lecbtnBox {
    margin-bottom: 5px;
}

.benefit {
    position: relative;
    margin-top: 10px;
    background-color: #f7f7f7;
    border-radius: 8px;
}
.benefit::after {
    content: "";
    position: absolute;
    top: 0;
    left: 5%;
    width: 0;
    height: 0;
    border: 8px solid transparent;
    border-bottom-color: #f7f7f7;
    border-top: 0;
    margin-top: -8px;
}
.benefit .inner {
    display: flex;
    padding: 9px 15px;
}
.benefit .ico {
    flex-shrink: 0;
    margin-top: 1px;
}
.benefit .txt {
    font-size: 14px;
    font-weight: 600;
    color: #808080;
    margin-left: 8px;
}
.benefit .txt strong {
    color: #0d0d0d;
}

.a-require {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 700;
    margin-top: 30px;
}
.a-require .ico {
    display: block;
    width: 20px;
    height: 20px;
    margin-right: 5px;
    background-color: #12b3fb;
    border-radius: 50%;
    border-bottom-right-radius: unset;
}
.a-require .ico::after {
    display: block;
    width: 100%;
    color: #fff;
    font-size: 16px;
    text-align: center;
    line-height: 21px;
    content: "?";
}
.a-require .txt {
    color: #000;
    border-bottom: 1px solid #333;
}

.cont-wrapper {
    position: relative;
}
.cont-wrap {
    width: 850px;
    padding-top: 10px;
}
.cont-wrap.fix {
    padding-top: 40px;
}
.cont-wrap.fix .lectab {
    position: fixed;
    top: 0;
    width: 850px;
    z-index: 1;
}
.cont-wrap .lectab ul {
    display: flex;
    background-color: #fff;
    border-bottom: 1px solid #ccc;
}
.cont-wrap .lectab li {
    position: relative;
    flex-grow: 1;
}
.cont-wrap .lectab li::before {
    display: block;
    position: absolute;
    left: 0;
    bottom: 15px;
    content: "";
    width: 1px;
    height: 14px;
    background-color: #e5e5e5;
}
.cont-wrap .lectab li:first-child::before {
    display: none;
}
.cont-wrap .lectab li a {
    display: block;
    width: 100%;
    color: #0d0d0d;
    font-size: 16px;
    line-height: 40px;
    text-align: center;
}
.cont-wrap .lectab li.on a {
    font-weight: 600;
}
.cont-wrap .lectab li.on::after {
    display: block;
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 100%;
    height: 2px;
    background-color: #000;
    content: "";
}
.cont-wrap .tabArea {
    margin-bottom: 100px;
    padding-top: 40px;
}
.cont-wrap .classList .liOver {
    /* lecture-view 연관강좌 */
    width: 200px;
    margin-right: calc(50px / 3);
}
.cont-wrap .classList .liOver:nth-of-type(5n) {
    margin-right: calc(50px / 3);
}
.cont-wrap .classList .liOver:nth-of-type(4n) {
    margin-right: 0;
}
.cont-wrap .classList .liOver .frame {
    height: 130px;
}

.wingBox {
    display: none;
    width: 300px;
    position: absolute;
    top: 0;
    right: 0;
    transition: top 1s, bottom 1s;
}
.wingBox .info-wrap {
    color: #333;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-bottom: 5px;
}
.wingBox .info-wrap .top {
    padding: 30px 23px;
}
.wingBox .info-wrap .tit {
    color: #0d0d0d;
    font-size: 24px;
    line-height: 1.2em;
    font-weight: 700;
    word-break: keep-all;
}
.wingBox .info-wrap .txtSumm {
    font-size: 14px;
    line-height: 1.4em;
    word-break: keep-all;
    margin-top: 10px;
}
.wingBox .info-wrap .detail {
    display: flex;
    flex-wrap: wrap;
    font-size: 14px;
    margin-top: 15px;
}
.wingBox .info-wrap .detail dt {
    width: 80px;
    margin: 3px 0;
}
.wingBox .info-wrap .detail dd {
    width: calc(100% - 80px);
    margin: 3px 0;
    font-weight: 600;
}
.wingBox .info-wrap .detail dd.orgPrice span {
    text-decoration: line-through;
}
.wingBox .info-wrap .detail dd.newPrice strong {
    font-size: 18px;
}
.wingBox .info-wrap .optInput label {
    width: 80px;
}
.wingBox .info-wrap .optInput label:nth-of-type(3n) {
    margin-right: 0;
}
.wingBox .lecbtnBox {
    border-radius: unset;
    border: none;
    border-top: 1px solid #ccc;
}

.freeSlide {
    position: relative;
    padding: 30px;
    border: 1px solid #000;
    background-color: #fff;
    border-radius: 8px;
}
.freeSlide .liOver .frame {
    position: relative;
    width: 100%;
    height: 170px;
    border-radius: 5px;
    overflow: hidden;
}
.freeSlide .liOver .frame .flag {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 58px;
    height: 58px;
    padding: 11px 0;
    background-color: #fcdf46;
    font-weight: 700;
    text-align: center;
    font-size: 13px;
    border-radius: 50%;
}
.freeSlide .liOver .frame .flag .num {
    font-size: 18px;
}
.freeSlide .liOver .txt {
    margin-top: 15px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5em;
}
.freeSlide .navi {
    position: absolute;
    top: 120px;
}
.freeSlide .navi.swiper-button-prev2 {
    left: -100px;
}
.freeSlide .navi.swiper-button-next2 {
    right: -100px;
}
.freeSlide-wrap {
    position: relative;
    padding-bottom: 50px;
    margin-bottom: 35px;
}
.freeSlide-wrap::before {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 120px;
    background-color: #faefcd;
    content: "";
    z-index: -1;
}

.packageSlide .swiper {
    width: 980px;
    padding: 50px 10px;
}
.packageSlide .navi {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.packageSlide .navi.swiper-button-prev2 {
    left: 0;
}
.packageSlide .navi.swiper-button-next2 {
    right: 0;
}
.packageSlide .swiper-slide {
    border-radius: 10px;
    transition: box-shadow 0.4s;
}
.packageSlide .swiper-slide:hover {
    box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.3);
}

.recPackage-wrap {
    margin-bottom: 40px;
}
.recPackage-wrap .recList {
    display: flex;
    padding: 20px;
    margin-bottom: 20px;
    background-color: #f5f6f7;
}
.recPackage-wrap .recList .titbox {
    min-width: calc(100% - 959px);
    padding-top: 25px;
    padding-left: 15px;
}
.recPackage-wrap .recList .titbox .tit {
    font-size: 26px;
    line-height: 1.4em;
}
.recPackage-wrap .recList .classList .liOver {
    width: 236px;
    margin: 0 0 0 5px;
    padding: 9px;
    background-color: #fff;
    border: 1px solid #e8eef1;
    border-radius: 5px;
}
.recPackage-wrap .recList .classList .liOver:nth-of-type(1) {
    margin-left: 0;
}

.lecPagination {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
}
.lecPagination .arrow {
    margin: 0 30px;
}
.lecPagination .arrow .ico {
    stroke: #000;
    margin-top: 5px;
}
.lecPagination .arrow.none .ico {
    stroke: #b3b3b3;
}
.lecPagination ol {
    display: flex;
}
.lecPagination ol li {
    margin: 0 6px;
}
.lecPagination ol li a {
    display: block;
    font-size: 14px;
    font-weight: 500;
    width: 28px;
    color: #4c4c4c;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
    background-color: transparent;
}
.lecPagination ol li.on a {
    color: #fff;
    background-color: #000;
}

.bubble {
    display: block;
    position: absolute;
    padding: 3px 8px;
    border-radius: 4px;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4em;
    white-space: nowrap;
}
.bubble::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border: 5px solid transparent;
}

.bubble.bgred {
    background-color: #eb5454;
}
.bubble.bgbk {
    background-color: #474a53;
}

.bubble.top::after {
    top: 0;
    left: 50%;
    border-top: 0;
    border-bottom-width: 10px;
    margin-left: -5px;
    margin-top: -7px;
}
.bubble.left::after {
    left: 0;
    top: 50%;
    border-left: 0;
    border-right-width: 10px;
    margin-top: -5px;
    margin-left: -7px;
}
.bubble.btm::after {
    bottom: 0;
    left: 50%;
    border-bottom: 0;
    border-top-width: 10px;
    margin-left: -5px;
    margin-bottom: -6px;
}
.bubble.top.bgred::after {
    border-bottom-color: #eb5454;
}
.bubble.left.bgbk::after {
    border-right-color: #474a53;
}
.bubble.btm.bgbk::after {
    border-top-color: #474a53;
}

#itbank_lecture_Wrap * {
    font-family: "Pretendard", sans-serif !important;
}
/* ------- } 페이지 리뉴얼(2023) ------- */

.tab {
    position: relative;
    height: 40px;
    border-bottom: 1px solid #d0d0d0;
    border-right: 1px solid #d0d0d0;
}
.tab ul {
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
}
.tab ul li {
    float: left;
    width: 33.33%;
}
.tab ul li a {
    display: block;
    height: 39px;
    padding: 11px 0;
    font-size: 14px;
    text-align: center;
    border-left: 1px solid #d0d0d0;
    border-top: 1px solid #d0d0d0;
    letter-spacing: -1px;
}
.tab ul li a:hover {
    background-color: #f0f2f4;
}
.tab ul li.on {
    width: 33.33%;
}
.tab ul li.on a {
    height: 40px;
    background: #fff;
    color: #000;
    font-weight: bold;
    border-bottom: none;
    border-top: 2px solid #474a52;
}
.tab.tab1 {
    border-right: 0;
}
.tab.tab1 ul li {
    width: 167px;
}
.tab.tab1 ul li a {
    border-right: 1px solid #d0d0d0;
}
.tab.tab2 ul li {
    width: 50%;
}
.tab.tab3 ul li {
    width: 33.333%;
}
.tab.tab4 ul li {
    width: 25%;
}
.tab.tab5 ul li {
    width: 20%;
}
.tab.tab6 ul li {
    width: 16.666%;
}
.tab.tab7 {
    border-right: none;
}
.tab.tab7 ul li {
    width: 14%;
}
.tab.tab7 ul li:last-child {
    border-right: 1px solid #d0d0d0;
}
.tab.tab8 ul li {
    width: 14.285%;
}
.tabArea {
    margin: 20px 0 100px;
}
.tabArea h4 {
    margin-left: 10px;
}

/* list */
.bestRolling {
    margin-bottom: 40px;
    border: 1px solid #ccc;
    border-top: none;
}
.bestRolling .rollingBox {
    position: relative;
    padding: 30px 36px 0;
}
.bestRolling .rollingBox .rollingWrap {
    overflow: hidden;
    width: 770px;
    height: 270px;
    margin: 0 auto;
}
.bestRolling .rollingBox .rollingWrap ul {
    width: 9999em;
}
.bestRolling .rollingBox .rollingWrap ul li {
    position: relative;
    float: left;
    margin-left: 0px;
}
.bestRolling .rollingBox .rollingWrap ul li:first-child {
    margin-left: 0;
}
.bestRolling .rollingBox .rollingWrap ul li.on:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 246px;
    height: 234px;
    border: 2px solid #01bbd6;
}
.bestRolling .rollingBox .rollingWrap ul li .imgBox {
    position: relative;
    width: 250px;
    height: 163px;
}
.bestRolling .rollingBox .rollingWrap ul li .imgBox img {
    width: 250px;
    height: 163px;
}
.bestRolling .rollingBox .rollingWrap ul li .imgBox .flag {
    position: absolute;
    left: 0;
    top: 0;
}
.bestRolling .rollingBox .rollingWrap ul li .imgBox .flag img {
    float: left;
    margin-left: -5px;
    width: auto;
    height: auto;
}
.bestRolling .rollingBox .rollingWrap ul li .imgBox .flag img:first-child {
    margin-left: 0;
}
.bestRolling .rollingBox .rollingWrap ul li .txt {
    font-size: 13px;
    font-weight: bold;
    text-align: center;
    height: 30px;
}
.bestRolling .rollingBox .rollingWrap ul li .txt span {
    display: block;
    height: 18px;
    margin: 9px 0 5px;
    color: #333;
    width: 245px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.bestRolling .rollingBox .rollingWrap ul li .txtComing {
    font-size: 14px;
    font-weight: bold;
    color: #eb5456;
    text-align: center;
}
.bestRolling .rollingBox .rollingWrap ul li .price {
    margin-top: 7px;
    color: #666;
    text-align: center;
}
.bestRolling .rollingBox .rollingWrap ul li .price .orgPrice {
    font-family: tahoma;
    text-decoration: line-through;
}
.bestRolling .rollingBox .rollingWrap ul li .price .newPrice strong {
    font-family: tahoma;
    font-size: 20px;
    color: #eb5456;
    font-weight: bold;
    line-height: 22px;
    vertical-align: -6%;
}
.bestRolling .rollingBox .btnBox a {
    position: absolute;
    top: 105px;
    display: block;
}
.bestRolling .rollingBox .btnBox .prev {
    left: -1px;
}
.bestRolling .rollingBox .btnBox .next {
    right: -1px;
}
.bestRolling .rollingBox .btnOver {
    z-index: 1;
    position: absolute;
    left: 0;
    top: 122px;
    width: 100%;
    text-align: center;
}
.bestRolling .rollingBox .btnOver a img {
    display: inline;
}

.bestRolling.noTab {
    border-top: 1px solid #ccc;
}
.bestRolling.noTab .rollingBox {
    padding: 35px 36px 0;
}
.bestRolling .right {
    position: absolute;
    right: 32px;
    top: 10px;
}
.bestRolling .rollingBox .right ul {
    overflow: hidden;
}
.bestRolling .rollingBox .right ul li {
    float: left;
    margin-left: 9px;
    padding-left: 9px;
    background: url(../img/common/bg_bar_2x12.gif) 0 3px no-repeat;
    font-size: 12px;
}
.bestRolling .rollingBox .right ul li:first-child {
    background: none;
}
.bestRolling .rollingBox .right ul li.on a {
    color: #00a1cf;
    font-weight: bold;
}

/* .classList ul{margin-left:-1px;border-left:1px solid #e8e8e8;border-top:1px solid #e8e8e8;}
.classList ul:after{content:".";height:0;visibility:hidden;display:block;clear:both}
.classList ul li{position:relative;float:left;width:280px;height:280px;padding:16px 15px 0 14px;border-right:1px solid #e8e8e8;border-bottom:1px solid #e8e8e8;}
.classList ul li.on:after{content:'';display:block;position:absolute;left:-1px;top:-1px;width:276px;height:275px;border:2px solid #01bbd6;}
.classList ul li img{display:block;width:250px;height:163px;margin-bottom:10px;}
.classList ul li .tit{display:block;margin-bottom:10px;padding:0 12px;font-size:14px;font-weight:bold;color:#000;width:240px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.classList ul li dl{overflow:hidden;padding:0 12px;line-height:15px;}
.classList ul li dl.txt{margin:0 4px;padding-bottom:10px;background:url(../img/sub/bg_class_list.gif) 0 100% repeat-x;}
.classList ul li dl.txt dt{float:left;width:56px;margin-bottom:4px;padding-left:8px;background:url(../img/common/bg_square_ccc.gif) 0 5px no-repeat;}
.classList ul li dl.txt dd{float:left;width:153px;margin-bottom:4px;max-width:153px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.classList ul li .txtComing{height:67px;margin-top:38px;background:url(../img/sub/bg_class_list.gif) 0 100% repeat-x;font-size:14px;font-weight:bold;color:#eb5456;text-align:center;}
.classList ul li .price{overflow:hidden;padding-top:10px;}
.classList ul li .price ul{margin:0 4px;padding:0 12px;border:none;}
.classList ul li .price ul li{position:relative;float:none;width:auto;height:auto;padding:0 0 0 8px;background:url(../img/common/bg_square_ccc.gif) 0 8px no-repeat;border:none;}
.classList ul li .price ul li.orgPrice span{text-decoration:line-through;color:#666;}
.classList ul li .price ul li span{position:absolute;right:0;top:0;font-family:tahoma;font-size:14px;font-weight:bold;text-align:right;}
.classList ul li .price ul li .unit{font-family:"맑은고딕",Malgun Gothic,"돋움",dotum, Arial,Sans-serif;}
.classList ul li .btnOver{z-index:1;position:absolute;left:0;top:135px;width:100%;text-align:center;}
.classList ul li .btnOver a img{display:inline;width:auto;height:auto;}
.classList .flag{overflow:hidden;position:absolute;left:14px;top:16px;}
.classList .flag img{float:left;display:inline;width:40px;height:50px;}
.classList.noPrice ul li{height:221px;}
.classList.noPrice ul li.on:after{height:234px;}
.classList.noPrice ul li dl.txt{background:none;} */

/* view */
/* .itemInfo{margin:30px 0 40px;}
.itemInfo:after{content:".";height:0;visibility:hidden;display:block;clear:both}
.itemInfo .itemImg{position:relative;float:left;width:342px;padding:19px 15px 56px 15px;border:1px solid #ccc;}
.itemInfo .itemImg .btnBox{position:absolute;left:15px;bottom:15px;}
.itemInfo .itemImg .btnBox div{display:inline;}
.itemInfo .itemTxt{float:right;width:450px;}
.itemInfo .itemTxt .tit{display:block;padding-bottom:17px;border-bottom:2px solid #474a52;font-size:22px;color:#000;line-height:30px;font-weight:bold;letter-spacing:-1px;}
.itemInfo .itemTxt.offline .tit{padding-bottom:5px;}
.itemInfo .itemTxt.offline dl{margin-bottom:10px;}
.itemInfo .itemTxt dl{margin-bottom:20px;}
.itemInfo .itemTxt dl:after{content:".";height:0;visibility:hidden;display:block;clear:both}
.itemInfo .itemTxt dl dt,
.itemInfo .itemTxt dl dd{float:left;min-height:40px;padding:12px 0 3px;border-bottom:1px solid #e8e8e8;}
.itemInfo .itemTxt dl dt{width:65px;padding:14px 0 3px;}
.itemInfo .itemTxt dl dt img{vertical-align:top;}
.itemInfo .itemTxt dl dd{width:160px;font-size:13px;color:#333;letter-spacing:-1px;}
.itemInfo .itemTxt dl dt.w50{width:65px;}
.itemInfo .itemTxt dl dd.w50{width:385px;}
.itemInfo .itemTxt dl dd.orgPrice span{font-family:Tahoma;font-size:18px;text-decoration:line-through;}
.itemInfo .itemTxt dl dt.newPrice{padding:15px 0 5px;}
.itemInfo .itemTxt dl dd.newPrice strong{margin-right:2px;font-size:27px;color:#eb5456;font-weight:bold;vertical-align:-5%;letter-spacing:-2px;}
.itemInfo .itemTxt dl dt.newPrice{min-height:50px;padding:10px 0 2px;}
.itemInfo .itemTxt dl dd.newPrice{min-height:50px;padding:8px 0 4px;line-height:27px;}
.itemInfo .itemTxt dl dd.newPrice02 span{font-family:Tahoma;font-size:18px;color:#eb5456;}
.itemInfo .itemTxt dl dd a{display:inline-block;margin-left:5px;}
.itemInfo .itemTxt dl dd a{vertical-align:-27%;}
.itemInfo .itemTxt dl dd.newPrice a{vertical-align:-11%;}
.itemInfo .itemTxt dl dd.price strong{font-family:Tahoma;font-size:18px;color:#eb5456;}
.itemInfo .itemTxt dl dd.txtSumm{width:450px;font-size:12px;color:#888;line-height:14px;}
.itemInfo .itemTxt dl dd.moreTeacher{position:relative;}
.itemInfo .itemTxt dl dd .teacherLayer{z-index:10;position:absolute;left:46px;top:29px;width:184px;background:#fff;border:2px solid #9b837f;}
.itemInfo .itemTxt dl dd .teacherLayer ul li{padding:10px 18px;border-top:1px solid #e8e8e8;font-size:14px;font-weight:bold;color:#333;}
.itemInfo .itemTxt dl dd .teacherLayer ul li:first-child{border-top:none;}
.itemInfo .itemTxt dl dd .teacherLayer ul li a{display:inline;}
.itemInfo .itemTxt dl dd .teacherLayer .btnClose{position:absolute;right:0;top:0;}
.itemInfo .itemTxt dl dd.option{position:relative;width:450px;margin-top:20px;font-size:12px;color:#888;line-height:20px;}
.itemInfo .itemTxt dl dd.option .sel_box{position:absolute;top:0;left:0;z-index:1;width:100%;height:26px;background:#fff;}
.itemInfo .itemTxt dl dd.option .sel_box a{margin:0;color:#333;}
.itemInfo .itemTxt dl dd.option .sel_box a:hover{text-decoration:none;}
.itemInfo .itemTxt dl dd.option .sel_box a.sel_value{display:block;height:26px;padding:0 0 0 10px;border:1px solid #bbb;border-right:1px solid #ddd;border-bottom:1px solid #ddd;background:url(../img/common/bg_select_arr.gif) no-repeat 425px 4px;color:#555;line-height:26px;}
.itemInfo .itemTxt dl dd.option .sel_box a.sel_value em{display:block;margin-right:28px;white-space:nowrap;overflow:hidden;}
.itemInfo .itemTxt dl dd.option .sel_box .sel_opt{display:none;position:absolute;top:27px;left:0;width:100%;}
.itemInfo .itemTxt dl dd.option .sel_box.open{z-index:2;}
.itemInfo .itemTxt dl dd.option .sel_box.open .sel_opt{display:block;}
.itemInfo .itemTxt dl dd.option .sel_box ul{border:1px solid #474a52;}
.itemInfo .itemTxt dl dd.option .sel_box li a{display:block;height:23px;padding:4px 0 4px 10px;background:#fff;}
.itemInfo .itemTxt dl dd.option .sel_box li a .bar{color:#ccc !important;}
.itemInfo .itemTxt dl dd.option .sel_box li a:hover{background:#f2f2f2;}
.itemInfo .itemTxt .btnBox{text-align:right;} */

/* 스쿨캐스트용 -------------------2020.09.25 ycy190 ============= start */
.itemInfo .itemTxt_schoolcast {
    position: relative;
    border-bottom: 2px solid #474a52;
    padding-bottom: 20px;
}
.itemInfo .itemTxt_schoolcast .tit {
    display: inline-block;
    font-size: 22px;
    color: #000;
    font-weight: bold;
    letter-spacing: -1px;
    vertical-align: middle;
}
.itemInfo .itemTxt_schoolcast.offline .tit {
    padding-bottom: 5px;
}
.itemInfo .itemTxt_schoolcast.offline dl {
    margin-bottom: 10px;
}
.itemInfo .itemTxt_schoolcast dl {
    margin-bottom: 20px;
}
.itemInfo .itemTxt_schoolcast dl:after {
    content: ".";
    height: 0;
    visibility: hidden;
    display: block;
    clear: both;
}
.itemInfo .itemTxt_schoolcast dl dt,
.itemInfo .itemTxt_schoolcast dl dd {
    float: left;
    min-height: 24px;
    padding: 10px 0 6px;
    border-bottom: 1px solid #e8e8e8;
}
.itemInfo .itemTxt_schoolcast dl dt {
    width: 65px;
    padding: 13px 0 3px;
}
.itemInfo .itemTxt_schoolcast dl dt img {
    vertical-align: top;
}
.itemInfo .itemTxt_schoolcast dl dd {
    width: 160px;
    font-size: 13px;
    color: #333;
    letter-spacing: -1px;
}
.itemInfo .itemTxt_schoolcast dl dt.w50 {
    width: 65px;
}
.itemInfo .itemTxt_schoolcast dl dd.w50 {
    width: 385px;
}
.itemInfo .itemTxt_schoolcast dl dd.orgPrice span {
    font-family: Tahoma;
    font-size: 18px;
    text-decoration: line-through;
}
.itemInfo .itemTxt_schoolcast dl dt.newPrice {
    padding: 15px 0 5px;
}
.itemInfo .itemTxt_schoolcast dl dd.newPrice strong {
    font-size: 30px;
    color: #eb5456;
    font-weight: bold;
    vertical-align: -3%;
}
.itemInfo .itemTxt_schoolcast dl dt.newPrice {
    min-height: 37px;
    padding: 10px 0 2px;
}
.itemInfo .itemTxt_schoolcast dl dd.newPrice {
    min-height: 41px;
    padding: 4px 0 4px;
    line-height: 32px;
}
.itemInfo .itemTxt_schoolcast dl dd.newPrice02 span {
    font-family: Tahoma;
    font-size: 18px;
    color: #eb5456;
}
.itemInfo .itemTxt_schoolcast dl dd a {
    display: inline-block;
    margin-left: 5px;
}
.itemInfo .itemTxt_schoolcast dl dd a {
    vertical-align: -27%;
}
.itemInfo .itemTxt_schoolcast dl dd.newPrice a {
    vertical-align: -5%;
}
.itemInfo .itemTxt_schoolcast dl dd.price strong {
    font-family: Tahoma;
    font-size: 18px;
    color: #eb5456;
}
.itemInfo .itemTxt_schoolcast dl dd.txtSumm {
    width: 450px;
    font-size: 12px;
    color: #888;
    line-height: 20px;
}
.itemInfo .itemTxt_schoolcast dl dd.moreTeacher {
    position: relative;
}
.itemInfo .itemTxt_schoolcast dl dd .teacherLayer {
    z-index: 10;
    position: absolute;
    left: 46px;
    top: 29px;
    width: 184px;
    background: #fff;
    border: 2px solid #9b837f;
}
.itemInfo .itemTxt_schoolcast dl dd .teacherLayer ul li {
    padding: 10px 18px;
    border-top: 1px solid #e8e8e8;
    font-size: 14px;
    font-weight: bold;
    color: #333;
}
.itemInfo .itemTxt_schoolcast dl dd .teacherLayer ul li:first-child {
    border-top: none;
}
.itemInfo .itemTxt_schoolcast dl dd .teacherLayer ul li a {
    display: inline;
}
.itemInfo .itemTxt_schoolcast dl dd .teacherLayer .btnClose {
    position: absolute;
    right: 0;
    top: 0;
}
.itemInfo .itemTxt_schoolcast dl dd.option {
    position: relative;
    width: 450px;
    margin-top: 20px;
    font-size: 12px;
    color: #888;
    line-height: 20px;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 26px;
    background: #fff;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box a {
    margin: 0;
    color: #333;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box a:hover {
    text-decoration: none;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box a.sel_value {
    display: block;
    height: 26px;
    padding: 0 0 0 10px;
    border: 1px solid #bbb;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background: url(../img/common/bg_select_arr.gif) no-repeat 425px 4px;
    color: #555;
    line-height: 26px;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box a.sel_value em {
    display: block;
    margin-right: 28px;
    white-space: nowrap;
    overflow: hidden;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box .sel_opt {
    display: none;
    position: absolute;
    top: 27px;
    left: 0;
    width: 100%;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box.open {
    z-index: 2;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box.open .sel_opt {
    display: block;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box ul {
    border: 1px solid #474a52;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box li a {
    display: block;
    height: 23px;
    padding: 4px 0 4px 10px;
    background: #fff;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box li a .bar {
    color: #ccc !important;
}
.itemInfo .itemTxt_schoolcast dl dd.option .sel_box li a:hover {
    background: #f2f2f2;
}
.itemInfo .itemTxt_schoolcast .btnBox {
    text-align: right;
}

.itemInfo .itemImg_schoolcast_lecturepreview {
    position: relative;
    float: left;
    width: 390px;
    padding: 19px 15px 19px 15px;
    border: 1px solid #ccc;
}
.itemInfo .itemImg_schoolcast_lecturepreview .btnBox {
    position: absolute;
    left: 15px;
    bottom: 15px;
}
.itemInfo .itemImg_schoolcast_lecturepreview .btnBox div {
    display: inline;
}
.itemInfo .itemTxt_schoolcast_lecturepreview {
    float: right;
    width: 409px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview .tit {
    display: block;
    padding-bottom: 17px;
    border-bottom: 2px solid #474a52;
    font-size: 22px;
    color: #000;
    line-height: 30px;
    font-weight: bold;
    letter-spacing: -1px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview.offline .tit {
    padding-bottom: 5px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview.offline dl {
    margin-bottom: 10px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl {
    margin-bottom: 20px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl:after {
    content: ".";
    height: 0;
    visibility: hidden;
    display: block;
    clear: both;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dt,
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd {
    float: left;
    min-height: 24px;
    padding: 10px 0 6px;
    border-bottom: 1px solid #e8e8e8;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dt {
    width: 65px;
    padding: 13px 0 3px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dt img {
    vertical-align: top;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd {
    width: 160px;
    font-size: 13px;
    color: #333;
    letter-spacing: -1px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dt.w50 {
    width: 65px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.w50 {
    width: 385px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.orgPrice span {
    font-family: Tahoma;
    font-size: 18px;
    text-decoration: line-through;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dt.newPrice {
    padding: 15px 0 5px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.newPrice strong {
    font-size: 30px;
    color: #eb5456;
    font-weight: bold;
    vertical-align: -3%;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dt.newPrice {
    min-height: 37px;
    padding: 10px 0 2px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.newPrice {
    min-height: 41px;
    padding: 4px 0 4px;
    line-height: 32px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.newPrice02 span {
    font-family: Tahoma;
    font-size: 18px;
    color: #eb5456;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd a {
    display: inline-block;
    margin-left: 5px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd a {
    vertical-align: -27%;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.newPrice a {
    vertical-align: -5%;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.price strong {
    font-family: Tahoma;
    font-size: 18px;
    color: #eb5456;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.txtSumm {
    width: 450px;
    font-size: 12px;
    color: #888;
    line-height: 20px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.moreTeacher {
    position: relative;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd .teacherLayer {
    z-index: 10;
    position: absolute;
    left: 46px;
    top: 29px;
    width: 184px;
    background: #fff;
    border: 2px solid #9b837f;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd .teacherLayer ul li {
    padding: 10px 18px;
    border-top: 1px solid #e8e8e8;
    font-size: 14px;
    font-weight: bold;
    color: #333;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd .teacherLayer ul li:first-child {
    border-top: none;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd .teacherLayer ul li a {
    display: inline;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd .teacherLayer .btnClose {
    position: absolute;
    right: 0;
    top: 0;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option {
    position: relative;
    width: 450px;
    margin-top: 20px;
    font-size: 12px;
    color: #888;
    line-height: 20px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 26px;
    background: #fff;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box a {
    margin: 0;
    color: #333;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box a:hover {
    text-decoration: none;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box a.sel_value {
    display: block;
    height: 26px;
    padding: 0 0 0 10px;
    border: 1px solid #bbb;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background: url(../img/common/bg_select_arr.gif) no-repeat 425px 4px;
    color: #555;
    line-height: 26px;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box a.sel_value em {
    display: block;
    margin-right: 28px;
    white-space: nowrap;
    overflow: hidden;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box .sel_opt {
    display: none;
    position: absolute;
    top: 27px;
    left: 0;
    width: 100%;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box.open {
    z-index: 2;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box.open .sel_opt {
    display: block;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box ul {
    border: 1px solid #474a52;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box li a {
    display: block;
    height: 23px;
    padding: 4px 0 4px 10px;
    background: #fff;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box li a .bar {
    color: #ccc !important;
}
.itemInfo .itemTxt_schoolcast_lecturepreview dl dd.option .sel_box li a:hover {
    background: #f2f2f2;
}
.itemInfo .itemTxt_schoolcast_lecturepreview .btnBox {
    text-align: right;
}

/* 스쿨캐스트용 -------------------2020.09.25 ycy190 ============= end */

.playBox {
    position: relative;
    margin: 20px 0 20px;
    padding: 60px 0;
    background: url(../img/sub/bg_detail_play.gif) 0 0 repeat;
}
.playBox .play {
    position: relative;
    width: 720px;
    margin: 0 auto;
}
.playBox .play .img {
    display: block;
    width: 100%;
}
.playBox .btnPreview {
    position: absolute;
    width: 100%;
    height: 100%;
    padding-top: 180px;
    left: 0;
    top: 0;
    background: url(../img/common/bg_opacity.png) 0 0 repeat;
    text-align: center;
}
.playBox .btnBox {
    position: absolute;
    right: 65px;
    bottom: 30px;
    text-align: right;
}
.playBox .btnBox a {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 1px solid #5d5d5d;
    text-align: center;
    color: #fff;
}
.playBox .btnBox a.on {
    background: #eb5456;
    border: 1px solid #eb5456;
    color: #fff;
}
.playTxt {
    margin: 30px 10px 0 10px;
}

.teacherGuide {
    margin-top: 30px;
    margin-bottom: 40px;
}
.teacherGuide .imgWrap {
    overflow: hidden;
    margin-bottom: 10px;
}
.teacherGuide .imgWrap .imgBox {
    position: relative;
    float: left;
    margin-left: 10px;
}
.teacherGuide .imgWrap .imgBox img {
    width: 129px;
    height: 129px;
}
.teacherGuide .imgWrap .imgBox .wrap {
    position: absolute;
    left: 0;
    top: 0;
}
.teacherGuide .imgWrap .txt {
    margin-top: 15px;
    padding: 0 35px 0 165px;
    color: #333;
    letter-spacing: -1px;
    line-height: 20px;
}
.teacherGuide .imgWrap .txt .tit {
    display: block;
    margin-bottom: 7px;
    font-size: 22px;
}
.teacherGuide .txtList {
    margin-left: 165px;
}
.teacherGuide .txtList .listWrap {
    display: inline-block;
    margin-right: 50px;
    zoom: 1;
    *display: inline;
    vertical-align: top;
}
.teacherGuide .txtList .listWrap .tit {
    display: block;
    margin-bottom: 5px;
    padding-left: 17px;
    font-size: 14px;
    color: #333;
}
.teacherGuide .txtList .listWrap .profile {
    background: url(../img/sub/bg_list_profile.gif) 0 2px no-repeat;
    width: 620px;
}
.teacherGuide .txtList .listWrap .book {
    background: url(../img/sub/bg_list_book.gif) 0 2px no-repeat;
    width: 620px;
}
.teacherGuide .txtList .listWrap ul {
    line-height: 20px;
}
.bookList {
    margin: 30px 0 0 0;
}
.bookList ul {
    overflow: hidden;
}
.bookList ul li {
    float: left;
    width: 170px;
    margin-bottom: 20px;
    vertical-align: top;
    text-align: center;
    letter-spacing: -1px;
    color: #888;
}
.bookList ul li img {
    width: 121px;
    height: 175px;
    border: 5px solid #e8eaee;
}
.bookList ul li strong {
    display: block;
    margin: 10px 0 5px;
    font-size: 14px;
    color: #333;
}
.bookList ul li .btnBox {
    margin-top: 10px;
}
.bookList ul li .btnBox img {
    width: auto;
    height: auto;
    border: none;
}
.gradeBox {
    margin-top: 20px;
    padding-bottom: 25px;
    background: url(../img/sub/bg_grade.gif) 0 100% repeat-x;
}
.gradeBox.noBg {
    background: none;
}
.gradeBox .tit {
    position: relative;
    margin-bottom: 20px;
    padding-bottom: 20px;
    background: url(../img/sub/bg_grade.gif) 0 100% repeat-x;
}
.gradeBox .tit h4 {
    font-size: 16px;
    font-weight: bold;
}
.gradeBox .tit h4 img {
    vertical-align: -20%;
}
.gradeBox .tit .right {
    position: absolute;
    right: 20px;
    top: 0;
}
.gradeBox ul li .gradeTit {
    position: relative;
    padding: 14px 228px 14px 20px;
    background: #f0f2f4;
    border-top: 1px solid #e5e6e9;
    font-size: 16px;
    font-weight: bold;
    color: #000;
}
.gradeBox ul li .gradeTit strong {
    margin-right: 8px;
}
.gradeBox ul li .gradeTit a {
    display: inline-block;
    zoom: 1;
    *display: inline;
    vertical-align: middle;
}
.gradeBox ul li .gradeTit .write {
    position: absolute;
    right: 20px;
    top: 16px;
    font-size: 14px;
    color: #888;
    font-weight: normal;
}
.gradeBox ul li .gradeTit .write strong {
    display: inline-block;
    zoom: 1;
    *display: inline;
    margin-right: 10px;
    padding-right: 10px;
    border-right: 1px solid #d8dadf;
    color: #000;
    line-height: 12px;
}
.gradeBox ul li .cont {
    position: relative;
    padding: 13px 175px 15px 20px;
    line-height: 20px;
}
.gradeBox ul li .cont .btnBox {
    position: absolute;
    right: 20px;
    top: 50%;
    margin-top: -20px;
}
.gradeBox ul li .reply {
    background: url(../img/sub/bg_reply_line.gif) repeat-x;
}
.gradeBox ul li .reply .inner {
    padding: 17px 175px 39px 95px;
    background: url(../img/sub/bg_reply_answer.gif) no-repeat 18px 20px;
    line-height: 20px;
}
.gradeBox ul li .reply .replyTo {
    color: #4c5488;
    font-size: 13px;
}
.gradeBox ul li .reply .replyTxt {
    color: #888;
    font-size: 12px;
}
.gradeBox ul li .reply .replyTxt a {
    color: #888;
    text-decoration: underline;
}
.gradeBox .noGrade {
    padding: 30px 0;
    background: #f0f2f4;
    border: 1px solid #e5e6e9;
    font-size: 14px;
    text-align: center;
    font-weight: bold;
}

.timeTable {
    margin: 30px 0 100px;
    font-size: 13px;
    letter-spacing: -1px;
    line-height: 20px;
}
.timeTable div {
    margin-bottom: 25px;
    font-size: 20px;
    font-weight: bold;
    color: #333;
}

.recmdClass {
    overflow: hidden;
    margin-top: 95px;
    border-top: 2px solid #474a52;
}
.recmdClass:after {
    content: ".";
    height: 0;
    visibility: hidden;
    display: block;
    clear: both;
}
.recmdClass .tit {
    display: block;
    margin-bottom: 12px;
    font-size: 18px;
    color: #333;
    letter-spacing: -1px;
}
.recmdClass .recmdBox {
    float: left;
    width: 249px;
    padding: 0 15px;
    border-left: 1px solid #e8e8e8;
}
.recmdClass .recmdBox.first {
    border-left: none;
}
.recmdClass .rollingBox {
    overflow: hidden;
    position: relative;
    padding: 15px 0 30px;
}
.recmdClass .rollingBox .rollingWrap {
    overflow: hidden;
    width: 250px;
    height: 270px;
    margin: 0 auto;
}
.recmdClass .rollingBox .rollingWrap ul {
    width: 9999em;
}
.recmdClass .rollingBox .rollingWrap ul li {
    float: left;
    text-align: center;
}
.recmdClass .rollingBox .rollingWrap ul li .imgBox {
    position: relative;
    width: 250px;
    height: 163px;
}
.recmdClass .rollingBox .rollingWrap ul li .imgBox .flag {
    position: absolute;
    left: 0;
    top: 0;
}
.recmdClass .rollingBox .rollingWrap ul li .imgBox .flag img {
    float: left;
    margin-left: -5px;
}
.recmdClass .rollingBox .rollingWrap ul li .imgBox .flag img:first-child {
    margin-left: 0;
}
.recmdClass .rollingBox .rollingWrap ul li .txt {
    font-size: 13px;
    font-weight: bold;
    text-align: center;
}
.recmdClass .rollingBox .rollingWrap ul li .txt span {
    display: block;
    margin: 9px 0 5px;
    color: #333;
}
.recmdClass .rollingBox .rollingWrap ul li .price {
    margin-top: 7px;
    color: #666;
    text-align: center;
}
.recmdClass .rollingBox .rollingWrap ul li .price .orgPrice {
    font-family: tahoma;
    text-decoration: line-through;
}
.recmdClass .rollingBox .rollingWrap ul li .price .newPrice strong {
    font-family: tahoma;
    font-size: 20px;
    color: #eb5456;
    font-weight: bold;
    line-height: 22px;
}
.recmdClass .rollingBox .rollingWrap ul li .btnWrap {
    display: block;
    margin-bottom: 10px;
}
.recmdClass .rollingBox .btnBox {
    position: absolute;
    right: 0;
    top: 17px;
    display: block;
}
.recmdClass .rollingBox .btnBox div {
    display: inline;
    margin-right: 5px;
    font-size: 11px;
    color: #999;
    letter-spacing: -1px;
}
.recmdClass .rollingBox .btnBox a {
    display: inline-block;
    margin-left: -4px;
}
.recmdClass .rollingBox .btnBox a img {
    vertical-align: middle;
}

/* 스쿨선생님 리스트 */
.schoolTeacher {
    margin: 30px 0 24px;
}
.schoolTeacher ul {
    overflow: hidden;
    width: 846px;
}
.schoolTeacher ul li {
    float: left;
    margin: 0 6px 6px 0;
}
.schoolTeacher ul li img {
    vertical-align: top;
}

/* 스쿨선생님 상세보기 */
.teacherDetail #tab03.tabArea .tblApply tbody .imgBox {
    position: relative;
    padding-top: 18px;
    padding-left: 10px;
    text-align: left;
}
.teacherDetail #tab03.tabArea .tblApply tbody .imgBox img {
    width: 150px;
    height: 98px;
}
.teacherDetail #tab03.tabArea .tblApply tbody .imgBox .flag {
    position: absolute;
    left: 10px;
    top: 13px;
}
.teacherDetail #tab03.tabArea .tblApply tbody .imgBox .flag img {
    width: 45px;
    height: 50px;
}
.teacherDetail #tab03.tabArea .tblApply tbody tr:first-child .imgBox {
    padding-top: 0;
}
.teacherDetail #tab03.tabArea .tblApply tbody tr:first-child .imgBox .flag {
    top: -5px;
}

/* 패키지 상세 */
.titPackage {
    position: relative;
    margin-bottom: 20px;
    padding-bottom: 14px;
    background: url(../img/sub/bg_grade.gif) 0 100% repeat-x;
    font-size: 16px;
    font-weight: bold;
}

/* 고객센터 */
.titBox {
    position: relative;
    padding-bottom: 10px;
}
.titBox.bg {
    padding-bottom: 18px;
    background: url(../img/common/bg_sub_tit.gif) 0 100% repeat-x;
}
.titBox h4 {
    padding-top: 5px;
    font-size: 20px;
    color: #333;
    font-weight: bold;
}
.titBox .right {
    position: absolute;
    right: 0;
    top: 0;
}
.titBox.type2 {
    padding-bottom: 0;
}
.titBox.type2 h4 {
    margin-bottom: 12px;
    font-size: 18px;
}
.titBox.type2 h4 span {
    font-size: 14px;
}
.titBox.type2 label {
    font-size: 15px;
    font-weight: bold;
    color: #333;
}
.titBox.type2 .right {
    bottom: 0;
    top: auto;
}

.mostFaq dt {
    padding: 10px;
    background: url(../img/sub/bg_faq_list.gif) 10px 8px no-repeat;
    border-bottom: 1px solid #e8e8e8;
}
.mostFaq dt img {
    display: inline-block;
    *display: inline;
    zoom: 1;
    margin-right: 8px;
    vertical-align: middle;
}
.mostFaq dd {
    padding: 13px 20px 32px 52px;
    background: #f0f2f4 url(../img/sub/bg_faq_answer.gif) 20px 13px no-repeat;
    line-height: 20px;
}
.btnMore {
    display: block;
    padding: 13px 0 12px 0;
    background: url(../img/sub/bg_faq_more.gif) 0 0 repeat-x;
    border: 1px solid #e8e8e8;
    text-align: center;
}

.faqList dt {
    padding: 15px 10px 15px 12px;
    background: url(../img/sub/bg_faq.gif) 97% 18px no-repeat;
    border-bottom: 1px solid #e8e8e8;
}
.faqList dt.on {
    background: url(../img/sub/bg_faq_on.gif) 97% 15px no-repeat;
}
.faqList dt img {
    vertical-align: middle;
}
.faqList .category {
    display: inline-block;
    *display: inline;
    zoom: 1;
    width: 150px;
    padding-left: 40px;
    background: url(../img/sub/bg_faq_question.gif) 8px 0 no-repeat;
    color: #888;
}
.faqList dd {
    padding: 13px 0 32px 52px;
    background: #f0f2f4 url(../img/sub/bg_faq_answer.gif) 20px 13px no-repeat;
    line-height: 20px;
}

.file {
    font-size: 15px;
    font-weight: bold;
    color: #333;
}
.file img {
    vertical-align: middle;
}

.programList {
}
.programList div {
    margin: 25px 0 10px;
    font-size: 14px;
}
.programList div .num {
    font-size: 24px;
    color: #333;
}
.programList ul {
    margin: 10px 0 10px 25px;
}
.programList ul.listGray li {
    padding-left: 14px;
    background: url(../img/common/bul_star.gif) 0 4px no-repeat;
}
.programList ul.listRed li {
    padding-left: 14px;
    background: url(../img/common/bul_star_red.gif) 0 4px no-repeat;
    color: #eb5456;
}
.programList a {
    margin-left: 10px;
    vertical-align: middle;
}
.programList .step {
    font-size: 20px;
    font-weight: bold;
    color: #666;
}
.programList .step .num {
    vertical-align: -2px;
}
.programList .desc {
    padding-bottom: 8px;
    font-size: 12px;
    line-height: 19px;
    letter-spacing: -0.025em;
    color: #666;
}
.programList .noti {
    padding-left: 14px;
    background: url(../img/common/bul_star.gif) 0 4px no-repeat;
}
.programList .f_blue {
    font-weight: bold;
    color: #0075d1;
}

/* 이벤트 */
.subRolling {
    height: 279px;
    margin: 30px 0 48px;
    border: 1px solid #cdcdcd;
}
.subRolling:after {
    content: ".";
    height: 0;
    visibility: hidden;
    display: block;
    clear: both;
}
.subRolling .txtList {
    float: right;
    width: 195px;
}
.subRolling .txtList ul {
    position: relative;
}
.subRolling .txtList ul li {
    border-top: 1px solid #e8e8e8;
}
.subRolling .txtList ul li:first-child {
    border-top: none;
}
.subRolling .txtList ul li a {
    display: block;
    padding: 18px 0 19px 11px;
    font-size: 13px;
    color: #555;
}
.subRolling .txtList ul li.on a {
    margin-left: -29px;
    padding-left: 49px;
    color: #fff;
    background: url(../img/sub/bg_rolling_on.png) 0 0 no-repeat;
}
.subRolling .imgBox {
    overflow: hidden;
    width: 643px;
    height: 280px;
}
.eventList {
    display: flex;
    flex-wrap: wrap;
    gap: 30px 20px;
    margin: 0 34px;
}

.eventList li {
    width: 280px;
    background-color: #f7f7f7;
    border-radius: 6px;
    overflow: hidden;
}
.eventList li .img {
    display: block;
}
.eventList li .img img {
    width: 280px;
    height: 180px;
}
.eventList li .txt {
    padding: 20px 12px;
    font-size: 14px;
    color: #333;
}
.eventList li .txt .event_info {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}
.eventList li .txt a {
    display: block;
    font-weight: 700;
    font-size: 16px;
    color: #333;
    margin-bottom: 4px;
}
.eventList li .txt .date {
    font-size: 14px;
    color: #999;
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 4px;
}
.eventList li .txt .date::before {
    content: "";
    display: block;
    width: 12px;
    height: 13px;
    background: url("/img/sub/icon_event_date.png") no-repeat center center;
}
.eventList li .step {
    font-size: 12px;
    color: #fff;
    width: 50px;
    text-align: center;
    border-radius: 100px;
    padding: 3px 0;
}
.eventList li .step.ongoing {
    background-color: #c12f34;
}
.eventList li .step.termination {
    background-color: #999999;
}

.repleBox {
    overflow: hidden;
    padding: 16px 18px 16px 23px;
    border: 1px solid #ccc;
    background: #f0f2f4;
}
.repleBox .name {
    float: left;
    width: 103px;
    font-size: 13px;
    line-height: 20px;
}
.repleBox .name strong {
    display: block;
    color: #333;
}
.repleBox textarea {
    float: left;
}
.repleBox a {
    float: right;
    display: block;
    width: 80px;
    height: 65px;
    background: #707482;
    line-height: 65px;
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    text-align: center;
}
.repleList {
    margin-top: 24px;
    background: url(../img/sub/bg_grade.gif) 0 100% repeat-x;
    border-top: 2px solid #474a52;
}
.repleList li {
    padding: 20px;
    border-top: 1px solid #e5e6e9;
}
.repleList li:first-child {
    border-top: none;
}
.repleList li strong {
    display: inline-block;
    margin-right: 10px;
    padding-right: 10px;
    background: url(../img/common/bg_bar_2x12.gif) 100% 3px no-repeat;
    color: #000;
}
.repleList li a {
    display: inline-block;
    margin-left: 5px;
}
.repleList li a img {
    vertical-align: -35%;
}
.repleList li div {
    margin-top: 2px;
}
.txtNav {
    margin: 40px 0 30px;
    border-top: 1px solid #474a52;
    text-transform: uppercase;
}
.txtNav div {
    padding: 15px 20px;
    border-bottom: 1px solid #474a52;
}
.txtNav div:first-child {
    border-bottom: 1px solid #e8e8e8;
}
.txtNav div strong {
    display: inline-block;
    margin-right: 30px;
    padding-right: 20px;
    background: url(../img/sub/bg_nav_prev.gif) 100% 6px no-repeat;
}
.txtNav div:first-child strong {
    background: url(../img/sub/bg_nav_next.gif) 100% 6px no-repeat;
}
.bannerBox2 {
    overflow: hidden;
}
.bannerBox2 a {
    display: block;
    float: left;
}

/* 오프라인 강좌 */
.offlineList li {
    position: relative;
    margin-top: 10px;
    padding: 10px 20px;
    border: 1px solid #e8e8e8;
    border-bottom: 1px solid #ccc;
}
.offlineList li:first-child {
    margin-top: 0;
}
.offlineList li .inner {
    overflow: hidden;
    padding: 5px 0;
    background: url(../img/sub/bg_offline.gif) -20px 0 repeat-y;
}
.offlineList li .img {
    float: left;
}
.offlineList li .txtBox {
    float: left;
    width: 360px;
    margin: 15px 0 0 25px;
}
.offlineList li .txtBox a {
    font-size: 18px;
    font-weight: bold;
    color: #333;
}
.offlineList li dl.txt {
    overflow: hidden;
    width: 240px;
    margin-top: 15px;
}
.offlineList li dl.txt dt {
    float: left;
    width: 62px;
    margin-bottom: 4px;
    padding-left: 8px;
    background: url(../img/common/bg_square_ccc.gif) 0 7px no-repeat;
    font-size: 13px;
    color: #888;
}
.offlineList li dl.txt dd {
    float: left;
    width: 170px;
    margin-bottom: 4px;
    font-size: 13px;
    color: #333;
}
.offlineList li dl.txt dd.date {
    font-family: Tahoma;
    color: #907c6b;
}
.offlineList li dl.txt dd a {
    vertical-align: middle;
}
.offlineList li .step {
    position: absolute;
    right: 45px;
    top: 50%;
    margin-top: -42px;
}

.offlineList2 li {
    position: relative;
    margin-top: 10px;
    padding: 10px 0px 10px 20px;
    border: 1px solid #e8e8e8;
    border-bottom: 1px solid #ccc;
}
.offlineList2 li:first-child {
    margin-top: 0;
}
.offlineList2 li .inner {
    overflow: hidden;
    padding: 5px 0;
}
.offlineList2 li .img {
    float: left;
}
.offlineList2 li .txtBox {
    float: left;
    width: 525px;
    margin: 15px 0 0 30px;
}
.offlineList2 li .txtBox a {
    display: inline-block;
    margin-right: 5px;
    font-size: 18px;
    font-weight: bold;
    color: #333;
    letter-spacing: -1px;
}
.offlineList2 li dl.txt {
    overflow: hidden;
    width: 100%;
    margin-top: 15px;
}
.offlineList2 li dl.txt dt {
    float: left;
    width: 70px;
    margin-bottom: 4px;
    padding-left: 8px;
    background: url(../img/common/bg_square_ccc.gif) 0 7px no-repeat;
    font-size: 13px;
    color: #888;
}
.offlineList2 li dl.txt dd {
    float: left;
    width: 430px;
    margin-bottom: 4px;
    font-size: 13px;
    color: #333;
}
.offlineList2 li dl.txt dd.date {
    width: 180px;
    font-family: Tahoma;
}
.offlineList2 li dl.txt dd strong {
    color: #907c6b;
}
.offlineList2 li dl.txt dd a {
    vertical-align: -11%;
}
.offlineList2 li dl.txt dd.w50 {
    width: 310px;
}
.offlineList2 li .btnBox {
    float: left;
    margin: 5px 0 0 30px;
}
.mapArea .address {
    margin-top: 10px;
    font-size: 14px;
    color: #333;
}

/* 제휴문의 */
.agreeArea .tblTop {
    margin-bottom: 15px;
}
.agreeArea .agreeBox {
    margin: 10px 0 5px;
    padding: 14px 12px;
    border: 1px solid #bbb;
    line-height: 20px;
}
.agreeArea .agreeBox.scroll {
    overflow-y: scroll;
    height: 90px;
}
.agreeArea label {
    display: block;
    font-size: 13px;
    font-weight: bold;
    color: #333;
}

/* 나의 강의실 */
.myInfo {
    background: #474a52;
}
.myInfo .tit {
    position: relative;
    padding: 12px 10px 12px 24px;
    background: url(../img/sub/bg_myInfo_tit.gif) 0 100% no-repeat;
    font-size: 16px;
    color: #cdd1d4;
}
.myInfo .wrapBox {
    overflow: hidden;
    background: #fff;
    border: 1px solid #ccc;
    border-top: none;
}
.myInfo .wrapBox .leftBox {
    float: left;
    width: 463px;
}
.myInfo .wrapBox .rightBox {
    float: right;
    width: 375px;
}
.myInfo .wrapBox div {
    overflow: hidden;
}
.myInfo .wrapBox div p {
    float: left;
}
.myInfo .wrapBox div dl {
    float: left;
    height: 114px;
    font-size: 14px;
    color: #333;
    text-align: center;
}
.myInfo .wrapBox div dl dt {
    margin: 34px 0 7px;
}
.myInfo .wrapBox div dl dd strong {
    font-family: Tahoma;
    font-size: 18px;
    font-weight: bold;
    color: #01bbd6;
}
.myInfo .wrapBox div.rightBox dl dd strong {
    font-size: 30px;
    color: #eb5456;
    vertical-align: -29%;
}
.myInfo .wrapBox div .point {
    width: 113px;
    border-right: 1px solid #e2e5e9;
}
.myInfo .wrapBox div .money {
    width: 113px;
    border-right: 1px solid #e2e5e9;
}
.myInfo .wrapBox div .coupon {
    width: 115px;
}
.myInfo .wrapBox div .study {
    width: 124px;
    border-right: 1px solid #e2e5e9;
}
.myInfo .wrapBox div .reple {
    width: 124px;
}
.infoBox {
    border: 4px solid #e2e5e9;
}
.infoBox .wrapBox {
    overflow: hidden;
    padding: 20px;
    border: 1px solid #cdd0d5;
}
.infoBox .wrapBox .tit {
    position: relative;
    padding-bottom: 9px;
    border-bottom: 2px solid #e8e8e8;
}
.infoBox .wrapBox .tit h4 {
    font-size: 15px;
    font-weight: bold;
    color: #888;
}
.infoBox .wrapBox .tit .right {
    position: absolute;
    right: 0;
    top: 0;
}
.infoBox .wrapBox ul li {
    position: relative;
    padding: 5px 71px 6px 0;
    border-top: 1px solid #e5e5e5;
    letter-spacing: -1px;
    *zoom: 1;
}
.infoBox .wrapBox ul li:first-child {
    border-top: none;
}
.infoBox .wrapBox ul li a {
    color: #666;
}
.infoBox .wrapBox ul li a:hover {
    text-decoration: underline;
}
.infoBox .wrapBox ul li span {
    position: absolute;
    right: 0;
    top: 6px;
    font-family: tahoma;
    font-size: 11px;
    color: #ababab;
    letter-spacing: 0;
}
.infoBox .wrapBox .leftBox {
    float: left;
    width: 380px;
}
.infoBox .wrapBox .rightBox {
    float: right;
    width: 380px;
}
.tblOrder.f13 tbody tr td.graphBox {
    padding: 8px 108px;
    background: url(../img/sub/bg_graph_box.gif) 0 0 repeat-x;
}
.tblOrder.f13 tbody tr td.graphBox strong {
    display: inline-block;
    *display: inline;
    zoom: 1;
    font-size: 14px;
}
.tblOrder.f13 tbody tr td.graphBox .graph {
    position: relative;
    display: inline-block;
    *display: inline;
    zoom: 1;
    width: 560px;
    height: 19px;
    margin-bottom: 3px;
    background: #cdd0d5;
    border-top: 1px solid #a2a7af;
    white-space: nowrap;
    vertical-align: top;
}
.tblOrder.f13 tbody tr td.graphBox .graph .gBar {
    position: relative;
    display: inline-block;
    height: 20px;
    background: url(../img/sub/bg_graph.gif) 0 0 repeat-x;
}
.tblOrder.f13 tbody tr td.graphBox .graph .gBar span {
    position: absolute;
    width: 40px;
    line-height: 20px;
    top: 0;
    left: 6px;
    font-family: Tahoma;
    color: #fff;
    font-weight: bold;
}
.tblOrder.f13 tbody tr td.graphBox .f11 {
    margin-left: 60px;
    color: #666;
}

.infoCheck {
    margin-top: 40px;
    padding-bottom: 10px;
    background: url(../img/sub/bg_box_btm.gif) 0 100% no-repeat;
}
.infoCheck .inner {
    position: relative;
    overflow: hidden;
    padding: 10px 55px 0 140px;
    background: url(../img/sub/bg_box_top.gif) 0 0 no-repeat;
}
.infoCheck .inner .imgBox {
    position: absolute;
    left: 53px;
    top: 50%;
    margin-top: -34px;
}
.infoCheck .inner .txt {
    float: left;
    padding: 23px 0 23px 45px;
    border-left: 1px solid #f5f6f7;
}
.infoCheck .inner .txt strong {
    font-size: 16px;
    color: #333;
}
.infoCheck .inner .txt ul {
    overflow: hidden;
    margin-top: 5px;
}
.infoCheck .inner .txt ul li {
    color: #888;
    line-height: 20px;
}
.infoCheck .inner .txt ul li ul {
    margin: 0 0 0 10px;
}
.infoCheck .inner .txt ul li ul li {
    padding-left: 5px;
    background: url(../img/common/bul_gray_2x2.gif) 0 9px no-repeat;
    color: #888;
}
.boxSearch {
    padding: 15px 0;
    background: #f4f7fb;
    border: 1px solid #ccc;
    border-bottom: 1px solid #b4b2b3;
    text-align: center;
}
.boxSearch.noBg {
    background: none;
}
.boxSearch strong {
    display: inline-block;
    *display: inline;
    zoom: 1;
    margin-right: 24px;
    font-size: 14px;
    color: #333;
    font-weight: bold;
    vertical-align: middle;
}
.boxSearch a {
    vertical-align: middle;
}
.boxSearch .date {
    overflow: hidden;
    display: inline-block;
    *display: inline;
    zoom: 1;
    margin-right: 20px;
    vertical-align: middle;
}
.boxSearch .date a {
    float: left;
    display: inline-block;
    zoom: 1;
    *display: inline;
    width: 60px;
    height: 22px;
    background: #fff;
    border: 1px solid #cdcbcc;
    border-left: none;
    font-size: 12px;
    color: #333;
    text-align: center;
    line-height: 22px;
    letter-spacing: -1px;
    cursor: pointer;
}
.boxSearch .date a:first-child {
    margin-left: 0;
    border-left: 1px solid #cdcbcc;
}
.boxSearch .date a.on {
    height: 24px;
    background: #474a52;
    border: none;
    color: #fff;
}
.boxSearch .cal {
    vertical-align: -20%;
}
.boxSearch .btnMini {
    margin-left: 10px;
}
.boxSearch input[type="text"] {
    width: 91px;
    vertical-align: middle;
}
.orderInfo {
    overflow: hidden;
    margin-top: 10px;
    border: 2px solid #474a52;
    font-size: 14px;
    color: #333;
}
.orderInfo dl {
    position: relative;
    float: left;
    width: 130px;
    background: url(../img/sub/bg_order_line.gif) 100% 0 repeat-y;
}
.orderInfo .total {
    width: 160px;
}
.orderInfo .payAmt {
    width: 130px;
}
.orderInfo .pay {
    width: 156px;
}
.orderInfo dl dt {
    padding: 10px 0;
    background: #f7f8fc url(../img/sub/bg_order_line.gif) 100% 0 repeat-y;
    font-weight: bold;
    text-align: center;
}
.orderInfo dl dd {
    padding: 20px 0;
    text-align: center;
}
.orderInfo dl.payAmt dd {
    padding: 11px 0;
}
.orderInfo dl dd span {
    display: block;
    font-size: 12px;
}
.orderInfo .pay dd {
    padding: 17px 0;
    text-align: center;
}
.refundTotal {
    margin-bottom: 10px;
    padding: 20px 20px 20px 380px;
    background: #f7f8fc;
    border: 2px solid #474a52;
}
.refundTotal strong {
    display: inline-block;
    *display: inline;
    zoom: 1;
    font-size: 14px;
    color: #333;
}
.refundTotal span {
    display: inline-block;
    *display: inline;
    zoom: 1;
    width: 173px;
    text-align: right;
}
.refundTotal .refundAmt {
    width: 100px;
}
.refundTotal.v2 {
    padding-left: 210px;
}
.refundTotal.v2 .refundAmt {
    width: 230px;
}
.refundTotal.v2 .refundAmt2 {
    width: 160px;
}

.myBank {
    padding: 20px 0;
    border: 1px solid #ccc;
    text-align: center;
}
.myBank .tit {
    display: inline-block;
    *display: inline;
    zoom: 1;
    font-size: 16px;
    color: #4b4d54;
}
.myBank.point .tit {
    padding: 20px 0 20px 80px;
    background: url(../img/sub/bg_list_point.gif) 0 0 no-repeat;
}
.myBank .txtMint {
    font-family: Tahoma;
    font-size: 30px;
    line-height: 32px;
    vertical-align: -26%;
}
.myBank.money {
    padding: 18px 0;
    border: none;
}
.myBank.money .tit {
    padding: 20px 0 20px 80px;
    background: url(../img/sub/bg_list_money.gif) 0 0 no-repeat;
}
.couponEnter {
    padding: 20px 0;
    border: 1px solid #ccc;
    border-bottom: 1px solid #b4b2b3;
    text-align: center;
}
.myStudy {
    padding: 35px 0 30px;
    background: #f4f7fb;
    border: 1px solid #ccc;
    text-align: center;
    font-size: 16px;
    color: #4b4d54;
}
.myStudy .tit {
    display: inline-block;
    *display: inline;
    zoom: 1;
}
.myStudy strong.txtRed {
    display: inline-block;
    *display: inline;
    zoom: 1;
    font-family: Tahoma;
    font-size: 30px;
    line-height: 32px;
    vertical-align: -8%;
}

/* 로그인 */
.loginWap {
    margin: 20px 0 0;
    padding: 50px 0 5px;
    background: url(../img/main/bg_info.gif) 0 100% repeat-x;
}
.loginWap h3 {
    padding-bottom: 15px;
}
.loginWap h3 span {
    font-size: 12px;
    font-weight: normal;
}
.loginWap:after {
    content: ".";
    height: 0;
    visibility: hidden;
    display: block;
    clear: both;
}
.loginWap .loginBox {
    position: relative;
    width: 570px;
    margin: 60px auto;
}
.loginWap .loginBox label {
    display: block;
    margin-bottom: 10px;
}
.loginWap .loginBox label span {
    display: inline-block;
    width: 60px;
    font-size: 14px;
    font-weight: bold;
    color: #707482;
}
.loginWap .loginBox label input[type="text"],
.loginWap .loginBox label input[type="password"] {
    padding: 13px 0 13px 5px;
    font-size: 14px;
    font-weight: bold;
    color: #333;
}
.loginWap .loginBox .loginTop {
    position: relative;
    width: 500px;
    margin: 0 50px 0 16px;
}
.loginWap .loginBox .loginTop .login {
    position: absolute;
    right: 0;
    top: 0;
}
.loginWap .txt {
    margin: 10px 0 0 65px;
    color: #666;
}
.loginWap ul {
    margin-top: 18px;
    border-top: 1px solid #e8e8e8;
}
.loginWap ul li {
    position: relative;
    padding-top: 20px;
    padding-left: 10px;
    background: url(../img/common/bul_gray_3x3.gif) 0 27px no-repeat;
    font-size: 14px;
    color: #888;
}
.loginWap ul li .btnSm {
    position: absolute;
    right: 0;
    top: 13px;
    width: 123px;
    height: 28px;
    line-height: 28px;
    text-align: left;
    font-size: 12px;
}
.loginWap ul li .btnSm span {
    display: block;
    padding: 0 16px;
    background: url(../img/common/bg_find.png) 90% 50% no-repeat;
}
.loginWap ul li .btnSm:hover {
    background-color: #f0f2f4;
}
.loginWap ul li .btnSm.btn02 {
    color: #fff;
    background-color: #c01e23;
    border-color: #c01e23;
}
.loginWap ul li .btnSm.btn02 span {
    background: url(../img/common/bg_find_w.png) 90% 50% no-repeat;
}
.loginWap ul li .btnSm.btn02:hover {
    background-color: #a5191e;
}
.capsLoc {
    margin-left: 65px;
    color: red;
}

/* 회원가입 */
.joinStep {
    padding-bottom: 24px;
    background: url(../img/sub/bg_grade.gif) 0 100% repeat-x;
}
.joinStep ul {
    overflow: hidden;
    width: 730px;
    margin: 0 auto;
}
.joinStep li {
    position: relative;
    float: left;
    width: 160px;
    height: 40px;
    margin-left: 30px;
    padding: 25px 0;
    background: url(../img/sub/bg_join.gif) 0 0 no-repeat;
    line-height: 20px;
    text-align: center;
    font-size: 14px;
    color: #fff;
}
.joinStep li:after {
    position: absolute;
    left: -26px;
    top: 50%;
    display: block;
    content: "";
    width: 22px;
    height: 22px;
    margin-top: -11px;
    background: url(../img/sub/bg_join_step.gif) 0 0 no-repeat;
}
.joinStep li:first-child {
    margin-left: 0;
}
.joinStep li:first-child:after {
    background: none;
}
.joinStep li.step3 {
    height: 66px;
    padding: 12px 0;
    margin-left: 30px;
}
.joinStep li span {
    display: block;
    font-size: 13px;
    color: #e2e5e9;
    text-transform: uppercase;
}
.joinStep li.on {
    background: url(../img/sub/bg_join_on.gif) 0 0 no-repeat;
    font-weight: bold;
}
.joinStep li.on span {
    color: #f3e7bf;
}
.joinMember {
    margin-top: 40px;
}
.joinMember .titBox .txt {
    font-size: 16px;
    color: #333;
    font-weight: bold;
}
.joinMember .titBox .right {
    top: -5px;
}
.joinMember .titBox .right .btnSm {
    width: 123px;
    height: 28px;
    line-height: 28px;
    color: #333;
    font-weight: bold;
}
.joinMember .titBox .right .btnSm:hover {
    background-color: #f0f2f4;
}
.joinMember ul {
    margin-top: 10px;
}
.joinMember ul li {
    position: relative;
    float: left;
    width: 202px;
    height: 287px;
    margin-left: 8px;
    border: 1px solid #ccc;
    border-top: 2px solid #474a52;
    border-bottom: 1px solid #b4b2b3;
    text-align: center;
}
.joinMember ul li:first-child {
    margin-left: 0;
}
.joinMember ul li a {
    display: block;
    height: 100%;
    color: #666;
    font-weight: bold;
}
.joinMember ul li.member01 a {
    background: url(../img/sub/bg_join_member01.gif) 0 0 no-repeat;
}
.joinMember ul li.member02 a {
    background: url(../img/sub/bg_join_member02.gif) 0 0 no-repeat;
}
.joinMember ul li.member03 a {
    background: url(../img/sub/bg_join_member03.gif) 0 0 no-repeat;
}
.joinMember ul li.member04 a {
    background: url(../img/sub/bg_join_member04.gif) 0 0 no-repeat;
}
.joinMember ul li.member01:hover a {
    background: url(../img/sub/bg_join_member01_on.gif) 0 0 no-repeat;
}
.joinMember ul li.member02:hover a {
    background: url(../img/sub/bg_join_member02_on.gif) 0 0 no-repeat;
}
.joinMember ul li.member03:hover a {
    background: url(../img/sub/bg_join_member03_on.gif) 0 0 no-repeat;
}
.joinMember ul li.member04:hover a {
    background: url(../img/sub/bg_join_member04_on.gif) 0 0 no-repeat;
}
.joinMember ul li a:hover {
    background: url(../img/sub/bg_member_on.gif) 0 0 no-repeat;
}
.joinMember ul li a strong {
    display: block;
    margin-bottom: 10px;
    padding-top: 70px;
    font-size: 24px;
    color: #474a52;
}
.joinMember ul li:after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    border-bottom: 1px solid #ccc;
}
.paContact {
    margin: 20px 0 20px;
    text-align: center;
}
label {
    display: inline-block;
    *display: inline;
    zoom: 1;
    margin-right: 15px;
    font-size: 13px;
    font-weight: bold;
    color: #333;
}

/* 약관동의 */
.agreeArea.bdTop {
    margin-top: 35px;
    padding-top: 35px;
    border-top: 1px dotted #ccc;
}
.agreeArea.bdTop .tblTop {
    margin-bottom: 15px;
}
.agreeArea.bdTop .tblTop h4 {
    font-size: 18px;
    font-weight: normal;
}
.agreeArea.bdTop .agreeBox {
    overflow-y: scroll;
    height: 179px;
    margin: 10px 0;
    padding: 14px;
    border: 1px solid #bbb;
    border-top: 2px solid #474a52;
    font-size: 13px;
    line-height: 20px;
    color: #888;
}
.agreeArea.bdTop .agreeBox p {
    font-weight: bold;
    padding-left: 10px;
}
.agreeArea.bdTop .agreeBox span {
    display: block;
    font-weight: bold;
    letter-spacing: 0;
    padding-bottom: 10px;
}
.agreeArea.bdTop .agreeBox strong {
    font-weight: normal;
}
.agreeArea.bdTop .agreeBox .box {
    padding-bottom: 10px;
}
.agreeArea.bdTop label {
    display: block;
    font-size: 15px;
    font-weight: bold;
    color: #333;
}

/* 약관동의layer */
.agreeArea.bdTop_Layer {
    margin-top: -35px;
    padding-top: 5px;
}
.agreeArea.bdTop_Layer .tblTop {
    margin-bottom: 5px;
}
.agreeArea.bdTop_Layer .tblTop h4 {
    font-size: 18px;
    font-weight: normal;
}
.agreeArea.bdTop_Layer .agreeBox {
    overflow-y: scroll;
    height: 179px;
    margin: 10px 0;
    padding: 14px;
    border: 1px solid #bbb;
    border-top: 2px solid #474a52;
    font-size: 13px;
    line-height: 20px;
    color: #888;
}
.agreeArea.bdTop_Layer .agreeBox p {
    font-weight: bold;
    padding-left: 10px;
}
.agreeArea.bdTop_Layer .agreeBox span {
    display: block;
    font-weight: bold;
    letter-spacing: 0;
    padding-bottom: 10px;
}
.agreeArea.bdTop_Layer .agreeBox strong {
    font-weight: normal;
}
.agreeArea.bdTop_Layer .agreeBox .box {
    padding-bottom: 10px;
}
.agreeArea.bdTop_Layer label {
    display: block;
    font-size: 15px;
    font-weight: bold;
    color: #333;
}

/* 약관동의layer */
.agreeArea.bdTop_SNS {
    margin-top: 15px;
    padding-top: 5px;
}
.agreeArea.bdTop_SNS .tblTop {
    margin-bottom: 5px;
}
.agreeArea.bdTop_SNS .tblTop h4 {
    font-size: 16px;
    font-weight: normal;
}
.agreeArea.bdTop_SNS .agreeBox {
    overflow-y: scroll;
    height: 79px;
    margin: 10px 0;
    padding: 14px;
    border: 1px solid #bbb;
    border-top: 2px solid #474a52;
    font-size: 13px;
    line-height: 20px;
    color: #888;
}
.agreeArea.bdTop_SNS .agreeBox p {
    font-weight: bold;
    padding-left: 10px;
}
.agreeArea.bdTop_SNS .agreeBox span {
    display: block;
    font-weight: bold;
    letter-spacing: 0;
    padding-bottom: 10px;
}
.agreeArea.bdTop_SNS .agreeBox strong {
    font-weight: normal;
}
.agreeArea.bdTop_SNS .agreeBox .box {
    padding-bottom: 10px;
}
.agreeArea.bdTop_SNS label {
    display: block;
    font-size: 15px;
    font-weight: bold;
    color: #333;
}

/* 실명확인 */
.certifyArea {
    overflow: hidden;
    margin-top: 40px;
}
.certifyArea div {
    float: left;
    border: 1px solid #ccc;
    border-top: 2px solid #474a52;
}
.certifyArea div:first-child {
    margin-right: 8px;
}
.certifyArea div a {
    display: block;
    width: 234px;
    padding: 48px 10px 48px 170px;
    background: url(../img/sub/bg_certify01.gif) 0 0 no-repeat;
}
.certifyArea div a:hover {
    background: url(../img/sub/bg_certify01_on.gif) 0 0 no-repeat;
}
.certifyArea div:first-child a {
    background: url(../img/sub/bg_certify02.gif) 0 0 no-repeat;
}
.certifyArea div:first-child a:hover {
    background: url(../img/sub/bg_certify02_on.gif) 0 0 no-repeat;
}
.certifyArea dl + div a {
    background: url(../img/sub/bg_certify02.gif) -20px 4px no-repeat;
}
.certifyArea dl + div a:hover {
    background: url(../img/sub/bg_certify02_on.gif) -20px 4px no-repeat;
}

.certifyArea div strong {
    display: block;
    margin: 5px 0 10px;
    font-size: 18px;
    color: #474a52;
}
.certifyArea dl {
    clear: both;
    overflow: hidden;
    width: 331px;
    margin: 0 auto;
}
.certifyArea dl dt {
    float: left;
    width: 90px;
    margin-bottom: 15px;
    padding-left: 8px;
    background: url(../img/common/bul_gray_3x3.gif) 0 7px no-repeat;
    font-size: 14px;
    font-weight: bold;
}
.certifyArea dl dd {
    float: left;
    width: 228px;
    margin-bottom: 15px;
}
.certifyArea dl dd input {
    font-size: 14px;
    color: #333;
    font-weight: bold;
}

.certifyArea.line {
    padding: 30px 0 50px;
    border: 1px solid #ccc;
}
.certifyArea.line div {
    background: url(../img/sub/bg_certify02.gif) 70px 50px no-repeat;
}
.certifyArea.line dl {
    margin-bottom: 15px;
}
.certifyArea.line dl + div {
    margin: 0 8px 0 65px;
    background: url(../img/sub/bg_certify01.gif) 70px 50px no-repeat;
}
.certifyArea.line div a {
    width: 200px;
    padding: 48px 10px 48px 136px;
}

.certify_msg {
    text-align: center;
    margin-top: 15px;
}
.certify_msg span {
    display: inline-block;
    *display: inline;
    zoom: 1;
    padding-left: 16px;
    font-size: 14px;
    color: #eb5456;
    background: url(../img/sub/bg_msg.gif) no-repeat 0 4px;
}

/* 기본정보입력 */
.tblForm tbody tr td .address {
    margin: 10px 0 0 66px;
}
.tblForm tbody tr td .sms {
    margin-top: 10px;
    color: #333;
}
.tblForm tbody tr td .sms label {
    display: inline-block;
    *display: inline;
    zoom: 1;
    margin-left: 10px;
}
.tblForm tbody tr td .email {
    margin-top: 10px;
    color: #333;
}
.tblForm tbody tr td .email label {
    display: inline-block;
    *display: inline;
    zoom: 1;
    margin-left: 10px;
}

/* 회원가입 완료 */
.joinMessage {
    margin-top: 85px;
    font-size: 14px;
    color: #888;
    text-align: center;
}
.joinMessage strong {
    display: block;
}
.joinMessage .txtEnd {
    margin: 15px 0 25px;
    font-size: 20px;
    color: #333;
}
.joinMessage .txtEnd strong {
    display: inline;
}

/* 회원정보 수정 */
.checkArea .t_center {
    font-size: 18px;
    font-weight: bold;
    color: #333;
}
.checkArea .borderBox dl {
    float: left;
}
.checkArea .borderBox dl dd {
    margin-left: 10px;
}
.checkArea .borderBox dl:first-child {
    margin: 0 25px 0 90px;
    *margin-top: 5px;
}

.borderBox {
    overflow: hidden;
    width: 600px;
    margin: 20px auto 0;
    padding: 45px 0;
    border: 1px solid #ccc;
}
.borderBox dl {
    font-size: 14px;
}
.borderBox dl dt {
    padding-left: 8px;
    background: url(../img/common/bul_gray_3x3.gif) 0 7px no-repeat;
    font-weight: bold;
}
.borderBox dl dt,
.borderBox dl dd {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

/* 비밀번호변경 */
.pwArea .t_center {
    font-size: 18px;
    font-weight: bold;
    color: #333;
}
.pwArea .borderBox {
    padding: 45px 0 30px;
}
.pwArea dl {
    width: 372px;
    margin: 0 auto;
}
.pwArea dl dt {
    width: 172px;
    margin-bottom: 15px;
}
.pwArea dl dd {
    width: 185px;
    margin-bottom: 15px;
}

/* 아이디찾기 */
.idfindArea {
    border: 1px solid #ccc;
    border-top: none;
}
.idfindArea .top {
    padding: 17px 0;
    background: url(../img/sub/bg_id_find.gif) 0 0 repeat-x;
    border-top: 2px solid #474a52;
    border-bottom: 1px solid #e8e8e8;
    text-align: center;
    color: #333;
}
.idfindArea .top label:first-child {
    margin-right: 25px;
}
.idfindArea .borderBox {
    margin-top: 0;
    padding: 25px 0 15px;
    border: none;
}
.idfindArea .borderBox dl {
    width: 328px;
    margin: 0 auto;
}
.idfindArea .borderBox dl dt {
    width: 88px;
    margin-bottom: 15px;
}
.idfindArea .borderBox dl dd {
    width: 226px;
    margin-bottom: 15px;
}
.idfindArea .borderBox dl dd input {
    font-size: 14px;
    color: #333;
    font-weight: bold;
}

/* 아이디찾기 완료 */
.msgArea {
    width: 600px;
    margin: 0 auto;
    padding: 50px 0;
    border: 1px solid #ccc;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
    color: #333;
}
.msgArea .tit {
    display: block;
    margin-bottom: 15px;
    font-size: 34px;
    font-weight: normal;
    line-height: 1;
}

/* 비밀번호 찾기 */
.pwFindArea .borderBox {
    width: 100%;
    padding: 35px 0 15px;
}
.pwFindArea dl {
    width: 331px;
    margin: 0 auto;
}
.pwFindArea dl dt {
    width: 90px;
    margin-bottom: 15px;
}
.pwFindArea dl dd {
    width: 228px;
    margin-bottom: 15px;
}
.pwFindArea .borderBox dl dd input {
    font-size: 14px;
    color: #333;
    font-weight: bold;
}

/* 본인인증하기 */
.pwFindAreaAuth .borderBox {
    width: 100%;
    padding: 35px 0 15px;
}
.pwFindAreaAuth dl {
    width: 531px;
    margin: 0 auto;
}
.pwFindAreaAuth dl dt {
    width: 90px;
    margin-bottom: 15px;
}
.pwFindAreaAuth dl dd {
    width: 428px;
    margin-bottom: 15px;
}
.pwFindAreaAuth .borderBox dl dd input {
    font-size: 14px;
    color: #333;
    font-weight: bold;
}

/* 검색결과 */
.searchResult {
    font-size: 16px;
    border: 1px solid #f2f2f2;
    padding: 16px 18px;
}
.searchResult .ico {
    display: inline-block;
    width: 24px;
    line-height: 24px;
    margin-right: 5px;
    color: #fff;
    text-align: center;
    font-weight: 700;
    background-color: #f2f2f2;
    border-radius: 50%;
}
.searchTab {
    margin: 20px 0;
}
.searchTab ul {
    display: flex;
}
.searchTab ul li {
    margin-left: 7px;
}
.searchTab ul li:first-child {
    margin-left: 0;
}
.searchTab ul li a {
    display: block;
    min-width: 120px;
    text-align: center;
    padding: 0 15px;
    font-size: 14px;
    line-height: 40px;
    color: #0d0d0d;
    background-color: #f2f2f2;
    border-radius: 5px;
    transition: color 0.4s, background-color 0.4s;
}
.searchTab ul li.on a {
    color: #fff;
    background-color: #232738;
}
.searchTab ul li:hover a {
    color: #fff;
    background-color: #232738;
}

.searchList {
    border-top: 1px solid #f2f2f2;
}
.searchList > li {
    display: flex;
    justify-content: space-between;
    padding: 20px 0;
    border-bottom: 1px solid #f2f2f2;
}
.searchList .cont {
    display: flex;
}
.searchList .cont .frame {
    width: 260px;
    height: 170px;
    overflow: hidden;
    border-radius: 5px;
    margin-right: 30px;
    flex-shrink: 0;
}
.searchList .cont .frame img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.searchList .txtbox {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.searchList .txtbox .title a {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4em;
}
.searchList .txtbox .txtSumm {
    font-size: 14px;
    line-height: 1.4em;
    margin-top: 10px;
}

.searchList .pricebox li {
    margin: 3px 0;
    color: #0d0d0d;
    font-size: 12px;
}
.searchList .pricebox li .lft {
    display: inline-block;
    width: 45px;
    vertical-align: middle;
    position: relative;
}
.searchList .pricebox li .lft::before {
    display: block;
    position: absolute;
    left: -8px;
    content: "·";
}
.searchList .pricebox li .rgt {
    display: inline-block;
    width: 100px;
    vertical-align: middle;
    letter-spacing: 0;
}
.searchList .pricebox li .rgt .total {
    font-size: 15px;
    font-weight: 600;
    vertical-align: bottom;
}
.searchList .pricebox li .rgt .disc {
    font-weight: 500;
    text-decoration: line-through;
}

.searchList .btnBox {
    flex-shrink: 0;
    margin-left: 15px;
}
.searchList .btn {
    display: block;
    width: 175px;
    line-height: 45px;
    margin-bottom: 5px;
    font-size: 16px;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 5px;
}
.searchList .btn.btnBlue {
    color: #fff;
    background-color: #12b3fb;
    font-weight: 700;
    border-color: #12b3fb;
}

.searchList li dl.txt_another {
    overflow: hidden;
    margin-top: 15px;
    float: none;
    width: 520px;
    color: #888;
}
.searchList li dl.txt_another dt {
    float: left;
    margin: 0 5px 4px 0;
}
.searchList li dl.txt_another dd {
    float: left;
    margin: 0 5px 4px 0;
}
.searchList li dl.txt_another dd.date {
    width: 180px;
    font-family: Tahoma;
}
.searchList li dl.txt_another dd strong {
    color: #907c6b;
}
.searchList li dl.txt_another dd a {
    vertical-align: -11%;
}
.searchList li .txt .list .etc {
    margin-left: 0;
    background: none;
    padding-left: 0;
}
.searchList li .icoRred {
    vertical-align: 0px;
}
.clr_left {
    clear: left;
}
.listbar {
    display: block;
    margin-left: 9px;
    padding-left: 9px;
    background: url(../img/common/bg_bar_1x11.gif) 0 3px no-repeat;
}
.pt_red {
    color: #eb5456;
}

/* 결제 */
.orderStep {
    overflow: hidden;
}
.orderStep ul {
    overflow: hidden;
    float: right;
}
.orderStep li {
    position: relative;
    float: left;
    width: 156px;
    height: 44px;
    margin-left: 32px;
    padding: 10px 0;
    background: url(../img/sub/bg_order_step.gif) 0 0 no-repeat;
    line-height: 24px;
    text-align: center;
    font-size: 15px;
    color: #fff;
    font-weight: bold;
}
.orderStep li:after {
    position: absolute;
    left: -26px;
    top: 50%;
    display: block;
    content: "";
    width: 22px;
    height: 22px;
    margin-top: -11px;
    background: url(../img/sub/bg_join_step.gif) 0 0 no-repeat;
}
.orderStep li:first-child {
    margin-left: 0;
}
.orderStep li:first-child:after {
    background: none;
}
.orderStep li span {
    font-size: 13px;
    color: #f3e7bf;
}
.orderStep li.on {
    background: url(../img/sub/bg_order_step_on.gif) 0 0 no-repeat;
}
.orderTotal {
    overflow: hidden;
    padding: 0 40px;
    background: #f7f8fc;
    border: 1px solid #474a52;
    border-top: 2px solid #474a52;
    font-size: 14px;
    color: #333;
    height: 80px;
}
.orderTotal dl {
    overflow: hidden;
    width: 280px;
    height: 80px;
    margin-right: 21px;
    padding: 27px 57px 27px 0;
    background: url(../img/sub/bg_order_line.gif) 96% 0 repeat-y;
}
.orderTotal dl.pay {
    margin-right: 0;
    padding-right: 0;
    background: none;
}
.orderTotal dl dt {
    float: left;
    width: 105px;
    margin-top: -14px;
    text-align: left;
}
.orderTotal dl dd {
    float: right;
    width: 175px;
    text-align: right;
}
.orderTotal .pay {
    float: right;
}
.orderTotal .pay dd strong {
    font-size: 28px;
    line-height: 1.2;
    vertical-align: -8%;
}
.orderTotal .amtBox {
    position: relative;
    float: left;
}
.orderTotal .amtBox:after {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 23px;
    width: 30px;
    height: 30px;
    background: url(../img/sub/bg_order_total.png) 0 0 no-repeat;
}
.orderTotal .amtBox:first-child:after {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 23px;
    width: 30px;
    height: 30px;
    background: url(../img/sub/bg_order_minus.png) 0 0 no-repeat;
}
.orderTotal .amtBox dd strong {
    font-size: 24px;
    line-height: 1.2;
    vertical-align: -8%;
}
.orderCheck {
    margin: 80px 0 20px;
    padding: 39px 187px;
    background: url(../img/sub/bg_order_check.gif) 0 0 no-repeat;
}
.orderCheck strong {
    font-size: 18px;
    color: #333;
}
.orderCheck ul {
    overflow: hidden;
    margin-top: 5px;
}
.orderCheck ul li {
    float: left;
    width: 278px;
    color: #888;
    line-height: 20px;
}
.recommBox {
    padding: 35px 40px;
    background: #f7f8fc;
    border: 1px solid #cdd0d5;
}
.recommBox h3 {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #474a52;
    font-size: 16px;
    font-weight: bold;
    color: #000;
}
.recommBox ul {
    overflow: hidden;
}
.recommBox ul li {
    float: left;
    width: 498px;
}
.recommBox ul li img {
    float: left;
    margin-right: 20px;
    width: 200px;
    height: 130px;
}
.recommBox ul li .txt {
    padding-right: 10px;
}
.recommBox ul li .txt strong {
    display: block;
    height: 65px;
    margin: 15px 0 0;
    font-size: 20px;
    color: #333;
    line-height: 25px;
}
.recommBox ul li .txt a {
    margin-top: 18px;
    letter-spacing: -1px;
}
.payBox {
    display: flex;
    overflow: hidden;
    margin-top: 40px;
    border: 2px solid #000;
}
.payBox > h3 {
    float: left;
    width: 180px;
    margin-top: 33px;
    font-size: 22px;
    font-weight: bold;
    color: #333;
    text-align: center;
    line-height: 1.2;
}
.payBox .payTool {
    float: left;
    width: 437px;
    height: 169px;
    padding: 40px 50px;
    background: #f7f8fc;
}
.payBox .payTool dt {
    margin-bottom: 25px;
    font-size: 14px;
    color: #333;
    font-weight: bold;
}
.payBox .payTool .txtInfo {
    margin-top: 10px;
    padding-left: 20px;
    background: url(../img/sub/bg_txt_info.gif) 0 4px no-repeat;
    color: #888;
    line-height: 20px;
}
.payBox .totalOrder {
    float: left;
    width: 278px;
    height: 169px;
    padding: 40px;
    background: #f7f8fc;
    border-left: 1px solid #cdd0d5;
}
.payBox .totalOrder dl {
    overflow: hidden;
    font-size: 13px;
    color: #333;
}
.payBox .totalOrder dl dt {
    float: left;
    width: 95px;
    margin-bottom: 15px;
}
.payBox .totalOrder dl dd {
    float: right;
    width: 183px;
    margin-bottom: 15px;
    font-size: 14px;
    text-align: right;
}
.payBox .totalOrder dl.total {
    padding-top: 10px;
    border-top: 1px solid #cdd0d5;
}
.payBox .totalOrder dl.total dt {
    font-size: 17px;
    font-weight: bold;
}
.payBox .totalOrder dl.total dd strong {
    font-size: 28px;
    line-height: 1.2;
    vertical-align: -8%;
}
.payBox .payAgree {
    float: left;
    width: 477px;
    height: 370px;
    padding: 35px 30px 0;
    background: #f0f2f9;
}
.payBox .payAgree .tit {
    font-size: 18px;
    font-weight: bold;
    color: #333;
}
.payBox .payAgree .agreebox {
    overflow: hidden;
    overflow-y: auto;
    margin-top: 22px;
    height: 218px;
    padding: 16px 20px;
    line-height: 18px;
    font-size: 12px;
    color: #666;
    border: 1px solid #cdd0d5;
    background: #fff;
}
.payBox .payAgree .agree_chk {
    margin-top: 22px;
    text-align: right;
}
.payBox .new_payTool {
    float: left;
    width: 323px;
    padding-left: 30px;
    background: #f0f2f9;
    width: calc(100% - 180px - 477px);
    box-sizing: border-box;
}
.payBox .new_payTool .payTool {
    float: none;
    width: 323px;
    height: auto;
    padding: 0;
    background: none;
}
.payBox .new_payTool .payTool dt {
    padding-top: 34px;
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: bold;
}
.payBox .new_payTool .payTool label {
    display: block;
    padding-left: 8px;
    margin-top: 12px;
    font-size: 14px;
    font-weight: normal;
}
.payBox .new_payTool .payTool .icobox {
    display: inline-block;
    position: relative;
    transform: translateY(5px);
    margin-left: 8px;
}
.payBox .new_payTool .payTool .icobox .bubble {
    display: block;
    position: absolute;
    top: -30px;
    left: 25px;
    background: #474a52;
    border-radius: 0.4em;
    color: #fff;
    font-size: 11.5px;
    letter-spacing: -0.05em;
    padding: 0 7px 2px;
}
.payBox .new_payTool .payTool .icobox .bubble:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-top-color: #474a52;
    border-bottom: 0;
    border-left: 0;
    margin-left: -3px;
    margin-bottom: -6px;
}
.payBox .new_payTool .totalOrder {
    float: none;
    width: 323px;
    height: auto;
    padding: 0;
    padding-top: 8px;
    border-left: 0;
    background: none;
}
.payBox .new_payTool .totalOrder dl {
    padding-top: 16px;
    border-top: 1px solid #cdd0d5;
}
.payBox .new_payTool .totalOrder dl dt {
    width: 100px;
    margin-bottom: 6px;
    padding-left: 12px;
}
.payBox .new_payTool .totalOrder dl dd {
    width: 190px;
    margin-bottom: 6px;
    padding-right: 12px;
}
.payBox .new_payTool .totalOrder dl.total {
    margin-top: 12px;
    padding-top: 8px;
}
.payBox .new_payTool .totalOrder dl.total dt {
    padding-top: 8px;
}
.payBox .new_payTool .totalOrder dl.total dd {
    font-size: 17px;
}

.orderEnd {
    margin-top: 15px;
    padding: 70px 35px 35px 35px;
    border: 5px solid #e2e5e9;
}
.orderMsg {
    padding-bottom: 4px;
    background: url(../img/sub/bg_grade.gif) 0 100% repeat-x;
    text-align: center;
}
.orderMsg p {
    margin: 0 auto 20px;
}
.orderMsg div {
    padding-bottom: 50px;
    font-size: 16px;
    line-height: 26px;
    color: #888;
}
.orderMsg .account {
    margin-bottom: 15px;
    padding: 20px 0;
    background-color: #f7f8fc;
    font-size: 14px;
    line-height: 25px;
}
.orderMsg .account ul {
    display: inline-block;
    margin: 0 auto;
}
.orderMsg .account ul li {
    text-align: center;
}
.orderMsg .account ul li div {
    display: inline-block;
    padding: 0 0 0 11px;
    background: url(../img/common/bul_mint_3x3.gif) 0 10px no-repeat;
    font-size: 14px;
    color: #333;
    line-height: 25px;
}

.orderTotalDetail {
    overflow: hidden;
    margin-top: 10px;
    border: 2px solid #474a52;
    font-size: 14px;
    color: #333;
}
.orderTotalDetail dl {
    position: relative;
    float: left;
    width: 152px;
    background: url(../img/sub/bg_order_line.gif) 100% 0 repeat-y;
}
.orderTotalDetail .amtBox:after {
    content: "";
    display: block;
    position: absolute;
    left: -15px;
    top: 40px;
    width: 30px;
    height: 30px;
    background: url(../img/sub/bg_order_minus.png) 0 0 no-repeat;
}
.orderTotalDetail .amtBox:first-child:after {
    background: none;
}
.orderTotalDetail .payAmt:after {
    content: "";
    display: block;
    position: absolute;
    left: -15px;
    top: 40px;
    width: 30px;
    height: 30px;
    background: url(../img/sub/bg_order_total.png) 0 0 no-repeat;
}
.orderTotalDetail dl dt {
    padding: 10px 0;
    background: #f7f8fc url(../img/sub/bg_order_line.gif) 100% 0 repeat-y;
    font-weight: bold;
    text-align: center;
}
.orderTotalDetail dl dd {
    padding: 20px 0;
    text-align: center;
}
.orderTotalDetail dl.payAmt dd {
    padding: 11px 0;
}
.orderTotalDetail dl dd span {
    display: block;
    font-size: 12px;
}
.orderTotalDetail dl dd strong {
    font-size: 18px;
    vertical-align: -8%;
}
.orderTotalDetail .pay {
    width: 236px;
}
.orderTotalDetail .pay dd {
    padding: 17px 0;
    text-align: center;
}
.orderTotalDetail .pay dd strong {
    font-size: 28px;
}

/* 회원탈퇴 */
.txtOut {
    margin-top: 50px;
}
.txtOut .msg {
    margin-bottom: 25px;
    font-size: 14px;
    color: #888;
    text-align: center;
    line-height: 20px;
}
.txtOut .msg div {
    margin-top: 5px;
}
.bdBox {
    padding: 30px;
    border: 1px solid #ccc;
}
.bdBox strong {
    display: block;
    margin-bottom: 10px;
    padding-left: 25px;
    background: url(../img/sub/bg_msg_check.gif) 0 3px no-repeat;
    font-size: 16px;
    color: #333;
}
.bdBox ul li {
    padding-left: 35px;
    text-indent: -9px;
}
.txtOutEnd {
    margin-top: 72px;
    padding-top: 63px;
    background: url(../img/sub/bg_out.gif) 50% 0 no-repeat;
}
.txtOutEnd .msg {
    margin-bottom: 25px;
    font-size: 14px;
    color: #888;
    text-align: center;
    line-height: 20px;
}
.txtOutEnd .msg div {
    margin-top: 10px;
}

/* ETC */
.ruleArea .box {
    margin-bottom: 25px;
    font-size: 13px;
    line-height: 20px;
    letter-spacing: -1px;
}
.ruleArea .box h4 {
    margin-bottom: 5px;
    font-weight: bold;
    color: #000;
    text-decoration: underline;
}
.ruleArea .box p {
    margin-bottom: 25px;
}
.ruleUseArea h4 {
    margin: 35px 0 25px;
    font-size: 24px;
    color: #333;
}
.ruleUseArea .box {
    margin-bottom: 25px;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: -1px;
}
.ruleUseArea .box h5 {
    margin-bottom: 5px;
    font-size: 16px;
    font-weight: bold;
    color: #000;
    text-decoration: underline;
}
.ruleUseArea .box .t_index {
    margin-left: 12px;
}
.siteArea {
    overflow: hidden;
    margin-top: 33px;
}
.siteArea .inner {
    float: left;
    width: 190px;
    margin-left: 30px;
}
.siteArea .inner:first-child {
    margin-left: 0;
}
.siteArea .inner .wrap {
    height: 210px;
}
.siteArea .inner h4 {
    margin-bottom: 20px;
    padding: 15px 0 15px 10px;
    border-top: 1px solid #333;
    border-bottom: 1px solid #cdd0d5;
    font-size: 18px;
    font-weight: bold;
    color: #333;
}
.siteArea .inner ul {
    padding-left: 10px;
}
.siteArea .inner ul li {
    margin-bottom: 14px;
    font-size: 14px;
}
.siteArea .inner.teacher strong {
    display: block;
    margin-bottom: 15px;
    padding-left: 10px;
    font-size: 14px;
    color: #333;
}
.siteArea .inner.teacher ul {
    overflow: hidden;
    margin-bottom: 14px;
}
.siteArea .inner.teacher ul li {
    margin-bottom: 2px;
    padding-left: 9px;
    background: url(../img/common/bul_gray_2x2.gif) 0 9px no-repeat;
    color: #333;
}
.siteArea .inner.teacher ul li a {
    position: relative;
    display: inline-block;
    margin-right: 5px;
    margin-bottom: 6px;
    padding-right: 5px;
    color: #333; /*letter-spacing:-1px;*/
    font-size: 14px;
}
.siteArea .inner.teacher ul li a:after {
    content: "";
    display: block;
    position: absolute;
    left: -8px;
    top: 3px;
    height: 14px;
    border-left: 2px solid #eee;
}
.siteArea .inner.teacher ul li a:first-child:after {
    border: none;
}
.siteArea .inner.teacher div.last ul li {
    display: block;
    margin-bottom: 5px;
    padding-left: 0;
    background: none;
    font-size: 14px;
}
.siteArea .inner .my ul li {
    font-weight: bold;
    color: #333;
    font-size: 14px;
}
.siteArea .inner .my ul li ul {
    margin: 12px 0 25px 0;
    padding-left: 0;
}
.siteArea .inner .my ul li ul li {
    margin-left: 0;
    margin-bottom: 8px;
    padding-left: 9px;
    background: url(../img/common/bul_gray_2x2.gif) 0 9px no-repeat;
    font-weight: normal;
}
.siteArea .inner .my ul li ul li a {
    color: #333;
    font-size: 14px;
}
.siteArea .inner a:hover {
    color: #00a2ba !important;
    text-decoration: underline;
}

/* 최진기선생님 소개 */
.teacher_info {
}
.teacher_info .mvbox {
    padding: 55px 52px;
    background: url(../img/sub/bg_teacher_mvlist.gif) repeat 0 0;
}
.teacher_info .mvbox .tit {
    margin-top: 30px;
    text-align: center;
}
.teacher_info .mvbox .mvlist {
    margin-top: 25px;
}
.teacher_info .mvbox .mvlist ul {
    overflow: hidden;
}
.teacher_info .mvbox .mvlist ul:after {
    content: "";
    display: block;
    clear: both;
}
.teacher_info .mvbox .mvlist li {
    float: left;
    width: 226px; /* height:226px; */
    margin-left: 19px;
}
.teacher_info .mvbox .mvlist li:first-child {
    padding-left: 0;
    border-left: 0;
}
.teacher_info .mvbox .mvlist li .thum img {
    width: 226px;
    height: 148px;
}
.teacher_info .mvbox .mvlist li .cont {
    padding: 10px;
    background: #2d2f33;
    min-height: 75px;
}
.teacher_info .mvbox .mvlist li .ttl {
    color: #fff;
    font-size: 14px;
    width: 194px; /* white-space: nowrap; */ /* text-overflow: ellipsis; */
    overflow: hidden;
}
.teacher_info .mvbox .mvlist li .time {
    margin-top: 2px;
    padding-left: 20px;
    font-size: 12px;
    color: #858586;
    background: url(../img/sub/ico_timer.png) no-repeat 0 bottom;
}

/* 조승연선생님 소개 */
.teacher_info {
}
.teacher_info .mvbox2 {
    padding: 55px 52px;
    background: url(http://www.ohmyschool.org/img/sub/bg_teacher_mvlist2.gif) repeat 0 0;
}
.teacher_info .mvbox2 .tit {
    margin-top: 45px;
    text-align: center;
}
.teacher_info .mvbox2 .mvlist {
    margin-top: 16px;
}
.teacher_info .mvbox2 .mvlist ul {
    overflow: hidden;
    margin-left: -14px;
}
.teacher_info .mvbox2 .mvlist ul:after {
    content: "";
    display: block;
    clear: both;
}
.teacher_info .mvbox2 .mvlist li {
    float: left;
    width: 226px;
    height: 226px;
    margin-left: 19px;
    border-left: 1px solid #313238;
}
.teacher_info .mvbox2 .mvlist li:first-child {
    padding-left: 0;
    border-left: 0;
}
.teacher_info .mvbox2 .mvlist li .thum img {
    width: 226px;
    height: 148px;
}
.teacher_info .mvbox2 .mvlist li .cont {
    height: 74px;
    padding: 10px;
    background: #013366;
}
.teacher_info .mvbox2 .mvlist li .ttl {
    color: #fff;
    font-size: 14px;
    width: 194px; /* white-space: nowrap; */ /* text-overflow: ellipsis; */
    overflow: hidden;
}
.teacher_info .mvbox2 .mvlist li .time {
    margin-top: 2px;
    padding-left: 20px;
    font-size: 12px;
    color: #858586;
    background: url(../img/sub/ico_timer.png) no-repeat 0 bottom;
}

/* 정현두선생님 소개 */
.teacher_info {
}
.teacher_info .mvbox3 {
    padding: 55px 52px;
    background: #181e5c;
}
.teacher_info .mvbox3 .tit {
    margin-top: 45px;
    text-align: center;
}
.teacher_info .mvbox3 .mvlist {
    margin-top: 16px;
}
.teacher_info .mvbox3 .mvlist ul {
    overflow: hidden;
    margin-left: -14px;
}
.teacher_info .mvbox3 .mvlist ul:after {
    content: "";
    display: block;
    clear: both;
}
.teacher_info .mvbox3 .mvlist li {
    float: left;
    width: 226px;
    height: 226px;
    margin-left: 19px;
    border-left: 1px solid #313238;
}
.teacher_info .mvbox3 .mvlist li:first-child {
    padding-left: 0;
    border-left: 0;
}
.teacher_info .mvbox3 .mvlist li .thum img {
    width: 226px;
    height: 148px;
}
.teacher_info .mvbox3 .mvlist li .cont {
    width: 226px;
    height: 74px;
    padding: 10px;
    background: #013366;
}
.teacher_info .mvbox3 .mvlist li .ttl {
    color: #fff;
    font-size: 14px;
    width: 194px; /* white-space: nowrap; */ /* text-overflow: ellipsis; */
    overflow: hidden;
}
.teacher_info .mvbox3 .mvlist li .time {
    margin-top: 2px;
    padding-left: 20px;
    font-size: 12px;
    color: #858586;
    background: url(../img/sub/ico_timer.png) no-repeat 0 bottom;
}

/* 출강/제휴 */ /* 김아영 수정_18-03-20 */
.b2b_guide .slideWrap_cont4 a.slidesjs-navigation {
    margin-top: 140px;
}
.b2b_guide a.slidesjs-navigation {
    position: absolute;
    z-index: 2;
    display: block;
    width: 24px;
    height: 42px;
    top: 50%;
    background-repeat: no-repeat;
    text-indent: -999999px;
}
.b2b_guide a.slidesjs-previous {
    left: 13px;
    background-image: url(http://www.ohmyschool.org/img/partner/b2b_slide_prev.png);
}
.b2b_guide a.slidesjs-next {
    right: 13px;
    background-image: url(http://www.ohmyschool.org/img/partner/b2b_slide_next.png);
}
.b2b_guide .slideWrap_cont7 {
    overflow: hidden;
    position: relative;
    width: 841px;
    height: 315px;
    background: url(../img/partner/b2b_cont7_bg.gif) repeat;
    text-align: center;
}
.b2b_guide .slideWrap_cont7 .slide_cont7 {
    width: 100%;
    height: 100%;
}
.b2b_guide .slideWrap_cont7 .slidesjs-container {
    position: relative;
    height: 315px;
    z-index: 0;
}
.b2b_guide .slideWrap_cont7 a.slidesjs-previous {
    left: 13px;
    top: 140px;
}
.b2b_guide .slideWrap_cont7 a.slidesjs-next {
    right: 13px;
    top: 140px;
}
.b2b_guide .cont8_btnBox {
    padding: 47px 0 0 125px;
    height: 125px;
    background: #eeeeee;
}
.b2b_guide .b2b_btn li {
    float: left;
    padding-right: 22px;
}
.recrute_teacher .frmbox {
    padding-bottom: 57px;
    background: url(../img/partner/tc_recrute_frmbg.jpg) repeat 0 0;
}
.recrute_teacher .frm {
    width: 741px;
    margin-top: -4px;
    margin-left: 50px;
    padding: 0 50px 34px;
    border: 1px solid #111;
    border-top: 0;
    background: #fff;
}
.remote_btnbox {
    padding: 0 50px 60px;
    background: url(../img/sub/remote_bg.gif) repeat 0 0;
}
.remote_btnbox a {
    display: block;
    width: 100%;
    height: 100%;
}
/* //김아영 수정_18-03-20 */

/* 회사 활동 */
.galleryList {
}
.galleryList ul {
    margin-left: -1px;
    border-left: 1px solid #e8e8e8;
    border-top: 1px solid #e8e8e8;
}
.galleryList ul:after {
    content: ".";
    height: 0;
    visibility: hidden;
    display: block;
    clear: both;
}
.galleryList ul li {
    position: relative;
    float: left;
    width: 280px;
}
.galleryList ul li .in {
    position: relative;
    width: 280px;
    height: 214px;
    margin-left: -1px;
    margin-top: -1px;
    padding: 16px 14px 0 16px;
    border: 1px solid #e8e8e8;
    border-left: 0;
    z-index: 10;
}
.galleryList li .thum {
    display: block;
    width: 250px;
    height: 160px;
    background: #000;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.galleryList li .tit {
    width: 250px;
    margin-top: 14px;
    font-size: 16px;
    font-weight: bold;
    color: #333;
    text-align: center;
    line-height: 1.2;
    *display: inline;
    zoom: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.galleryList li .btnOver {
    position: absolute;
    top: 80px;
    left: 123px;
    display: block;
    width: 37px;
    height: 37px;
    background: url(../img/sub/btn_gallerymore.png);
    opacity: 0;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}
.galleryList li .btnOver a {
    display: block;
    width: 100%;
    height: 100%;
}
.galleryList li.on .in,
.galleryList li:hover .in {
    width: 280px;
    height: 214px;
    margin-left: -1px;
    margin-top: -1px;
    padding: 15px 14px 0 15px;
    border: 2px solid #01bbd6;
    z-index: 11;
}
.galleryList li:hover .btnOver {
    opacity: 1;
}
.galleryList li:hover .thum img {
    opacity: 0.7;
}
.location_info {
    margin-top: 30px;
}
.mapinfo {
    margin-top: 10px;
    padding: 25px 0 25px 125px;
    line-height: 22px;
    border-bottom: 1px solid #eee;
    background: url(../img/sub/ico_mapinfo.gif) no-repeat 20px 25px;
}
.mapinfo .address {
    font-size: 19px;
    font-weight: bold;
    color: #000;
}
.mapinfo .eng {
    font-size: 16px;
}
.mapinfo .info {
    margin-top: 10px;
    color: #666;
}
.mapinfo .info .tit {
    padding-left: 8px;
    font-size: 14px;
    color: #00a2ba;
    background: url(../img/common/bul_mint_3x3.gif) no-repeat 0 center;
}
.mapinfo .info .txt {
    padding-right: 20px;
}
.company_sns {
    position: relative;
}
.company_sns .snslist {
    position: absolute;
    top: 38px;
    left: 498px;
}
.company_sns .snslist ul {
    overflow: hidden;
}
.company_sns .snslist ul li {
    float: left;
    margin-right: 28px;
    text-align: center;
}
.company_sns .snslist ul li a {
    display: block;
    width: 100%;
    height: 100%;
}
.company_sns .snslist ul li .ic {
    display: block;
    width: 48px;
    height: 48px;
}
.company_sns .snslist ul li .t {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #666;
}
.company_sns .snslist ul li.blog .ic {
    background: url(../img/sub/company_sns1.gif) no-repeat 0 0;
}
.company_sns .snslist ul li.youtube .ic {
    background: url(../img/sub/company_sns2.gif) no-repeat 0 0;
}
.company_sns .snslist ul li.facebook .ic {
    background: url(../img/sub/company_sns3.gif) no-repeat 0 0;
}
.company_sns .snslist ul li.kakaotalk .ic {
    background: url(../img/sub/company_sns4.gif) no-repeat 0 0;
}
.company_sns .snslist ul li.blog:hover .ic {
    background-position: 0 -48px;
}
.company_sns .snslist ul li.youtube:hover .ic {
    background-position: 0 -48px;
}
.company_sns .snslist ul li.facebook:hover .ic {
    background-position: 0 -48px;
}
.company_sns .snslist ul li.kakaotalk:hover .ic {
    background-position: 0 -48px;
}

/* ie */
.ie7_body .classList ul {
    overflow: hidden;
}
.ie7_body .tab {
    margin-left: -1px;
}
.ie7_body .itemInfo .itemTxt dl dd.newPrice a {
    vertical-align: -11%;
}
.ie7_body .recmdClass .rollingBox .btnBox div {
    margin-right: 10px;
}
.ie7_body .certifyArea.line dl {
    margin-bottom: 30px;
}
.ie7_body .classList ul li .txtComing {
    height: 64px;
}
.ie7_body .itemInfo .itemTxt dl dd {
    padding: 12px 0 4px;
}
.ie7_body .myBank .tit {
    display: inline;
    zoom: inherit;
}

/* 개발자 추가 css 영역 */
.bestRolling .rollingBox .rollingWrap ul li .imgBox > img {
    width: 250px;
    height: 163px;
}
/*.itemInfo .itemImg>img{width:310px;height:202px;}
 .playBox img{width:720px;height:424px;}*/
.teacherGuide .imgWrap .imgBox > img {
    width: 129px;
    height: 129px;
}
.visualArea .visualWrap div > img {
    width: 1080px;
    height: 280px;
}
.offlineList2 li .img > img {
    width: 250px;
    height: 163px;
}
.bannerBox2 > a > img {
    width: 280px;
    height: 120px;
}
.bx-viewport,
.bx-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
.bxslider,
.bxslider li {
    height: 100% !important;
}
.bxslider li {
    background-repeat: none;
    background-position: top center;
    background-size: cover;
}
.bx-wrapper .bx-viewport {
    border: none !important;
}
a {
    cursor: pointer;
}
.tab.tab4 ul li {
    width: 25%;
}

/* SNS 회원가입 추가 */

.joinStepSNS {
    padding-bottom: 40px;
    background: url(../img/sub/bg_grade.gif) 0 100% repeat-x;
}
.joinmemberSNS {
    position: relative;
    width: 420px;
    margin: 0 auto;
    padding-top: 25px;
}
.joinmemberSNS .member {
    display: block;
}
.joinStepSNS .joinmemberSNS .member_txt {
    font-size: 14px;
    color: #999;
    padding: 20px 0px 10px 0px;
}

/* 쿠폰레이어 추가 */
.couponLayer {
    z-index: 99999;
    position: absolute;
    left: 1px;
    top: 1px;
    width: 184px;
    background: #fff;
    border: 2px solid #9b837f;
}
.couponLayer ul li {
    padding: 10px 18px;
    border-top: 1px solid #e8e8e8;
    font-size: 14px;
    font-weight: bold;
    color: #333;
}
.couponLayer ul li:first-child {
    border-top: none;
}
.couponLayer ul li a {
    display: inline;
}
.couponLayer .btnClose {
    position: absolute;
    right: 0;
    top: 0;
}

/* 아티클__리스트 */
.articleList {
    margin-top: 20px;
}
.article-container {
    background-color: #f7f7f7;
    display: flex;
    border-radius: 6px;
    margin-bottom: 20px;
}

.article-container .left-section {
}

.article-container .left-section .author-photo {
    width: 250px;
    height: 160px;
    border-radius: 6px;
    overflow: hidden;
}

.article-container .left-section .author-photo > img {
    width: 100%;
}

.article-container .right-section {
    padding: 20px;
}

.article-container .right-section {
}

.article-container .right-section .article-meta {
    display: flex;
    gap: 24px;
    margin-bottom: 8px;
}

.article-container .right-section .article-meta .category-tag {
    background: #666;
    color: #fff;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
}

.article-container .right-section .article-meta .date {
    font-size: 14px;
    color: #999999;
}

.article-container .right-section .article-title {
    font-size: 18px;
    font-weight: 700;
    color: #000;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
}

.article-container .right-section .article-title a:hover {
    text-decoration: underline;
}

.article-container .right-section .article-title .bookmark-icon {
    background: url("/img/sub/sp_bookmark.png") no-repeat bottom center;
    width: 16px;
    height: 19px;
    display: block;
    cursor: pointer;
}

.article-container .right-section .article-title .bookmark-icon:hover,
.article-container .right-section .article-title .bookmark-icon.on {
    background: url("/img/sub/sp_bookmark.png") no-repeat top center;
}

.article-container .right-section .article-body {
    color: #333;
}

/* 아티클 뷰 */
.articleView {
	width: 950px;
}

.articleView .category-tag {
    display: inline-block;
    border: 2px solid #333;
    color: #333;
    border-radius: 100px;
    padding: 5px 18px;
    font-weight: 700;
    margin-bottom: 16px;
}

.articleView .news-header {
    margin-bottom: 24px;
}

.articleView .news-header .news-title {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    font-size: 30px;
    font-weight: 700;
    gap: 12px;
}

.articleView .news-header .news-title .icon-set {
    display: flex;
    gap: 4px;
}

.articleView .news-header .news-title .icon-set > a {
    width: 30px;
    height: 30px;
    border-radius: 6px;
    background: #f2f2f2;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.articleView .news-header .news-title .icon-set .bookmark-icon {
    width: 16px;
    height: 19px;
    background: #f2f2f2 url(/img/sub/sp_bookmark.png) no-repeat bottom center;
}

.articleView .news-header .news-title .icon-set .bookmark-icon:hover,
.articleView .news-header .news-title .icon-set .bookmark-icon.on {
    background: #f2f2f2 url(/img/sub/sp_bookmark.png) no-repeat top center;
}

.articleView .news-header .news-title .icon-set .share-icon {
    width: 16px;
    height: 19px;
    background: #f2f2f2 url(/img/sub/icon_share.png) no-repeat top center;
    opacity: 0.4;
}

.articleView .news-header .news-title .icon-set .share-icon:hover {
    opacity: 1;
}

.articleView .news-header .news-meta {
    display: flex;
    align-items: center;
    gap: 4px;
}

.articleView .news-header .news-meta .author-name {
    color: #000;
    font-weight: 700;
}

.articleView .news-header .news-meta .publish-date {
    color: #999;
}

.articleView .news-content {
    font-size: 16px;
    color: #000;
    line-height: 24px;
    text-align: justify;
}

.articleView .news-content .imgarea {
    margin-bottom: 24px;
}
.articleView .news-content .view_sub_tit {
    width: 100%;
    height: auto;
    border-left: 5px solid #000;
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center;
    margin-bottom: 30px;
    padding: 5px 0 5px 15px;
}
.view_cont_wrap > .image > figcaption {
    font-size: 15px;
    color: #7b7b7b;
    line-height: 23px;
    margin-bottom: 20px;
}
.view_cont_wrap > .econo_warning {
    font-size: 17px;
    color: #777;
    margin-top: 30px;
}

.view_sub_tit li {
    line-height: 26px;
    font-size: 18px;
    font-weight: 500;
}

.more-button {
    display: block;
    width: 180px;
    background: #e6e6e6;
    color: #000;
    text-align: center;
    padding: 10px 0;
    border-radius: 6px;
    margin: 30px auto 0;
    font-size: 16px;
    font-weight: 700;
}

.more-button:hover {
    background: #dee2e6;
}

/* 프리미엄리스트 */
.premiumlist {
    margin-top: 20px;
}

.premiumlist .premiumlist_wrap,
.premiumlist .chaeumlist_wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 50px 20px;
}

.card-container {
    width: 280px;
    background-color: #f7f7f7;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    transition: all 0.4s ease;
}

.card-container:hover {
    box-shadow: 0 0px 10px rgba(0, 0, 0, 0.4);
    transform: translateY(-6px);
}

.card-container:hover .card-content .content-title {
    font-weight: 700;
    color: #000;
}

.card-container .linkoverlay {
    display: block;
    width: 100%;
    height: 100%;
    bottom: 0;
    position: absolute;
}

.card-container .card-header {
    position: relative;
}

.card-container .card-header .author-photo > img {
    width: 100%;
    height: 180px;
}

.card-container .card-header .bookmark-icon {
    background: url(/img/sub/sp_bookmark.png) no-repeat bottom center;
    width: 16px;
    height: 19px;
    display: block;
    cursor: pointer;
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 9;
}

.card-container .card-header .bookmark-icon:hover,
.card-container .card-header .bookmark-icon.on {
    background: url(/img/sub/sp_bookmark.png) no-repeat top center;
}

.card-container .card-content {
    padding: 20px;
}

.card-container .card-content .content-meta .category-tag {
    background: #666;
    color: #fff;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    margin-bottom: 16px;
}

.card-container .card-content .content-meta .time-info {
    color: #999;
    font-size: 14px;
    margin-left: 14px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.card-container .card-content .content-meta .time-info::before {
    content: "";
    display: inline-flex;
    width: 13px;
    height: 13px;
    background: url(/img//main_new/icon_time.png) no-repeat center center;
}

.card-container .card-content .content-title {
    font-size: 16px;
    color: #666;
    margin-top: 12px;
}
/* 프리미엄 상세페이지 */
.premiumView {
    position: relative;
}

.premiumView .Lecture_info__wrap {
    max-width: 950px;
}

.premiumView .Lecture_info__wrap .infoWrap {
    display: flex;
    gap: 20px;
}

.premiumView .Lecture_info__wrap .infoWrap .vod_area {
    width: 580px;
    height: 326px;
    background-color: #333;
    overflow: hidden;
    /* border-radius: 6px; */
}
.premiumView .Lecture_info__wrap .infoWrap .vod_area > img {
    width: 100%;
    height: 100%;
}

.premiumView .Lecture_info__wrap .infoWrap .info {
    flex: 1;
    position: relative;
}

.premiumView .Lecture_info__wrap .infoWrap .info .category-tag {
    display: inline-block;
    border: 2px solid #333;
    color: #333;
    border-radius: 100px;
    padding: 5px 18px;
    font-weight: 700;
    margin-bottom: 16px;
}

.premiumView .Lecture_info__wrap .infoWrap .info .title {
    font-size: 24px;
    font-weight: 700;
    color: #000;
    margin-bottom: 10px;
}

.premiumView .Lecture_info__wrap .infoWrap .info .duration {
    color: #000;
}

.premiumView .Lecture_info__wrap .infoWrap .info .duration strong {
    font-weight: 700;
}

.premiumView .Lecture_info__wrap .infoWrap .info .icon-set > a {
    width: 30px;
    height: 30px;
    border-radius: 6px;
    background: #f2f2f2;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.premiumView .Lecture_info__wrap .infoWrap .info .icon-set .bookmark-icon {
    width: 16px;
    height: 19px;
    background: #f2f2f2 url(/img/sub/sp_bookmark.png) no-repeat bottom center;
}

.premiumView .Lecture_info__wrap .infoWrap .info .icon-set .bookmark-icon:hover,
.premiumView .Lecture_info__wrap .infoWrap .info .icon-set .bookmark-icon.on {
    background: #f2f2f2 url(/img/sub/sp_bookmark.png) no-repeat top center;
}

.premiumView .Lecture_info__wrap .infoWrap .info .icon-set .share-icon {
    width: 16px;
    height: 19px;
    background: #f2f2f2 url(/img/sub/icon_share.png) no-repeat top center;
    opacity: 0.4;
}

.premiumView .Lecture_info__wrap .infoWrap .info .icon-set .share-icon:hover {
    opacity: 1;
}
.premiumView .Lecture_info__wrap .infoWrap .info .icon-set {
    position: absolute;
    bottom: 60px;
}
.premiumView .Lecture_info__wrap .infoWrap .info .play-btn {
    display: block;
    width: 100%;
    background: #a80734;
    color: #fff;
    text-align: center;
    padding: 14px 0;
    border-radius: 6px;
    font-size: 18px;
    font-weight: 700;
    position: absolute;
    bottom: 0px;
}

.premiumView .Lecture_info__wrap .infoWrap .info .play-btn:hover {
    background-color: #810226;
}

.premiumView .recommendations {
    display: none;
    border: 1px solid #7a8294;
    position: absolute;
    width: 180px;
    right: 0px;
    border-radius: 6px;
    overflow: hidden;
}

.premiumView .recommendations h2 {
    background-color: #7a8294;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    text-align: center;
    padding: 12px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

/* 프리미엄 상세페이지 추천과정 */
.premiumView .recommendations .lce__items {
    padding: 30px 0px;
}

.premiumView .recommendations .lce__items a {
    display: block;
    width: 140px;
    margin: 0 auto;
}

.premiumView .recommendations .lce__items figure {
    margin-bottom: 20px;
}

.premiumView .recommendations .lce__items figure img {
    width: 140px;
    height: 90px;
    overflow: hidden;
    border-radius: 6px;
}

.premiumView .recommendations .lce__items figcaption {
    color: #333;
    margin-top: 10px;
}

.premiumView .recommendations .lce__items a:hover figcaption {
    font-weight: 700;
    transition: all 0.4s ease;
}

.premiumView .Lecture_info__wrap .cnt_info {
    margin-top: 66px;
}

.premiumView .Lecture_info__wrap .cnt_info h2 {
    color: #000;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 16px;
}

.premiumView .Lecture_info__wrap .cnt_info .cntTxt {
    color: #000;
    font-size: 16px;
    line-height: 1.5;
}

.premiumView .Lecture_info__wrap .review_wrap {
    margin-top: 60px;
}

.premiumView .Lecture_info__wrap .review_wrap .reveiw_header {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-bottom: 30px;
}

.premiumView .Lecture_info__wrap .review_wrap .reveiw_header h2 {
    color: #000;
    font-size: 24px;
    font-weight: 700;
    display: flex;
    align-items: flex-end;
    gap: 7px;
}

.premiumView .Lecture_info__wrap .review_wrap .reveiw_header h2 span.counter {
    color: #000;
    font-size: 18px;
    font-weight: 400;
}

.premiumView .Lecture_info__wrap .review_wrap .reveiw_header .btn_reveiwWrite {
    font-size: 14px;
    color: #fff;
    font-weight: 700;
    background-color: #333;
    border-radius: 6px;
    padding: 10px 20px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.premiumView .Lecture_info__wrap .review_wrap .review-box {
}

.premiumView .Lecture_info__wrap .review_wrap .review-box-header {
    background-color: #f2f2f2;
    padding: 22px 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.premiumView .Lecture_info__wrap .review_wrap .review-box-header .review-title {
    font-size: 16px;
    color: #000;
    font-weight: bold;
    display: flex;
    align-items: center;
}

.premiumView .Lecture_info__wrap .review_wrap .review-box-header .review-title .heart {
    font-size: 14px;
    color: #000;
    margin-left: 22px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.premiumView .Lecture_info__wrap .review_wrap .review-box-header .review-title .heart::before {
    content: "";
    display: block;
    margin-right: 4px;
    width: 17px;
    height: 15px;
    background: url("/img/sub/sp_heart.png") no-repeat top center;
}

.premiumView .Lecture_info__wrap .review_wrap .review-box-header .review-title .heart.on::before {
    content: "";
    display: block;
    margin-right: 4px;
    width: 17px;
    height: 15px;
    background: url("/img/sub/sp_heart.png") no-repeat bottom center;
}

.premiumView .Lecture_info__wrap .review_wrap .review-box-header .review-meta span {
    color: #000;
}

.premiumView .Lecture_info__wrap .review_wrap .review-box-header .review-meta span:first-child::after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 11px;
    background-color: #ccc;
    margin: 0 12px;
}

.premiumView .Lecture_info__wrap .review_wrap .description {
    padding: 20px 30px 40px;
    color: #000;
}

.review_Write__box {
    display: flex;
    align-items: flex-end;
    position: relative;
}

.review_Write__box .popupWrap {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 9999;
}

.review_Write__box .popup {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 6px;
    padding: 40px;
    margin: 0 auto;
    width: 560px;
}

.review_Write__box .popup h2 {
    font-size: 30px;
    color: #000;
    font-weight: 700;
    text-align: center;
    margin-bottom: 20px;
}

.review_Write__box .popup table {
    width: 100%;
    border-top: 1px solid #474a52;
}

.review_Write__box .popup table th {
    height: 44px;
    border-bottom: 1px solid #e6e6e6;
}

.review_Write__box .popup table td {
    border-left: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    padding: 12px 20px;
    font-size: 13px;
    color: #666666;
}

.review_Write__box .popup table td input[type="text"] {
    width: 100%;
    border: transparent;
    padding: 0px 0px;
}

.review_Write__box .popup table td textarea {
    width: 100%;
    height: 120px;
    border: transparent;
    padding: 0px 0px;
}

.review_Write__box .popup .btn-x {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 44px;
    height: 44px;
}

.review_Write__box .popup .btn__submit {
    display: block;
    width: 180px;
    background: #000;
    color: #fff;
    text-align: center;
    padding: 10px 0;
    border-radius: 6px;
    margin: 30px auto 0;
    font-size: 16px;
    font-weight: 700;
}

/* 나의페이지 스크랩영역 */
.scrapWrap {
    display: flex;
    gap: 10px;
}

.scrapWrap .card-container {
    width: 230px;
    background-color: #fff;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    transition: all 0.4s ease;
}

.scrapWrap .card-container:hover {
    box-shadow: initial;
    transform: translateY(-6px);
}

.scrapWrap .card-container .card-header .author-photo {
    overflow: hidden;
    border-radius: 6px;
}

.scrapWrap .card-container .card-header .author-photo > img {
    width: 100%;
    height: 130px;
}

.scrapWrap .card-container .card-content {
    padding: 12px;
}

.scrapWrap .card-container .content-title {
    margin-top: initial;
    font-size: 14px;
    color: #333;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: keep-all;
    overflow: hidden;
}

.scrapWrap .card-container:hover .content-title {
    color: #000;
}

.premiumWrap {
    display: flex;
    gap: 20px 9px;
    flex-wrap: wrap;
}

.premiumWrap .card-container {
    width: 230px;
    background-color: #fff;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    transition: all 0.4s ease;
}

.premiumWrap .card-container:hover {
    box-shadow: initial;
    transform: translateY(-6px);
}

.premiumWrap .card-container .card-header .author-photo {
    overflow: hidden;
    border-radius: 6px;
}

.premiumWrap .card-container .card-header .author-photo > img {
    width: 100%;
    height: 130px;
}

.premiumWrap .card-container .card-content {
    padding: 12px;
}

.premiumWrap .card-container .content-title {
    margin-top: initial;
    font-size: 14px;
    color: #333;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: keep-all;
    overflow: hidden;
}

.premiumWrap .card-container:hover .content-title {
    color: #000;
}

.articleWrap {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.articleWrap .itembox {
    display: flex;
    padding: 24px 20px;
    background-color: #edeff3;
    border: 1px solid #edeff3;
    border-radius: 6px;
}

.articleWrap .itembox:hover {
    background-color: #fceeee;
    border: 1px solid #f4d3d3;
}

.articleWrap .itembox dl {
    display: flex;
}

.articleWrap .itembox dl dt {
    width: 104px;
    color: #333;
    margin-right: 30px;
    position: relative;
}

.articleWrap .itembox dl dt:after {
    content: "";
    display: block;
    width: 2px;
    height: 12px;
    background-color: #afb0b3;
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
}

.articleWrap .itembox dl dd {
    font-size: 16px;
    color: #000;
    font-weight: 700;
}