@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap'); .inTitle1{position:relative; width:100%; padding:110px 0 85px 0; font-size:60px; font-weight:400; color:#510cae; 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:#510cae; 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:10px; 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; } /* 대표컬러 */ .repColor1{color:#f94747 !important;} /*빨강색*/ .repColor2{color:#00bfa6 !important;} /*보라색*/ .repColor3{color:#0071d0 !important;} /*파란색*/ .repColor4{color:#ff7200 !important;} /*주황색*/ .repBg1{background-color:#f94747 !important;} .repBg2{background-color:#00bfa6 !important;} .repBg3{background-color:#0071d0 !important;} .repBg4{background-color:#ff7200 !important;} /* 검색바 */ .noticeSearch{width:100%; margin-bottom:28px; padding:25px 0; font-size:0; text-align:center; background:#f5f5f5;} .noticeSearch .inputA{display:inline-block; position:relative; width:64%; margin-left:-1px;} .noticeSearch .inputA input[type="text"]{padding-right:80px;} .noticeSearch .inputA input[type="image"]{position:absolute; top:14px; right:16px;} .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 165px 15px 20px; font-size:0; text-align:center; background:#f5f5f5; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .lookUpArea.titleIn{padding:15px 170px 15px 245px;} .lookUpArea.titleIn .tit{position:absolute; top:50%; left:40px; width:185px; 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 .division{width:100%; margin:5px 0; text-align:left;} .lookUpArea span.center{padding:0 15px; font-size:16px; line-height:45px; } /* 폼 스타일 */ .popBox{width:838px; height:768px; padding:100px 0 0 0; background:#fff; border:1px solid #999; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .popBox2{padding:100px 0; height:auto; border:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .popBox.nopop{margin:0 auto; background:none; border:none; } .popBox.autoH{height:auto; padding:25px; } .popBox.center{margin:0 auto;} .inBox{width:465px; margin:0 auto;} .inBox.full{width:100%;} .inBox.end{width:560px;} .pwIn{position:relative; width:45%; margin:0 auto; padding-left:90px; margin-top:45px; margin-bottom:45px; background:#f8f8f8; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .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{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;} table.basicTb2 .placeT{width:140px; } table.basicTb2 .placeT2{width:240px; } table.basicTb2 .placeH{font-size:16px; line-height:50px; } .chkIco{position:absolute; top:50%; right:14px; width:28px; height:20px; margin-top:-10px; font-size:0; text-indent:-9999px; background:url("/template/1/type1/images/chk_off.png") 0 0 no-repeat;} .chkIco.chkOk{background:url("/template/1/type1/images/chk_on.png") 0 0 no-repeat;} .inTselect{display:inline-block; font-size:20px; font-weight:100; background:#fff; border:1px solid #ccc; border-right:none; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .inTselect:last-child, .inTselect.last{border-right:1px solid #ccc;} .inTselect.choLong{width:42%;} .inTselect.choShort{width:29%; } .division .inTselect{width:20%; font-size:16px; line-height:45px; } .division .inTselect.choShort{width:13.5%;} /* 팝업 */ .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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .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{width:100%; height:350px; padding:10px; font-size:14px; font-weight:300; line-height:24px; border:1px solid #ccc; overflow-y:auto; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} /* 쿠폰등록 팝업 */ .couponPop{width:100%; padding:60px 45px; background:#fff; border:1px solid #333; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}/* 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{display:block; width:100%; } /* 셀렉트 스타일 */ 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} select.joinBig{height:70px; font-size:20px; font-weight:100; } select.w{width:42%;} 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} select.lookUpSelect{width:70%; height:45px; min-width:auto; margin:0 5px 0 0; padding-left:15px; font-size:16px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} select.lookUpSelect.long{width:14%} .inTselect select.lookUpSelect.long{width:82%} 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;-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } select.nob{height:70px;} ul.inputList select{background:#fff url("/template/1/type1/images/sArrow2.png") 95% center 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{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} input[type="text"], input[type="password"]{/*width:250px;*/ height:50px; padding-left:20px; font-size:18px; font-weight:100; /*vertical-align:top;*/ 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:31.5% !important;} input.quantity{width:40px; height:23px !important; padding:0 5px 0 0 !important;} /* 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .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:#00bfa6;} .input-file .file-name { width:100% !important; /* background: #f5f5f5; height: 27px; line-height: 26px; */text-indent: 5px; border: 1px solid #bbb; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .file-focus {outline: 1px dotted #d2310e;} /* 버튼 스타일 */ .buyBtnArea{width:100%; font-size:0; } .buyBtnArea a.sBtn:first-child{margin-left:0;} .buyBtnArea a.sBtn{width:32.6%; height:55px; margin-left:1%; 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; min-width:120px; height:45px; padding:0 18px; font-size:16px; color:#fff; line-height:45px; text-align:center; vertical-align:top; background:#00bfa6; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .H50{height:50px; line-height:50px;} .atte{position:relative; padding-left:57px; } .atte:before{content:""; display:block; position:absolute; top:0; left:0; width:57px; height:53px; font-size:70px; color:#ccc; background:url("/template/1/type1/images/heart_off.png") center center no-repeat; border-right:1px solid #c1c1c1; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .atte.active:before{background:url("/template/1/type1/images/heart_on.png") center center no-repeat; } .blue{background:#0071d0;} .red{background:#f94747;} .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%; } .half{width:49%; margin:5px 2% 0 0 !important;} .half:last-child{margin-right:0 !important;} .viewBtn{display:inline-block; width:90px; height:32px; font-size:16px; line-height:31px; text-align:center; background:#fff; border:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } .viewBtn_gnu{display:inline-block; width:190px; height:32px; font-size:16px; line-height:31px; text-align:center; background:#fff; border:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -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:#00bfa6; -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 0; font-size:16px; font-weight:400; color:#fff !important; background:#0071d0;} .sampleB.none{position:relative; cursor:default; background:#ccc;} .sampleB.red{background:#f94747;} .sampleB.bas{background: #00bfa6; } .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; } .lookUpA{display:inline-block; width:12%; height:45px; margin:0 5px 0 0; font-size:16px; text-align:center; line-height:43px; vertical-align:top; background:#fff; border:1px solid #0071d0; cursor:pointer; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .lookUpA.active{color:#fff; background:#0071d0; border:1px solid #0071d0;} .lookUpArea.point a.lookUpBtn{display:inline-block; position:relative; top:0; right:0; margin-left:15px; } .lookUpBtn{display:block; position:absolute; top:15px; right:20px; width:12%; 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; } .payBtn{display:block; width:100%; height:55px; margin:5px auto; font-size:18px; color:#fff; text-align:center; line-height:53px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .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:#00bfa6; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} /* 커스텀 체크 */ .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-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -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-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -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, #0ac9dc), color-stop(0.9500000000000001, #24adef)); background: -moz-linear-gradient(-126deg, #0ac9dc 0%, #24adef 95%); background: -webkit-linear-gradient(-126deg, #0ac9dc 0%, #24adef 95%); background: -o-linear-gradient(-126deg, #0ac9dc 0%, #24adef 95%); background: -ms-linear-gradient(-126deg, #0ac9dc 0%, #24adef 95%); background: linear-gradient(-126deg, #0ac9dc 0%, #24adef 95%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0ac9dc', endColorstr='#24adef', gradientType=1); } .chkCus2{width:100%; } .chkCus2 .in{position:relative; background:#fff;} .chkCus2 input[type="checkbox"], .chkCus2 input[type="radio"]{visibility:hidden; } .chkCus2 label{display:block; width:100%; height:70px; border:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .chkCus2 span.txt{padding-left:24px; font-size:20px; font-weight:100; line-height:70px;} .chkCus2 span.btn{display:block; position:absolute; top:26px; right:14px; width:28px; height:20px; background:url("/template/1/type1/images/chk_off.png") 0 0 no-repeat;} .chkCus2 input[type="checkbox"]:checked + span.txt + span.btn, .chkCus2 input[type="radio"]:checked + span.txt + span.btn{background:url("/template/1/type1/images/chk_on.png") 0 0 no-repeat;} /* 커스텀 라디오 */ .radioCus label{display:inline-block; position:relative; width:49%; height:70px; margin-right:2%; } .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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .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:30px; 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:url("/template/1/type1/images/chk_off2.png") 0 0 no-repeat;} .payRadio input[type="radio"]:checked + span.btn, .payRadio input[type="checkbox"]:checked + span.btn{background:url("/template/1/type1/images/chk_on2.png") 0 0 no-repeat;} .boxLabel input[type="radio"]{visibility:hidden; display:none; } .boxLabel input[type="radio"]:checked + .lookUpA{color:#fff; background:#0071d0; border:1px solid #0071d0;} /* 테이블 */ .viewIn table.basicTb1{margin-bottom:100px;} table, table th, table td{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} 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:-6px; 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .addDel span img{vertical-align:middle} /* 로그인/아이디찾기/비밀번호찾기 */ 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:#00bfa6; -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; } 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} ul.pwEnd{width:100%;} ul.pwEnd li{position:relative; margin:4px 0; padding:10px 0 10px 170px; background:#fff; border:1px solid #dbdbdb; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} /* 회원가입 */ ul.joinList{margin-bottom:30px; } ul.joinList li{min-height:70px; margin-bottom:35px; } 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .joinchoBox ul.choList:after{content:""; display:block; clear:both;} .joinchoBox ul.choList li{float:left; width:50%; padding:10px 0 10px 20px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .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;} #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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #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; border-bottom:1px solid #000;} #contents ul.inTabs2:after{content:""; display:block; clear:both;} #contents ul.inTabs2 li{position:relative; float:left; width:12.5%; height:64px; border:1px solid #ccc; border-bottom:none; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents ul.inTabs2 li.active{border:1px solid #000; border-bottom:none;} #contents ul.inTabs2 li.active:after{content:""; display:block; position:absolute; bottom:-1px; left:0; z-index:100; width:100%; height:1px; background:#fff;} #contents ul.inTabs2 li a{display:block; position:relative; width:100%; font-size:18px; font-weight:300; color:#666; line-height:62px; text-align:center;} #contents ul.inTabs2 li.active a{color:#000; } /* 마이페이지 상단 */ #contents .mypageGuide{position:relative; width:100%; height:150px; margin:60px 0; padding-right:175px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .myStatus{width:100%; height:100%; margin-bottom:60px; padding:30px 0 30px 25px; border-bottom:1px solid #ddd; border-top:2px solid #000; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}/*background:#f8f8f8; */ #contents .myStatus:after{content:""; display:block; clear:both;} #contents .myStatus .myinfo{float:left; width:26%; height:100%; padding-left:10px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .myStatus .myinfo .top{padding-bottom:14px; font-size:14px; font-weight:300; color:#333; } #contents .myStatus .myinfo .top b{font-size:20px; font-weight:500; color:#333; } #contents .myStatus .myinfo .top a{display:inline-block; padding:0 15px; font-size:12px; color:#fff; line-height:22px; background:#4c4a48; } #contents .myStatus .myinfo p{padding:2px 0; font-size:14px; font-weight:300; color:#333; } #contents .myStatus .myinfo p.big{padding-top:8px; font-size:20px; font-weight:300; line-height:36px;} #contents .myStatus .myinfo p.big b{font-weight:500; color:#333;} #contents .myStatus ul.lookUp{float:left; width:74%; } #contents .myStatus ul.lookUp:after{content:""; display:block; clear:both;} #contents .myStatus ul.lookUp li{float:left; width:16.66%; border-left:1px solid #e6e6e6; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .myStatus ul.lookUp li a{display:block; width:100%; text-align:center;} #contents .myStatus ul.lookUp li p{padding-bottom:15px; font-size:16px; font-weight:300; color:#333; } #contents .myStatus ul.lookUp li p.value{padding-bottom:0; font-size:16px; } #contents .myStatus ul.lookUp li p.value b{font-size:24px; font-weight:500; color:#0071d0;} #contents .myRoomMove{position:absolute; top:0; right:0; width:165px; height:100%;} #contents .myRoomMove a{display:block; width:100%; height:100%; padding:30px 0; text-align:center; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #0ac9dc), color-stop(0.9500000000000001, #24adef )); background: -moz-linear-gradient(-138deg, #0ac9dc 0%, #24adef 95%); background: -webkit-linear-gradient(-138deg, #0ac9dc 0%, #24adef 95%); background: -o-linear-gradient(-138deg, #0ac9dc 0%, #24adef 95%); background: -ms-linear-gradient(-138deg, #0ac9dc 0%, #24adef 95%); background: linear-gradient(-138deg, #0ac9dc 0%, #24adef 95%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0ac9dc', endColorstr='#24adef ', gradientType=1); } #contents .myRoomMove a:before{content:""; display:block; position:absolute; top:68px; left:50%; width:42px; height:5px; margin-left:-21px; background:url("/template/1/type1/images/moreA2.png") 0 0 no-repeat;} #contents .myRoomMove p.title{padding-bottom:38px; font-size:14px; color:#fff; font-weight:500; } #contents .myRoomMove p.title img{display:inline-block; margin-right:5px;} #contents .myRoomMove p.cap{font-size:14px; font-weight:300; color:#fff; } #contents .myRoomMove p.cap b{font-weight:500; } /* 나의 강의실 상단 */ #contents .myRoom{padding-left:175px; padding-right:0;} #contents .myRoom .myRoomMove{left:0; right:auto;} #contents .myRoom .myRoomMove a:before{top:110px; -ms-transform:rotateY(-180deg) ; -webkit-transform:rotateY(-180deg) ; transform:rotateY(-180deg) ; } #contents .myRoom .myRoomMove p.title{ } #contents .myRoom .myRoomMove p.title img{display:inline-block; margin-right:0; margin-bottom:15px} #contents .myRoom .myStatus .myinfo{width:18%;} #contents .myRoom .myStatus ul.lookUp{float:right; width:60%; height:100%;} #contents .myRoom .myStatus ul.lookUp li{width:20%; height:100%; } #contents .myRoom .totalProgress{position:relative; float:left; width:40%; height:100%; padding:14px 10px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .myRoom .totalProgress:after{content:""; display:block; clear:both;} #contents .myRoom .totalProgress .txtBar{float:left; margin-right:25px;} #contents .myRoom .totalProgress .title{margin-bottom:15px; font-size:20px; color:#000; font-weight:300;} #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, #0ac9dc), color-stop(0.9500000000000001, #24adef)); background: -moz-linear-gradient(-138deg, #0ac9dc 0%, #24adef 95%); background: -webkit-linear-gradient(-138deg, #0ac9dc 0%, #24adef 95%); background: -o-linear-gradient(-138deg, #0ac9dc 0%, #24adef 95%); background: -ms-linear-gradient(-138deg, #0ac9dc 0%, #24adef 95%); background: linear-gradient(-138deg, #0ac9dc 0%, #24adef 95%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0ac9dc', endColorstr='#24adef', gradientType=1); } #contents .myRoom .totalProgress .progressBar.action span.bar:after{width:100%;} #contents .myRoom .totalProgress .numberA{float:left; margin-top:-16px; font-size:24px; color:#333; } #contents .myRoom .totalProgress .numberA span.counter{font-size:55px; font-weight:600; color:#f94747;} /* 나의 수강 현황 */ #contents .captionBox{width:100%; margin-bottom:20px; padding:34px 40px; background:#f8f8f8; border-top:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .captionBox.pointCaptionBox{background:#edf5fb; border-top:none;} #contents .captionBox.pointCaptionBox ul li{color:#000;} #contents .captionBox.borTNo{border-top:none;} #contents .captionBox ul li{position:relative; display:inline-block; width:100%; margin:7px 0; padding-left:20px; font-size:14px; font-weight:300; color:#0071d0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .captionBox 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;} #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;} #contents .lectureViewProgress{position:relative; width:100%; margin:0 0 35px 0; padding:26px 300px 26px 60px; background:#f8f8f8; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .lectureViewProgress:after{content:""; display:block; clear:both;} #contents .lectureViewProgress .totalProgress{position:relative; float:left; width:16%; max-width:130px; min-height:100px; margin-right:30px; } #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{float:left; width:70%; max-width:560px; padding-top:15px;} #contents .lectureViewProgress .inT .cap{font-size:16px; color:#666; } #contents .lectureViewProgress a.link{display:block; position:absolute; top:60px; right:60px; width:220px; height:50px; font-size:16px; font-weight:500; color:#fff; line-height:50px; text-align:center; background:#f94747;} /*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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .captionBox2 .couponBox input[type="text"]{height:65px !important; border:none !important;} .captionBox2 .couponBox .lookUpBtn{width:145px;} /* 월별학습현황 */ #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{position:relative; width:100%; padding:20px; font-size:18px; background:#f5f5f5; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #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; } /* 전환가능 포인트 */ #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; height:65px; padding-right:380px;} .captionBox2 .mileageBox .availableP{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:35px; width:490px; background:#fff; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .captionBox2 .pointInputBox .t{font-weight:300; } .captionBox2 .pointInputBox #cyber{width:88%; height:65px; font-size:35px; color:#0071d0; text-align:right; border:none;} .captionBox2 a.lookUpBtn{top:0; right:0; width:220px; height:65px; font-size:24px; line-height:65px; background:#1d1568;} /* 게시판 */ #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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #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-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:20px 0; font-size:18px; text-align:center; vertical-align:middle; word-wrap: break-word; border-bottom:1px solid #c4c4c4;} .notice_list01 ul.thead > li{display:table-cell; font-weight:400; border-top:1px solid #c4c4c4; border-bottom:2px solid #000;} .notice_list01 ul.thead > li:after{content:""; display:block; position:absolute; top:50%; right:0; width:1px; height:18px; margin-top:-9px; background:#dbdbcb;} .notice_list01 ul.thead > li:last-child:after{display:none;} .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 li.left{padding-left:35px; 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; } .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 .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; } /* 게시판 리스트 댓글 표시 */ .comment_cntA{color:rgb(231, 76, 60); 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: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 .tableview{width:100%;} #contents .tableview .top{position:relative; padding:20px 0; font-size:18px; border-top:1px solid #c4c4c4; border-bottom:2px solid #000; } #contents .tableview .top .title{width:100%; padding-left:30px; } #contents .tableview .top .info{width:100%; 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 15px; 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 .viewArea{padding:30px; font-size:16px; font-weight:300; line-height:24px; background:#fafafa; border-bottom:1px solid #c4c4c4; } #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 .noticeBtnArea{width:100%; margin-top:25px; margin-bottom:100px; } #contents .noticeBtnArea:after{content:""; display:block; clear:both;} #contents .noticeBtnArea > span{display:block; font-size:0; } #contents .noticeBtnArea .left{float:left; } #contents .noticeBtnArea .right{float:right; } #contents .posList{width:100%; margin-bottom:20px; 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:118px; padding:0 40px 0 24px; font-weight:400; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .posList p.tit:after{content:""; display:block; position:absolute; top:50%; right:0; width:1px; height:22px; margin-top:-11px; background:#ccc;} #contents .posList p.txt{width:calc( 100% - 118px ); padding:0 12px; font-weight:300; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} /* 댓글달기 */ #contents .commentBox{width:100%; margin-bottom:54px; padding:45px 0; background:#fafafa; } #contents .commentBox#comment_write{border-top:1px solid #000; } /*#contents span.reply .commentBox,#contents span.edit .commentBox{border-top:0px;margin-bottom:0px;}*/ #contents .commentIn{position:relative; width:95%; height:52px; margin:0 auto; padding:0 126px 0 0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .commentList .commentIn{width:100%; } #contents .commentIn textarea{width:100%; height:100%; padding:13px 12px; resize:none; font-family:"NotoSansKR", sans-serif; vertical-align:top; background:#fff; border:1px solid #ccc; border-right:none; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .commentIn .commentB{position:absolute; top:0; right:0; width:126px; height:100%; font-weight:300; border:1px solid #ccc; border-left:none; line-height:50px;} #contents .commentIn .commentB span{position:relative; z-index:10; font-size:100%; color:#666; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } #contents .commentIn .commentB:after{content:""; display:block; position:absolute; top:0; left:0; width:0; height:100%; background:#00bfa6; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } #contents .commentIn .commentB.focus:after{width:100%;} #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;} /* 댓글리스트 */ #contents .commentListBox{width:100%; background:#fafafa; } #contents .commentList{width:100%; } #contents .commentList.depth_0{border-top:1px solid #000; } #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:25px;} #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:#fff; border-bottom:1px solid #c4c4c4; } #contents .commentList dt{position:relative; padding:14px 220px 14px 30px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .commentList dt > span{display:block; } #contents .commentList dt span.writer{width:100%; font-size:16px; } #contents .commentList dt span.writerBtn{position:absolute; top:14px; right:0; font-size:0; } #contents .commentList > dt span.writerBtn{right:30px;} #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 25px 20px; font-size:16px; font-weight:300; line-height:20px; } #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:url("/template/1/type1/images/answer.png") left center no-repeat; } #contents .commentList dd dl dd{padding:20px 15px;} /* FAQ */ #contents dl.questionsList{width:100%; border-top:1px solid #ccc; } #contents dl.questionsList dt{position:relative; width:100%; height:65px; padding:0 0 0 70px; font-size:18px; color:#000; line-height:64px; cursor: pointer ;border-bottom:1px solid #ccc; font-weight:300; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents dl.questionsList dt:before{content:"Q"; display:block; position:absolute; top:-2px; left:40px; font-size:18px; font-weight:600; color:#f94747} #contents dl.questionsList dt:after{content:""; display:block; position:absolute; top:50%; right:40px; width:12px; height:12px; margin-top:-6px; background:url("/template/1/type1/images/on01.png") 0 0 no-repeat;} #contents dl.questionsList dt.active:after{background:url("/template/1/type1/images/off01.png") 0 center no-repeat;} #contents dl.questionsList dt span.num{display:inline-block; width:36px; margin-right:5px; text-align:right; } #contents dl.questionsList dd{display:none; padding:20px 70px; font-size:16px; font-weight:300; line-height:24px; color:#555; background:#f8f8f8; border-bottom:1px solid #ccc; } #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; } /* img {vertical-align:none;} */ /* 강의상세 */ #contents .lectureViewTop{width:100%; margin-bottom:50px; padding-top:20px; border-top:2px solid #000; } #contents .lectureViewTop:after{content:""; display:block; clear:both;} #contents .lectureViewTop .sampleVideo{float:left; width:50%; background:#f8f8f8; } #contents .lectureViewTop .sampleVideo > img{display:block; width:100%; } #contents .lectureViewTop .sampleVideo > iframe{display:block; width:100%; } #contents .lectureViewTop .viewBuyInfo{float:right; width:45.5%; } #contents .viewBuyInfo .viewInfo{width:100%;} #contents .viewBuyInfo .viewInfo dt{width:100%; padding:18px; font-size:24px; background:#f3f3f3; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .viewBuyInfo .viewInfo dd{width:100%; padding:15px 0 10px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .viewBuyInfo .viewInfo dd ul{width:100%; height:auto; max-height:120px; overflow-y:auto; } #contents .viewBuyInfo .viewInfo dd ul > li{position:relative; 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:2px solid #ccc;} #contents .viewBuyInfo .viewInfo dd.texB ul > li{margin-bottom:10px; padding-left:72px; } #contents .viewBuyInfo .viewInfo dd.texB ul > li span.tit{display:block; position:absolute; top:0; left:0; width:72px; font-size:100%; } #contents .viewBuyInfo .viewInfo dd.priceB{border-bottom:1px solid #333;} #contents .viewBuyInfo .viewInfo dd.priceB ul{min-height:114px;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li{margin-bottom:18px; padding-right:350px; } #contents .viewBuyInfo .viewInfo dd.priceB ul > li.long{padding-right:100px} #contents .viewBuyInfo .viewInfo dd.priceB ul > li.long span.price{width:100px;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li label{display:block; position:relative; width:100%; padding-left:35px; font-size:100%; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li input[type="checkbox"]{position:absolute; top:6px; left:0; } #contents .viewBuyInfo .viewInfo dd.priceB ul > li span.price{display:block; position:absolute; top:0; right:0; width:340px; font-size:100%; color:#d50000; text-align:right;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li span.price span.delspan{font-size:12px; color:#0071d0;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li span.price span.bold{font-weight:600; } #contents .viewBuyInfo .allPrice{position:relative; width:100%; padding:16px 28px 35px; font-size:20px; font-weight:500; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .viewBuyInfo .allPrice span.price{display:block; position:absolute; top:10px; right:0; width:100%; padding-right:25px; padding-left:140px; font-size:30px; font-weight:600; color:#d50000; text-align:right; line-height:40px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } /* 강의상세탭 */ #contents ul.viewTabs{width:100%; margin-left:1px; margin-bottom:15px; } #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 + 1px); margin-left:-1px; margin-bottom:-1px; border:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents ul.viewTabs li a{display:table-cell; position:relative; width:100%; height:62px; font-size:18px; color:#777; text-align:center; vertical-align:middle; background:#fff;} #contents ul.viewTabs li.active{z-index:110; border:1px solid #000;} #contents ul.viewTabs li.active a{color:#000; } /* 강의상세내용 */ #contents .Introduce{width:100%;} #contents .Introduce.teacList{border-top:2px solid #000; } #contents .Introduce > li{width:100%; height:350px; margin-bottom:10px; border:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .Introduce > li:after{content:""; display:block; clear:both;} #contents .Introduce > li .imgD{display:table; float:left; width:30%; height:100%; text-align:center; border-right:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .Introduce > li .imgD a{display:table-cell; width:100%; height:100%; position:relative; vertical-align:middle; } /* #contents .Introduce > li .imgD{display:table-cell; width:100%; height:100%; vertical-align:middle;border-right:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .Introduce > li > a{display:table; float:left; width:30%; height:100%; position:relative; text-align:center; } */ #contents .Introduce > li .imgD img{display:inline-block; } #contents .Introduce > li .infoD{float:left; width:70%; height:100%; padding:40px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .Introduce > li .infoD strong{display:block; padding-bottom:10px; font-size:22px; font-weight:500; color:#00bfa6;} #contents .Introduce > li .infoD a{display:block; padding-bottom:10px; font-size:22px; font-weight:500; color:#00bfa6;} #contents .Introduce > li .infoD p.titCap{height:52px; font-size:16px; font-weight:300; color:#666; overflow-y:auto;} #contents .Introduce > li .infoD ul.book{height:170px; margin:15px 0 0 0; overflow-y:auto;} #contents .Introduce > li .infoD ul.book li{position:relative; width:100%; margin-bottom:5px; padding-left:82px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #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%; height:170px; overflow-y:auto; } #contents .Introduce > li .infoD .careerIn{position:relative; width:100%;} #contents .Introduce > li .infoD .careerIn:before{content:""; display:block; position:absolute; top:0; left:46%; width:1px; height:100%; margin-left:-0.5px; background:#e6e6e6;} #contents .Introduce > li .infoD .careerIn:after{content:""; display:block; clear:both;} #contents .Introduce > li .infoD .careerIn > dl{float:left; width:50%; padding-right:45px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .Introduce > li .infoD .careerIn > dl dt{margin-bottom:20px; font-size:18px; font-weight:100; color:#0071d0;} #contents .Introduce > li .infoD .careerIn > dl dd{font-size:16px;} #contents .Introduce.teacList > li .infoD .careerIn > dl dd p{max-width:90%; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} /* 교재상세 */ #contents .bookViewTop{width:100%; margin-bottom:120px; padding-top:20px; border-top:2px solid #000; } #contents .bookViewTop:after{content:""; display:block; clear:both;} #contents .bookViewTop .sampleBook{float:left; width:34%; height:450px; line-height:448px; text-align:center; border:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .bookViewTop .sampleBook > img{display:inline-block; width:auto; max-width:80%; max-height:330px; margin:0 auto; vertical-align:middle; } #contents .bookViewTop .bookBuyInfo{float:right; width:62%; } #contents .bookBuyInfo .viewInfo{width:100%;} #contents .bookBuyInfo .viewInfo dt{width:100%; padding:18px; font-size:24px; background:#f3f3f3; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .bookBuyInfo .viewInfo dd{width:100%; padding:15px 0 10px; border-bottom:1px solid #000; } #contents .bookBuyInfo .viewInfo dd ul{width:100%; height:208px; overflow-y:auto;} #contents .bookBuyInfo .viewInfo dd ul li{position:relative; width:100%; margin-bottom:10px; padding-left:112px; font-size:16px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .bookBuyInfo .viewInfo dd ul li span.tit{position:absolute; top:0; left:20px; font-weight:500; } #contents .bookBuyInfo .viewInfo dd ul li del{font-weight:100; } #contents .bookBuyInfo .viewInfo dd ul li ins{padding:0 10px 0 5px; background:none; } #contents .bookBuyInfo .viewInfo dd ul li ins span.bold{font-size:30px; line-height:22px; vertical-align:-3px;} #contents .bookBuyInfo .allPrice{position:relative; width:100%; padding:16px 28px 35px; font-size:20px; font-weight:500; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .bookBuyInfo .allPrice span.price{display:block; position:absolute; top:10px; right:0; width:100%; padding-right:25px; padding-left:140px; font-size:30px; font-weight:600; color:#d50000; text-align:right; line-height:40px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } #contents .viewIntro{width:100%; padding:30px; font-size:18px; line-height:40px; color:#333; background:#f8f8f8; border-top:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} /* 영상후기 / 무료강의 */ #contents .videoTop{width:100%; margin-bottom:52px; padding:52px 0; border-top:1px solid #ccc; border-bottom:1px solid #ccc; } #contents .bigVideo{width:90%; margin:0 auto; border:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .bigVideo img{display:block; width:100%;} #contents ul.videoThum{width:104%; margin-left:-4%; font-size:0; } /* #contents ul.videoThum:after{content:""; display:block; clear:both;} */ #contents ul.videoThum li{display:inline-block; *display:inline; *zoom:1; width:21%; /* height:400px; */margin-left:4%; margin-bottom:20px; vertical-align:top; } #contents ul.videoThum li > div > a{display:block; position:relative; padding-top:56%; } #contents ul.videoThum li > div > a > img{/*display:block; width:100%;*/} #contents ul.videoThum li > div > a > img.mov_thumnail_img{display:block; position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; margin-left:0; object-fit:cover; } #contents ul.videoThum li .videoMove{margin-bottom:10px; border:1px solid #ccc;} #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; } #contents ul.videoThum li a{display:inline-block; font-size:14px; } #contents ul.videoThum li a img{margin-left:8px; } /* 교재리스트 */ #contents .bookList{width:100%; margin-bottom:30px; border-top:2px solid #000;} #contents .bookList > li{width:100%; height:300px; margin-bottom:10px; border:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .bookList > li:after{content:""; display:block; clear:both;} #contents .bookList > li .imgD{display:table; float:left; width:30%; height:100%; text-align:center; line-height:296px; border-right:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .bookList > li .imgD a{display:table-cell; width:100%; height:100%; position:relative; vertical-align:middle; } #contents .bookList > li .imgD img{display:inline-block; width:auto; max-width:80%; margin:0 auto;} #contents .bookList > li .infoD{float:left; width:45%; height:100%; padding:30px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .bookList > li .infoD strong{display:block; padding-bottom:10px; font-size:22px; font-weight:500; color:#00bfa6;} #contents .bookList > li .infoD p.titCap{height:52px; font-size:16px; font-weight:300; color:#666; overflow-y:auto;} #contents .bookList > li .infoD ul.book{height:116px; margin:15px 0 0 0; overflow-y:auto;} #contents .bookList > li .infoD ul.book li{position:relative; width:100%; margin-bottom:5px; padding-left:82px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .bookList > 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 .bookList > 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 .bookList > li .priceD{float:left; width:25%; padding:30px;-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } #contents .bookList > li .priceD .price{width:100%; height:110px; text-align:center; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; } #contents .bookList > li .priceD .price del{display:block; font-size:16px; font-weight:300; color:#666;} #contents .bookList > li .priceD .price ins{display:block; font-size:40px; font-weight:500; line-height:42px; background:none;} /* 선생님소개 */ #contents .teacherinfoBox{position:relative; width:100%; padding:85px 0 0 0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #contents .teacherinfoBox .infoBox{width:100%; padding:30px 250px 0 70px; background:url("/template/1/type1/images/teacdot.gif") 0 0 repeat; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #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: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;} /* 강의 */ #contents .lectureList{width:100%; margin-bottom:35px; padding-top:20px; border-top:2px solid #000; } #contents .lectureList.view{border-top:1px solid #ccc; } #contents .lectureList > ul{display:flex;flex-wrap:wrap;} #contents .lectureList > ul:after{content:""; display:block; clear:both;} #contents .lectureList > ul > li{position:relative; float:left; width:calc(100% / 3 - 8px); margin:15px 12px 15px 0;} #contents .lectureList > ul > li:nth-child(3n) {margin-right: 0;} #contents .lectureList > ul > li .topBan{position:relative; width:100%; } #contents .lectureList > ul > li .topBan > a {display:block; position:relative; width:100%; padding-top:62%;} #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:28px 26px; border:1px solid #ccc; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #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:24px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; border-bottom:1px solid #e0e0e0;} #contents .lectureList > ul > li .botInfo .confiB{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; white-space:nowrap} #contents .lectureList > ul > li .botInfo .priceB:after{content:""; display:block; clear:both;} #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:#f94747; background:none;} .texS{font-size:16px; font-weight:300;} /* 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:33.33%; 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:#f94747;} #contents .stepArea li.active span.num{background:#f94747;} /* 장바구니/결제진행 */ #contents .paymentArea{position:relative; width:100%; min-height:850px; padding-right:420px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #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:#f94747;} #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{margin-bottom:10px;} #contents .paymentBox .bottomA .payB a:last-child{margin-bottom: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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}/* 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;} /* 이벤트 */ #contents ul.evevtList{width:100%; margin-top:20px;} #contents ul.evevtList > li{position:relative; width:100%; margin-bottom:20px; padding:25px 40px; border:1px solid #ccc; } #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; float:left; width:53%; /* height:150px; */ padding-top:13%;} #contents ul.evevtList > li .banIn img{display:block; position: absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; object-fit:cover;} #contents ul.evevtList > li .txtIn{float:right; width:45%;} #contents ul.evevtList > li p.day{padding-bottom:18px; font-size:16px; font-weight:100; color:#000; } #contents ul.evevtList > li p.day b{display:inline-block; padding-right:10px; font-weight:500; color:#333; } #contents ul.evevtList > li p.title{padding-bottom:10px; font-size:22px; color:#000; max-width:95%; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} #contents ul.evevtList > li p.cap{font-size:14px; font-weight:100; color:#666;} #contents ul.evevtList.end > li .banIn:after{content:""; display:block; 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;} #contents ul.evevtList.end > li p{opacity:0.6;} /* 오시는길 */ #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; } /* 페이징 */ .pager{width:100%; margin-bottom:45px; font-size:0; text-align:center; } .pager span{display:inline-block; } .pager a{display:inline-block; padding:0 8px; font-size:16px; font-weight:300; } .pager strong{display:inline-block; position:relative; padding:0 8px; font-size:20px; font-weight:600; color:#f02424; } .pager strong:after{content:""; display:block; position:absolute; bottom:-5px; left:0; width:100%; height:1px; background:#f02424;} .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{margin-left:5px; padding:0 4px; font-size:14px; font-weight:600; color:#fff; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .condition.conIco1{background:#f94747;} .condition.conIco2{background:#00bfa6;} .condition.conIco3{background:#0071d0;} 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; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} ul.snsConnect li span.tit{position:absolute; top:15px; left:15px; } ul.snsConnect li .caption{font-size:14px;} .agree_info{width:100%; max-width:557px; padding:50px 38px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .agree_info > h1{padding-bottom:25px; font-size:26px; font-weight:400; } .agree_info .infoin{width:100%; height:400px; padding:15px; border:1px solid #ccc; overflow-y:auto; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .agree_info .infoin img{display:inline-block; width:auto; max-width:100%;} .calendB{position:relative; display:inline-block; margin-right:15px; } .calendB > .ui-datepicker-trigger{position:absolute; top:13px; right:8px; } /*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:#f94747 !important;} .borerColr2{border-color:#00bfa6 !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 65px; 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; width:100%; text-align:center; } ul.lecture_tabs{width:100%; padding:20px 0 40px 0; } ul.lecture_tabs:after{content:""; display:block; clear:both; } ul.lecture_tabs li{display:table; float:left; width:calc(100% / 5 + 1px); height:65px; margin:0 -1px 0 0; border:1px solid #e6e6e6; -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:13px; color:#333; text-align:center; vertical-align:middle; background-color: #f8f8f8;} ul.lecture_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;} /*200702 By Kang*/ #contents .lectureList > ul > li .topBan .ing_status {display:inline-block; *display:inline; *zoom:1; padding:2px 10px 4px; position:absolute; top:5px; left:5px; text-align:center; border-radius:5px; background:#28a3d0; color:#ffffff; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition: all .3s; } /* #contents .lectureList > ul > li:hover .ing_status{opacity:1; } */ .after_top{display:table; width:100%; } .after_top li{display:table-cell; width:50%; height:160px; text-align:center; vertical-align:middle; } .after_top li label{display:block; font-size:18px; color:#010101; } .after_top li b{display:inline-block; font-size:35px; color:#454545; font-weight:500; } .after_top li .number_format{font-size:55px; font-weight:500; color:#010101;} /* 강의상세 */ #contents .lectureViewTop {position: relative; margin-bottom: 0;padding-top: 0;border: none;} #contents .lectureViewTop .sampleVideo {width:100%; max-width:756px; margin-bottom:57px; border-radius:7px; overflow:hidden;} #contents .lectureViewTop .viewBuyInfo {overflow-y: auto;max-height:calc(100vh - 120px);position: absolute;top: 0;left: 50%;width:386px;margin-left:205px;padding:0 0 25px;background: #fff;z-index: 1;} #contents .lectureViewTop .viewBuyInfo .cate {padding:0 0 2px; font-size:16px; font-weight:bold; color:#0079fe;} #contents .viewBuyInfo .viewInfo dt {padding:0; font-size:24px; font-weight:bold; background:transparent;} #contents .viewBuyInfo .viewInfo dd {padding-bottom:0;} #contents .viewBuyInfo .viewInfo dd.priceB {padding-top:7px; border-bottom:none;} #contents .viewBuyInfo .viewInfo dd.priceB ul {min-height:auto;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li {padding-right:0;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li label {display:none;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li .price {position:static; display:flex;} #contents .viewBuyInfo .viewInfo dd.priceB ul > li .del {display:inline-block; margin-top:5px; font-size:16px; font-weight:500; color:#999;} #contents .viewBuyInfo .discount_rate_box {color:#e40505;} #contents .viewBuyInfo .viewInfo .member_amount {font-weight:900; font-family:'Roboto';} #contents .viewBuyInfo .discount_rate_box .bold {font-weight:900 !important; font-family:'Roboto';} #contents .viewBuyInfo .price_area {position:static; margin-left:auto; text-align:right; font-size:26px; color:#000; font-weight:bold;} #contents .viewBuyInfo .price_txt {display:block; margin-top:5px; font-size:16px; font-weight:300; color:#999;} #contents .viewBuyInfo .viewInfo .review_rate {padding-top:11px; font-size:14px; color:#000; font-weight:bold;} #contents .viewBuyInfo .viewInfo .review_rate:before {content:''; display:inline-block; width:15px; height:14px; margin-right:4px; background:url(/template/1/images/lecture/icon_review_on.png) no-repeat center/contain; vertical-align:-1px;} #contents .viewBuyInfo .viewInfo dd.texB {padding:18px 0; margin-top:12px; border-top:1px solid #dedede; border-bottom:1px solid #dedede;} #contents .viewBuyInfo .viewInfo dd.texB ul > li {display:flex; margin-bottom:14px; padding-left:0;} #contents .viewBuyInfo .viewInfo dd.texB ul > li span.tit {position:static; font-size:16px; color:#000; font-weight:300;} #contents .viewBuyInfo .viewInfo dd.texB ul > li strong {font-weight:bold;} #contents .viewBuyInfo .allPrice {display:flex; padding:23px 0 5px; font-weight:bold;} #contents .viewBuyInfo .allPrice .tit {font-size:20px; line-height:38px;} #contents .viewBuyInfo .allPrice .price_area {flex-wrap:wrap; min-height:57px; font-size:26px; color:#000; font-weight:bold;} #contents .viewBuyInfo .allPrice span.price {position:static; display:inline; padding-left:0; padding-right:0; font-size:26px; font-weight:900; font-family:'Roboto'; color:#000;} #contents .viewBuyInfo .allPrice .price_txt {margin-top:0;} .viewBuyInfo .buyBtnArea {display:flex;} .viewBuyInfo .buyBtnArea a.wishBtn {flex-shrink:0; width:144px; height:50px; padding-left:55px; line-height:48px; font-size:14px; font-weight:bold; color:#f94747 !important; text-align:left; border-color:#f94747;} .viewBuyInfo .buyBtnArea a.wishBtn:before {width:50px; height:50px; border:none; background:url(/template/1/images/lecture/icon_wish.png) no-repeat center/auto 20px;} .viewBuyInfo .buyBtnArea a.wishBtn.active:before {background-image:url(/template/1/images/lecture/icon_wish_on.png)} .viewBuyInfo .buyBtnArea a.sBtn {flex-grow:1; height:50px; line-height:48px; font-size:14px; border-radius:4px;} #contents .viewTabsWrap {position: absolute;width:100%;max-width: 756px; background:#f0f0f0; border-radius:7px; z-index: 200;} #contents ul.viewTabs {padding:5px; margin-bottom:0;} #contents ul.viewTabs li {width:120px !important; border:none;} #contents ul.viewTabs li a {height:42px; font-size:14px; font-weight:500; color:#999; background:transparent;} #contents ul.viewTabs li.active {border:none;} #contents ul.viewTabs li.active a { border-radius:6px; background:#fff;} #contents ul.viewTabs li.active .number {color:#0079ff;} .viewContents {max-width:756px; padding-top:54px;} .viewContents .viewIn {padding-top:31px;} .viewContents .tab_cont img {max-width:756px; height:auto !important} .lecture_tit {margin-bottom:19px; font-size:20px; font-weight:700; letter-spacing:-0.01em; color:#000;} .lecture_tit .total_count {font-size:14px; font-weight:400; color:#999; vertical-align:2px;} .normal_list {display:table; width:100%; table-layout:fixed; margin-bottom:6rem; border-collapse:collapse; border-spacing:0;} .normal_list li{display:table-row; } .normal_list li span{display:table-cell; position:relative; text-align:center; padding:15px 0; font-size:16px; text-align:center; vertical-align:middle; word-wrap: break-word; border-bottom:1px solid #c4c4c4;} .normal_list .list_head span{display:table-cell; font-weight:400; border-top:1px solid #c4c4c4; border-bottom:2px solid #000;} .normal_list .list_body {font-weight:300; } .normal_list li .left{padding-left:35px; text-align:left;} .normal_list li .center{text-align:center; padding-left:0;} .normal_list .list_body.m_block{display:none !important;} .normal_list .list_body.m_block:after{display:none; } .normal_list .no_data {position:relative;} .normal_list .no_data span {display:block; position:absolute; top:0; left:0; width:100%; padding:30px 0; font-size:16px; text-align:center;} .review_list .review_box + .review_box {margin-top:32px;} .review_box {position:relative; padding:26px 29px; border:1px solid #ededed; border-radius:17px;} .review_box .username {font-size:16px; font-weight:bold; color:#000;} .review_box .date {margin-left:13px; font-size:14px; font-weight:300; color:#000;} .review_box .review_rate {margin-top:2px;} .review_box .review_rate .rate_img {display:inline-block;width:90px;height:14px;background:url(/template/1/images/lecture/icon_review.png) repeat-x left center/auto 14px; vertical-align:-6px} .review_box .review_rate .rate_img .on {display:inline-block;height:14px;background:url(/template/1/images/lecture/icon_review_on.png) repeat-x left center/auto 14px;vertical-align:top} .review_box .review_rate .rate_txt {font-size:14px; font-weight:300; color:#000;} .review_box .review_cont {max-height:242px; margin-top:8px; line-height:30px; font-size:15px; font-weight:300; color:#000; word-break:keep-all; overflow:hidden;} .review_box .btn_more {display:inline-block; line-height:22px; font-size:14px; font-weight:300; color:#000; display:none;} .review_box .btn_more:after {content:''; display:inline-block; width:11px; height:22px; margin-left:4px; background:url(/template/1/images/lecture/icon_more.png) no-repeat center/contain; vertical-align:-6px; transition:all 0.4s;} .review_box .btn_more:before {content:''; position:absolute; bottom:50px; left:0; width:100%; height:96px; background:linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, #FFFFFF 100%); z-index:2;} .review_box.on .review_cont {max-height:none;} .review_box.on .btn_more:after {transform:rotate(180deg);} .review_box.on .btn_more:before {display:none;} .review_area .pagination {margin-top:25px;} .review_area .pagination ul {display:flex; justify-content:center; align-items:center; gap:10px;} .review_area .pagination ul a[class^='page_'] {display:block; width:25px; height:25px; font-size:0; text-indent:-9999em; background:url(/template/1/images/lecture/icon_page.png) no-repeat center/auto 9px; opacity:0.3;} .review_area .pagination ul a[class^='page_'].on {opacity:1;} .review_area .pagination ul .page_first {transform:rotate(180deg);} .review_area .pagination ul .page_prev {transform:rotate(180deg);} .review_area .pagination ul .page a {padding:3px 6px; font-size:16px; font-family:'Roboto'; color:#000; font-weight:bold;} .review_area .pagination ul .page a + a {margin-left:12px;} .review_area .pagination ul .page .active {color:#f94747;} .review_area .no_data {width:100%; padding:30px 0; font-size:16px; text-align:center;} @media only screen and (max-width:1300px) { #contents .lectureViewTop .viewBuyInfo {left:auto; right:0; margin-left:0;} }