.inTitle1{position:relative; width:100%; padding:110px 0 85px 0; font-size:60px; font-weight:400; color:#db0b37; text-align:center; } .inTitle1:before{content:""; display:block; position:absolute; top:0; left:50%; width:1px; height:82px; margin-left:-0.5px; background:#ccc;} .inTitle2{width:100%; padding-bottom:20px; font-size:65px; font-weight:400; text-align:center; } .inTitle3{position:relative; width:100%; padding:110px 0 10px 0; font-size:50px; font-weight:400; color:#db0b37; text-align:center; } .inTitle3:before{content:""; display:block; position:absolute; top:0; left:50%; width:1px; height:82px; margin-left:-0.5px; background:#ccc;} .inTitle3 span{font-size:35px; color:#555;} .inTitle4{margin-bottom:25px; font-size:24px; font-weight:500;} .titleCap{width:100%; padding-bottom:40px; font-size:18px; font-weight:100; line-height:24px; text-align:center; } .titleCap2{width:100%; padding-bottom:40px; font-size:22px; font-weight:500; line-height:30px; text-align:center; } .basicCap{width:100%; margin-bottom:20px; font-size:18px; } .basicCap.center{text-align:center;} .basicCap span{font-size:16px; color:#666;} .basicCap span.title { font-size:30px; color:#333;} .basicCap2{width:100%; font-size:18px; font-weight:300; text-align:center; } .inTitleCap1{width:100%; padding-bottom:70px; font-size:26px; font-weight:100; color:#666; text-align:center; } .payCap{margin-top:8px; font-size:14px; font-weight:300; color:#ff7200;} .del{margin-right:5px; text-decoration:line-through;} .bold{font-weight:600 !important; } .nobb{border-bottom:none !important; } .lineClamp1{width:98%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .lineClamp2{width:98%; height:40px; white-space:normal; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical; } .lineClamp2.h48{height:48px;} .lineClamp3{width:98%; white-space:normal; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; } .lineClamp4{width:98%; white-space:normal; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient: vertical; } @media(max-width:1080px){ .inTitle1{padding:80px 0 65px 0; font-size:50px;} .inTitle1:before{height:62px;} .inTitle2{padding-bottom:15px; font-size:45px;} .inTitle3{padding:70px 0 10px 0; font-size:38px; } .inTitle3:before{height:52px; } .inTitle3 span{font-size:28px;} .inTitle4{margin-bottom:15px; font-size:18px;} .titleCap{padding-bottom:30px; font-size:16px; } .titleCap2{padding-bottom:30px; font-size:18px; } .inTitleCap1{padding-bottom:50px; font-size:20px;} .basicCap{margin-bottom:18px; font-size:16px; } .basicCap span{font-size:14px;} .basicCap span.title { font-size:24px;} .basicCap2{font-size:16px;} } @media(max-width:640px){ .inTitle1{padding:60px 0 45px 0; font-size:30px;} .inTitle1:before{height:42px;} .inTitle2{padding-bottom:8px; font-size:30px;} .inTitle3{padding:40px 0 10px 0; font-size:28px; } .inTitle3:before{height:32px; } .inTitle3 span{font-size:22px;} .inTitle4{font-size:18px;} .titleCap{padding-bottom:20px; font-size:14px; } .titleCap2{padding-bottom:15px; font-size:16px; } .inTitleCap1{padding-bottom:40px; font-size:18px;} .m_block{display:block; } .payCap{font-size:13px;} .basicCap{margin-bottom:15px; font-size:14px; } .basicCap span{font-size:13px;} .basicCap span.title { font-size:20px;} .basicCap2{font-size:14px;} } /* 대표컬러 */ .repColor1{color:#db0b37 !important;} /*빨강색*/ .repColor2{color:#006ec2 !important;} /*보라색*/ .repColor3{color:#0071d0 !important;} /*파란색*/ .repColor4{color:#ff7200 !important;} /*주황색*/ .repBg1{background-color:#db0b37 !important;} .repBg2{background-color:#006ec2 !important;} .repBg3{background-color:#0071d0 !important;} .repBg4{background-color:#ff7200 !important;} /* 검색바 */ .noticeSearch{width:100%; margin-bottom:40px; padding:28px 0; font-size:0; text-align:center; background:#f1f8fc;} .noticeSearch select.basicS {width:228px; height:44px; padding:0; border:none; border-bottom:1px solid #acb3b7; background:transparent url("/template/1/type1/images/sArrow3.png") right center no-repeat !important; color:#7d8387; font-size:18px; font-weight:300; letter-spacing:-0.04rem; vertical-align:middle;} .noticeSearch .inputA{display:inline-block; position:relative; width:60.3%; margin-left:80px; vertical-align:middle;} .noticeSearch.no_select .inputA{width:74%; margin-left:0;} .noticeSearch .inputA input[type="text"] {padding:0 90px 0 30px; height:60px; border:none; color:#999; font-size:18px; font-weight:300; letter-spacing:-0.04rem;} .noticeSearch .inputA input[type="text"]:-ms-input-placeholder {color:#999;} .noticeSearch .inputA input[type="text"]::-webkit-input-placeholder {color:#999;} .noticeSearch .inputA input[type="text"]::-moz-placeholder {color:#999;} .noticeSearch .inputA input[type="image"] {position:absolute; top:14px; right:16px;} .noticeSearch .inputA .searchInput {width:85px; height:60px; background:url("/template/1/type1/images/searchIco2.png") center center no-repeat;} .searchInput{position:absolute; top:0; right:0; width:80px; height:50px; font-size:0; text-indent:-9999px; background:url("/template/1/type1/images/searchIco.png") center center no-repeat;} .searchInput.focus{background:url("/template/1/type1/images/searchIco_on.png") center center no-repeat;} .lookUpArea{position:relative; width:100%; min-height:75px; margin-bottom:28px; padding:15px 172px 15px 20px; font-size:0; text-align:center; background:#f1f8fc; } .lookUpArea.titleIn{padding:15px 155px 15px 175px;} .lookUpArea.titleIn .tit{position:absolute; top:50%; left:40px; width:120px; font-size:22px; font-weight:500; text-align:left; -webkit-transform: translate3d(0,-50%,0); -moz-transform: translate3d(0,-50%,0); -ms-transform:translate3d(0,-50%,0); -o-transform:translate3d(0,-50%,0); transform: translate3d(0,-50%,0); } .lookUpArea.point{padding:15px; font-size:18px; text-align:center;} .lookUpArea.point a.lookUpBtn{display:inline-block; position:relative; top:0; right:0; margin-left:15px; } .lookUpArea .division{width:100%; text-align:left;} .lookUpArea .division.first{margin-bottom:5px; } .lookUpArea .division.first select{width:160px; margin-right:5px; } .lookUpArea select{height:45px; padding-left:15px; font-size:18px; color:#333; vertical-align:top; background:#fff url("/template/1/type1/images/sArrow1.png") 95% center no-repeat !important; border:1px solid #ccc; } .lookUpArea span.center{padding:0 15px; font-size:16px; } .lookUpArea .boxLabel{display:inline-block; width:calc(100% / 6 - 36px); height:45px; margin:0 5px 0 0;} .lookUpArea .boxLabel:last-child{margin:0; } .lookUpArea .boxLabel .lookUpA{display:inline-block; width:100%; height:100%; padding:8px 0; font-size:16px; text-align:center; vertical-align:top; background:#fff; border:1px solid #0071d0; cursor:pointer; } .lookUpArea .boxLabel .lookUpA.active{color:#fff; background:#0071d0; border:1px solid #0071d0;} .lookUpArea .block_ele{display:inline-block; width:calc(100% / 2 - 20.01px);} .lookUpArea .block_ele .inTselect{display:inline-block; width:calc(100% / 3 - 0.01px); font-size:16px; line-height:45px; } .lookUpArea .block_ele .inTselect select{width:calc(100% - 28px)} .lookUpBtn{display:block; position:absolute; top:15px; right:20px; width:11%; height:100px; font-size:18px; font-weight:500; color:#fff; text-align:center; line-height:100px; cursor:pointer;background:#0071d0;} .lookUpBtn.short{height:50px; line-height:50px; } @media(max-width:1080px){ .noticeSearch{position:relative; width:auto; margin:0 -15px 18px; padding:28px 15px 28px 240px;} .noticeSearch select.basicS{position:absolute; top:28px; left:15px; z-index:1; width:180px; height:35px; font-size:14px;} .noticeSearch .inputA{width:100%; margin:0;} .noticeSearch.no_select {padding-left:15px;} .noticeSearch.no_select .inputA{width:100%; } .noticeSearch .inputA input[type="text"]{padding-left:20px; padding-right:44px; height:35px; font-size:14px;} .noticeSearch .inputA .searchInput {width:35px; height:35px; background-size:16px;} .searchInput{width:45px; height:40px; -webkit-background-size:22px; background-size:22px;} .searchInput.focus{-webkit-background-size:22px; background-size:22px;} .lookUpArea{padding:15px;} .lookUpArea .block_ele{margin-bottom:5px; } .lookUpBtn{position:relative; top:0; right:0; width:100%; height:45px; font-size:16px; line-height:45px;} .lookUpArea.titleIn{padding:15px 15px 15px 120px;} .lookUpArea.titleIn .tit{left:20px; width:95px; font-size:18px;} } @media(max-width:800px){ .lookUpArea .block_ele{display:block; width:100%;} .lookUpArea span.center{display:none; } .lookUpArea .boxLabel{width:calc(100% / 5 - 37.01px);} } @media(max-width:640px){ /* 검색바 */ .noticeSearch{position:relative; padding:18px 15px 18px 100px;} .noticeSearch select.basicS{position:absolute; top:18px; left:15px; z-index:1; width:70px; font-size:12px; background-size:8px 4.5px !important;} .noticeSearch.no_select{padding:15px;} .noticeSearch .inputA{width:100%; margin-left:0;} .noticeSearch.no_select .inputA{width:100%; } .noticeSearch .inputA input[type="text"]{font-size:12px; padding-left:10px;} .lookUpBtn{height:40px; font-size:14px; line-height:40px;} .lookUpArea{padding:10px; } .lookUpArea select{height:40px; padding-left:10px; font-size:14px;} .lookUpArea .division.first select{width:100%; margin:0 0 5px 0; } .lookUpArea .boxLabel{width:calc(100% / 5 - 4.01px); height:40px; } .lookUpArea .boxLabel .lookUpA{font-size:14px;} .inTselect{font-size:0 !important; line-height:inherit !important; } .lookUpArea .block_ele .inTselect select{width:100%;} .lookUpArea.titleIn{padding:15px;} .lookUpArea.titleIn .tit{position:relative; top:0; left:0; width:100%; margin-bottom:10px; font-size:18px; -webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); -ms-transform:translate3d(0,0,0); -o-transform:translate3d(0,0,0); transform: translate3d(0,0,0); } } /* 폼 스타일 */ .popBox{width:838px; height:768px; max-width:100%; padding:100px 0; background:#fff; /* border:1px solid #999; */} .popBox2{padding:100px 0; height:auto; border:1px solid #ccc; } .popBox.nopop{height:auto; margin:0 auto; background:none; border:none; } .popBox.autoH{height:auto; padding:25px; } .popBox.center{margin:0 auto;} .inBox{width:465px; max-width:100%; margin:0 auto;} .inBox.full{width:100%;} .inBox.end{width:560px; max-width:100%; } .pwIn{position:relative; width:45%; margin:0 auto; padding-left:90px; margin-top:45px; margin-bottom:45px; background:#f8f8f8; } .pwIn .tit{position:absolute; top:12px; left:17px; } .pwIn input{width:100%;} ul.inputList li{position:relative; margin:0 0 10px 0; font-size:0; } .placeT{display:inline-block; position:relative; width:100%; vertical-align:top;} .placeH{display:none; position:absolute; top:0; left:24px; font-size:20px; font-weight:100; line-height:70px; color:#6b6b6b;} .placeH .cap{font-size:16px; font-weight:100; color:#c7c7c7;} .chkIco{position:absolute; top:50%; right:14px; width:28px; height:20px; margin-top:-10px; font-size:0; text-indent:-9999px; background-image: url("/template/1/type1/images/chk_off.png"); background-position: 0 0; background-repeat: no-repeat; -webkit-background-size: 100%; background-size:100%;} .chkIco.chkOk{background-image:url("/template/1/type1/images/chk_on.png");} .inTselect{display:inline-block; font-size:20px; font-weight:100; background:#fff; border:1px solid #ccc; border-right:none; } .inTselect:last-child, .inTselect.last{border-right:1px solid #ccc;} .inTselect.choLong{width:42%;} .inTselect.choShort{width:29%; } @media(max-width:1080px){ .popBox{width:100%; } .inTselect{font-size:16px;} .chkIco{right:14px; width:22px; height:18px; margin-top:-9px; } } @media(max-width:640px){ .popBox.autoH{padding:15px; margin:auto;} } /* 팝업 */ .popCont{display:none; position:fixed; top:50%; left:50%; z-index:500; width:500px; height:500px; margin:-250px 0 0 -250px; padding:50px 38px 0 38px; background:#fff; border:2px solid #000; } .popCont .popTitle{padding-bottom:25px; font-size:26px; font-weight:400; } .popCont .close{position:absolute; top:20px; right:20px; width:20px; height:20px; font-size:0; text-indent:-9999px; background:url("/template/1/type1/images/close.png") 0 0 no-repeat; -webkit-background-size: 100%; background-size: 100%;} .textAreaBox{position:relative; z-index:10; width:100%; height:350px; padding:10px; font-size:14px; font-weight:300; line-height:24px; border:1px solid #ccc; overflow-y:auto; } /* 쿠폰등록 팝업 */ .couponPop{width:100%; padding:60px 45px; background:#fff; border:1px solid #333; }/* position:absolute; top:-5px; left:-415px; */ .couponPop .popT{margin-bottom:10px; font-size:22px; font-weight:500; text-align:left; } .whiteCoupon{position:relative; padding-right:95px;} .whiteCoupon a.sBtn{position:absolute; top:0; right:0; width:95px;} .couponPop .closeB{position:absolute; top:14px; right:14px; width:22px; cursor:pointer;} .couponPop .closeB img{display:block; width:100%; } /* 서브배너 */ .sBanLink{width:100%; margin-top:70px; } .sBanLink a, .sBanLink img{display:block; width:100%; height:auto;} /* 셀렉트 스타일 */ select.period_select{display:block; width:80%; height:40px; margin:0 auto; padding-left:5px; font-size:18px; vertical-align:top; background:#fff url("/template/1/type1/images/sArrow1.png") 95% center no-repeat !important; border:1px solid #ccc; } select.basicS{width:20%; height:50px; font-size:18px; vertical-align:top; background:#fff url("/template/1/type1/images/sArrow1.png") 95% center no-repeat !important; border:1px solid #ccc; } select.basicS.numselect{height:30px; } select.basicS.shot{width:120px;} select.basicS.shot2{width:78px; padding-left:10px;} select.basicAuto{height:50px; font-size:18px; vertical-align:top; background:#fff url("/template/1/type1/images/sArrow1.png") 95% center no-repeat; border:1px solid #ccc; } select.joinBig{height:70px; font-size:20px; font-weight:100; } select.w{width:42%;} select.write_select{width:300px;} select.choLong{width:42%;} select.choShort{width:29%;} select.shortSerch{width:180px; height:45px;} select.tableInS{width:80%; height:35px; min-width:auto; margin:0 auto 5px; padding-left:15px; font-size:16px; } select.small{width:78px; min-width:auto; height:25px; padding-left:5px; font-size:16px; font-weight:300; background:#fff url("/template/1/type1/images/sArrow1.png") 95% center no-repeat; border:1px solid #ccc; } select.nob{height:70px;} ul.inputList select{background-color: #fff; background-image: url("/template/1/type1/images/sArrow2.png"); background-position: 95% center; background-repeat: no-repeat;} ul.joinList .lengInput1 select{width:33%; border:none;} .inTselect select{margin-right:5px; border:none;} .inTselect select.choLong{width:85%;} .inTselect select.choShort{width:78%;} .couponChoice select.basicS{width:100%; height:55px; padding-left:10px; font-size:16px; vertical-align:top; background:#fff url("/template/1/type1/images/sArrow1.png") 95% center no-repeat; border:1px solid #ccc; border-right:none; } /* 인풋 스타일 */ /* input:focus + span.placeH{display:none;} */ /*input:not([type="radio"]):not([type="checkbox"]):not([type="image"]):not([type="file"]){width:250px; height:50px; padding-left:20px; font-size:18px; font-weight:100; vertical-align:top; background:#fff; border:1px solid #ccc; } .inputList input:not([type="radio"]):not([type="checkbox"]):not([type="image"]){height:70px; padding-left:24px; font-size:20px; }*/ input{} /* input:not([type="radio"]):not([type="checkbox"]):not([type="image"]):not([type="file"]):not([type="button"]):not([type="submit"]){width:250px; height:50px; padding-left:20px; font-size:18px; font-weight:100; vertical-align:top; background:#fff; border:1px solid #ccc; } */ input[type="text"], input[type="password"]{height:50px; padding-left:20px; font-size:18px; font-weight:100; background:#fff; border:1px solid #ccc; } input.w150{width:150px;} input[type="submit"]{cursor:pointer;} .inputList input[type="text"], .inputList input[type="password"]{height:70px; padding-left:24px; font-size:20px; } ul.joinList input{padding-right:55px} ul.joinList .lengInput1 input{padding-right:10px; border:none !important;} input.fixW1{width:100% !important;} input.fixW2{width:300px !important;} input.quantity{width:40px; height:23px !important; padding:0 5px 0 0 !important;} @media(max-width:1080px){ /* 셀렉트 스타일 */ select.basicS{height:40px; font-size:16px; } select.joinBig{height:55px; font-size:16px;} input[type="text"], input[type="password"]{height:40px; padding-left:15px; font-size:16px;} .inputList input[type="text"], .inputList input[type="password"]{height:55px; padding-left:15px; font-size:16px; } } @media(max-width:640px){ input.fixW2{width:100% !important;} select.basicS{font-size:14px; } select.joinBig{width:100% !important; height:40px; margin:0; font-size:14px;} select.basicS.numselect{width:100%;} select.write_select{width:100%;} input[type="text"], input[type="password"]{padding-left:10px; font-size:14px;} .inputList input[type="text"], .inputList input[type="password"]{height:40px; padding-left:10px; font-size:14px; } ul.inputList select{-webkit-background-size:12px; background-size:12px;} } /* textarea */ textarea.writText{width:100%; height:350px; vertical-align:top; resize:none; border:1px solid #ccc; } /* 파일커스텀 */ .input-file{position:relative; width:100%; margin:5px 0; padding-right:110px; font-size:0; } .input-file [type="file"] {position: absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0, 0, 0, 0); border:none;} .input-file .file-label{position:absolute; top:0; right:0; width:110px; height:50px; line-height: 50px; font-size: 18px; color:#fff; text-align:center; background-color:#006ec2;} .joinArea .input-file .file-label{height:70px; font-size:20px; line-height: 70px;} .input-file .file-name { width:100% !important; background: #f5f5f5; height:50px; line-height:48px; text-indent: 5px; border: 1px solid #bbb; } .file-focus {outline: 1px dotted #d2310e;} @media(max-width:1080px){ .input-file .file-label {height:40px; line-height:40px; font-size: 16px;} .input-file .file-name {height:40px; line-height:38px; } .joinArea .input-file .file-label{height:55px; font-size:18px; line-height: 55px;} } @media(max-width:640px){ .joinArea .input-file .file-label{height:40px; font-size:14px; line-height: 40px;} } /* 버튼 스타일 */ .buyBtnArea{width:100%; font-size:0; } .buyBtnArea a.sBtn:first-child{margin-left:0;} .buyBtnArea a.sBtn{width:calc(100% / 2 - 35.01px); height:55px; margin-left:5px; font-size:18px; line-height:55px; } .buyBtnArea a.sBtn.white{line-height:53px; } .buyBtnArea a.sBtn.gray{line-height:53px; } .centerBtnA{width:100%; font-size:0; text-align:center; } .centerBtnA.mtA{margin-top:35px; } .centerBtnA a{margin:0 5px; } .centerBtnA a.full{margin:0;} .sBtn{display:inline-block; width:120px; height:45px; font-size:16px; color:#fff; line-height:45px; text-align:center; vertical-align:top; background:#006ec2; } .sBtn.m_show{display:none; } .sBtn2{display:inline-block; width:130px; height:50px; font-size:18px; color:#fff; line-height:50px; text-align:center; vertical-align:top; border:1px solid #29a2e8; background:#29a2e8; } .sBtn2.line {background:#fff; border-color:#29a2e8; color:#29a2e8;} .sBtn2.grayBtn {background:#e5e9eb; border-color:#e5e9eb; color:#808080 !important;} .H50{height:50px; line-height:50px;} .atte{position:relative; width:60px !important; height:60px !important; padding-left:57px; font-size:0 !important; border:1px solid #e6e6e6 !important;} .atte:before{content:""; display:block; position:absolute; top:0; left:0; width:60px; height:60px; font-size:70px; color:#ccc; background-image: url("/template/1/type1/images/heart_off.png"); background-position: center center; background-repeat: no-repeat; } .atte.active:before{background:url("/template/1/type1/images/heart_on.png") center center no-repeat; } .blue{background:#0071d0;} .red{background:#db0b37;} .gray{color:#000 !important; background:#f4f4f4; line-height:43px; border:1px solid #ccc;} .gray2{color:#000 !important; background: #ccc; line-height:43px; border:1px solid #ccc; } .white{color:#000 !important; background: #fff; line-height:43px; border:1px solid #333; } .black{color:#fff !important; background: #000; line-height:43px; border:1px solid #000; } .big{height:70px; font-size:20px; line-height:70px;} .full{width:100% !important; } .half{width:calc(100% / 2 - 2.51px); margin:5px 5px 0 0 !important;} .half:last-child{margin-right:0 !important;} .viewBtn{display:inline-block; height:32px; padding:0 10px; font-size:16px; line-height:30px; text-align:center; background:#fff; border:1px solid #ccc; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .viewBtn_gnu{display:inline-block; padding:0 10px; height:32px; font-size:16px; line-height:30px; text-align:center; background:#fff; border:1px solid #ccc; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .notB{display:inline-block; position:relative; padding:0 18px; font-size:16px; font-weight:100; } .notB:before{content:""; display:block; position:absolute; top:50%; left:0; width:1px; height:14px; margin-top:-7px; background:#d3d3d3;} .notB:after{content:""; display:block; position:absolute; bottom:-8px; left:50%; width:0; height:2px; margin-left:0; background:#006ec2; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } .notB:hover:after{width:60px; margin-left:-30px;} .noticeBtnArea .notB:first-child:before{display:none;} .sampleB{display:block; width:80%; margin:2px auto; padding:5px; font-size:15px; font-weight:400; color:#fff !important; background:#0071d0;} .sampleB.none{position:relative; cursor:default; background:#ccc;} .sampleB.red{background:#db0b37;} .sampleB.bas{background: #006ec2; } .sampleB.dele{color:#000 !important; background:#fff; border:1px solid #333;} .sampleB.white{color:#000 !important; line-height:32px; background:#fff; border:1px solid #333;} .sampleB.black{color:#fff !important; line-height:inherit; background: #000; } .sampleB.end{color:#fff !important; line-height:inherit; background: #595959; } .payBtn{display:block; width:100%; height:55px; margin:5px auto; font-size:18px; color:#fff; text-align:center; line-height:53px; } .payCouoBtn{display:inline-block; position:absolute; top:0; right:0; width:54px; height:55px; padding:6px 0; font-size:18px; color:#fff; line-height:20px; text-align:center; background:#006ec2; } @media(max-width:1080px){ .buyBtnArea a.sBtn{height:40px !important; font-size:13px; line-height:40px !important; } .buyBtnArea a.sBtn.white{line-height:43px; } .buyBtnArea a.sBtn.gray{line-height:43px; } .sBtn.m_show{display:block; margin:15px 0 0 0; } .atte{padding-left:45px; width:40px !important; height:40px !important; padding:0 !important; line-height: 40px !important;} .atte:before{width:40px !important; height:40px !important; -webkit-background-size:22px; background-size:22px; } .sampleB{width:95%; font-size:14px; } .big{height:55px; font-size:18px; line-height:55px;} .viewBtn{height:28px; font-size:14px; line-height:26px; -webkit-border-radius: 14px; -moz-border-radius: 14px; border-radius: 14px; } .viewBtn_gnu{height:28px; font-size:14px; line-height:26px; -webkit-border-radius: 14px; -moz-border-radius: 14px; border-radius: 14px; } } @media(max-width:640px){ .sBtn{width:100%; min-width:120px; height:40px; font-size:14px; line-height:40px; } .buyBtnArea a.sBtn{width:calc(100% / 2 - 29.01px); margin-left:2px; } .centerBtnA.mtA{margin-top:15px;} .centerBtnA a{width:calc(100% / 2 - 2.51px); margin:0 5px 0 0;} .centerBtnA a:last-child{margin-right:0; } .atte{min-width:inherit; padding-left:0; font-size:0 !important; } .atte:before{border-right:none; } .sampleB{min-width:85px; width:auto; font-size:13px; } .notice_list01 .sampleB{display:inline-block; margin:0 2px;} } /* 커스텀 체크 */ .chkCus{position:relative; } .chkCus input[type="checkbox"]{display:none; } .chkCus span.text{margin-right:10px; } .chkCus span.btn{display:inline-block; position:relative; width:34px; height:10px; vertical-align:2px; background:#d8d8d8; border:1px solid #ccc; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .chkCus span.btn:before{content:""; display:block; position:absolute; top:-4px; left:-5px; width:16px; height:16px; background:#fff; border:1px solid #bababa; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; -webkit-transition: left .5s; -moz-transition: left .5s; -ms-transition: left .5s; -o-transition: left .5s; transition: left .5s; } .chkCus input[type="checkbox"]:checked + span.text + span.btn:before{left:20px; border:none; background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #7794fd), color-stop(0.74, #8065f6), color-stop(0.9500000000000001, #764eef)); background: -moz-linear-gradient(-126deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: -webkit-linear-gradient(-126deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: -o-linear-gradient(-126deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: -ms-linear-gradient(-126deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: linear-gradient(-126deg, #7794fd 0%, #8065f6 74%, #764eef 95%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7794fd', endColorstr='#764eef', gradientType=1); } .chkCus2{width:100%; } .chkCus2 .in{position:relative; background:#fff;} .chkCus2 input[type="checkbox"], .chkCus2 input[type="radio"]{visibility:hidden; position:absolute; top:0; left:0; } .chkCus2 label{display:block; width:100%; height:70px; border:1px solid #ccc; } .chkCus2 span.txt{display:block; padding:18px 54px 18px 24px; height:100%; font-size:20px; font-weight:100; } .chkCus2 span.btn{display:block; position:absolute; top:50%; right:14px; width:28px; height:20px; margin-top:-10px; background-image: url("/template/1/type1/images/chk_off.png"); background-position: 0 0; background-repeat: no-repeat; -webkit-background-size: 100%; background-size:100%;} .chkCus2 input[type="checkbox"]:checked + span.txt + span.btn, .chkCus2 input[type="radio"]:checked + span.txt + span.btn{background-image:url("/template/1/type1/images/chk_on.png");} @media(max-width:1080px){ .chkCus2 label{height:55px;} .chkCus2 span.txt{padding:14px 54px 14px 15px; font-size:16px;} .chkCus2 span.btn{width:22px; height:18px; margin-top:-9px;} } @media(max-width:640px){ .chkCus2 label{height:40px;} .chkCus2 span.txt{padding:8px 30px 8px 15px; font-size:14px;} .chkCus2 span.btn{right:10px; width:20px; height:14px; margin-top:-7px;} } /* 커스텀 라디오 */ .radioCus label{display:inline-block; position:relative; width:calc(100% / 2 - 5.01px); height:70px; margin-right:10px; } .radioCus label:last-child{margin-right:0; } .radioCus input[type="radio"]{visibility:hidden; } .radioCus span.txt{display:block; position:absolute; top:0; left:0; z-index:10; width:100%; font-size:20px; font-weight:400; line-height:70px; text-align:center; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } .radioCus span.btn{display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:#fff; border:1px solid #ccc; } .radioCus span.btn:after{content:""; display:block; position:absolute; top:0; left:0; width:0; height:100%; background:#ff4a03; -webkit-transition: width .3s; -moz-transition: width .3s; -ms-transition: width .3s; -o-transition: width .3s; transition: width .3s; } .radioCus input[type="radio"]:checked + span.txt{color:#fff; } .radioCus input[type="radio"]:checked + span.txt + span.btn{border:1px solid #ff4a03} .radioCus input[type="radio"]:checked + span.txt + span.btn:after{width:100%;} /*.payRadio label{display:inline-block; position:relative; margin-right:30px; padding-left:40px;}*/ .payRadio label{display:inline-block; position:relative; margin-right:18px; padding-left:32px;line-height: 26px;} .payRadio label.nomargin{margin:0px;} .payRadio label.nopadding{padding:0px;} .payRadio input[type="radio"], .payRadio input[type="checkbox"]{visibility:hidden; display:none; } .payRadio span.btn{display:block; position:absolute; top:0; left:0; width:26px; height:26px; background-image: url("/template/1/type1/images/chk_off2.png"); background-position: 0 0; background-repeat: no-repeat; -webkit-background-size: 100%; background-size:100%;} .payRadio input[type="radio"]:checked + span.btn, .payRadio input[type="checkbox"]:checked + span.btn{background-image:url("/template/1/type1/images/chk_on2.png");} .boxLabel input[type="radio"]{visibility:hidden; display:none; } .boxLabel input[type="radio"]:checked + .lookUpA{color:#fff; background:#0071d0; border:1px solid #0071d0;} @media(max-width:1080px){ .radioCus label{height:55px;} .radioCus span.txt{font-size:18px; line-height:55px;} } @media(max-width:640px){ .payRadio span.btn{top:3px; width:22px; height:22px;} .radioCus label{height:45px;} .radioCus span.txt{font-size:16px; line-height:45px;} } .chkCus3 label{display:inline-block; position:relative; width:26px; height:26px; } .chkCus3 label.nomargin{margin:0px;} .chkCus3 label.nopadding{padding:0px;} .chkCus3 input[type="radio"], .chkCus3 input[type="checkbox"]{visibility:hidden; display:none; } .chkCus3 span.btn{display:block; position:absolute; top:0; left:0; width:26px; height:26px; background-image: url("/template/1/type1/images/chk_off2.png"); background-position: 0 0; background-repeat: no-repeat; -webkit-background-size: 100%; background-size:100%;} .chkCus3 input[type="radio"]:checked + span.btn, .chkCus3 input[type="checkbox"]:checked + span.btn{background-image:url("/template/1/type1/images/chk_on2.png");} @media(max-width:640px){ .chkCus3 label{width:20px; height:20px; } .chkCus3 span.btn{width:20px; height:20px;} } /* 테이블 */ .viewIn table.basicTb1{margin-bottom:100px;} table, table th, table td{} table.basicTb1{margin-bottom:35px;} table.basicTb1.noMargin{margin:0;} table.basicTb1 th{font-weight:400; } table.basicTb1 thead th{border-top:1px solid #c4c4c4; border-bottom:2px solid #000;} table.basicTb1 thead th:after{content:""; display:block; position:absolute; top:50%; right:0; width:1px; height:18px; margin-top:-9px; background:#dbdbcb;} table.basicTb1 thead th:last-child:after{display:none;} table.basicTb1 thead th input[type="checkbox"]{margin-right:8px;} table.basicTb1 th, table.basicTb1 td{position:relative; padding:20px 0; font-size:18px; text-align:center; border-bottom:1px solid #c4c4c4;} table.basicTb1 td{font-weight:300; } table.basicTb1 td input[type="checkbox"]:not(".noA"){position:absolute; top:28px; left:5px; } table.basicTb1 .left{padding-left:35px; text-align:left; } .paymentArea table.basicTb1 .left{padding-left:5px;} table .top{vertical-align:top;} table.basicTb1 .left.chk{padding-left:50px;} table.basicTb1 .left.chk input[type="checkbox"]{left:25px;} table.basicTb1 .left a{display:inline-block; width:auto; max-width:90%; margin-left:8px; vertical-align:middle; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} table.basicTb1 .packageP{width:100%; position:relative; } table.basicTb1 .packageP a{max-width:80%;} table.basicTb1 span.progressN{display:block; position:absolute; top:0; right:0; width:14%; text-align:center; } table.basicTb1 .left a.noH{text-overflow:inherit; white-space:inherit; overflow:inherit;} table.basicTb1 .left a:hover{text-decoration:underline;} table.basicTb1 .imgT{width:145px; max-width:100%; height:110px; margin:0 auto; } table.basicTb1 .imgT img{display:block; width:auto; max-width:100%; height:100%; margin:0 auto; } table.basicTb2{border:1px solid #ccc; border-top:2px solid #000; } table.basicTb2 th, table.basicTb2 td{height:70px; padding:7px 20px; color:#333; text-align:left; border-bottom:1px solid #ccc; } table.basicTb2 th{position:relative; font-size:16px; font-weight:500; } table.basicTb2 th:after{content:""; display:block; position:absolute; top:26px; right:0; width:1px; height:18px; background:#ccc; } table.basicTb2 td{position:relative; padding-left:210px; font-size:18px; font-weight:300; } table.basicTb2 .top{padding-top:22px;} table.basicTb2 .settle_bank select.long{width:calc(100% - 150px);} table.basicTb2 span.tit{position:absolute; top:0; left:0; width:200px; height:100%; display:table; font-size:16px; font-weight:500; color:#333; } table.basicTb2.tit_30 span.tit{width:220px;} table.basicTb2.tit_30 td{padding-left:230px; } table.basicTb2 span.tit > span{display:table-cell; padding-left:24px; vertical-align:middle; } table.basicTb2 span.tit:after{content:""; display:block; position:absolute; top:50%; right:0; width:1px; height:18px; margin-top:-9px; background:#ccc; } table.basicTb2 .placeT{width:140px; } table.basicTb2 .placeT2{width:240px; } table.basicTb2 .placeH{font-size:16px; line-height:50px; } table.basicTb2.pay_basicTb2 td{padding-left:140px;} table.basicTb2.pay_basicTb2 span.tit{width:135px;} table.popBasicTb{border:1px solid #ccc; border-top:2px solid #000; } table.popBasicTb th, table.popBasicTb td{height:40px; padding:5px 10px; color:#333; border-bottom:1px solid #ccc; } table.popBasicTb th{position:relative; font-size:14px; font-weight:500; } table.popBasicTb td{font-size:14px; font-weight:300; } table.popBasicTb .left{padding:8px; text-align:left; } ul.packageProg{width:100%; margin:15px 0 0 0; padding-left:15px; } ul.packageProg li{position:relative; width:100%; } ul.packageProg li a{max-width:75% !important;} .addDel{margin:5px 0 0 0; font-size:0;} .addDel span{display:inline-block; width:30px; height:30px; text-align:center; line-height:28px; cursor:pointer; background:#fff; border:1px solid #ccc; } .addDel span img{vertical-align:middle} @media(max-width:1080px){ table.basicTb2 td{padding-left:130px; font-size:16px;} table.basicTb2 span.tit{width:120px; font-size:14px;} table.basicTb2.tit_30 td{padding-left:170px; } table.basicTb2.tit_30 span.tit{width:160px;} } @media(max-width:640px){ table.basicTb2 td{padding:10px; font-size:14px;} table.basicTb2 span.tit{position:relative; width:100%; height:auto; margin-bottom:10px; } table.basicTb2 span.tit:after{display:none; } table.basicTb2 span.tit > span{padding:0; } table.basicTb2.tit_30 td{padding-left:10px; } table.basicTb2.tit_30 span.tit{width:100%;} table.basicTb2 .addDel{display:inline-block; *display:inline; *zoom:1; margin:0 0 0 10px; vertical-align:middle; } table.basicTb2.pay_basicTb2 td{padding-left:10px;} table.basicTb2.pay_basicTb2 span.tit{width:100%;} table.basicTb2 .settle_bank select.long{width:100%;} table.basicTb2 .placeT{width:100%; margin-top:5px;} } /* 로그인/아이디찾기/비밀번호찾기 */ ul.loginNav{width:100%; padding:40px 0 0 0; } ul.loginNav:after{content:""; display:block; clear:both;} ul.loginNav li{position:relative; float:left; padding:0 18px; } ul.loginNav li:first-child{padding-left:0;} ul.loginNav li:last-child{padding-right:0;} ul.loginNav li:after{content:""; display:block; position:absolute; top:7px; right:0; width:1px; height:17px; background:#e5e5e5;} ul.loginNav li:last-child:after{display:none; } ul.loginNav li a, ul.loginNav li span.text{position:relative; font-size:20px; font-weight:100; } ul.loginNav li a:after, ul.loginNav li label:after{content:""; display:block; position:absolute; bottom:-4px; left:-10%; width:0; height:2px; background:#5a2ac5; -webkit-transition: width .3s; -moz-transition: width .3s; -ms-transition: width .3s; -o-transition: width .3s; transition: width .3s; } ul.loginNav li label:after{bottom:0; left:-4%;} ul.loginNav li a:hover:after{width:120%;} ul.loginNav li:hover label:after{width:80%;} dl.simpleLogin{width:100%; margin-top:60px;} dl.simpleLogin:after{content:""; display:block; clear:both;} dl.simpleLogin dt{float:left; width:106px; font-size:20px; font-weight:100; } dl.simpleLogin dd{float:left; width:80px; margin-left:6px; } dl.simpleLogin dd a, dl.simpleLogin dd img{display:block; width:100%; } dl.simpleLogin .kko_login{background: none !important;} ul.findEnd{width:100%; border:1px solid #dbdbdb; border-right:none;} ul.findEnd:after{content:""; display:block; clear:both;} ul.findEnd li:first-child{width:24%; font-weight:100; color:#3e3e3e; text-align:center; } ul.findEnd li{float:left; width:38%; font-size:18px; font-weight:500; color:#000; padding:12px; background:#fff; border-right:1px solid #dbdbdb; } ul.pwEnd{width:100%;} ul.pwEnd li{position:relative; margin:4px 0; padding:10px 0 10px 170px; background:#fff; border:1px solid #dbdbdb; } ul.pwEnd li > a{display:block; position:absolute; top:0; left:-1px; width:160px; height:100%; text-align:center; line-height:44px; background:url("/template/1/type1/images/next.png") 90% center no-repeat; border:1px solid #000; } @media(max-width:1080px){ ul.loginNav{padding:30px 0 0 0; } ul.loginNav li{padding:0 14px; } ul.loginNav li:after{top:8px; height:14px;} ul.loginNav li a, ul.loginNav li span.text{font-size:16px; } dl.simpleLogin{margin-top:60px;} dl.simpleLogin dt{float:none; width:100%; margin-bottom:5px; font-size:18px; } dl.simpleLogin dd{margin-left:0; margin-right:6px; } ul.findEnd li{font-size:16px; padding:8px; } ul.pwEnd li{padding:8px 0 8px 140px; font-size:16px; } ul.pwEnd li > a{width:130px; padding:0 8px; text-align:left; line-height:40px;} } @media(max-width:640px){ ul.loginNav{padding:10px 0 0 0; } ul.loginNav li{padding:0 8px; } ul.loginNav li a, ul.loginNav li span.text{font-size:14px; } dl.simpleLogin{margin-top:30px;} dl.simpleLogin dt{ font-size:16px; } dl.simpleLogin dd{width:60px; } ul.findEnd li{width:76%;} ul.findEnd li.last_li{width:100%; border-top:1px solid #dbdbdb;} ul.pwEnd li{padding:8px 0 8px 130px; font-size:14px; } ul.pwEnd li > a{width:120px; line-height:34px;} } /* 회원가입 */ ul.joinList{margin-bottom:30px; } ul.joinList li{min-height:70px; margin-bottom:35px; } ul.joinList.joinEnd li{margin-bottom:25px;} ul.joinList li.chkCus2{margin-bottom:5px;} ul.joinList li .in{position:relative; width:100%; background:#fff;} ul.joinList li p.tit{margin-bottom:5px; font-size:18px;} ul.joinList li p.value{width:100%; min-height:70px; padding:20px 24px; font-size:20px; font-weight:100; border:1px solid #ccc; } ul.joinList li.noW{background:none;} span.error{position:absolute; bottom:-24px; left:0; padding-left:25px; font-size:14px; color:#ee0000;} span.error:before{content:""; display:block; position:absolute; top:1px; left:0; width:20px; height:20px; background:url("/template/1/type1/images/icon_warning.png") 0 0 no-repeat; -webkit-background-size: 100%; background-size:100%; } ul.joinList .nec{font-size:14px; color:#ee0000;} ul.joinList .necPass{color:#0d88f1;} ul.joinList .lengInput1 .in{border:1px solid #ccc;} /* ul.joinList .lengInput1 label{width:31.5%;} */ ul.joinList .lengInput1 .btnIn{position:relative; margin-bottom:5px; padding-right:150px; } ul.joinList .lengInput1 .btnIn label{width:100%;} ul.joinList .lengInput1 .btnIn a.sBtn{position:absolute; top:0; right:0; width:150px; border:none; border-left:1px solid #ccc; } ul.joinList.joinEnd .lengInput1 .btnIn a.sBtn{top:1px; right:1px; } ul.joinList .lengInput1 .bul{font-size:20px; font-weight:100; vertical-align:-7px; } .joinchoBox ul.capList li{float:none !important; width:100% !important; padding:10px 20px 10px 42px !important; font-size:18px; font-weight:100; background:url("/template/1/image/capChkIco.png") 20px 20px no-repeat; } .joinchoBox{position:relative; width:100%; margin-bottom:50px; padding-bottom:10px; } .joinchoBox.nobm{margin-bottom:0;} .joinchoBox span.error{bottom:-10px;} .joinchoBox > p{font-size:20px; font-weight:100; } .joinchoBox ul.choList{width:100%; margin-top:14px; padding:10px 0; background:#fff; border:1px solid #ccc; border-top:3px solid #000; } .joinchoBox ul.choList:after{content:""; display:block; clear:both;} .joinchoBox ul.choList li{float:left; width:50%; padding:10px 0 10px 20px; } .joinchoBox ul.choList li label{font-size:20px; font-weight:100; } .joinchoBox ul.choList li input{margin-right:10px; } .joinchoBox ul.choList.full li{float:none; width:100%; }/* 추가 */ ul.joinAgree{position:relative; width:100%; padding:15px 0 30px 0;} ul.joinAgree:after{content:""; display:block; clear:both;} ul.joinAgree li{margin-bottom:5px; font-size:0; } ul.joinAgree li label{margin-right:10px; font-size:18px; font-weight:100; } ul.joinAgree li input[type="checkbox"]{margin-right:10px; } ul.joinAgree span.error{bottom:15px;} @media(max-width:1080px){ ul.joinList li{min-height:45px; } ul.joinList li p.tit{font-size:16px;} ul.joinList li p.value{min-height:55px; padding:14px 15px; font-size:16px;} .joinchoBox{margin-bottom:30px; padding-bottom:8px; } .joinchoBox > p{font-size:16px;} .joinchoBox ul.choList{margin-top:10px; padding:8px 0; } .joinchoBox ul.choList li{padding:8px 0 8px 15px; } .joinchoBox ul.choList li label{font-size:16px; } .joinchoBox ul.choList li input{margin-right:8px; } .joinchoBox span.error{bottom:-20px;} ul.joinAgree{padding-top:12px;} ul.joinAgree li label{margin-right:8px; font-size:16px; } ul.joinAgree li input[type="checkbox"]{margin-right:8px; } } @media(max-width:640px){ ul.joinList{margin-bottom:20px; } ul.joinList li p.tit{font-size:14px;} ul.joinList li p.value{min-height:40px; padding:9px 10px; font-size:14px;} ul.joinList .lengInput1 .btnIn{padding-right:100px; } ul.joinList .lengInput1 .btnIn a.sBtn{width:100px; min-width:100px; } .joinchoBox > p{font-size:14px;} .joinchoBox ul.choList{margin-top:8px; padding:6px 0; } .joinchoBox ul.choList li{padding:6px 0 6px 10px; } .joinchoBox ul.choList li label{font-size:14px; } .joinchoBox ul.choList li input{margin-right:6px; } ul.joinAgree{padding-top:10px;} ul.joinAgree li label{margin-right:6px; font-size:14px; } ul.joinAgree li input[type="checkbox"]{margin-right:6px; } } #contents ul.inTabs{width:100%; margin-bottom:30px; border-bottom:1px solid #ccc;} #contents ul.inTabs:after{content:""; display:block; clear:both;} #contents ul.inTabs li{position:relative; float:left; width:25%; padding:0 2px; } #contents ul.inTabs li:after{content:""; display:block; position:absolute; top:50%; right:0; width:1px; height:18px; margin-top:-9px; background:#ccc;} #contents ul.inTabs li:last-child:after{display:none; } #contents ul.inTabs li a{display:block; position:relative; width:100%; padding:20px 0; font-size:18px; font-weight:300; text-align:center;} #contents ul.inTabs li a:after{content:""; display:block; position:absolute; bottom:-1px; left:50%; width:0; height:5px; background:#0071d0; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition:all .5s; -o-transition: all .5s; transition: all .5s; } #contents ul.inTabs li a:hover:after, #contents ul.inTabs li.active a:after{width:100%; margin-left:-50%;} #contents ul.inTabs2{width:100%; margin-bottom:30px;} #contents ul.inTabs2:after{content:""; display:block; clear:both;} #contents ul.inTabs2 li{position:relative; display:table; float:left; width:calc(100% / 5 + 0.99px) !important; height:50px; margin:-1px -1px 0 0; border:1px solid #dbdbdb; } #contents ul.inTabs2 li a{display:table-cell; position:relative; width:100%; font-size:15px; font-weight:300; color:#7a7e80; text-align:center; vertical-align:middle; } #contents ul.inTabs2 li.active{z-index:1;} #contents ul.inTabs2 li.active a{color:#29a2e8; font-weight:500; background:#e9f6fd;} @media(max-width:1080px){ #contents ul.inTabs2{border-bottom:none} #contents ul.inTabs2 li{width:calc(100% / 3 - 0.01px) !important; height:50px;} #contents ul.inTabs2 li a{font-size:15px;} } @media(max-width:640px){ #contents ul.inTabs2 li a{font-size:13px;} } /* 마이페이지 상단 */ /* 상단 픽스 */ .myGuideFixed{display:none; width:100%; margin-bottom:15px; } .myGuideFixed .fixedIn{position:relative; width:100%;} .myGuideFixed .fixedIn.fixed{position:fixed; top:0; left:0; z-index:200; background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffffff), color-stop(0.7, #ffffff), color-stop(1, rgba(255,255,255,0))); background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 70%, rgba(255,255,255,0) 100%); background: -webkit-linear-gradient(top, #ffffff 0%, #ffffff 70%, rgba(255,255,255,0) 100%); background: -o-linear-gradient(top, #ffffff 0%, #ffffff 70%, rgba(255,255,255,0) 100%); background: -ms-linear-gradient(top, #ffffff 0%, #ffffff 70%, rgba(255,255,255,0) 100%); background: linear-gradient(top, #ffffff 0%, #ffffff 70%, rgba(255,255,255,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='rgba(255,255,255,0)', gradientType=0); } .topFixTitle{position:relative; width:100%; padding:10px 15px 10px 35px; font-size:18px; color:#fff; font-weight:500; text-align:center; background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #2c69ad), color-stop(0.9500000000000001, #006ec2)); background: -moz-linear-gradient(145deg, #2c69ad 0%, #006ec2 95%); background: -webkit-linear-gradient(145deg, #2c69ad 0%, #006ec2 95%); background: -o-linear-gradient(145deg, #2c69ad 0%, #006ec2 95%); background: -ms-linear-gradient(145deg, #2c69ad 0%, #006ec2 95%); background: linear-gradient(145deg, #2c69ad 0%, #006ec2 95%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2c69ad', endColorstr='#006ec2', gradientType=1); } .topFixTitle a.back{display:block; position:absolute; top:50%; left:15px; width:10px; margin-top:-8.5px; font-size:18px; color:#fff; font-weight:600; } .topFixTitle a.back img{display:block; width:100%; } @media(max-width:1080px){ .myGuideFixed{display:block; } } #contents .mypageGuide{position:relative; width:100%; height:155px; margin:60px 0;} #contents .myStatus{display:table; width:100%; height:100%; padding:0 0; background:#f7f7f7;} #contents .myStatus:after{content:""; display:block; clear:both;} #contents .myStatus .myinfo{display:table-cell; width:330px; vertical-align:middle; text-align:center;} #contents .myStatus .myinfo .top{color:#262626; font-size:20px; font-weight:300;} #contents .myStatus .myinfo .top strong{font-size:26px; font-weight:500;} #contents .myStatus .myinfo .modify {padding-top:14px;} #contents .myStatus .myinfo .modify a {display:inline-block; width:110px; height:30px; border:1px solid #e0e0e0; background:#fff; color:#1a1a1a; font-size:15px; font-weight:300; text-align:center; line-height:29px;} #contents .myStatus ul.lookUp{display:table-cell; width:calc(100% - 330px); font-size:0; vertical-align:middle;} #contents .myStatus ul.lookUp li{display:inline-block; width:calc(100% / 6 - 0.01px); padding:5px 0; text-align:center; vertical-align:middle; border-left:1px solid #dbdbdb; } #contents .myStatus ul.lookUp li a{display:block; width:100%; text-align:center;} #contents .myStatus ul.lookUp li p{font-size:16px; font-weight:300; color:#333;word-break: keep-all;} #contents .myStatus ul.lookUp li p {color:#666666; font-size:15px; font-weight:300;} #contents .myStatus ul.lookUp li p + p {padding-top:11px;} #contents .myStatus ul.lookUp li p.value{color:#262626; font-size:15px; font-weight:300;} #contents .myStatus ul.lookUp li p.value strong{font-size:30px; font-weight:600; line-height:1;} #contents .myStatus ul.lookUp li p.point {color:#29a2e8;} @media(max-width:1080px){ .t_hide{display:none !important; } #contents .mypageGuide{height:auto; margin:-25px 0 20px;} #contents .myStatus{display:block; width:calc(100% + 30px); height:auto; margin-left:-15px; padding:0 15px; margin-bottom:0; border-bottom:none; border-top:none; } #contents .myStatus .myinfo{display:block; position:relative; width:100%; height:auto; padding:21px 0; border-bottom:1px solid #dbdbdb; text-align:center;} #contents .myStatus .myinfo .top{font-size:14px; text-align:left;} #contents .myStatus .myinfo .top strong{font-size:26px;} #contents .myStatus .myinfo .modify {position:absolute; top:50%; right:0; padding-top:0; margin-top:-15px;} #contents .myStatus .myinfo .modify a {width:100px; font-size:13px;} #contents .myStatus ul.lookUp{display:block; width:100%; padding:25px 0 30px;} #contents .myStatus ul.lookUp li {padding:0;} #contents .myStatus ul.lookUp li:first-child {border-left:0;} #contents .myStatus ul.lookUp li p {font-size:13px;} #contents .myStatus ul.lookUp li p + p {padding-top:10px;} #contents .myStatus ul.lookUp li p.value{font-size:12px; } #contents .myStatus ul.lookUp li p.value strong{font-size:18px;} } @media(max-width:640px){ #contents .myStatus ul.lookUp {display:flex;flex-wrap:wrap;} #contents .myStatus ul.lookUp li {width: 33.333% !important;padding: 10px 0 !important;} #contents .myStatus ul.lookUp li:nth-child(3n+1){border-left: none;} } /* 나의 강의실 상단 */ #contents .myRoom{} #contents .myRoom .totalProgress{display:table-cell; width:330px; vertical-align:middle; text-align:center;} #contents .myRoom .totalProgress .txtBar{text-align:left; padding-left:50px;} #contents .myRoom .totalProgress .title{margin-bottom:5px; font-size:22px; color:#262626; font-weight:500; letter-spacing:-0.04rem;} #contents .myRoom .totalProgress .title:last-child{margin-bottom:0; } #contents .myRoom .totalProgress .time {margin-bottom:0; font-size:20px; color:#262626; font-weight:300; letter-spacing:-0.04rem;} #contents .myRoom .totalProgress .period {font-size:18px; color:#262626; font-weight:300; letter-spacing:-0.04rem;} #contents .myRoom .totalProgress .progressBar{position:relative; width:215px; height:13px; background:#e7e7e7;} #contents .myRoom .totalProgress .progressBar:before{content:""; display:block; position:absolute; top:0; left:0; z-index:20; width:100%; height:100%; background:url("/template/1/type1/images/progressBar.png") 0 0 repeat-x;} #contents .myRoom .totalProgress .progressBar span.bar{display:block; position:absolute; top:0; left:0; z-index:10; height:100%; } #contents .myRoom .totalProgress .progressBar span.bar:after{content:""; display:block; position:absolute; top:0; left:0; width:0; height:100%; -webkit-transition: all 2.5s; -moz-transition: all 2.5s; -ms-transition:all 2.5s; -o-transition: all 2.5s; transition: all 2.5s; background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #2c69ad), color-stop(0.9500000000000001, #006ec2)); background: -moz-linear-gradient(145deg, #2c69ad 0%, #006ec2 95%); background: -webkit-linear-gradient(145deg, #2c69ad 0%, #006ec2 95%); background: -o-linear-gradient(145deg, #2c69ad 0%, #006ec2 95%); background: -ms-linear-gradient(145deg, #2c69ad 0%, #006ec2 95%); background: linear-gradient(145deg, #2c69ad 0%, #006ec2 95%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2c69ad', endColorstr='#006ec2', gradientType=1); } #contents .myRoom .totalProgress .progressBar.action span.bar:after{width:100%;} #contents .myRoom .totalProgress .numberA{font-size:20px; color:#db0b37; vertical-align:top; } #contents .myRoom .totalProgress .numberA span.counter{font-size:40px; font-weight:600;} @media(max-width:1080px){ #contents .myRoom{padding:0;} #contents .myRoom .myStatus ul.lookUp{display:table; width:100%; } #contents .myRoom .myStatus ul.lookUp > li{display:table-cell; } #contents .myRoom .totalProgress{display:block; position:relative; width:100%; height:auto; padding:21px 0; border-bottom:1px solid #dbdbdb; text-align:center;} #contents .myRoom .totalProgress .txtBar{padding-left:0;} #contents .myRoom .totalProgress .title{font-size:22px;} #contents .myRoom .totalProgress .time{font-size:14px;} #contents .myRoom .myRoomMove p.title img{display:inline-block; margin:0 5px 0 0;} #contents .myRoom .myRoomMove a:before{top:22px; -ms-transform:rotateY(0) ; -webkit-transform:rotateY(0) ; transform:rotateY(0) ; } #contents .myRoom .totalProgress .progressBar{width:220px; height:26px; background:none; border:1px solid #fff; -webkit-border-radius: 13px; -moz-border-radius:13px; border-radius:13px; overflow:hidden; } #contents .myRoom .totalProgress .progressBar:before{display:none; } #contents .myRoom .totalProgress .progressBar span.bar:after{ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #dadada), color-stop(0.37, #ffffff), color-stop(1, #dadada)); background: -moz-linear-gradient(top, #dadada 0%, #ffffff 37%, #dadada 100%); background: -webkit-linear-gradient(top, #dadada 0%, #ffffff 37%, #dadada 100%); background: -o-linear-gradient(top, #dadada 0%, #ffffff 37%, #dadada 100%); background: -ms-linear-gradient(top, #dadada 0%, #ffffff 37%, #dadada 100%); background: linear-gradient(top, #dadada 0%, #ffffff 37%, #dadada 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dadada', endColorstr='#dadada', gradientType=0); } #contents .myRoom .totalProgress .numberA{font-size:16px;} #contents .myRoom .totalProgress .numberA span.counter{font-size:28px;} } @media(max-width:640px){ #contents .myRoom .totalProgress .numberA{font-size:14px;} #contents .myRoom .totalProgress .numberA span.counter{font-size:25px; } #contents .myRoom .myRoomMove a{padding:10px 0;} #contents .myRoom .myRoomMove a:before{top:18px;} } #contents .lecture {height:213px;} #contents .lecture .totalProgress.lecture_progress{width:460px; text-align:left; padding-left:50px;} #contents .lecture .totalProgress.lecture_progress .txtBar{padding-left:0;} #contents .lecture .totalProgress.lecture_progress .percent_btn {position:relative; margin-bottom:10px;} #contents .lecture .totalProgress.lecture_progress .btn {position:absolute; top:50%; right:50px; margin-top:-15px; text-align:center;} #contents .lecture .totalProgress.lecture_progress .btn a {width:116px; height:30px; background:#fff; padding:0; margin:0; border:1px solid #e0e0e0; color:#1a1a1a !important; font-size:15px; font-weight:300; line-height:29px;} #contents .lecture ul.lecture_lookUp {width:calc(100% - 460px);} #contents .lecture ul.lecture_lookUp li a {padding-top:85px; background:no-repeat top center/72px;} #contents .lecture ul.lecture_lookUp li p {color:#262626; font-size:18px; font-weight:300;} #contents .lecture ul.lecture_lookUp li:nth-child(1) a{background-image:url("/template/1/images/lecture_lookUp0.png");} #contents .lecture ul.lecture_lookUp li:nth-child(2) a{background-image:url("/template/1/images/lecture_lookUp1.png");} #contents .lecture ul.lecture_lookUp li:nth-child(3) a{background-image:url("/template/1/images/lecture_lookUp2.png");} @media(max-width:1080px){ #contents .lecture {height:auto;} #contents .lecture .totalProgress.lecture_progress{display:block; width:100%; padding: 21px 0; border-bottom: 1px solid #dbdbdb;} #contents .lecture .totalProgress.lecture_progress .txtBar{padding:0;} #contents .lecture .totalProgress.lecture_progress .percent_btn {margin-bottom:14px;} #contents .lecture .totalProgress.lecture_progress .btn {right:0;} #contents .lecture .totalProgress.lecture_progress .btn a {width:90px; font-size:13px;} #contents .lecture .totalProgress.lecture_progress .title {font-size:15px;} #contents .lecture .totalProgress.lecture_progress .period {font-size:14px;} #contents .lecture ul.lecture_lookUp {padding:20px 0 30px;} #contents .lecture ul.lecture_lookUp li a {padding-top:55px; background-size:45px;} #contents .lecture ul.lecture_lookUp li p {font-size:14px;} } /* 나의 수강 현황 */ #contents .captionBox{overflow: hidden;width:100%; margin-bottom:40px; padding:21px 30px; border:1px solid #e0e0e0; border-width:1px 0;} #contents .captionBox.pointCaptionBox{background:#edf5fb; border-top:none;} #contents .captionBox.pointCaptionBox ul li{color:#000;} #contents .captionBox.borTNo{border-top:none;} #contents .captionBox ul {float: left;width: calc(100% - 200px);} #contents .captionBox ul li{position:relative; display:inline-block; width:100%; margin:5px 0; padding-left:25px; font-size:16px; font-weight:300; color:#262626; letter-spacing:-0.04rem;} #contents .captionBox ul li:before{content:""; display:block; position:absolute; top:3px; left:0; width:18px; height:18px; background:url("/template/1/type1/images/check2.png") no-repeat center/cover;} #contents .captionBox ul li .bold {font-family: "Noto Sans KR", sans-serif; font-weight:500 !important;} #contents .captionBox dl{width:100%; margin-bottom:35px;} #contents .captionBox dl:last-child{margin-bottom:0;} #contents .captionBox dl dt{padding-bottom:10px; font-size:18px; font-weight:500; } #contents .captionBox dl dd{font-size:16px; } #contents .captionBox p{margin-bottom:15px; font-size:16px; font-weight:300; } #contents .captionBox p:last-child{margin-bottom:0;} @media(max-width:1080px){ #contents .captionBox{padding:14px 0; margin-bottom:20px;} #contents .captionBox ul li{margin:2px 0; padding-left:23px; font-size:15px; line-height:19px;} #contents .captionBox ul li:before{width:13px; height:13px; top:2px;} #contents .captionBox dl{margin-bottom:25px;} #contents .captionBox dl dt{font-size:16px; } #contents .captionBox dl dd{font-size:14px; } #contents .captionBox p{margin-bottom:10px; font-size:14px;} } @media(max-width:640px){ #contents .captionBox ul {width: 100%;float: none;} #contents .captionBox ul li{font-size:13px;} #contents .captionBox dl dt{font-size:15px; } #contents .captionBox dl dd{font-size:13px; } #contents .captionBox p{font-size:13px;} } #contents .lectureViewProgress{position:relative; display:table; width:100%; margin:0 0 35px 0; padding:26px 60px; background:#f8f8f8; } #contents .lectureViewProgress > div{display:table-cell; vertical-align:middle; } #contents .lectureViewProgress .totalProgress{position:relative; width:130px; min-height:100px; } #contents .lectureViewProgress .totalProgress .zero:after{content:"0%"; position:absolute; top:50%; left:50%; font-size:20px; color:#000; -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); -ms-transform: translate3d(-50%, -50%, 0); -o-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); } #contents .lectureViewProgress .inT{padding:0 15px 0 30px;} #contents .lectureViewProgress .inT .cap{padding:2px 0; font-size:16px; color:#666; } #contents .lectureViewProgress .btn_link{width:220px; height:50px; } #contents .lectureViewProgress a.link{display:block; width:100%; font-size:16px; font-weight:500; color:#fff; line-height:50px; text-align:center; background:#db0b37;} @media(max-width:1080px){ #contents .lectureViewProgress{margin:0 0 25px 0; padding:15px 30px;} #contents .lectureViewProgress .totalProgress{width:100px;} #contents .lectureViewProgress .totalProgress .progressbar-text, #contents .lectureViewProgress .totalProgress .zero:after{font-size:18px !important; } #contents .lectureViewProgress .inT{padding:0 10px 0 30px;} #contents .lectureViewProgress .inT .cap{font-size:14px; } #contents .lectureViewProgress .btn_link{width:180px; height:40px; } #contents .lectureViewProgress a.link{font-size:14px; line-height:40px;} } @media(max-width:800px){ #contents .lectureViewProgress > div{display:inline-block; } #contents .lectureViewProgress .totalProgress{width:80px; min-height:80px;} #contents .lectureViewProgress .totalProgress .progressbar-text, #contents .lectureViewProgress .totalProgress .zero:after{font-size:16px !important; } #contents .lectureViewProgress .inT{width:calc(100% - 84px);} #contents .lectureViewProgress .btn_link{display:block; margin-top:15px; margin-left:114px; } } @media(max-width:640px){ #contents .lectureViewProgress{padding:15px;} #contents .lectureViewProgress .totalProgress{float:right; } #contents .lectureViewProgress .inT{width:calc(100% - 85px); padding:0; } #contents .lectureViewProgress .btn_link{width:150px; margin-left:0; } } /*200122 나의강의실 상세 수료증버튼추가 By kang*/ #contents .lectureViewProgress a.cert_link{display:inline-block; width:100px; height:24px; font-size:16px; font-weight:500; color:#fff; line-height:24px; text-align:center; background:#0071d0;} .captionBox2{width:100%; margin-bottom:20px; padding:34px 40px; background:#edf5fb; } .captionBox2:after{content:""; display:block; clear:both;} .captionBox2 > ul{float:left; width:45%;} .captionBox2 > ul li{position:relative; display:inline-block; width:100%; margin:2px 0; padding-left:20px; font-size:14px; font-weight:300; color:#000; } .captionBox2 > ul li:before{content:""; display:block; position:absolute; top:6px; left:0; width:12px; height:9px; background:url("/template/1/type1/images/check.png") 0 0 no-repeat;} .captionBox2 .couponBox{position:relative; float:right; width:50%; padding-right:145px; } .captionBox2 .couponBox input[type="text"]{height:65px !important; border:none !important;} .captionBox2 .couponBox .lookUpBtn{width:145px;} @media(max-width:1080px){ .captionBox2{margin-bottom:20px; padding:15px 20px;} .captionBox2 > ul{float:none; width:100%;} .captionBox2 > ul li{padding-left:14px; } .captionBox2 .couponBox{float:none; width:100%; margin:15px 0 0 0; padding-right:110px; } .captionBox2 .couponBox input[type="text"]{height:50px !important; } .captionBox2 .couponBox .lookUpBtn{position:absolute; width:110px; height:50px; font-size:18px; line-height:50px;} } @media(max-width:640px){ .captionBox2{padding:15px;} .captionBox2 .couponBox{padding-right:90px; } .captionBox2 .couponBox input[type="text"]{height:40px !important; } .captionBox2 .couponBox .lookUpBtn{width:90px; height:40px; font-size:16px; line-height:40px;} } /* 월별학습현황 */ #contents .shortSearch{width:100%; margin:40px 0 20px; font-size:0; text-align:right; } #contents .shortSearch > span{display:inline-block; font-size:16px; padding:0 15px 0 8px; line-height:45px; } /* 결제내역 */ #contents .amountPay{display:none !important; position:relative; width:100%; padding:20px; font-size:18px; background:#f5f5f5; } #contents .amountPay:after{content:""; display:block; clear:both;} #contents .amountPay span{font-size:18px;} #contents .amountPay span.txt{float:left; } #contents .amountPay span.pay{float:right; } @media(max-width:1080px){ /* 결제내역 */ #contents .amountPay{padding:15px; font-size:16px; } #contents .amountPay span{font-size:16px;} } @media(max-width:640px){ /* 결제내역 */ #contents .amountPay{padding:10px; font-size:14px; } #contents .amountPay span{font-size:14px;} } /* 전환가능 포인트 */ #contents .totalPoint{width:100%; margin-bottom:35px; padding:20px 0; font-size:18px; text-align:center; background:#f5f5f5;} .captionBox2 .left{float:left; } .captionBox2 .left .tit{font-size:24px; font-weight:600; } .captionBox2 .left p{font-size:16px; font-weight:300; } .captionBox2 .right{float:right;} .captionBox2 .right span{display:inline-block; vertical-align:middle; } .captionBox2 .mileageBox{position:relative; padding-right:380px;} .captionBox2 .mileageBox .availableP{width:auto; padding:0; font-size:45px; background:none;} .captionBox2 .mileageBox .lookUpBtn{width:340px;} .captionBox2 .availableP{padding-right:45px; font-size:35px; font-weight:300; background:url("/template/1/type1/images/arrowBig1.png") 98% center no-repeat;} .captionBox2 .availableP span{font-weight:600; vertical-align:top;} .captionBox2 .pointInputBox{position:relative; padding-right:220px; font-size:0; width:490px; background:#fff; } .captionBox2 .pointInputBox .t{font-size:35px; font-weight:300; } .captionBox2 .pointInputBox #cyber{width:calc(100% - 24px); height:65px; font-size:35px; color:#0071d0; text-align:right; border:none;} .captionBox2 .lookUpBtn{top:0; right:0; width:220px; height:65px; font-size:24px; line-height:65px; background:#006ec2;} @media(max-width:1080px){ #contents .totalPoint{padding:15px 0; font-size:16px;} .captionBox2 .left{float:none; width:100%; margin-bottom:15px; } .captionBox2 .left .tit{font-size:20px;} .captionBox2 .left p{font-size:14px;} .captionBox2 .right{float:none; width:100%; } .captionBox2 .availableP{width:150px; padding-right:25px; font-size:25px; -webkit-background-size:28px; background-size:28px;} .captionBox2 .pointInputBox{width:calc(100% - 155px); padding-right:180px;} .captionBox2 .pointInputBox .t{font-size:25px;} .captionBox2 .pointInputBox #cyber{height:50px; font-size:25px;} .captionBox2 .lookUpBtn{position:absolute; width:180px; height:50px; font-size:18px; line-height:50px; } .captionBox2 .mileageBox{padding:0; height:auto;} .captionBox2 .mileageBox .availableP{float:left; font-size:35px;} .captionBox2 .mileageBox .lookUpBtn{position:relative; float:right; margin:5px 0 0 0; width:190px;} } @media(max-width:640px){ #contents .totalPoint{padding:10px 0; font-size:14px;} .captionBox2 .left .tit{font-size:18px;} .captionBox2 .availableP{float:none; width:100%; padding-right:0; padding-bottom:10px; font-size:20px; background: none;} .captionBox2 .pointInputBox{width:100%; padding-right:130px; } .captionBox2 .pointInputBox .t{font-size:0;} .captionBox2 .pointInputBox #cyber{width:100%; height:40px; padding:0 10px; font-size:20px;} .captionBox2 .lookUpBtn{width:130px; height:40px; font-size:14px; line-height:40px; } .captionBox2 .mileageBox .availableP{font-size:25px;} .captionBox2 .mileageBox .lookUpBtn{margin:0; width:140px;} } /* 게시판 */ #contents ul.noticeList{width:100%; margin-bottom:45px; } #contents ul.noticeList:after{content:""; display:block; clear:both;} #contents ul.noticeList > li{position:relative; float:left; width:32%; margin-left:1%; margin-bottom:12px; padding:25px; border:1px solid #ccc; } #contents ul.noticeList > li > input[type="checkbox"]{position:absolute; top:30px; right:25px; } #contents ul.noticeList > li:before{content:""; display:block; position:absolute; top:-1px; left:0; width:100%; height:2px; background:#363636;} #contents ul.noticeList > li .topCap{position:relative; width:100%; padding-bottom:10px; } #contents ul.noticeList > li .topCap span{display:inline-block; position:relative; padding:0 14px 0 12px; font-size:16px; color:#666; } #contents ul.noticeList > li .topCap span:first-child{padding-left:0; } #contents ul.noticeList > li .topCap span:after{content:""; display:block; position:absolute; top:50%; right:0; width:1px; height:15px; margin-top:-7.5px; background:#ccc;} #contents ul.noticeList > li .topCap span:last-child:after{display:none; } #contents ul.noticeList > li .title{height:55px; font-size:18px; font-weight:500; } #contents ul.noticeList > li .botCap{position:relative; width:100%; padding-bottom:10px; } #contents ul.noticeList > li .botCap span{display:inline-block; position:relative; padding:0 14px 0 12px; font-size:16px; color:#666; } #contents ul.noticeList > li .botCap span:first-child{padding-left:0; } #contents ul.noticeList > li .botCap span:after{content:""; display:block; position:absolute; top:50%; right:0; width:2px; height:2px; margin-top:-1px; background:#ccc;} #contents ul.noticeList > li .botCap span:last-child:after{display:none; } /* 반응게시판 */ .notice_list01{display:table; width:100%; table-layout:fixed; margin-bottom:35px; border-top:2px solid #29a2e8; border-collapse:collapse; border-spacing:0;} .notice_list01.noMargin{margin:0;} .notice_list01 ul{display:table-row; } .notice_list01 ul > li{display:table-cell; position:relative; text-align:center; padding:18px 0; font-size:18px; text-align:center; vertical-align:middle; word-wrap: break-word; border-bottom:1px solid #e0e0e0;} .notice_list01 ul > li.txt_gray, .notice_list01 ul > li.txt_gray * {color:#666;} .notice_list01 ul.thead > li{display:table-cell; padding:15px 0; font-weight:500; border-bottom:1px solid #e0e0e0;} .notice_list01 ul.thead > li input[type="checkbox"]{margin-right:8px;} .notice_list01 ul.tbody > li{font-weight:300; } .notice_list01 ul.tbody > li input[type="checkbox"]:not(".noA"){position:absolute; top:28px; left:5px; } .notice_list01 ul.tbody > li span.notice {color:#29a2e8;} .notice_list01 li.left{padding-left:50px; text-align:left; } .notice_list01 li.left.left_center{text-align:center; padding-left:0; } .notice_list01 ul.tbody li.m_block{display:none !important;} .notice_list01 ul.tbody li.m_block:after{display:none; } .notice_list01 ul.tbody li .comment_cntA {font-size:18px; vertical-align:middle;} /* 20200703 mr 추가 */ .notice_list01 ul.mov_category li{position:relative; padding:20px 0; color:#262626; font-weight:300;} /*.notice_list01 ul.mov_category li:last-child{background-image: url("/template/resp/image/board_icon_arr.png"); background-position:center 24px; background-repeat: no-repeat;}*/ .notice_list01 ul.mov_category li:first-child{color:#666666; font-size:16px; font-weight:300; } .notice_list01 ul.mov_category li.left{padding-left:10px; } /* .notice_list01 ul.mov_category li:before{content:""; display:block; position:absolute; bottom:0; left:0; width:100%; height:20px; background-color: #f6f6f6;} */ .notice_list01 ul.mov_category li.in_btn{padding-left:15px; font-size:0; text-align:left; } .notice_list01 ul.mov_category li.in_btn a {padding:0; font-size:14px; line-height:39px; text-align:center;} .notice_list01 ul.mov_category li.in_btn a.sampleB {color:#fff !important; border:1px solid #29a2e8; background:#29a2e8;} .notice_list01 ul.mov_category li.in_btn a.sampleB.movie_word_open {color:#fff !important; border:1px solid #50b65e; background:#50b65e;} .notice_list01 ul.mov_category li.in_btn a.sampleB.process_100 {color:#fff !important; border:1px solid #ccc ; background:#ccc ;} .notice_list01 ul.mov_category li.in_btn span.vod a.movie_download_link, .notice_list01 ul.mov_category li.munu_btn_mov span.vod a.movie_download_link{font-size:0; width:24px; min-width:inherit; height:40px; padding:0; vertical-align:18px; background-color:transparent !important; background:url("/template/1/images/w_ply_downIcon_gry2.png") no-repeat center/22px; border:none;} /* @media(max-width:1080px){ .notice_list01 ul.mov_category{background-position:calc(100% - 55px) 20px;} .notice_list01 ul.mov_category li{padding-bottom:30px; font-size:18px; } } */ .notice_list01 ul.board li {padding:25px 0;} .notice_list01 ul.board li.left{padding-left:50px;} .notice_list01 ul.my li.left{padding-left:30px; color:#262626;} .notice_list01 ul.my li.mov_category_process {font-size:16px;} .notice_list01 ul.my li.mov_category_process span {font-size:30px;} .notice_list01 ul.order > li {padding:20px 0;} .notice_list01 ul.order > li .type {color:#29a2e8 !important;} .notice_list01 ul.order > li .prc {color:#262626 !important; font-weight:600;} .notice_list01 ul.order > li .pay_way {font-size:16px;} .notice_list01 ul.order > li .print_study {min-width:70px; width:70px; margin-top:12px; color:#666 !important; background:none !important; border:1px solid #d9d9d9 !important; font-size:13px; font-weight:300;} .notice_list01 ul.order > li .refund_btn, .notice_list01 ul.order > li .bank_cancel_btn {width:70px; margin-top:12px; color:#29a2e8 !important; background:none !important; border:1px solid #29a2e8 !important; font-size:13px; font-weight:300;} .notice_list01 ul.order > li .refundY_btn {color:#db0b37;} @media(max-width:1080px){ .notice_list01 ul.mov_category{position:relative; /* background-image: url("/template/resp/image/board_icon_arr.png"); background-position:calc(100% - 5px) 20px; background-repeat: no-repeat; -webkit-background-size: 14px; background-size:14px; */} .notice_list01 ul.mov_category li:last-child{background: none;} .notice_list01 ul.mov_category li:first-child {font-size:14px;} /* .notice_list01 ul.mov_category:after{content:""; display:block; position:absolute; bottom:0; left:0; width:100%; height:12px; background-color: #f6f6f6;} */ .notice_list01 ul.mov_category li{} .notice_list01 ul.mov_category li.mov_category_process{position:absolute; top:15px; right:0; margin:0; padding:0; } .notice_list01 ul.mov_category li:before, .notice_list01 ul.mov_category li:after{display:none !important; } .notice_list01 ul.mov_category li.in_btn{padding-left:0; padding-right:0; } .notice_list01 ul.mov_category li.in_btn a{width:162px; padding:0; margin:5px 0; font-size:13px;} .notice_list01 ul.mov_category li.in_btn, .notice_list01 ul.mov_category li.munu_btn_mov{display:block !important; margin:0; padding:0; text-align:left; } .notice_list01 ul.mov_category li.munu_btn_mov a{text-align:center; } .notice_list01 ul.mov_category li.in_btn span.vod, .notice_list01 ul.mov_category li.munu_btn_mov span.vod{display:block; width:100%; } .notice_list01 ul.mov_category li.in_btn span.vod:after, .notice_list01 ul.mov_category li.munu_btn_mov span.vod:after{content:""; display:block; clear:both;} .notice_list01 ul.mov_category li.in_btn span.vod a.movie_open, .notice_list01 ul.mov_category li.munu_btn_mov span.vod a.movie_open{float:left; width:auto; width:162px; padding:0; } .notice_list01 ul.mov_category li.in_btn span.vod a.movie_download_link, .notice_list01 ul.mov_category li.munu_btn_mov span.vod a.movie_download_link{float:right; font-size:0; width:24px; min-width:inherit; height:40px; padding:0; background-color:transparent !important; background:url("/template/1/images/w_ply_downIcon_gry2.png") no-repeat center/22px; border:none;} .notice_list01 ul.mov_category .movie_open{margin:2px; } .notice_list01 ul.my li.mov_category_process {font-size:15px;} .notice_list01 ul.my li.mov_category_process span {font-size:22px;} .notice_list01 ul.my {padding:20px 0 15px !important; } .notice_list01 ul.my li.left{width:calc(100% - 60px); padding-left:0; margin-bottom:27px; font-size:15px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} .notice_list01.order {border-top:0;} .notice_list01 ul.order {position:relative; padding:0 !important; margin-bottom:15px; border:1px solid #d9d9d9 !important; border-bottom:0; border-bottom:0 !important;} .notice_list01 ul.order > li {display:block !important; text-align:left;} .notice_list01 ul.order > li.no {padding:13px 15px; margin-bottom:13px; background:#f7f7f7; font-size:14px;} .notice_list01 ul.order > li.date {position:absolute; top:13px; right:15px; font-size:14px;} .notice_list01 ul.order > li.left {padding:0 15px 14px !important; font-size:16px;} .notice_list01 ul.order > li.pay {padding:0 15px 20px; font-size:16px; border-bottom:1px solid #d9d9d9;} .notice_list01 ul.order > li.pay:after {display:block; clear:both; content:'';} .notice_list01 ul.order > li.pay .print_study {float:right; margin-top:-4px;} .notice_list01 ul.order > li.btn_box {position:relative; padding:15px; border-bottom:1px solid #d9d9d9;} .notice_list01 ul.order > li.btn_box.dlv {display:none !important;} .notice_list01 ul.order > li.btn_box.dlv.show {display:block !important;} .notice_list01 ul.order > li.btn_box .print_study {position:absolute; top:50%; right:15px; margin-top:-15px;} .notice_list01 ul.order > li .print_study {display:inline-block; margin:0; min-width:60px !important; width:60px; font-size:13px; text-align:center;} } .notice_list01.freepass_target{display:block; } .notice_list01.freepass_target .packageProg{margin:0; padding:0; background-color: #f8f8f8;} .notice_list01.freepass_target .packageProg li{padding:15px; } .notice_list01.freepass_target .packageProg li a{color:#666; } .notice_list01.freepass_target > ul.thead, .notice_list01.freepass_target > ul.tbody{display:table; width:100%; table-layout:fixed; border-collapse:collapse; border-spacing:0;} .notice_list01.freepass_target > ul.thead li, .notice_list01.freepass_target > ul.tbody li{display:table-cell; } .notice_list01.freepass_target .col_01{} .notice_list01.freepass_target .col_02{width:230px;} .notice_list01.freepass_target .col_03{width:60px;} .notice_list01.freepass_target span.progressN{top:50%; width:8%; -webkit-transform: translate(0,-50%); -moz-transform: translate(0,-50%); -ms-transform: translate(0,-50%); -o-transform: translate(0,-50%); transform: translate(0,-50%); } .notice_list01.freepass_target ul.tbody.active img.arrow_active{-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .paymentArea .notice_list01 ul.tbody > li.left{padding-left:5px;} table .top{vertical-align:top;} .notice_list01 .left.chk{padding-left:50px;} .notice_list01 .left a{display:inline-block; width:auto; max-width:90%; margin-left:8px; vertical-align:middle; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} .notice_list01 .left img {margin-left:-27px;} .notice_list01 .packageP{width:100%; position:relative; } .notice_list01 .packageP a{max-width:80%;} .notice_list01 span.progressN{display:block; position:absolute; top:0; right:0; width:14%; text-align:center; } .notice_list01 .left a.noH{text-overflow:inherit; white-space:inherit; overflow:inherit;} .notice_list01 .left a:hover{text-decoration:underline;} .notice_list01 .imgT{display:inline-block; width:145px; max-width:100%; /* height:110px; */ vertical-align:middle; } .notice_list01 .imgT img{display:block; width:auto; max-width:100%; /* height:100%; */ margin:0 auto; } .notice_list01 .tit{display:inline-block; width:calc(100% - 168px);} .notice_list01 .pay_way{display:block; } .no_list{width:100%; margin-top:-35px; margin-bottom:35px; padding:20px 0; font-size:18px; text-align:center; border-bottom:1px solid #c4c4c4; } .pc_hide{display:none !important; } @media(max-width:1080px){ .m_hide{display:none !important; } .pc_hide{display:inline-block !important; } .notice_list01 ul.thead{display:none; } .notice_list01 ul.tbody{display:block; position:relative; padding:12px 15px; border-bottom:1px solid #c4c4c4; } .notice_list01 ul.tbody li{display:inline-block; *display:inline; *zoom:1; padding:0 0; font-size:13px; color:#666; border-bottom:none; } .notice_list01 ul.tbody li:after{content:""; display:none; position:absolute; top:50%; right:3px; width:1px; height:12px; margin-top:-6px; background-color: #b9b9b9; } .notice_list01 ul.tbody li:last-child:after{display:none; } .notice_list01 ul.tbody li.m_no_bullet:after{display:none;} .notice_list01 ul.tbody li.left{display:block; padding-bottom:5px;} .notice_list01 li.left.left_center{text-align:left; } .notice_list01 ul.tbody li.left:after{display:none; } .notice_list01 ul.tbody li.left a{margin-left:0; font-size:14px; color:#262626;} .notice_list01 ul.tbody li.left img {margin:0 5px 0 0; width:17px;} .notice_list01 ul.tbody li.bold_tit{font-weight:600; } .notice_list01 ul.tbody li.bold_tit:after{display:none; } .notice_list01 ul.tbody li.m_block{display:block !important;} .notice_list01 ul.tbody li.progress{display:none; } .notice_list01 ul.tbody li.txt_btn{display:block !important; padding:0; text-align:left; } .notice_list01 ul.tbody li.txt_btn a{width:auto; min-width:inherit} .notice_list01 ul.tbody li.name {position:relative; margin-right:10px; padding-right:10px; } .notice_list01 ul.tbody li.name:after {display:block; position:absolute; top:50%; right:-1px; width:1px; height:10px; margin-top:-4px; background:#e0e0e0; content:'';} .notice_list01 ul.tbody li.star {position:absolute; bottom:12px; right:15px;} .notice_list01 ul.tbody li.hit {position:relative; margin-left:10px; padding-left:10px; } .notice_list01 ul.tbody li.hit:after {display:block; position:absolute; top:50%; left:-1px; width:1px; height:10px; margin-top:-4px; background:#e0e0e0; content:'';} .notice_list01 ul.tbody li .comment_cntA {font-size:14px;} .notice_list01 .left.chk input[type="checkbox"]{position:absolute; top:-5px; left:-5px;} .notice_list01.detail ul.thead {display:table-row;} .notice_list01.detail ul.thead > li {padding:9px 0; font-size:13px;} .notice_list01.detail ul.tbody{display:table-row; padding:12px 0; border-bottom:1px solid #c4c4c4; } .notice_list01.detail ul.tbody li{display:table-cell; padding:16px 0; font-size:12px; border-bottom:none; } .notice_list01.detail ul.tbody li:after{content:""; display:none; position:absolute; top:50%; right:3px; width:1px; height:12px; margin-top:-6px; background-color: #b9b9b9; } .notice_list01.detail ul.tbody li:last-child:after{display:none; } .notice_list01.detail ul.tbody li.m_no_bullet:after{display:none;} .notice_list01.detail ul.tbody li.left{color:#262626; padding-left:8px; font-size:12px;} .notice_list01.detail li.left.left_center{text-align:left; } .notice_list01 ul.board > li {padding:0 0;} .notice_list01 ul.board > li.left{padding-left:0;} .notice_list01.wish_notice_list{border-top:none; font-size:0; } .notice_list01.wish_notice_list ul.tbody{display:inline-block; *display:inline; *zoom:1; width:calc(100% / 2 - 10.01px); margin:0 5px 15px; padding:10px; vertical-align:top; border:1px solid #c4c4c4; } .notice_list01.wish_notice_list ul.tbody li{display:block; padding:0; } .notice_list01.wish_notice_list ul.tbody li.price{padding:20px 0 5px; font-size:18px; color:#d70000; font-weight:500; text-align:right; } .notice_list01.wish_notice_list ul.tbody li:after{display:none; } .notice_list01.wish_notice_list .quantity_change{width:100%; margin-top:5px;} .notice_list01.order_notice_list ul.tbody li.price{padding-top:4px; } .notice_list01.order_notice_list ul.tbody li.num{position:relative; margin:10px 0 0 0; padding:0 0 0 30px; font-size:14px; color:#333; text-align:left; } .notice_list01.order_notice_list ul.tbody li.num:before{content:"수량"; display:block; position:absolute; top:0; left:0; font-size:14px; font-weight:500; color:#333; } .notice_list01 .imgT{width:100%; margin-bottom:10px; } .notice_list01 .tit{width:100%;} .notice_list01 .tit.text_overflow{text-overflow:ellipsis; white-space:nowrap; overflow:hidden; } .notice_list01 .pay_way{display:inline-block; margin-left:8px; } .no_list{/* border-top: 2px solid #000; */padding:15px 0; font-size:14px;} .m_inline{display:inline-block; *display:inline; *zoom:1; margin-left:5px; } .block_ele{display:block !important; } .block_ele.btn_box{display:block !important; padding:5px 0 0 0 !important; font-size:0 !important; } .block_ele.btn_box a{display:inline-block; *display:inline; *zoom:1; width:calc(100% / 2 - 5.01px); margin:0 2.5px; } .division_type{width:76px; padding:2px 10px; font-size:14px;} .notice_list01.notice_list02 ul.tbody li:after{display:none;} .notice_list01.notice_list02 ul.tbody li.left{font-weight:400; color:#444;} .notice_list01.notice_list02 ul.tbody li.m_right{float:right;} .notice_list01.freepass_target ul.thead{display:none; } .notice_list01.freepass_target ul.tbody{display:block; padding:12px 0; border-bottom:1px solid #c4c4c4; } .notice_list01.freepass_target ul.tbody li{display:inline-block; *display:inline; *zoom:1; padding:0 12px 2px 0; font-size:14px; color:#666; border-bottom:none; } .notice_list01.freepass_target ul.tbody li.left{display:block; padding:0 0 8px 0; font-size:16px; font-weight:500; color:#000;} .notice_list01.freepass_target .col_01{} .notice_list01.freepass_target .col_02{width:auto;} .notice_list01.freepass_target .col_03{width:auto;} } @media(max-width:375px){ .notice_list01.wish_notice_list ul.tbody{width:100%; margin:0 0 15px;} } /* 게시판 리스트 댓글 표시 */ .comment_cntA{color:#da0b37; margin-left:2px;} /* 게시판 상세 */ #contents .starScore{padding:3px 0 0 0; font-size:11px; color:#d70b0b; } #contents .starScore .scoreBg{display:inline-block; position:relative; top:2px; width:115px; height:22px; margin-right:5px; background:url("/template/1/images/ico_star_off2.gif") 0 0 repeat-x; } #contents .starScore .scoreOn{display:block; position:absolute; top:0; left:0; width:115px; height:22px; background:url("/template/1/images/ico_star_on2.gif") 0 0 repeat-x;} #contents .starScore2{padding:3px 0 0 0; font-size:11px; color:#d70b0b; } #contents .starScore2 .scoreBg{display:inline-block; position:relative; top:2px; width:94px; height:17px; background:url("/template/1/images/st_off.gif") 0 0 repeat-x; } #contents .starScore2 .scoreOn{display:block; position:absolute; top:0; left:0; width:94px; height:17px; background:url("/template/1/images/st_on.gif") 0 0 repeat-x;} #contents .tableview{width:100%;} #contents .tableview .top{position:relative; padding:17px 30px; color:#666; font-size:16px; font-weight:300; border-top:2px solid #29a2e8; border-bottom:1px solid #e0e0e0; } #contents .tableview .top .title{width:100%; padding-bottom:10px; color:#262626; font-size:22px; font-weight:500;} #contents .tableview .top .title .lecture {color:#29a2e8;} #contents .tableview .top .info{position:absolute; top:20px; right:30px; text-align:right; } #contents .tableview .top .info:after{content:""; display:block; clear:both;} #contents .tableview .top .info > span{display:inline-block; }/*float:left; */ #contents .tableview .top .info > div{position:relative; display:inline-block; *display:inline; *zoom:1; padding:0 10px; font-size:16px; font-weight:300; }/*float:left; */ #contents .tableview .top .info > div:after{content:""; display:block; position:absolute; top:50%; right:0; width:1px; height:14px; margin-top:-7px; background:#ccc;;} #contents .tableview .top .info > div:last-child{padding-right:0;} #contents .tableview .top .info > div:last-child:after{display:none; } #contents .tableview .top .info > div span.tit{margin-right:8px; } #contents .tableview .top .starScore {color:#262626; font-size:16px;} #contents .tableview .top .starScore .scoreBg {margin-right:10px;} #contents .tableview .viewArea{padding:50px 50px 90px; font-size:18px; /* font-weight:300; */ line-height:32px;} #contents .tableview .viewArea > img{display:inline-block; width:auto; max-width:100%; } #contents .tableview .viewArea .cont{/* min-height:500px; */} #contents .tableview .viewArea .files_div .files{margin-top:0px;} #contents .posList{width:100%; margin-top:40px; border-top:1px solid #000; } #contents .posList > div{width:100%; padding:20px 0; border-bottom:1px solid #c4c4c4; } #contents .posList > div:after{content:""; display:block; clear:both;} #contents .posList p{float:left; font-size:18px; } #contents .posList p.tit{position:relative; width:130px; padding:0 0 0 0; font-weight:400; text-align:center;} #contents .posList p.tit span {padding-left:40px; background:no-repeat left center;} #contents .posList p.tit span.prev {background-image:url('/template/1/images/board_prev.png');} #contents .posList p.tit span.next {background-image:url('/template/1/images/board_next.png');} #contents .posList p.txt{width:calc( 100% - 130px ); padding:0 12px; font-weight:300; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; } #contents .noticeBtnArea{width:100%; margin:40px 0; } #contents .noticeBtnArea:after{content:""; display:block; clear:both;} #contents .noticeBtnArea > span{display:block; font-size:0; } #contents .noticeBtnArea .left{float:left; } #contents .noticeBtnArea .left .sBtn2 {margin-right:10px;} #contents .noticeBtnArea .right{float:right; } #contents .noticeBtnArea .right .sBtn2 {margin-left:10px;} @media(max-width:1080px){ /* 게시판 상세 */ /* #contents .starScore .scoreBg{display:inline-block; position:relative; top:2px; width:84px; height:15px; margin-right:5px; background:url("/template/1/type1/images/starScore_off.gif") 0 0 no-repeat; } #contents .starScore .scoreOn{display:block; position:absolute; top:0; left:0; width:84px; height:15px; background:url("/template/1/type1/images/starScore_on.gif") 0 0 no-repeat;} 위치 확인후 작업 */ #contents .starScore .scoreBg, #contents .starScore .scoreOn {width:70px; height:15px; margin:0; background-size:14px auto;} #contents .tableview .top{overflow:hidden; min-height:inherit; padding:0 0 15px; font-size:12px; font-weight:300; border-top:0; color:#000;} #contents .tableview .top .title{padding-left:0; font-size:16px; } #contents .tableview .top .info{float:right; position:relative; top:0; right:0; max-width:inherit; text-align:right; } #contents .tableview .top .info > div{padding:0 15px 0 0; font-size:12px; } #contents .tableview .top .info > div:after{right:8px;} #contents .tableview .top .starScore {padding-top:0; font-size:14px;} #contents .tableview .viewArea{padding:25px 20px 30px; font-size:13px; line-height:21px;} #contents .tableview .viewArea .iframe_view{position:relative; width:70%; padding-top:38%; } #contents .tableview .viewArea .iframe_view iframe{position:absolute; top:0; left:0; width:100%; height:100%; object-fir:cover;} #contents .posList {margin-top:20px;} #contents .posList > div{padding:15px 0;} #contents .posList p{font-size:15px; } #contents .posList p.tit{width:80px;} #contents .posList p.tit:after{height:14px; margin-top:-7px;} #contents .posList p.tit span {padding-left:30px; width:85px; font-size:15px;} #contents .posList p.txt{width:calc( 100% - 85px ); } #contents .noticeBtnArea{margin:30px 0 15px; } #contents .noticeBtnArea .right{overflow:hidden; float:none; display:table; width:100%;} #contents .noticeBtnArea .right > span {display:table-cell; width:50%; padding-left:3px;} #contents .noticeBtnArea .right > span:first-child {padding:0 3px 0 0;} #contents .noticeBtnArea .right .sBtn2{width:100%; margin:0; height:40px; line-height:40px; font-size:13px;} #contents .noticeBtnArea .left{float:none; width:calc(100% + 4px); margin-left:-2px; padding-top:10px; display:table;} #contents .noticeBtnArea .left > span {display:table-cell; width:25%; padding:0 2px 0 2px;} #contents .noticeBtnArea .left .sBtn2{width:100%; margin:0; height:30px; line-height:30px; font-size:13px;} } @media(max-width:640px){ #contents .tableview .viewArea .iframe_view{width:100%; padding-top:56%; } #contents .posList > div{padding:10px 0;} #contents .posList p{font-size:13px; } #contents .posList p.tit span {font-size:13px;} } /* 댓글달기 */ #contents .commentBox{width:100%; margin-bottom:40px;} /*#contents span.reply .commentBox,#contents span.edit .commentBox{border-top:0px;margin-bottom:0px;}*/ #contents .commentIn{position:relative; width:100%; height:200px; padding:0 0 0 0; } #contents .commentList .commentIn{width:100%; } #contents .commentIn textarea{width:100%; height:100%; padding:20px; resize:none; font-family:"NotoSansKR", sans-serif; vertical-align:top; background:#fff; border:1px solid #e6e6e6; color:#000; font-size:16px; font-weight:400; } #contents .commentIn .commentB{position:absolute; bottom:20px; right:20px; width:73px; height:36px; background:#29a2e8; font-size:18px; font-weight:300; text-align:center; line-height:35px;} #contents .commentIn .commentB span{position:relative; z-index:10; font-size:100%; color:#fff;} #contents .commentIn .commentB.focus span{color:#fff;} #contents .comment_info{width:95%; margin:0 auto 15px; font-size:0; } #contents .comment_info label{margin-right:10px; font-size:18px; vertical-align:middle; } #contents .comment_info img{vertical-align:middle; height:50px;} @media(max-width:1080px){ #contents .commentBox{margin-bottom:20px; padding:0 0;} #contents .commentIn {height:190px;} #contents .commentIn textarea{padding:15px; font-size:12px;} #contents .commentIn .commentB{bottom:10px; right:10px; min-width:60px; width:60px; height:35px; line-height:34px; font-size:13px;} } @media(max-width:640px){ #contents .comment_info span.box{display:block; margin:5px 0; } } /* 댓글리스트 */ #contents .commentListBox{width:100%;} #contents .commentList{width:100%; } #contents .commentList.depth_0 .commentIn{width:95%; height:77px; padding-bottom:25px; } #contents .commentList.depth_0 .commentIn .commentB{height:calc(100% - 25px); } #contents .commentList.depth_0 > dd{padding-top:40px;} #contents .commentList.depth_0 > dd:after, #contents .commentList.depth_0 > dd:before{display:none; } #contents .commentList.depth_1 > dd{padding-left:30px;} #contents .commentList.depth_2 > dd{padding-left:60px;} #contents .commentList.depth_3 > dd{padding-left:90px;} #contents .commentList.depth_4 > dd{padding-left:120px;} #contents .commentList.depth_5 > dd{padding-left:150px;} #contents .commentList > dd{position:relative; } #contents .commentList > dd:after{content:""; display:block; position:absolute; top:0; left:25px; width:calc(100% - 50px); height:1px; background-color: #ccc;} #contents .commentList > dd:before{content:""; display:block; position:absolute; top:50px; left:25px; width:calc(100% - 50px); height:1px; border-bottom:1px dotted #cecece;} #contents .commentList > dt{width:100%; background:#f5f5f5;} #contents .commentList dt{position:relative; padding:16px 220px 16px 30px;} #contents .commentList dt > span{display:block; } #contents .commentList dt span.writer{width:100%; color:#000; font-size:16px; /* font-weight:300; */ letter-spacing:-0.04rem;} #contents .commentList dt span.writer a {color:#000; font-size:16px; /* font-weight:300; */ } #contents .commentList dt span.writerBtn{position:absolute; top:10px; right:0; font-size:0; } #contents .commentList > dt span.writerBtn{right:20px;} #contents .commentList dt span.writerBtn a{display:inline-block; position:relative; padding:0 18px; font-size:14px; /* font-weight:100; */ } #contents .commentList dt span.writerBtn a:after{content:""; display:block; position:absolute; top:50%; right:0; width:1px; height:12px; margin-top:-6px; background:#d3d3d3;} #contents .commentList dt span.writerBtn a:last-child{padding-right:0;} #contents .commentList dt span.writerBtn a:last-child:after{display:none; } #contents .commentList dd{padding:0 30px 40px; /* color:#262626; */ color:#000; font-size:16px; /* font-weight:300; */ line-height:32px; } #contents .commentList dd p.incomm{font-size:16px; /* font-weight:300; */ line-height:20px;} #contents .commentList dd dl{padding-top:25px;} #contents .commentList dd dl dt{background-image:url("/template/1/type1/images/answer.png"); background-position: left 18px; background-repeat: no-repeat; } #contents .commentList dd dl dd{padding:20px 15px;} @media(max-width:1080px){ /* 댓글리스트 */ #contents .commentList.depth_0 .commentIn{height:66px; } #contents .commentList.depth_0 > dd{padding-top:20px;} #contents .commentList.depth_1 > dd{padding-left:20px;} #contents .commentList.depth_2 > dd{padding-left:24px;} #contents .commentList.depth_3 > dd{padding-left:28px;} #contents .commentList.depth_4 > dd{padding-left:32px;} #contents .commentList.depth_5 > dd{padding-left:34px;} #contents .commentList > dd:after{left:15px; width:calc(100% - 30px);} #contents .commentList > dd:before{top:56px; left:15px; width:calc(100% - 30px);} #contents .commentList dt{border-top:1px solid #e0e0e0; padding:10px 20px;} #contents .commentList dt span.writer{font-size:12px; } #contents .commentList dt span.writer a {font-size:12px;} #contents .commentList dt span.writerBtn{ text-align:right; } #contents .commentList > dt span.writerBtn{} #contents .commentList dt span.writerBtn a{padding:0 9px; font-size:11px;} #contents .commentList dt span.writerBtn a:after{height:12px; margin-top:-6px;} #contents .commentList dd{padding:0 20px 20px; font-size:12px;} #contents .commentList dd p.incomm{font-size:12px; line-height:18px;} #contents .commentList dd dl{padding-top:0;} #contents .commentList dd dl dt{background-position: left 12px; -webkit-background-size:10px; background-size:10px; } #contents .commentList dd dl dd{padding:10px;} } /* FAQ */ #contents dl.questionsList{width:100%;} #contents dl.questionsList dt{position:relative; width:100%; padding:26px 60px; font-size:18px; color:#666; cursor: pointer ; border-bottom:1px solid #e0e0e0; font-weight:300; } #contents dl.questionsList dt:before{content:"Q"; display:block; position:absolute; top:26px; left:30px; font-size:18px; font-weight:600; color:#29a2e8} #contents dl.questionsList dt:after{content:""; display:block; position:absolute; top:50%; right:30px; width:24px; height:12px; margin-top:-6px; background-image: url("/template/1/type1/images/faq_down.png"); background-position: center center; background-repeat: no-repeat; -webkit-background-size: 100%; background-size:100%;} #contents dl.questionsList dt.active {border-bottom:0;} #contents dl.questionsList dt.active:after{background-image:url("/template/1/type1/images/faq_up.png");} #contents dl.questionsList dt strong {color:#262626; font-weight:400;} #contents dl.questionsList dd{display:none; padding:40px 60px; font-size:18px; font-weight:300; line-height:30px; color:#666666; background:#f5f5f5; border-bottom:1px solid #e0e0e0; letter-spacing:-0.04rem;} #contents dl.questionsList .noticeBtnArea{margin-bottom:15px;} #contents dl.questionsList div.item{position:relative;} #contents dl.questionsList .payRadio{position:absolute;top:20px;left:0px;z-index:100; } @media(max-width:1080px){ /* FAQ */ #contents dl.questionsList {border-top:1px solid #e0e0e0;} #contents dl.questionsList dt{padding:27px 20px; font-size:14px; } #contents dl.questionsList dt:before{top:27px; left:0; font-size:14px; } #contents dl.questionsList dt:after{width:20px; height:10px; right:0;} #contents dl.questionsList dt span.num{ width:20px;} #contents dl.questionsList dd{padding:20px 15px; font-size:13px;} #contents dl.questionsList .noticeBtnArea{margin-bottom:0;} /* #contents dl.questionsList .payRadio{top:20px;} 확인후 작업 */ } /* 강의상세 */ #contents .lectureViewTop{width:100%; margin-bottom:60px; padding-top:60px; /* border-top:2px solid #000; */} #contents .lectureViewTop:after{content:""; display:block; clear:both;} #contents .lectureViewTop .box_left_video{position:relative; float:left; width:50%; } #contents .lectureViewTop .sampleVideo{position:relative; width:100%; margin-bottom:15px; padding-top:56%;} #contents .lectureViewTop .sampleVideo > img, #contents .lectureViewTop .sampleVideo > iframe{display:block; position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; object-fit:cover; } #contents .lectureViewTop .viewBuyInfo{float:right; width:48%; } #contents .viewBuyInfo .viewInfo{width:100%;} #contents .viewBuyInfo .viewInfo dt{width:100%; padding-bottom:25px; font-size:26px; border-bottom:1px solid #262626; color:#262626; font-weight:500; letter-spacing:-0.04rem;} #contents .viewBuyInfo .viewInfo dd{width:100%; padding:25px 0; } #contents .viewBuyInfo .viewInfo dd ul{position:relative; z-index:10; width:100%; height:auto; /*max-height:120px;*/ /*overflow-y:auto;*/ } #contents .viewBuyInfo .viewInfo dd ul > li{position:relative; color:#262626; font-size:16px; font-weight:300; } #contents .viewBuyInfo .viewInfo dd ul > li:last-child{margin-bottom:0 !important; } #contents .viewBuyInfo .viewInfo dd.texB{border-bottom:1px solid #e0e0e0;} #contents .viewBuyInfo .viewInfo dd.texB ul > li{margin-bottom:10px; padding-left:145px;} #contents .viewBuyInfo .viewInfo dd.texB ul > li span.tit{display:block; position:absolute; top:0; left:0; width:145px; font-size:100%; color:#666;} #contents .viewBuyInfo .viewInfo dd.priceB{padding:18px 0 25px; border-bottom:1px solid #e0e0e0;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li{margin-bottom:10px; } #contents .viewBuyInfo .viewInfo dd.priceB ul > li:after{content:""; display:block; clear:both; } #contents .viewBuyInfo .viewInfo dd.priceB label{display:inline-block; float:left; position:relative; padding-left:35px; font-size:100%; line-height:45px;} #contents .viewBuyInfo .viewInfo dd.priceB label .btn{top:50%; margin-top:-13px;} #contents .viewBuyInfo .viewInfo dd.priceB input[type="checkbox"]{position:absolute; top:6px; left:0; } #contents .viewBuyInfo .viewInfo span.price{display:inline-block; float:right; font-size:100%; color:#d50000; text-align:right;} #contents .viewBuyInfo .viewInfo span.price span.del{color:#666; font-size:16px; vertical-align:middle;} #contents .viewBuyInfo .viewInfo span.price span.member {color:#db0b37; font-size:22px; font-weight:500;vertical-align:middle;} #contents .viewBuyInfo .viewInfo span.price span.member_amount {color:#db0b37; font-size:28px; font-weight:600;vertical-align:middle;} #contents .viewBuyInfo .viewInfo span.price span.percent {color:#d4a320;vertical-align:middle;} #contents .viewBuyInfo .viewInfo .msg {padding-top:27px; color:#808080; font-size:16px; font-weight:300; text-align:right;} #contents .viewBuyInfo .viewInfo .msg strong {color:#29a2e8; font-weight:300;} #contents .viewBuyInfo .viewInfo dd.box_bookOtp{border-bottom:1px solid #ccc; } #contents .viewBuyInfo .viewInfo dd.box_bookOtp .obj_option{margin:0 0 14px 0; } #contents .viewBuyInfo .viewInfo dd.box_bookOtp .obj_option:after{content:""; display:block; clear:both; } #contents .viewBuyInfo .viewInfo dd.box_bookOtp .obj_option label{float:left; } #contents .viewBuyInfo .viewInfo dd.box_bookOtp .obj_option span.price{ color:#000;} #contents .viewBuyInfo .viewInfo dd.choice_opt{width:100%; padding:12px 20px 12px 40px; border-bottom:1px solid #ccc; } #contents .viewBuyInfo .viewInfo dd.choice_opt:after{content:""; display:block; clear:both; } #contents .viewBuyInfo .viewInfo dd.choice_opt > span{font-size:18px; font-weight:500; color:#000;} #contents .viewBuyInfo .viewInfo dd.choice_opt span.txt{float:left; } #contents .viewBuyInfo .viewInfo dd.choice_opt span.price{float:right; } #contents .viewBuyInfo .box_txt{width:100%; padding:25px 0; border-bottom:1px solid #e0e0e0;} #contents .viewBuyInfo .box_txt > li{position:relative; margin-bottom:10px; padding-left:85px; } #contents .viewBuyInfo .box_txt > li span.tit{display:block; position:absolute; top:0; left:0; width:80px; font-size:100%; } #contents .viewBuyInfo .box_txt > li .cap{font-size:14px; color:#666;} #contents .viewBuyInfo .box_txt > dl {position:relative; padding-left:145px;} #contents .viewBuyInfo .box_txt > dl dt {position:absolute; top:0; left:0; color:#666; font-size:16px; font-weight:300;} #contents .viewBuyInfo .box_txt > dl dd {color:#262626; font-size:16px; font-weight:300; line-height:26px; letter-spacing:-0.03rem;} #contents .viewBuyInfo .box_txt > dl dd .cap {color:#808080;} #contents .viewBuyInfo .allPrice{position:relative; width:100%; margin-bottom:4px; padding:33px 0; font-size:22px; font-weight:400;} #contents .viewBuyInfo .allPrice span.price{display:block; position:absolute; top:50%; right:0; width:100%; margin-top:-22px; padding-left:140px; font-size:34px; font-weight:600; color:#d50000; text-align:right; line-height:40px; } #contents .viewBuyInfo .allPrice span.price strong {font-size:22px; font-weight:500;} #contents .viewBuyInfo .allPrice .btn_del{position:absolute; top:20px; right:10px; } #contents .lectureViewTop .box_banner{font-size:0;} #contents .lectureViewTop .box_banner .obj_img{display:inline-block; width:calc(100% / 2 - 4.01px); margin-left:8px; } #contents .lectureViewTop .box_banner .obj_img:first-child{margin-left:0; } #contents .lectureViewTop .box_banner .obj_img img{display:block; width:100%; } @media(max-width:1080px){ /* 강의상세 */ #contents .lectureViewTop{margin-bottom:40px; padding-top:15px;} #contents .lectureViewTop .box_left_video{float:none; width:800px; max-width:100%; margin:0 auto 30px; } #contents .lectureViewTop .sampleVideo{padding-top:43%; } #contents .lectureViewTop .viewBuyInfo{float:none; width:100%; } #contents .viewBuyInfo .viewInfo dt{padding-bottom:10px; font-size:22px; } #contents .viewBuyInfo .viewInfo dd ul{max-height:inherit; overflow-y:inherit; } #contents .viewBuyInfo .viewInfo dd ul > li {font-size:13px;} #contents .viewBuyInfo .viewInfo dd {padding:20px 0;} #contents .viewBuyInfo .viewInfo dd.texB ul > li {padding-left:75px;} #contents .viewBuyInfo .viewInfo dd.texB ul > li span.tit {width:75px;} #contents .viewBuyInfo .viewInfo dd.priceB ul{min-height:inherit;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li{margin-bottom:15px; } #contents .viewBuyInfo .viewInfo span.price span.del{color:#666; font-size:16px; vertical-align:middle;} #contents .viewBuyInfo .viewInfo span.price span.member {color:#db0b37; font-size:13px; font-weight:500;vertical-align:middle;} #contents .viewBuyInfo .viewInfo span.price span.member_amount {color:#db0b37; font-size:17px; font-weight:600;vertical-align:middle;} #contents .viewBuyInfo .viewInfo span.price span.percent {color:#d4a320; font-size:12px; vertical-align:middle;} #contents .viewBuyInfo .box_txt{padding:20px 0; } #contents .viewBuyInfo .box_txt > li{padding-left:65px; font-size:13px; } #contents .viewBuyInfo .box_txt > li span.tit{width:60px;} #contents .viewBuyInfo .box_txt > li .cap{font-size:14px; color:#666;} #contents .viewBuyInfo .box_txt > dl {position:relative; padding-left:75px;} #contents .viewBuyInfo .box_txt > dl dt {font-size:13px;} #contents .viewBuyInfo .box_txt > dl dd {font-size:13px; line-height:18px;} #contents .viewBuyInfo .box_txt > dl dd .cap{padding-top:5px;} #contents .viewBuyInfo .allPrice{padding:16px 0 20px; font-size:20px; } #contents .viewBuyInfo .allPrice span.price{margin-top:-21px; font-size:24px; line-height:38px; } #contents .viewBuyInfo .allPrice span.price strong {font-size:13px; font-weight:500;} } @media(max-width:640px){ #contents .lectureViewTop{margin-bottom:30px;} #contents .lectureViewTop .box_left_video{width:100%; margin:0 auto 15px; } #contents .lectureViewTop .sampleVideo{padding-top:55%; } #contents .viewBuyInfo .viewInfo dd.texB ul > li{padding-left:68px;} #contents .viewBuyInfo .viewInfo dd.texB ul > li span.tit{width:65px;} #contents .viewBuyInfo .viewInfo dd.priceB {padding:25px 0 17px;} #contents .viewBuyInfo .viewInfo dd.priceB label{padding-left:28px; line-height:23px; margin-right:0;} #contents .viewBuyInfo .viewInfo dd.priceB label .btn{margin-top:-11px;} #contents .viewBuyInfo .viewInfo span.price {float:none; clear:both; width:100%; padding-left:28px; text-align:left;} #contents .viewBuyInfo .viewInfo .msg {padding-top:20px; font-size:12px;} #contents .viewBuyInfo .viewInfo dd.choice_opt{padding:12px 20px;} #contents .viewBuyInfo .viewInfo dd.choice_opt > span{font-size:15px;} #contents .viewBuyInfo .viewInfo dd.choice_opt > span{font-size:15px;} } /* 강의상세탭 */ #contents ul.viewTabs{width:100%; margin-left:1px; margin-bottom:20px; } #contents ul.viewTabs:after{content:""; display:block; clear:both;} #contents ul.viewTabs li{float:left; position:relative; z-index:100; display:table; width:calc(100% / 4 + 0.99px); margin-left:-1px; margin-bottom:-1px; border:1px solid #dbdbdb; } #contents ul.viewTabs li a{display:table-cell; position:relative; width:100%; height:60px; font-size:18px; color:#808080; font-weight:300; text-align:center; vertical-align:middle; background:#f7f7f7;} #contents ul.viewTabs.fixed li a{height:80px; } #contents ul.viewTabs li.active{z-index:110;} #contents ul.viewTabs li.active a{color:#29a2e8; font-weight:500; background:#fff;} #contents ul.viewTabs li.active a:after {display:block; position:absolute; top:-1px; left:-1px; width:calc(100% + 2px); height:3px; background:#29a2e8; content:'';} @media(max-width:1080px){ #contents ul.viewTabs li a{height:50px; font-size:16px;} } @media(max-width:640px){ #contents ul.viewTabs {position:relative; left:50%; width:calc(100% + 40px); -webkit-transform: translate(-50%,0); -moz-transform: translate(-50%,0); -ms-transform: translate(-50%,0); -o-transform: translate(-50%,0); transform: translate(-50%,0); } #contents ul.viewTabs li a{font-size:13px;} #contents ul.viewTabs.two li {width:50% !important;} } /* 강의상세내용 */ #contents .viewIn{position:relative; width:100%; min-height:350px; } #contents .viewIn2 {min-height:auto;} #contents .tabView{min-height:auto; } .viewIn > p > img{display:inline-block; width:auto !important; /* max-width:100%; */ } .landing_view img{position:relative; left:50%; width:auto !important; max-width:1920px; height:auto !important; -webkit-transform: translate(-50%,0); -moz-transform: translate(-50%,0); -ms-transform: translate(-50%,0); -o-transform: translate(-50%,0); transform: translate(-50%,0); } @media(max-width:1200px){ .landing_view img{max-width:160%; } } #contents .Introduce{width:calc(100% + 10px); margin-left:-10px; font-size:0; } #contents .Introduce > li{display:inline-block; *display:inline; *zoom:1; width:calc(100% / 4 - 10.01px); margin:0 0 20px 10px; border:1px solid #ccc; vertical-align:top; } #contents .Introduce > li:after{content:""; display:block; clear:both;} #contents .Introduce > li .imgD{width:100%; padding:12px; } #contents .Introduce > li .imgD a, #contents .Introduce > li .imgD img{display:block; width:100%; height:auto; } #contents .Introduce > li .infoD{width:100%; padding:12px; } #contents .Introduce > li .infoD strong{display:block; padding-bottom:10px; font-size:22px; font-weight:500; color:#006ec2;} #contents .Introduce > li .infoD a{display:block; padding-bottom:10px; font-size:22px; font-weight:500; color:#006ec2;} #contents .Introduce > li .infoD p.titCap{font-size:16px; font-weight:300; color:#666;} #contents .Introduce > li .infoD ul.book{position:relative; z-index:10; height:170px; margin:15px 0 0 0; overflow-y:auto;} #contents .Introduce > li .infoD ul.book li{position:relative; width:100%; font-size:16px; min-height:24px; margin-bottom:5px; padding-left:82px; } #contents .Introduce > li .infoD ul.book li span{display:block; position:absolute; top:0; left:0; width:68px; font-size:16px; font-weight:500; color:#0071d0; } #contents .Introduce > li .infoD ul.book li span:after{content:":"; display:block; position:absolute; top:0; right:-5px; font-size:16px; font-weight:500; color:#666;} #contents .Introduce > li .infoD .career{width:100%; max-height:72px; white-space:normal; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; } #contents .Introduce > li .infoD .career p{font-size:16px; color:#666; } @media(max-width:1080px){ #contents .Introduce > li{width:calc(100% / 3 - 10.01px); } #contents .Introduce > li .infoD{padding:0 15px 15px ;} #contents .Introduce > li .infoD strong{font-size:18px;} #contents .Introduce > li .infoD a{font-size:18px;} #contents .Introduce > li .infoD .career{max-height:62px;} #contents .Introduce > li .infoD .career p{font-size:14px; } } @media(max-width:640px){ #contents .Introduce > li{width:calc(100% / 2 - 10.01px); } #contents .Introduce > li .infoD strong{font-size:16px;} #contents .Introduce > li .infoD a{font-size:16px;} #contents .Introduce > li .infoD p.titCap{font-size:14px;} } @media(max-width:375px){ #contents .Introduce{width:100%; margin-left:0;} #contents .Introduce > li{width:100%; margin:0 0 10px 0; } } /* 교재상세 */ #contents .bookViewTop{width:100%; margin-bottom:120px; padding-top:60px;} #contents .bookViewTop:after{content:""; display:block; clear:both;} #contents .bookViewTop .sampleBook{position:relative; float:left; width:49%; padding-top:38%; text-align:center; border:1px solid #e6e6e6; } #contents .bookViewTop .sampleBook > img{display:block; position:absolute; top:0; right:0; bottom:0; left:0; width:auto; max-width:80%; height:auto; max-height:80%; margin:auto; object-fit:cover;} #contents .bookViewTop .bookBuyInfo{float:right; width:51%; padding-left:40px;} #contents .bookBuyInfo .viewInfo{width:100%;} #contents .bookBuyInfo .viewInfo dt{width:100%; padding-bottom:25px; font-size:26px; border-bottom:1px solid #262626; color:#262626; font-weight:500; letter-spacing:-0.04rem;} #contents .bookBuyInfo .viewInfo dd{width:100%; padding:25px 0; border-bottom:1px solid #e0e0e0;} #contents .bookBuyInfo .viewInfo dd .prc{font-size:16px;} #contents .bookBuyInfo .viewInfo dd .prc .cust {display:block; padding-bottom:10px; color:#666;} #contents .bookBuyInfo .viewInfo dd .prc ins{ background:none; font-size:22px; font-weight:500;} #contents .bookBuyInfo .viewInfo dd .prc ins span.bold{font-size:30px; font-weight:600; line-height:22px; vertical-align:-3px;} #contents .bookBuyInfo .viewInfo dd .prc .percent {color:#d4a320;} #contents .bookBuyInfo .viewInfo dd .prc .point {display:inline-block; position:relative; padding-left:14px; margin-left:14px; color:#29a2e8;} #contents .bookBuyInfo .viewInfo dd .prc .point:after {position:absolute; top:50%; left:0; width:1px; height:16px; margin-top:-8px; background:#e0e0e0; content:'';} #contents .bookBuyInfo .viewInfo dd ul{position:relative; z-index:10; width:100%; height:auto; /*max-height:120px;*/ /*overflow-y:auto;*/ } #contents .bookBuyInfo .viewInfo dd ul > li{position:relative; margin-bottom:10px; padding-left:145px; color:#262626; font-size:16px; font-weight:300; } #contents .bookBuyInfo .viewInfo dd ul > li:last-child{margin-bottom:0 !important; } #contents .bookBuyInfo .viewInfo dd ul > li span.tit{display:block; position:absolute; top:0; left:0; width:145px; font-size:100%; color:#666;} #contents .bookBuyInfo .viewInfo dd ul > li select {width:127px; height:30px; padding-left:10px; border-color:#e6e6e6; background:url('/template/1/type1/images/sArrow3.png') no-repeat right 10px center/11px 6px !important; font-size:16px; color:#262626;} #contents .bookBuyInfo .allPrice{position:relative; width:100%; margin-bottom:4px; padding:33px 0; font-size:22px; font-weight:400;} #contents .bookBuyInfo .allPrice span.price{display:block; position:absolute; top:50%; right:0; width:100%; margin-top:-22px; padding-left:140px; font-size:34px; font-weight:600; color:#d50000; text-align:right; line-height:40px; } #contents .bookBuyInfo .allPrice span.price strong {font-size:22px; font-weight:500;} #contents .viewIntro{width:100%; padding:30px; font-size:18px; line-height:40px; color:#333; background:#fff; border-top:1px solid #ccc; } #contents .viewIntro p img{display:inline-block; width:auto; max-width:100%; height:auto !important;} @media(max-width:1080px){ #contents .bookViewTop {padding-top:0; margin-bottom:30px;} #contents .bookViewTop .sampleBook{float:none; width:100%; height:300px; padding-top:0;} #contents .bookViewTop .sampleBook > img{max-width:100%; max-height:100%; } #contents .bookViewTop .bookBuyInfo{float:none; width:100%; padding:0;} #contents .bookBuyInfo .viewInfo dt{padding:25px 0 10px; font-size:22px; } #contents .bookBuyInfo .viewInfo dd {padding:20px 0;} #contents .bookBuyInfo .viewInfo dd .prc{font-size:12px;} #contents .bookBuyInfo .viewInfo dd .prc .cust {padding-bottom:5px; font-size:14px;} #contents .bookBuyInfo .viewInfo dd .prc ins{font-size:13px;} #contents .bookBuyInfo .viewInfo dd .prc ins span.bold{font-size:20px;} #contents .bookBuyInfo .viewInfo dd .prc .point {padding-left:10px; margin-left:10px;} #contents .bookBuyInfo .viewInfo dd ul{height:auto; overflow-y:inherit; } #contents .bookBuyInfo .viewInfo dd ul li{padding-left:75px; font-size:13px;} #contents .bookBuyInfo .viewInfo dd ul li ins span.bold{font-size:25px; line-height:22px; vertical-align:-3px;} #contents .bookBuyInfo .viewInfo dd ul > li span.tit {width:75px;} #contents .bookBuyInfo .viewInfo dd ul > li select {width:105px; height:30px; font-size:13px;} #contents .bookBuyInfo .allPrice{padding:16px 0 20px; font-size:20px; } #contents .bookBuyInfo .allPrice span.price{margin-top:-21px; font-size:24px; line-height:38px; } #contents .bookBuyInfo .allPrice span.price strong {font-size:13px; font-weight:500;} } @media(max-width:640px){ #contents .bookViewTop{margin-bottom:20px;} #contents .bookBuyInfo .viewInfo dd ul > li{font-size:14px;} #contents .bookBuyInfo .viewInfo dd ul li ins span.bold{font-size:22px;} #contents .bookBuyInfo .viewInfo .m_block{margin-top:5px; } } /* 영상후기 / 무료강의 */ #contents .videoTop{width:100%; margin-bottom:52px; padding:52px 0; border-top:1px solid #ccc; border-bottom:1px solid #ccc; } #contents .bigVideo{position:relative; width:90%; margin:0 auto; padding-top:55%; border:1px solid #ccc; } #contents .bigVideo iframe{position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; object-fir:cover;} #contents .bigVideo a{display:block; position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; object-fir:cover;} #contents .bigVideo a > img{display:block; width:100%; position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; object-fir:cover;} #contents ul.videoThum{width:calc(100% + 16px); margin-left:-16px;} #contents ul.videoThum:after{content:""; display:block; clear:both;} #contents ul.videoThum li{float:left; width:calc(100% / 4 - 16.01px); margin:0 0 25px 16px;} #contents ul.videoThum li > div > a, #contents ul.videoThum li > div > a > img{/*display:block; width:100%;*/} /*#contents ul.videoThum li > div > a > img{display:block; width:100%;}*/ #contents ul.videoThum li .videoMove{width:100%; margin-bottom:10px; border:1px solid #ccc;} #contents ul.videoThum li .videoMove a{display:block; position:relative; padding-top:60%; } #contents ul.videoThum li .videoMove a img{display:block; position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; object-fit:cover;} #contents ul.videoThum li .viewMove{position:relative;} #contents ul.videoThum li .viewMove span.payRadio{position:absolute;top:-40px;left:3px;} #contents ul.videoThum li .viewMove a{display:block; width:auto; max-width:95%; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} #contents ul.videoThum li .viewMove input[type="checkbox"]{margin-right:5px; } @media(max-width:1080px){ /* 영상후기 / 무료강의 */ #contents .videoTop{margin-bottom:30px; padding:25px 0;} #contents .bigVideo{width:60%; padding-top:40%} } @media(max-width:640px){ /* 영상후기 / 무료강의 */ #contents .videoTop{margin-bottom:20px; padding:15px 0;} #contents .bigVideo{width:68%; padding-top:40%} #contents ul.videoThum li{width:calc(100% / 2 - 16.01px);} #contents ul.videoThum li .viewMove a{font-size:14px;} } /* 교재리스트 */ #contents .bookList{width:calc(100% + 10px); margin-left:-10px; margin-bottom:30px; font-size:0; } #contents .bookList > li{display:inline-block; *display:inline; *zoom:1; width:calc(100% / 4 - 10.01px); margin:0 0 15px 10px; vertical-align:top; border:1px solid #e6e6e6; } #contents .bookList > li .imgD{width:100%; padding:10px; text-align:center;} #contents .bookList > li .imgD a{position:relative; display:block; width:95%; margin:0 auto; padding-top:80%; vertical-align:middle; } #contents .bookList > li .imgD img{display:block; position:absolute; top:0; right:0; bottom:0; left:0; width:auto; max-width:100%; height:auto; max-height:100%; margin:auto; object-fit:cover;} #contents .bookList > li .infoD{width:100%; padding:15px 20px 10px; } #contents .bookList > li .infoD strong{display:block; width:98%; padding-bottom:2px; font-size:18px; font-weight:500; color:#262626; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; } #contents .bookList > li .infoD p.titCap{width:98%; font-size:14px; font-weight:300; color:#666; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; } #contents .bookList > li .infoD ul.book{position:relative; z-index:10; margin:15px 0 0 0; } #contents .bookList > li .infoD ul.book li{position:relative; width:100%; min-height:20px; margin-bottom:5px; padding-left:70px; font-size:14px; color:#666; } #contents .bookList > li .infoD ul.book li span{display:block; position:absolute; top:0; left:0; width:56px; font-size:14px; font-weight:500; } #contents .bookList > li .infoD ul.book li span:after{content:":"; display:block; position:absolute; top:0; right:-5px; font-size:14px; font-weight:500; color:#666;} #contents .bookList > li .priceD{width:100%; padding:0 20px 15px 20px; } #contents .bookList > li .priceD .price{overflow:hidden; width:100%; text-align:right; } #contents .bookList > li .priceD .price .cust {float:left; margin-top:10px;} #contents .bookList > li .priceD .price .cust del{display:inline-block; font-size:14px; font-weight:300; color:#666;} #contents .bookList > li .priceD .price ins{float:right; display:block; font-size:15px; font-weight:500; color:#db0b37; background:none;} #contents .bookList > li .priceD .price ins > span{font-size:24px; font-weight:600;} @media(max-width:1080px){ #contents .bookList > li{width:calc(100% / 3 - 10.01px);} #contents .bookList > li .infoD strong{font-size:15px;} #contents .bookList > li .infoD p.titCap{font-size:12px;} #contents .bookList > li .priceD .price del{font-size:13px;} #contents .bookList > li .priceD .price ins{font-size:14px;} #contents .bookList > li .priceD .price ins > span{font-size:20px; } } @media(max-width:640px){ #contents .bookList > li{width:calc(100% / 2 - 10.01px);} #contents .bookList > li .infoD{padding:10px; } #contents .bookList > li .priceD{padding:0 10px 10px 10px;} #contents .bookList > li .priceD .price {text-align:left;} #contents .bookList > li .priceD .price .cust {float:none; display:block; margin:0;} #contents .bookList > li .priceD .price del{font-size:12px;} #contents .bookList > li .priceD .price ins{float:none; font-size:13px;} #contents .bookList > li .priceD .price ins > span{font-size:18px; } } @media(max-width:375px){ #contents .bookList{width:calc(100% + 10px); margin-left:-10px; } #contents .bookList > li .imgD a{padding-top:65%;} } /* 선생님소개 */ #contents .teacherinfoBox{position:relative; width:100%; padding:85px 0 0 0; } #contents .teacherinfoBox .infoBox{width:100%; padding:30px 250px 0 70px; background:url("/template/1/type1/images/teacdot.gif") 0 0 repeat; } #contents .teacherinfoBox .word{font-size:35px; } #contents .teacherinfoBox dl.teachCareer{padding:40px 0 0 0;} #contents .teacherinfoBox dl.teachCareer dt{padding-bottom:32px; font-size:26px; font-weight:600; } #contents .teacherinfoBox dl.teachCareer dd{padding-bottom:70px; font-size:18px; line-height:28px; color:#666; } #contents .teacherinfoBox .imgBox{position:absolute; top:0; right:-100px; } #contents .teacherinfoBox .imgBox img{display:block; width:100%; } #contents .teacherinfoBox .imgBox:before{content:""; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.4); opacity:1; -webkit-transition: all .8s; -moz-transition: all .8s; -ms-transition: all .8s; -o-transition: all .8s; transition: all .8s; } #contents .teacherinfoBox:hover .imgBox:before{height:0; opacity:0;} #contents .teacherinfoBox.right{padding-left:275px;} #contents .teacherinfoBox.right .infoBox{padding:30px 0 0 250px; } #contents .teacherinfoBox.right .imgBox{right:auto; left:-100px;} @media(max-width:1080px){ #contents .teacherinfoBox{padding:85px 15px 0 0; } #contents .teacherinfoBox .infoBox{padding:35px 350px 35px 35px; } #contents .teacherinfoBox .word{font-size:20px; } #contents .teacherinfoBox dl.teachCareer{padding:20px 0 0 0;} #contents .teacherinfoBox dl.teachCareer dt{padding-bottom:15px; font-size:20px; } #contents .teacherinfoBox dl.teachCareer dd{padding-bottom:40px; font-size:16px; } #contents .teacherinfoBox .imgBox{right:0; width:350px;} #contents .teacherinfoBox.right{padding-left:0;} #contents .teacherinfoBox.right .infoBox{padding:35px 350px 35px 35px; } #contents .teacherinfoBox.right .imgBox{left:auto; right:0; } } @media(max-width:800px){ #contents .teacherinfoBox{padding:420px 0 0 0;} #contents .teacherinfoBox .infoBox{padding:25px 0; background: none;} #contents .teacherinfoBox.right .infoBox{padding:25px 0; } #contents .teacherinfoBox .word{font-size:18px; } #contents .teacherinfoBox dl.teachCareer{padding:15px 0 0 0;} #contents .teacherinfoBox dl.teachCareer dt{padding-bottom:10px; font-size:18px; } #contents .teacherinfoBox dl.teachCareer dd{padding-bottom:15px; font-size:14px; line-height:24px;} #contents .teacherinfoBox .imgBox{top:-10px; left:50%; right:auto; width:300px; max-width:100%; -webkit-transform: translate3d(-50%, 0, 0); -moz-transform: translate3d(-50%, 0, 0); -ms-transform: translate3d(-50%, 0, 0); -o-transform: translate3d(-50%, 0, 0); transform: translate3d(-50%, 0, 0); } #contents .teacherinfoBox.right .imgBox{left:50%; } } @media(max-width:640px){ #contents .teacherinfoBox dl.teachCareer dt{font-size:16px; } } /* 강의 */ #contents .lectureList{width:100%; margin-bottom:35px;} #contents .lectureList.view{margin-top:20px;} #contents .lectureList > ul{width:calc(100% + 10px); margin-left:-10px; font-size:0;} #contents .lectureList > ul > li{position:relative; display:inline-block; *display:inline; *zoom:1; width:calc(100% / 3 - 10.01px); margin:0 0 30px 10px; vertical-align:top; } #contents .lectureList > ul > li .topBan{position:relative; width:100%; } #contents .lectureList > ul > li .topBan > a {display:block; position:relative; width:100%; padding-top:56%;} #contents .lectureList > ul > li .topBan > a img{display:block; position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; object-fit:cover; } #contents .lectureList > ul > li .topBan .overBtn{position:absolute; bottom:19px; left:0; font-size:0; width:100%; text-align:center; opacity:0; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } #contents .lectureList > ul > li:hover .overBtn{opacity:1; } #contents .lectureList > ul > li .topBan .overBtn a{display:inline-block; position:relative; top:0; width:170px; max-width:45%; height:50px; margin:0 2.5px; font-size:18px; font-weight:500; color:#fff; line-height:48px; text-align:center; vertical-align:top;} #contents .lectureList > ul > li .topBan .overBtn a:hover{top:-5px;} #contents .lectureList > ul > li .botInfo{width:100%; padding:24px 20px; border:1px solid #e6e6e6; } #contents .lectureList > ul > li .botInfo strong.title{display:block; width:95%; margin-bottom:5px; font-size:20px; font-weight:500; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} #contents .lectureList > ul > li .botInfo p.texS{width:95%; padding-bottom:8px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} #contents .lectureList > ul > li .botInfo .box_condition{padding-bottom:10px;} #contents .lectureList > ul > li .botInfo .confiB{position:relative; z-index:10; width:100%; height:120px; margin-bottom:25px; font-size:16px; color:#666; overflow-y:auto; } #contents .lectureList > ul > li .botInfo .markA{margin-bottom:25px;} .markA{width:100%; font-size:0; } .markA span{display:inline-block; margin-right:5px; padding:0 8px; font-size:16px; color:#fff; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .markA span.col1{background-color:#0995dd;} .markA span.col2{background-color:#092795;} #contents .lectureList > ul > li .botInfo .priceB{width:100%; padding:15px 0 0 0; /* border-top:1px solid #e0e0e0; */} #contents .lectureList > ul > li .botInfo .priceB:after{content:""; display:block; clear:both;} #contents .lectureList > ul > li .botInfo .priceB .more_link{display:inline-block; padding:2px 8px; font-size:14px; font-weight:500; color:#fff; background-color: #69AAEC; vertical-align:-21px; } #contents .lectureList > ul > li .botInfo .priceB span.txt{float:left; font-size:16px; font-weight:500; } #contents .lectureList > ul > li .botInfo .priceB span.price{float:right;} #contents .lectureList > ul > li .botInfo .priceB span.price del{padding-right:5px; font-size:15px; font-weight:100; } #contents .lectureList > ul > li .botInfo .priceB span.price ins{font-size:20px; font-weight:500; color:#db0b37; background:none;} .texS{font-size:16px; font-weight:300;} @media(max-width:1080px){ #contents .lectureList > ul > li .botInfo{padding:15px;} #contents .lectureList > ul > li .botInfo strong.title{font-size:18px;} #contents .lectureList > ul > li .botInfo .priceB > span{display:block; } #contents .lectureList > ul > li .botInfo .priceB span.txt{float:none; width:100%; font-size:16px; font-weight:500; } #contents .lectureList > ul > li .botInfo .priceB span.price{float:none; width:100%; text-align:right; } #contents .lectureList > ul > li .botInfo .priceB span.price del{ font-size:14px;} #contents .lectureList > ul > li .botInfo .priceB span.price ins{font-size:18px;} .texS{font-size:14px;} } @media(max-width:800px){ #contents .lectureList > ul > li .botInfo .priceB{position:relative; } #contents .lectureList > ul > li .botInfo .priceB span.price del{position:absolute; top:0; right:0; } } @media(max-width:640px){ #contents .lectureList > ul > li{width:calc(100% / 2 - 10.01px); } #contents .lectureList > ul > li .botInfo strong.title{font-size:16px;} #contents .lectureList > ul > li .botInfo .priceB span.txt{font-size:14px;} #contents .lectureList > ul > li .botInfo .priceB span.price del{ font-size:13px;} #contents .lectureList > ul > li .botInfo .priceB span.price ins{font-size:18px;} } @media(max-width:375px){ #contents .lectureList > ul{width:100%; margin-left:0; } } #contents .lectureList.my > ul > li .topBan .prog {display:block; position:absolute; bottom:0; left:0; width:100%; height:4px; background:rgba(0,0,0,.7);} #contents .lectureList.my > ul > li .topBan .prog span {display:block; position:absolute; top:0; left:0; height:4px; background:#db0b37;} #contents .lectureList.my > ul > li .botInfo {position:relative;} #contents .lectureList.my > ul > li .botInfo strong.title {width:calc(100% - 60px); color:#262626; font-size:18px; margin:0;} #contents .lectureList.my > ul > li .botInfo .process {position:absolute; top:50%; right:20px; margin-top:-11px; padding-left:26px; color:#666; font-size:16px; font-weight:600; background:url('/template/1/images/trophy.png') no-repeat left center/19px auto;} @media(max-width:1080px){ #contents .lectureList.my > ul > li {width:calc(100% / 2 - 10.01px);} #contents .lectureList.my > ul > li .botInfo .process {right:15px; padding-left:17px; font-size:15px; background-size:12.5px auto;} } @media(max-width:640px){ #contents .lectureList.my > ul {width:100%; margin:0;} #contents .lectureList.my > ul > li {display:block; width:100%; margin:0 0 20px;} } /* step */ #contents .stepArea{position:relative; width:100vw; margin-left:calc(-50vw + 50%); margin-bottom:110px; padding:64px 0 0 0; } #contents .stepArea:before{content:""; display:block; position:absolute; top:94px; left:0; width:100%; height:1px; background:#000;} #contents .stepArea:after{content:""; display:block; position:absolute; top:14px; left:0; width:100%; height:80px; background:#f8f8f8;} #contents .stepArea .stepIn{width:100%; max-width:1180px; margin:0 auto;} #contents .stepArea .stepIn:after{content:""; display:block; clear:both;} #contents .stepArea .stepIn li{position:relative; z-index:100; float:left; width:calc(100% / 3 - 0.1px); font-size:16px; text-align:center; } #contents .stepArea .stepIn.step5 li{width:20%;} #contents .stepArea .stepIn li span.num{display:block; width:60px; height:60px; margin:0 auto 8px; font-size:20px; font-weight:600; color:#fff; line-height:60px; background:#000; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px; } #contents .stepArea li.active{color:#db0b37;} #contents .stepArea li.active span.num{background:#db0b37;} @media(max-width:1080px){ #contents .stepArea{margin-bottom:60px; padding:0; } #contents .stepArea:before{top:32px;} #contents .stepArea:after{display:none; } } @media(max-width:640px){ #contents .stepArea{margin-bottom:30px; } #contents .stepArea:before{top:24px;} #contents .stepArea .stepIn li{font-size:0;} #contents .stepArea .stepIn li span.num{width:46px; height:46px; font-size:15px; line-height:46px; -webkit-border-radius:23px; -moz-border-radius:23px; border-radius:23px; } } /* 장바구니/결제진행 */ #contents .paymentArea{position:relative; width:100%; min-height:850px; padding-right:420px; } #contents .choice{width:100%; margin:15px 0 0 0; font-size:16px; font-weight:500; } #contents .choice a{display:inline-block; width:60px; height:30px; margin-left:10px; font-size:12px; font-weight:500; line-height:28px; text-align:center; background:#fff; border:1px solid #000; } #contents .choice span{display:inline-block; padding-left:15px; font-size:14px; font-weight:300; color:#666;} #contents .paymentBox{position:absolute; top:0; right:0; z-index:100; width:380px; padding:20px 35px 35px 35px; background:#fff; border:5px solid #ccc; } #contents .paymentBox.move{position:fixed;} #contents .paymentBox > p.tit{padding-bottom:15px; font-size:24px; font-weight:500; border-bottom:1px solid #000; } #contents .paymentBox ul.payment{width:100%; min-height:90px;} #contents .paymentBox ul.payment li{width:100%; padding:14px 0; border-bottom:1px solid #ccc; } #contents .paymentBox ul.payment li:after{content:""; display:block; clear:both; } #contents .paymentBox ul.payment li > span{font-size:16px; font-weight:300; } #contents .paymentBox ul.payment li span.tit{float:left; margin-right:10px; padding-top:6px;} #contents .paymentBox ul.payment li span.val{float:right; text-align:right;} #contents .paymentBox ul.payment li span.val b{font-size:24px; } #contents .paymentBox .bottomA{width:100%; margin-top:60px; } #contents .paymentBox .bottomA .payPrice{width:100%;} #contents .paymentBox .bottomA .payPrice:after{content:""; display:block; clear:both;} #contents .paymentBox .bottomA .payPrice span{font-size:16px;} #contents .paymentBox .bottomA .payPrice span.tit{float:left; padding-top:12px; font-weight:600; } #contents .paymentBox .bottomA .payPrice span.val{float:right; color:#db0b37;} #contents .paymentBox .bottomA .payPrice span.val b{font-size:30px;} #contents .paymentBox .bottomA .payPrice span.val b span{font-size:100%;} #contents .paymentBox .bottomA .payB{width:100%; margin-top:30px;} #contents .paymentBox .bottomA .payB a{float:left; width:calc(100%/ 2 - 5px); margin-right:10px; margin-bottom:10px;} #contents .paymentBox .bottomA .payB a{} #contents .paymentBox .bottomA .payB a:last-child{margin-bottom:0; margin-right:0; } #contents .couponChoice{position:relative; width:220px;} #contents .couponChoice.inB{padding-right:54px;} #contents .mileage{position:relative; width:220px; padding-right:15px; background:#fff; border:1px solid #ccc; }/* padding-right:115px; 추후수정 */ #contents .mileage #od_temp_point{position:absolute; bottom:0; left:-80px; } #contents .mileage .placeH{position:absolute; top:0; right:50px; left:auto; font-size:16px; color:#666; line-height:50px;} #contents .mileage input[type="text"]{padding-left:5px; font-size:20px; font-weight:600; text-align:right; border:none;} @media(max-width:1080px){ #contents .choice span{display:block; padding-left:0; font-size:13px;} #contents .paymentArea{padding-right:0; min-height:auto;} #contents .paymentBox{position:relative; width:100%; margin:45px 0 0 0; padding:20px; } #contents .paymentBox > p.tit{padding-bottom:10px; font-size:20px; } #contents .paymentBox ul.payment li{padding:10px 0;} #contents .paymentBox ul.payment li.m_val_in span.val{width:450px;} #contents .couponChoice{width:100%;} #contents .couponChoice.inB{padding-right:54px;} #contents .paymentBox .bottomA{margin-top:30px; } #contents .paymentBox .bottomA .payB{width:calc(100% + 50px); margin:10px 0 -25px -25px;} #contents .paymentBox .bottomA .payB:after{content:""; display:block; clear:both; } #contents .paymentBox .bottomA .payB a{width:calc(100% / 2 - 0.01px); margin-right:0; margin-bottom:0;} #contents .paymentBox .bottomA .payB a.full{float:none; width:100%;} #contents .mileage{width:100%; } #contents .mileage #od_temp_point{bottom:-18px; left:0; } } @media(max-width:640px){ #contents .paymentBox{margin:25px 0 0 0; padding:15px; } #contents .paymentBox ul.payment li > span{font-size:14px;} #contents .paymentBox ul.payment li.m_val_in span.tit{float:none; } #contents .paymentBox ul.payment li.m_val_in span.val{display:block; float:none; width:100%; margin:5px 0 0 0; } #contents .paymentBox ul.payment li span.val b{font-size:20px;} #contents .paymentBox .bottomA .payPrice span.val b{font-size:24px;} #contents .couponChoice.inB{padding-right:85px;} #contents .paymentBox ul.payment li .couponChoice select.basicS{height:40px; font-size:14px; } #contents .paymentBox ul.payment li .couponChoice .payCouoBtn{width:85px; height:40px; padding:4px 0; font-size:14px; line-height:16px; } #contents .paymentBox .bottomA .payB{width:calc(100% + 40px); margin:10px 0 -20px -20px;} #contents .mileage input[type="text"]{font-size:16px;} } /* 환불팝업 */ .refund_bank{font-size:0 !important; } .refund_bank select{width:calc(100% / 3 - 3.51px); margin-right:5px;} .refund_bank input[type="text"]{width:calc(100% / 3 - 3.51px); margin-right:5px;} .refund_bank input[type="text"]:last-child{margin-right:0; } @media(max-width:640px){ .refund_bank select{width:100%; margin-right:0; margin-bottom:5px; } .refund_bank input[type="text"]{width:calc(100% / 2 - 2.51px); } .refund_bank input[type="text"]:last-child{margin-right:0; } } /* 이벤트 */ #contents ul.evevtList{margin-top:40px; font-size:0; margin-left:-20px;} #contents ul.evevtList > li{display:inline-block; position:relative; width:33.33%; padding-left:20px; margin-bottom:40px;} #contents ul.evevtList > li > input[type="checkbox"]{position:absolute; top:25px; left:20px;} #contents ul.evevtList > li > a{display:block; width:100%; } #contents ul.evevtList > li:after{content:""; display:block; clear:both;} #contents ul.evevtList > li .banIn{position:relative; width:100%;} #contents ul.evevtList > li .banIn img{width:100%; height:auto;} #contents ul.evevtList > li .txtIn{position:relative; z-index:1; margin-top:-12px; padding:0 20px;} #contents ul.evevtList > li p.title{padding:15px 0 10px; font-size:22px; color:#262626; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} #contents ul.evevtList > li p.day{font-size:14px; color:#666; } #contents ul.evevtList.end > li .banIn:after{display:none; content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:url("/template/1/type1/images/endEvent.png") center center no-repeat; -webkit-background-size: cover; background-size:cover;} #ui-datepicker-div .ui-datepicker-month{position:absolute; top:8px; right:38px; } .calendB{position:relative; display:inline-block; margin-right:15px; } .calendB > .ui-datepicker-trigger{position:absolute; top:50%; right:8px; margin-top:-12px;} @media(max-width:1080px){ #contents ul.evevtList > li{width:50%;} #contents ul.evevtList > li > input[type="checkbox"]{top:15px; left:8px;} #contents ul.evevtList > li p.title{font-size:18px;} #contents ul.evevtList > li p.title{padding:10px 0 5px; font-size:20px;} #contents ul.evevtList > li p.day{font-size:16px; color:#666; } #ui-datepicker-div{width:310px;} #ui-datepicker-div .ui-datepicker-month{width:45.5%;} .calendB > .ui-datepicker-trigger{width:22px; margin-top:-10px; } .calend_box{display:block; width:100%; } } @media(max-width:640px){ #contents ul.evevtList {margin-left:0;} #contents ul.evevtList > li{width:100%; padding:0; margin-bottom:30px;} #contents ul.evevtList > li .banIn{float:none; width:100%; padding-top:0; } #contents ul.evevtList > li .banIn img{position: relative; width:100%; height:auto; object-fit:inherit;} #contents ul.evevtList.end > li .banIn:before{content:"종료"; position:absolute; top:50%; left:50%; z-index:10; font-size:32px; font-weight:500; color:#fff; -webkit-transform: rotate(-35deg) translate3d(-50%, -50%, 0); -moz-transform:rotate(-35deg) translate3d(-50%, -50%, 0); -ms-transform:rotate(-35deg) translate3d(-50%, -50%, 0); -o-transform: rotate(-35deg) translate3d(-50%, -50%, 0); transform: rotate(-35deg) translate3d(-50%, -50%, 0); transform-origin: 0 0; } #contents ul.evevtList.end > li .banIn:after{background:rgba(0,0,0,0.7);} #ui-datepicker-div{width:290px;} #ui-datepicker-div .ui-datepicker-month{width:41.7%;} .calend_box .m_block{height:5px; } .calend_box input.w150{width:180px;} .calend_box select{vertical-align:middle; } .calend_box select.basicS{width:180px;} } /* 오시는길 */ #contents .mapInfo{width:100%; margin-top:45px; padding-top:30px; border-top:1px solid #ccc; } #contents .mapInfo:after{content:""; display:block; clear:both;} #contents .mapT{float:left; width:50%; } #contents .mapT li{position:relative; width:100%; margin-bottom:8px; padding-left:65px; font-size:18px; font-weight:300;} #contents .mapT li b{position:absolute; top:0; left:0; width:60px; } #contents .tel{float:right; width:40%; font-size:18px; } #contents .tel span{padding-left:10px; font-size:50px; font-weight:600; word-wrap: break-word;} @media(max-width:830px){ #contents .mapT{float:none; width:100%; padding-bottom:15px; } #contents .tel{float:none; width:100%;} } @media(max-width:640px){ .map_iframe{height:320px;} #contents .mapInfo{margin-top:25px; padding-top:15px; } #contents .mapT{float:none; width:100%; padding-bottom:15px; } #contents .mapT li{padding-left:50px; font-size:14px;} #contents .mapT li b{width:50px; } #contents .tel{float:none; width:100%; font-size:14px; } #contents .tel span{font-size:30px;} } /* 페이징 */ .pager{width:100%; margin:30px 0 45px; font-size:0; text-align:center; } .pager span {display:inline-block; } .pager a {display:inline-block; width:28px; height:28px; margin:0 13px; border-radius:50%; background:#fff; font-size:18px; font-weight:300; color:#666666; line-height:27px;} .pager strong {display:inline-block; width:28px; height:28px; margin:0 13px; font-size:18px; font-weight:400; border-radius:50%; background:#29a2e8; color:#fff; line-height:27px;} .pager img {width:28px; height:auto;} @media(max-width:1080px){ .pager a {width:20px; height:20px;font-size:13px; margin:0 10px; line-height:20px;} .pager strong {width:20px; height:20px; margin:0 13px; font-size:13px; line-height:20px;} .pager img {width:20px; height:auto;} } .pager2{width:100%; margin-bottom:45px; font-size:0; text-align:center; } /* .pager span{display:inline-block; } */ .pager2 a{display:inline-block; margin:0 8px; font-size:16px; font-weight:300; vertical-align:middle;} .pager2 #jsPagePrev{width:28px; height:28px; font-size:0; vertical-align:12px; background:url("/template/1/type1/images/pPrev.gif") 0 0 no-repeat;} .pager2 #jsPageNext{width:28px; height:28px; font-size:0; vertical-align:12px; background:url("/template/1/type1/images/pNext.gif") 0 0 no-repeat;} .pager2 .active{display:inline-block; position:relative; padding:0 8px; font-size:20px; font-weight:600; color:#f02424; } .pager2 .active:after{content:""; display:block; position:absolute; bottom:-5px; left:0; width:100%; height:1px; background:#f02424;} .popWrap{width:500px;} /* 상태아이콘 */ .condition{padding:3px 10px; font-size:14px; font-weight:400; color:#fff; } .condition.conIco1{background:#db0b37;} .condition.conIco2{background:#006ec2;} .condition.conIco3{background:#29a2e8;} ul.snsConnect{width:100%; margin-top:14px; background:#fff; border:1px solid #ccc; border-top:3px solid #000; } ul.snsConnect li{position:relative; width:100%; padding:15px 15px 15px 120px; border-bottom:1px solid #ccc; } ul.snsConnect li span.tit{position:absolute; top:15px; left:15px; width:80px;} ul.snsConnect li span.tit a, ul.snsConnect li span.tit img{display:block; width:100%; } ul.snsConnect li .caption{font-size:14px;} .fancybox-wrap{max-width:90%; } .fancybox-inner{max-width:100%; /* height:auto !important; */ } .agree_info{width:100%; max-width:557px; padding:50px 38px; } .agree_info > h1{padding-bottom:25px; font-size:26px; font-weight:400; } .agree_info .infoin{position:relative; z-index:10; width:100%; height:400px; padding:15px; border:1px solid #ccc; overflow-y:auto; } .agree_info .infoin img{display:inline-block; width:auto; max-width:100%;} @media(max-width:640px){ ul.snsConnect{margin-top:10px;} ul.snsConnect li{padding:10px 10px 10px 90px; font-size:14px;} ul.snsConnect li span.tit{top:12px; left:10px; width:65px; } ul.snsConnect li .caption{font-size:13px;} .agree_info{max-width:100%; padding:30px 15px; } .agree_info > h1{padding-bottom:18px; font-size:20px;} .agree_info .infoin{height:300px; padding:10px; } } /*Css pattern By Kang .191002*/ .mt20{margin-top:20px;} .mt30{margin-top:30px;} .mt40{margin-top:40px;} .mt50{margin-top:50px;} .mt60{margin-top:60px;} .mt70{margin-top:70px;} .mt80{margin-top:80px;} .mt90{margin-top:90px;} .mt100{margin-top:100px;} .borerColr1{border-color:#db0b37 !important;} .borerColr2{border-color:#006ec2 !important;} .borerColr3{border-color:#0071d0 !important;} .borerColr4{border-color:#ff7200 !important;} .boderw1{border-top-width:1px;border-bottom-width:1px;border-left-width:1px;border-right-width:1px;} .boderw2{border-top-width:2px;border-bottom-width:2px;border-left-width:2px;border-right-width:2px;} .boderw3{border-top-width:3px;border-bottom-width:3px;border-left-width:3px;border-right-width:3px;} .boderw4{border-top-width:4px;border-bottom-width:4px;border-left-width:4px;border-right-width:4px;} .boderw5{border-top-width:5px;border-bottom-width:5px;border-left-width:5px;border-right-width:5px;} .boderwT{border-top-style:solid !important;border-bottom-style:none !important;border-left-style:none !important;border-right-style:none !important;} .boderwB{border-top-style:none !important;border-bottom-style:solid !important;border-left-style:none !important;border-right-style:none !important;} .boderwL{border-top-style:none !important;border-bottom-style:none !important;border-left-style:solid !important;border-right-style:none !important;} .boderwR{border-top-style:none !important;border-bottom-style:none !important;border-left-style:none !important;border-right-style:solid !important;} .boderwA{border-top-style:solid !important;border-bottom-style:solid !important;border-left-style:solid !important;border-right-style:solid !important;} .wp100{width:100%} .wp90{width:90%} .wp80{width:80%} .wp70{width:70%} .wp60{width:60%} .wp50{width:50%} .wp40{width:40%} .wp30{width:30%} .wp20{width:20%} .wp10{width:10%} /* 수료증 */ .certificateArea{width:800px; margin:0 auto; padding:49px; border:1px solid #ccc; -webkit-box-sizing: border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .certificateArea .logo_bg{position:absolute; top:52%; left:50%; -webkit-transform: translate3d(-50%,-50%,0); -moz-transform: translate3d(-50%,-50%,0); -ms-transform: translate3d(-50%,-50%,0); -o-transform: translate3d(-50%,-50%,0); transform: translate3d(-50%,-50%,0); } .certificateArea .certi_line_bg{position:absolute; top:50%; left:50%; margin:-450px 0 0 -350px} .certificateArea .certificateBox{position:relative; width:100%; padding:100px 0 45px; text-align:center;} /* v.certificateArea .certificateBox:before, .certificateArea .certificateBox:after{content:""; display:block; position:absolute; left:0; width:100%; height:20px; } .certificateArea .certificateBox:before{top:0; background:url("../images/certi_top.gif") 0 0 no-repeat;} .certificateArea .certificateBox:after{bottom:0; background:url("../images/certi_bottom.gif") 0 0 no-repeat;} */ .certificateArea .certificateBox h3.tit{padding-bottom:80px; font-size:50px; font-weight:600; color:#000;} .certificateArea .certificateBox ul.certificateList{width:400px; margin:0 auto 90px; border-top:1px solid #ccc; border-bottom:1px solid #ccc; } .certificateArea .certificateBox ul.certificateList li{position:relative; width:100%; padding:10px; font-size:18px; color:#000; text-align:left; -webkit-box-sizing: border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .certificateArea .certificateBox ul.certificateList li.col_line img{display:block; position:absolute; top:0; left:0; z-index:-10; width:100%; } .certificateArea .certificateBox .basicT1{font-size:20px; padding-bottom:12px;} .certificateArea .certificateBox .capT1{padding-bottom:85px; font-size:16px; font-weight:300; color:#000; } .certificateArea .certificateBox .capT2{font-size:14px; font-weight:300; line-height:20px; color:#000; } .certificateArea .certificateBox .bottomInfo{position:relative; width:520px; margin:0 auto; text-align:center; } .certificateArea .certificateBox .bottomInfo .stamp{position:absolute; top:0; right:0; } .lecture_tabs_now {display:none; overflow:hidden; width:100%; height:40px; margin-bottom:30px; padding:0 45px 0 15px; border:1px solid #dbdbdb; background:url('/template/1/images/lecture_tabs_now_open.png') no-repeat right 15px center/12.4px 7.5px; color:#333333; font-size:12px; letter-spacing:-0.04rem; line-height:40px; white-space:nowrap; text-overflow:ellipsis;} .lecture_tabs_now.active {background-image:url('/template/1/images/lecture_tabs_now_close.png');} ul.lecture_tabs.mini {display:none;} ul.lecture_tabs.biger {display:block !important;} ul.lecture_tabs{width:100%; padding:0 0 60px 0; } ul.lecture_tabs:after{content:""; display:block; clear:both; } ul.lecture_tabs li{display:table; float:left; width:calc(100% / 5 + 0.99px); height:50px; margin:0 -1px -1px 0; border:1px solid #dbdbdb; -webkit-box-sizing: border-box; -moz-box-sizing:border-box; box-sizing:border-box;} ul.lecture_tabs li a{display:table-cell; width:100%; font-size:15px; color:#7a7e80; font-weight:300; text-align:center; vertical-align:middle; background-color: #fff;} ul.lecture_tabs li.active a {background:#e9f6fd; color:#29a2e8; font-weight:500;} @media(max-width:1080px){ .lecture_tabs_now {display:block;} ul.lecture_tabs{display:none; position:absolute; top:50px; left:0; z-index:1; padding:0; background:#fff; border:1px solid #dbdbdb;} ul.lecture_tabs li {width:100%; float:none; height:35px; margin:0; border:none;} ul.lecture_tabs li a {padding:0 15px; font-size:12px; text-align:left;} ul.lecture_tabs li.active a {background:#fff; color:#7a7e80; font-weight:300;} } ul.after_tabs{width:100%; padding:20px 0 40px 0; } ul.after_tabs:after{content:""; display:block; clear:both; } ul.after_tabs li{display:table; float:left; width:calc(100% / 6 + 0.99px); height:65px; margin:0 -1px -1px 0; border:1px solid #e6e6e6; -webkit-box-sizing: border-box; -moz-box-sizing:border-box; box-sizing:border-box;} ul.after_tabs li a{display:table-cell; width:100%; font-size:13px; color:#333; text-align:center; vertical-align:middle; background-color: #f8f8f8;} ul.after_tabs li.active a{background-image: url("/template/1/image/ico_move.png"); background-position: right bottom; background-repeat: no-repeat; -webkit-background-size: 26px 25px; background-size: 26px 25px;} @media(max-width:1080px){ ul.after_tabs{padding:15px 0 25px 0; } ul.after_tabs li{width:calc(100% / 4 + 0.99px); height:55px; } } @media(max-width:640px){ ul.after_tabs{padding:10px 0; } ul.after_tabs li{width:calc(100% / 2 + 0.99px); height:45px; } } a.extend_btn { display: inline-block; padding: 2px 6px; font-size: 16px; text-align: center; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; color: #fff; background-color: #ff3600; } div.popup h3{padding-bottom:12px;font-size:25px;font-weight:500;font-family:"Noto Sans KR";color:#000;text-align:center;} div.popup span.close{font-size:0;width:24px;height:23px;position:absolute;top:25px;right:25px;background:url('../images/icon_general.png') no-repeat left -216px;cursor:pointer;} div.payment table.table-list{width:100%;border-top:2px solid #000;} table.table-list th{padding:17px 0;font-size:17px;line-height:1.5;color:#000;font-weight:700;background:#f9f9fa;border-bottom:1px solid #ccc;} table.table-list td{padding:16px 0;text-align:center;line-height:1.5;color:#393d44;font-size:16px;background:#fff;border-bottom:1px solid #ccc;} table.table-list td.nolist{padding:50px;} table.table-list.bort{border-top:2px solid #000;} table.table-list.left td, table.table-list .left{text-align:left;padding-left:30px;padding-right:15px;} div.payment input, div.payment select{height:35px;padding:0 10px;margin-right:4px;font-size:14px;border:1px solid #ccc; -webkit-appearance:menulist ; -moz-appearance:menulist ; appearance:menulist ; } .color-red{color:#ec1a23 !important;} div.popup div.pay-btn{margin-top:30px; text-align:center; } div.popup div.pay-btn .btn{display:inline-block; min-width:150px; height:50px; margin:0 auto; padding:0 30px; line-height:50px; font-size:16px; color:#fff; font-weight:600; text-align:center; border:1px solid #ec1e79;background:#ec1e79;} div.popup.extend ul.left-list{position:relative; bottom:-32px; width:calc(100% + 64px); margin: 0 0 0 -32px; padding:25px; background-color:#f9f9fa;;} div.popup.extend ul.left-list li{position: relative;padding-left: 10px;margin-bottom: 6px;font-size: 14px;color:#666;} div.popup.extend ul.left-list li:before{content: "";width: 4px;height: 4px;position: absolute;left:0;top:6px;background: #000; border-radius: 2px;} @media(max-width:640px){ div.popup{margin: 0px 15px !important;} div.popup h3{font-size:15px !important;} div.popup div.pay-btn .btn{height:40px; padding:0 15px; line-height:40px; font-size:14px; } } #loadImg{position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; text-align:center; background-color:rgba(0,0,0,0.8);} #loadImg img{position:absolute; top:50%; left:50%; z-index:200; -webkit-transform: translate3d(-50%,-50%,0); -moz-transform: translate3d(-50%,-50%,0); -ms-transform: translate3d(-50%,-50%,0); -o-transform:translate3d(-50%,-50%,0); transform:translate3d(-50%,-50%,0); } /* 동의 */ dl.agreeDl{width:100%; margin:25px 0 0 0; border:1px solid #0071d0; } dl.agreeDl dt{width:100%; padding:10px 45px 10px 15px !important; font-size:18px; color:#0071d0; background:#edf5fb; -webkit-box-sizing: border-box; -moz-box-sizing:border-box; box-sizing:border-box;} dl.agreeDl dt, dl.agreeDl dd{position:relative; padding:10px 15px; } dl.agreeDl dd{padding:10px 50px 10px 15px; border-bottom:1px solid #ccc;} dl.agreeDl dt .chkCus3, dl.agreeDl dd .chkCus3{position:absolute; right:15px; width:auto; } dl.agreeDl dt .chkCus3{bottom:5px;} dl.agreeDl dt .chkCus3 label{color:#000;} dl.agreeDl dd .chkCus3{top:10px;} @media(max-width:640px){ dl.agreeDl dt, dl.agreeDl dd{font-size:14px; } } .AjaxRefundBtn{color:blue;text-decoration:underline;margin:0px 10px;} /* 레벨테스트 결과 페이지 */ .testresult_area{width:640px; max-width:100%; margin:0 auto; } .testresult_area .tit_area{position:relative; padding:55px 0 30px 0; text-align:center; } .testresult_area .tit_area:before{content:""; display:block; position:absolute; top:0; left:50%; width:1px; height:45px; margin-left:-0.5px; background-color: #5facf4;} .testresult_area .tit_area .eng{display:inline-block; margin-bottom:20px; padding-bottom:8px; font-size:25px; color:#5facf4; border-bottom:2px solid #5facf4; } .testresult_area .tit_area .obj_tit{display:block; font-size:35px; font-weight:400; color:#000; } .testresult_area .result_box{width:100%; padding:30px 40px; border:1px solid #ccc; } .testresult_area .tester_info{width:100%; padding-bottom:65px; } .testresult_area .tester_info li{display:table; width:100%; padding:10px 0; border-bottom:1px solid #ccc;} .testresult_area .tester_info dl{display:table-cell; width:50%; padding:0 10px;} .testresult_area .tester_info dl dt{font-size:18px; font-weight:400; color:#8597ab;} .testresult_area .tester_info dl dd{font-size:24px; color:#000; } .testresult_area .test_answer_box{width:100%; padding-bottom:65px; } .testresult_area .test_answer_box:last-child{padding-bottom:0; } .testresult_area .test_answer_box .obj_tit{display:block; width:100%; margin-bottom:-1px; padding:0 0 20px 10px; font-size:26px; font-weight:100; border-bottom:1px solid #333; } .testresult_area .test_answer_box .obj_tit > span{font-weight:400; } .testresult_area .test_answer_list{width:100%; border-top:1px solid #333; } .testresult_area .test_answer_list > li{width:100%; border-bottom:1px solid #ccc;} .testresult_area .test_answer_list .Input_info{position:relative; width:100%; padding:18px 60px 18px 15px; } .testresult_area .test_answer_list .Input_info > span{display:inline-block; padding-right:10px; font-size:24px; color:#000; } .testresult_area .test_answer_list .Input_info .num{font-weight:300; } .testresult_area .test_answer_list .Input_info .submit_txt{font-weight:500; } .testresult_area .test_answer_list .Input_info .checkWhether{position:absolute; top:22px; right:10px; } .testresult_area .test_answer_list .result_after{width:100%; padding:10px 0; background-color: #f8f9fa;} .testresult_area .test_answer_list .result_after:after{content:""; display:block; clear:both; } .testresult_area .test_answer_list .result_after span{display:inline-block; } .testresult_area .test_answer_list .result_after li{min-height:44px; padding:5px 10px; } .testresult_area .test_answer_list .result_after li.answer_obj{position:relative; float:left; padding-left:80px; font-size:24px; font-weight:400; color:#ff0000;} .testresult_area .test_answer_list .result_after li.answer_obj .after_tit{position:absolute; top:5px; left:10px; } .testresult_area .test_answer_list .result_after li.answer_obj .after_tit:before{display:none; } .testresult_area .test_answer_list .result_after li.score_obj{float:right; text-align:right; } .testresult_area .test_answer_list .result_after li.score_obj .after_tit{margin-right:8px; } .testresult_area .test_answer_list .result_after li.score_obj .obj{margin-right:40px; font-size:24px; color:#000; } .testresult_area .test_answer_list .result_after .after_tit{position:relative; padding:0 10px; font-size:24px; font-weight:300; color:#000;} .testresult_area .test_answer_list .result_after .after_tit:before, .testresult_area .test_answer_list .result_after .after_tit:after{content:""; display:block; position:absolute; top:50%; width:1px; height:20px; margin-top:-10px; background-color: #d2d4d6;} .testresult_area .test_answer_list .result_after .after_tit:before{left:0; } .testresult_area .test_answer_list .result_after .after_tit:after{right:0; } .testresult_area .txt_objBox{width:100%; padding:10px; font-size:24px; line-height:45px; color:#454545; letter-spacing:-0.5px; border-top:1px solid #333; } @media(max-width:640px){ .testresult_area .tit_area{padding:45px 0 20px 0;} .testresult_area .tit_area:before{height:35px; } .testresult_area .tit_area .eng{margin-bottom:15px; padding-bottom:6px; font-size:18px;} .testresult_area .tit_area .obj_tit{font-size:22px;} .testresult_area .result_box{padding:25px 15px;} .testresult_area .tester_info{padding-bottom:45px; } .testresult_area .tester_info dl dt{font-size:14px;} .testresult_area .tester_info dl dd{font-size:18px;} .testresult_area .test_answer_box{padding-bottom:35px; } .testresult_area .test_answer_box .obj_tit{padding:0 0 15px 10px; font-size:20px;} .testresult_area .test_answer_list .Input_info{padding:12px 40px 12px 10px; } .testresult_area .test_answer_list .Input_info > span{font-size:18px;} .testresult_area .test_answer_list .Input_info .checkWhether{ top:10px; -webkit-transform: scale(0.8,0.8); -moz-transform: scale(0.8,0.8); -ms-transform: scale(0.8,0.8); -o-transform:scale(0.8,0.8); transform:scale(0.8,0.8); } .testresult_area .test_answer_list .result_after li{min-height:34px; } .testresult_area .test_answer_list .result_after li.answer_obj{padding-left:65px; font-size:16px; } .testresult_area .test_answer_list .result_after li.score_obj .obj{margin-right:10px; font-size:15px;} .testresult_area .test_answer_list .result_after .after_tit{padding:0 10px; font-size:16px; font-weight:300; color:#000;} .testresult_area .test_answer_list .result_after .after_tit:before, .testresult_area .test_answer_list .result_after .after_tit:after{height:16px; margin-top:-8px;} .testresult_area .txt_objBox{font-size:14px; line-height:28px;} } /* .add-cart, .item_submit_but{display:none !important; } .buy-cart, .item_direct_submit_but{width:calc(100% - 70px) !important; height:60px !important; margin-left:10px !important; line-height:60px !important;} @media(max-width:1080px){ .buy-cart, .item_direct_submit_but{width:calc(100% - 53px) !important;} } @media(max-width:640px){ .buy-cart, .item_direct_submit_but{width:calc(100% - 50px) !important;} } */ .wrap-loading{z-index:400; }