.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:#d70000 !important;} /*빨강색*/ .repColor2{color:#00479d !important;} /*보라색*/ .repColor3{color:#0071d0 !important;} /*파란색*/ .repColor4{color:#ff7200 !important;} /*주황색*/ .repBg1{background-color:#d70000 !important;} .repBg2{background-color:#00479d !important;} .repBg3{background-color:#0071d0 !important;} .repBg4{background-color:#ff7200 !important;} .bg_gray{background-color: #f1f1f1 !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:760px; 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("../type1/images/searchIco.png") center center no-repeat;} .searchInput.focus{background:url("../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;} .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:50px 0 0 0; background:#fff; border:1px solid #999;} .popBox2{padding:50px 0; height:auto; border:1px solid #ccc;} .popBox.nopop{margin:0 auto; height:auto; background:none; border:none; } .popBox.autoH{height:auto; padding:25px;} .popBox.center{margin:0 auto;} .inBox{width:750px; 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} .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("../type1/images/chk_off.png") 0 0 no-repeat;} .chkIco.chkOk{background:url("../type1/images/chk_on.png") 0 0 no-repeat;} .select_basic{height:50px; font-size:16px; border:1px solid #d9d9d9;} .select_in{width:calc(100% + 10px); margin-left:-10px; } .select_in:after{content:""; display:block; clear:both;} .select_basic.select3{width:calc(100% / 3 - 10px - 0.01px); margin-left:10px; font-size:20px; } .inTselect{display:inline-block; font-size:16px; font-weight:100; background:#fff; border:1px solid #ccc; border-right:none;} .inTselect:last-child, .inTselect.last{border-right:1px solid #ccc;} .inTselect.choLong{width:42%;} .inTselect.choShort{width:29%; } .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;} .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("../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;} /* 쿠폰등록 팝업 */ .couponPop{width:100%; padding:60px 45px; background:#fff; border:1px solid #333; }/* position:absolute; top:-5px; left:-415px; */ .couponPop .popT{margin-bottom:10px; font-size:22px; font-weight:500; text-align:left; } .whiteCoupon{position:relative; padding-right:95px;} .whiteCoupon a.sBtn{position:absolute; top:0; right:0; width:95px;} .couponPop .closeB{position:absolute; top:14px; right:14px; width:22px; cursor:pointer;} .couponPop .closeB img{display:block; width:100%; } /* 서브배너 */ .sBanLink{width:100%; margin-top:70px; } .sBanLink a{display:block; width:100%; } /* 셀렉트 스타일 */ select.basicS{width:240px; height:50px; font-size:18px; vertical-align:top; background:#fff url("../type1/images/sArrow1.png") 95% center no-repeat !important; border:1px solid #ccc; } 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("../type1/images/sArrow1.png") 95% center no-repeat; border:1px solid #ccc; } select.joinBig{height:70px; font-size:20px; font-weight:100; } select.w{width:42%;} select.choLong{width:42%;} select.choShort{width:29%;} select.shortSerch{width:180px; height:45px;} select.tableInS{width:80%; height:35px; min-width:auto; margin:0 auto 5px; padding-left:15px; font-size:16px;} select.lookUpSelect{width:70%; height:45px; min-width:auto; margin:0 5px 0 0; padding-left:15px; font-size:16px;} select.lookUpSelect.long{width:140px} .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("../type1/images/sArrow1.png") 95% center no-repeat; border:1px solid #ccc; } select.nob{height:70px;} ul.inputList select{background:#fff url("../type1/images/sArrow2.png") 95% center no-repeat;} ul.joinList .lengInput1 select{width:33%; border:none;} .inTselect select{margin-right:5px; height:50px; font-size:16px; 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("../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:not([type="radio"]):not([type="checkbox"]):not([type="image"]):not([type="file"]):not([type="button"]):not([type="submit"]){/*width:250px;*/ height:50px; padding-left:20px; font-size:16px; font-weight:100; /*vertical-align:top;*/ background:#fff; border:1px solid #ccc; } input.w150{width:150px;} input[type="submit"]{cursor:pointer;} /* .inputList input:not([type="radio"]):not([type="checkbox"]):not([type="image"]):not([type="file"]):not([type="button"]):not([type="submit"]){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;} /* 2008106 */ .full{width:100% !important;} .e_renewal{position:relative; padding-bottom:10px; } .e_renewal select.basicS{margin-top:5px; border:1px solid #ccc !important; } .division2:after, .division2_bul:after, .division3:after{content:""; display:block; clear:both;} .division2 .target{float:left; width:calc(100% / 2) !important;} .division2_bul .target{float:left; width:calc(100% / 2 - 13px) !important;} .division2_bul .target.bul{display:inline-block; width:26px !important; padding:0 3px; } .division3 .target{float:left; width:calc(100% / 3); padding-right:20px !important;} .necessary{display:inline-block; padding-right:5px; color:#ee0000; } /* textarea */ textarea.writText{width:100%; height:350px; vertical-align:top; resize:none; border:1px solid #ccc; } /* 파일커스텀 */ .input-file{position:relative; width:100%; margin:5px 0; padding-right:110px; font-size:0;} .input-file [type="file"] {position: absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0, 0, 0, 0); border:none;} .input-file .file-label {position:absolute; top:0; right:0; width:110px; height:50px; line-height: 50px; font-size: 18px; color:#fff; text-align:center; background-color:#00479d;} .input-file .file-name { width:100% !important; background: #f5f5f5; height: 27px; line-height: 26px; text-indent: 5px; border: 1px solid #bbb;} .file-focus {outline: 1px dotted #d2310e;} /* 버튼 스타일 */ .buyBtnArea{width:100%; font-size:0; } .buyBtnArea.right{text-align:right; } .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; width:120px; height:50px; font-size:16px; color:#fff; line-height:48px; text-align:center; vertical-align:top; background:#00479d;} .certBtn{display:inline-block; width:100%; height:56px; margin:0 !important; font-size:20px; line-height:54px; color:#fff; text-align:center; vertical-align:top; background:#1f2328;} .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("../type1/images/heart_off.png") center center no-repeat; border-right:1px solid #c1c1c1;} .atte.active:before{background:url("../type1/images/heart_on.png") center center no-repeat; } .blue{background:#0071d0;} .red{background:#d70000;} .gray{color:#000 !important; background:#f4f4f4; line-height:48px; border:1px solid #ccc;} .gray2{color:#000 !important; background: #ccc; line-height:48px; border:1px solid #ccc; } .gray3{color:#fff !important; background: #4c4c4d; line-height:48px; border:1px solid #4c4c4d; } .gray4{color:#fff !important; background: #bdbebf; line-height:48px; border:1px solid #bdbebf; } .white{color:#000 !important; background: #fff; line-height:48px; border:1px solid #333; } .black{color:#fff !important; background: #000; line-height:48px; border:1px solid #000; } .big{height:56px; font-size:20px; line-height:54px;} .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-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:#00479d; -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;} .sampleB{display:block; width:80%; margin:2px auto; padding:5px 0; font-size:14px; font-weight:400; color:#fff !important; background:#0071d0; letter-spacing:-1px} .sampleB.none{position:relative; cursor:default; background:#ccc;} .sampleB.red{background:#d70000;} .sampleB.bas{background: #32186d; } .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:105px; 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;} .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:145px; 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;} .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:#32186d;} .sub_btn{display:inline-block; min-width:80px; margin-left:15px; padding:4px 10px; font-size:14px; font-weight:400; color:#fff; text-align:center; background-color: #0071d0;} /* 커스텀 체크 */ .chkCus{position:relative; } .chkCus label{height:24px; font-size:14px; color:#4f4f4f;} .chkCus.basic label{font-size:16px; color:#4f4f4f;} .chkCus.basic span.btn{width:20px; height:20px; vertical-align:-4px; background-position: 0 -20px; } .chkCus input[type="checkbox"]{display:none; } .chkCus span.btn{display:inline-block; position:relative; width:24px; height:24px; margin-right:8px; vertical-align:-6px; background-image:url("../html/images/chk_ico.png"); background-position: 0 -24px; background-repeat: no-repeat; -webkit-background-size: 100%; background-size:100%; } .chkCus input[type="checkbox"]:checked + span.btn{background-position: 0 0; } .chkCus input[type="checkbox"]:checked + span.text + span.btn{background-position: 0 0; } ul.chk_list{width:100%; padding-bottom:30px; } ul.chk_list li{width:100%; margin-bottom:15px; } ul.chk_list li:last-child{margin-bottom:0; } .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; } .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("../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("../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;} .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;} .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("../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("../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.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:87%; margin-left:8px; vertical-align:middle; text-overflow:ellipsis; white-space:nowrap; vertical-align: top; overflow:hidden;} table.basicTb1 .left a img{display:inline-block; margin:0 4px 0 0; vertical-align:-2px; } table.basicTb1 .view_big a{font-size:20px; color:#000; font-weight:600; } 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{font-size:18px; font-weight:300; } table.basicTb2 .top{padding-top:22px;} table.basicTb2 .settle_bank select.long{width:74%;} table.popBasicTb{border:1px solid #ccc; border-top:2px solid #000; } table.popBasicTb th, table.popBasicTb td{height:40px; padding:5px 10px; color:#333; border-bottom:1px solid #ccc; } table.popBasicTb th{position:relative; font-size:14px; font-weight:500; } table.popBasicTb td{font-size:14px; font-weight:300; } table.popBasicTb .left{padding:8px; text-align:left; } ul.packageProg{width:100%; margin:15px 0 0 0; padding-left:15px; } ul.packageProg li{position:relative; width:100%; } ul.packageProg li a{max-width:75% !important;} .addDel{margin:5px 0 0 0; font-size:0;} .addDel span{display:inline-block; width:30px; height:30px; text-align:center; line-height:28px; cursor:pointer; background:#fff; border:1px solid #ccc; } .addDel span img{vertical-align:middle} /* 로그인/아이디찾기/비밀번호찾기 */ 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:19px; font-weight:100; } ul.loginNav li a:after, ul.loginNav li span.text:after{content:""; display:block; position:absolute; bottom:-4px; left:-10%; width:0; height:2px; background:#5a2ac5; -webkit-transition: width .3s; -moz-transition: width .3s; -ms-transition: width .3s; -o-transition: width .3s; transition: width .3s; } ul.loginNav li a:hover:after, ul.loginNav li a:hover span.text:after{width:120%;} 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;} ul.pwEnd{width:100%;} ul.pwEnd li{position:relative; margin:4px 0; padding:10px 0 10px 170px; background:#fff; border:1px solid #dbdbdb;} ul.pwEnd li > a{display:block; position:absolute; top:0; left:-1px; width:160px; height:100%; text-align:center; line-height:44px; background:url("../type1/images/next.png") 90% center no-repeat; border:1px solid #000;} ul.pwEnd li > a:after{content:""; display:block; position:absolute; top:8px; right:-388px; width:26px; height:26px; background:url("../image/chk_off2.png") 0 0 no-repeat;} ul.pwEnd li > a.active:after{background:url("../image/chk_on2.png") 0 0 no-repeat;} /* 회원가입 */ 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.tit span.chk{float:right; } ul.joinList li p.tit span.chk label{padding-left:5px; font-size:14px; } ul.joinList li p.value{width:100%; min-height:auto; padding:10px 24px; font-size:20px; font-weight:100; border:1px solid #ccc;background-color:#ccc;} ul.joinList li.noW{background:none;} span.error{position:absolute; bottom:-24px; left:0; padding-left:25px; font-size:14px; color:#ee0000;} span.error:before{content:""; display:block; position:absolute; top:1px; left:0; width:20px; height:20px; background:url("../type1/images/icon_warning.png") 0 0 no-repeat; -webkit-background-size: 100%; background-size:100%; } p.error{position:relative; padding-left:25px; font-size:14px; color:#ee0000;} p.error:before{content:""; display:block; position:absolute; top:1px; left:0; width:20px; height:20px; background:url("../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 .nec:last-child{display:block;} ul.joinList .necPass{color:#0d88f1;} ul.joinList .lengInput1 .in{border:1px solid #ccc;} /* ul.joinList .lengInput1 label{width:31.5%;} */ ul.joinList .lengInput1 .btnIn{position:relative; margin-bottom:5px; padding-right:150px;} ul.joinList .lengInput1 .btnIn label{width:100%;} ul.joinList .lengInput1 .btnIn a.sBtn{position:absolute; top:0; right:0; width:150px; background-color: #border:none; ;} 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("../image/capChkIco.png") 20px 20px no-repeat;} .joinchoBox{position:relative; width:100%; margin-bottom:50px; padding-bottom:10px; } .joinchoBox.nobm{margin-bottom:0;} .joinchoBox span.error{bottom:-10px;} .joinchoBox > p{font-size:20px; font-weight:100; } .joinchoBox ul.choList{width:100%; margin-top:14px; padding:10px 0; background:#fff; border:1px solid #ccc; border-top:3px solid #000; } .joinchoBox ul.choList:after{content:""; display:block; clear:both;} .joinchoBox ul.choList li{float:left; width:50%; padding:10px 0 10px 20px;} .joinchoBox ul.choList li label{font-size:20px; font-weight:100; } .joinchoBox ul.choList li input{margin-right:10px; } .joinchoBox ul.choList.full li{float:none; width:100%; }/* 추가 */ ul.joinAgree{position:relative; width:100%; padding:15px 0 30px 0;} ul.joinAgree:after{content:""; display:block; clear:both;} ul.joinAgree li{margin-bottom:5px; font-size:0; } ul.joinAgree li label{margin-right:10px; font-size:18px; font-weight:100; } ul.joinAgree li input[type="checkbox"]{margin-right:10px; } ul.joinAgree span.error{bottom:15px;} .warning{padding:20px 0 0 0; font-size:14px; color:#7d7d7d; } /* .all_chk{padding-bottom:24px; } */ .all_chk label{font-size:18px;} .all_chk_cap{padding-top:4px; padding-left:32px; font-size:15px; line-height:23px; color:#3d3d3d; } #contents ul.inTabs{width:100%; margin-bottom:30px; border-bottom:1px solid #ccc;} #contents ul.inTabs:after{content:""; display:block; clear:both;} #contents ul.inTabs li{position:relative; float:left; width:25%; padding:0 2px;} #contents ul.inTabs li:after{content:""; display:block; position:absolute; top:50%; right:0; width:1px; height:18px; margin-top:-9px; background:#ccc;} #contents ul.inTabs li:last-child:after{display:none; } #contents ul.inTabs li a{display:block; position:relative; width:100%; padding:20px 0; font-size:18px; font-weight:300; text-align:center;} #contents ul.inTabs li a:after{content:""; display:block; position:absolute; bottom:-1px; left:50%; width:0; height:5px; background:#0071d0; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition:all .5s; -o-transition: all .5s; transition: all .5s; } #contents ul.inTabs li a:hover:after, #contents ul.inTabs li.active a:after{width:100%; margin-left:-50%;} #contents ul.inTabs2{width:100%; margin-bottom:30px; 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;} #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;} #contents .myStatus{width:100%; height:100%; margin-bottom:60px; padding:30px 0; border-bottom:1px solid #ddd; border-top:2px solid #000; }/*background:#f8f8f8; */ #contents .myStatus:after{content:""; display:block; clear:both;} #contents .myStatus .myinfo{float:left; width:26%; height:100%; padding-left:10px; } #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; } #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:34px; 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; background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #7794fd), color-stop(0.74, #8065f6), color-stop(0.9500000000000001, #764eef)); background: -moz-linear-gradient(-138deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: -webkit-linear-gradient(-138deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: -o-linear-gradient(-138deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: -ms-linear-gradient(-138deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: linear-gradient(-138deg, #7794fd 0%, #8065f6 74%, #764eef 95%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7794fd', endColorstr='#764eef', gradientType=1); } #contents .myRoomMove a:before{content:""; display:block; position:absolute; top:68px; left:50%; width:42px; height:5px; margin-left:-21px; background:url("../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 .mypageGuide_renewal .myRoomMove a{padding:62px 0; background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #232f64), color-stop(0.74, #073993), color-stop(0.9500000000000001, #2e3e72)); background: -moz-linear-gradient(-138deg, #232f64 0%, #073993 74%, #2e3e72 95%); background: -webkit-linear-gradient(-138deg, #232f64 0%, #073993 74%, #2e3e72 95%); background: -o-linear-gradient(-138deg, #232f64 0%, #073993 74%, #2e3e72 95%); background: -ms-linear-gradient(-138deg, #232f64 0%, #073993 74%, #2e3e72 95%); background: linear-gradient(-138deg, #232f64 0%, #073993 74%, #2e3e72 95%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#232f64', endColorstr='#2e3e72', gradientType=1); } #contents .mypageGuide_renewal .myRoomMove p.title img{display:block; margin:0 auto 10px; } #contents .mypageGuide_renewal .myRoomMove a:before{top:95px; } #contents .mypageGuide2{height:120px; } #contents .myStatus2{padding:25px 0 25px 25px; } #contents .myStatus2 .myinfo{width:50%; padding-left:0; } #contents .myStatus2 .myinfo:after{content:""; display:block; clear:both;} #contents .myStatus2 .myinfo .float{float:left; } #contents .myStatus2 .myinfo .float.right{padding:10px 0 0 0;} #contents .myStatus2 .myinfo .top{padding-right:30px; } #contents .myStatus2 .myinfo .top a{display:block; margin-top:8px; } #contents .myStatus2 ul.lookUp{ width:50%; padding:8px 0 0 0; } #contents .myStatus2 ul.lookUp li{width:50%; } #contents .myStatus2 ul.lookUp li a{padding:0 15px; } #contents .myStatus2 ul.lookUp li a:after{content:""; display:block; clear:both;} #contents .myStatus2 ul.lookUp li p{float:left; } #contents .myStatus2 ul.lookUp li p.tit{padding:0 0 0 50px; line-height:50px; } #contents .myStatus2 ul.lookUp li.look1 p.tit{background: url("../html/images/ico_look_01.png") left center no-repeat;} #contents .myStatus2 ul.lookUp li.look2 p.tit{background: url("../html/images/ico_look_02.png") left center no-repeat;} #contents .myStatus2 ul.lookUp li a p.value{float:right; } #contents .myRoomMove2 a:before{top:85px;} #contents .myRoomMove2 p.title img{display:block; margin:0 auto; margin-bottom:8px;} /* 나의 강의실 상단 */ #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:54%; height:100%;} #contents .myRoom .myStatus ul.lookUp li{width:25%; height:100%; } #contents .myRoom .totalProgress{position:relative; float:left; width:46%; height:100%; padding:14px 10px; } #contents .myRoom .totalProgress:after{content:""; display:block; clear:both;} #contents .myRoom .totalProgress .txtBar{float:left; margin-right:15px;} #contents .myRoom .totalProgress .title{margin-bottom:15px; font-size:18px; 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("../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, #7794fd), color-stop(0.74, #8065f6), color-stop(0.9500000000000001, #764eef)); background: -moz-linear-gradient(-138deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: -webkit-linear-gradient(-138deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: -o-linear-gradient(-138deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: -ms-linear-gradient(-138deg, #7794fd 0%, #8065f6 74%, #764eef 95%); background: linear-gradient(-138deg, #7794fd 0%, #8065f6 74%, #764eef 95%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7794fd', endColorstr='#764eef', 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; letter-spacing:-1px } #contents .myRoom .totalProgress .numberA span.counter{font-size:55px; font-weight:600; color:#d70000;} /* 나의 강의실 상단 수정 */ #contents .myRoom.renewal{margin:25px 0 40px; padding-right:175px; padding-left:0;} #contents .myRoom.renewal .myRoomMove{left:auto; right:0;} #contents .myRoom.renewal .myRoomMove a{ background: -webkit-gradient(linear, left top, right bottom, color-stop(0, #ffb333), color-stop(0.74, #f39800), color-stop(0.9500000000000001, #d98903)); background: -moz-linear-gradient(-138deg, #ffb333 0%, #f39800 74%, #d98903 95%); background: -webkit-linear-gradient(-138deg, #ffb333 0%, #f39800 74%, #d98903 95%); background: -o-linear-gradient(-138deg, #ffb333 0%, #f39800 74%, #d98903 95%); background: -ms-linear-gradient(-138deg, #ffb333 0%, #f39800 74%, #d98903 95%); background: linear-gradient(-138deg, #ffb333 0%, #f39800 74%, #d98903 95%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffb333', endColorstr='#d98903', gradientType=1); } #contents .myRoom.renewal .myRoomMove a:before{ -ms-transform:rotateY(0) ; -webkit-transform:rotateY(0) ; transform:rotateY(0) ; } .study_year{float:left; width:44%; padding:0 15px; } .study_year p{padding-bottom:10px; font-size:18px; font-weight:500; color:#09458e;} .study_year .select_box{height:50px; font-size:0; } .study_year .select_box select{width:165px; height:100%; font-size:18px; color:#000; background:#fff url("../type1/images/sArrow1.png") 95% center no-repeat !important; border:1px solid #ccc; } .study_year .select_box .btn_basic{min-width:70px; height:100%; font-size:18px; line-height:50px; vertical-align:top; } /* 나의 수강 현황 */ #contents .captionBox{width:100%; margin-bottom:20px; padding:34px 40px; background:#f8f8f8; border-top:1px solid #ccc;} #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;} #contents .captionBox ul li:before{content:""; display:block; position:absolute; top:6px; left:0; width:12px; height:9px; background:url("../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;} #contents .lectureViewProgress:after{content:""; display:block; clear:both;} #contents .lectureViewProgress .totalProgress{position:relative; float:left; 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: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:#d70000;} #contents .lectureViewProgress.renewal{padding-right:30px;} #contents .lectureViewProgress .inT .small_cap{font-size:14px; color:#000;} #contents .lectureViewProgress .btn_right_box{position:relative; float:right; width:264px; margin:20px 0 0 0; padding-right:92px; } #contents .lectureViewProgress .btn_right_box > a{display:block; width:170px; height:42px; font-size:15px; font-weight:600; line-height:40px; text-align:center; } #contents .lectureViewProgress .btn_right_box > a.ass{margin-bottom:8px; color:#fff; background:#d70000; border:1px solid #d70000;} #contents .lectureViewProgress .btn_right_box > a.refresh{color:#000; background:#fff url("../image/ico_re_01.png") 15px center no-repeat; border:1px solid #ccc; } #contents .lectureViewProgress .btn_right_box .dday{display:block; position:absolute; top:0; right:0; width:88px; height:92px; text-align:center; background-color: #fff; border:1px solid #ccc; border-top:3px solid #d70000; } #contents .lectureViewProgress .btn_right_box .dday > strong{display:block; width:100%; padding:2px 0; font-size:18px; font-weight:600; color:#666; border-bottom:1px solid #ccc; } #contents .lectureViewProgress .btn_right_box .dday > strong span{color:#000; } #contents .lectureViewProgress .btn_right_box .dday .day{display:block; width:100%; padding:3px 0; font-size:12px; font-weight:600; color:#000; } #contents .lectureViewProgress .btn_right_box .dday .day .num{display:block; font-size:35px; font-weight:600; line-height:32px; } .lectureViewProgress.renewal .progress_box{position:relative; float:left; width:130px; min-height:100px; margin-right:30px; } .lectureViewProgress.renewal .progress_box .totalProgress{float:none; } .lectureViewProgress.renewal .progress_box .time{position:absolute; bottom:38px; left:33px; font-size:12px; color:#000; } .lectureViewProgress.renewal .progress_box .progressbar-text{top:42% !important; } .lectureViewProgress.renewal .progress_box .zero:after{top:42% !important;} .captionBox2{width:100%; margin-bottom:20px; padding:34px 40px; background:#edf5fb;} .captionBox2:after{content:""; display:block; clear:both;} .captionBox2 > ul{float:left; width:45%;} .captionBox2 > ul li{position:relative; display:inline-block; width:100%; margin:2px 0; padding-left:20px; font-size:14px; font-weight:300; color:#000;} .captionBox2 > ul li:before{content:""; display:block; position:absolute; top:6px; left:0; width:12px; height:9px; background:url("../type1/images/check.png") 0 0 no-repeat;} .captionBox2 .couponBox{position:relative; float:right; width:50%; padding-right:145px;} .captionBox2 .couponBox input[type="text"]{height:65px !important; border:none !important;} .captionBox2 .couponBox .lookUpBtn{width:145px;} /* 월별학습현황 */ #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;} #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("../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;} .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; } #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; } /* 게시판 리스트 댓글 표시 */ .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("../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("../type1/images/starScore_on.gif") 0 0 no-repeat;} #contents .tableview{width:100%;} #contents .tableview .top{position:relative; min-height:97px; padding:20px 20px 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{position:absolute; top:55px; left:16px; width:100%; text-align:left; } #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 .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:12%; padding:0 40px 0 24px; font-weight:400;} #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:88%; padding:0 12px; font-weight:300; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} /* 댓글달기 */ #contents .commentBox{width:100%; margin-bottom:54px; padding:45px 0; background:#fafafa; 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:152px; margin:0 auto; padding:0 126px 0 0; background:#fff; border:1px solid #ccc;} #contents .commentList > dd .commentIn{width:100%; margin-bottom:35px; } #contents .commentIn textarea{width:100%; height:100%; padding:13px 12px; resize:none; font-family:"NotoSansKR", sans-serif; vertical-align:top; } #contents .commentIn .commentB{position:absolute; top:0; right:0; width:126px; height:100%; font-weight:300; border:none;} #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; line-height:148px; } #contents .commentIn .commentB:after{content:""; display:block; position:absolute; top:0; left:0; width:0; height:100%; background:#00479d; -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 .commentListBox{width:100%; /*padding-bottom:45px;*/ background:#fafafa;} /*#contents .commentListBox{width:100%; padding-bottom:45px; background:#fafafa;}*/ #contents .commentList{width:100%; } #contents .commentList.depth_0 dd dl dt {padding-left:0px;background-position:0px center; } #contents .commentList.depth_0 dd dl dd {padding-left:25px; } #contents .commentList.depth_0 > dd .commentIn{width:100%; margin-bottom:35px; } #contents .commentList.depth_1 dd dl dt {padding-left:25px;background-position:0px center; } #contents .commentList.depth_1 dd dl dd {padding-left:25px; } #contents .commentList.depth_1 > dd .commentIn{margin:0px;margin-right:25px;margin-left:25px;width:calc(100% - 25px); } #contents .commentList.depth_2 dd dl dt {padding-left:50px;background-position:25px center; } #contents .commentList.depth_2 dd dl dd {padding-left:50px; } #contents .commentList.depth_2 > dd .commentIn{margin:0px;margin-right:25px;margin-left:50px;width:calc(100% - 50px); } #contents .commentList.depth_3 dd dl dt {padding-left:75px;background-position:50px center; } #contents .commentList.depth_3 dd dl dd {padding-left:75px; } #contents .commentList.depth_3 > dd .commentIn{margin:0px;margin-right:25px;margin-left:75px;width:calc(100% - 75px); } #contents .commentList.depth_4 dd dl dt {padding-left:100px;background-position:75px center; } #contents .commentList.depth_4 dd dl dd {padding-left:100px; } #contents .commentList.depth_4 > dd .commentIn{margin:0px;margin-right:25px;margin-left:100px;width:calc(100% - 100px); } #contents .commentList.depth_5 dd dl dt {padding-left:125px;background-position:100px center; } #contents .commentList.depth_5 dd dl dd {padding-left:125px; } #contents .commentList.depth_5 > dd .commentIn{margin:0px;margin-right:25px;margin-left:125px;width:calc(100% - 125px); } #contents .commentList > dt{width:100%; background:#fff; border-bottom:1px solid #c4c4c4; } #contents .commentList dt{position:relative; padding:14px 220px 14px 30px; border-top:1px solid #000; } #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:25px 30px; 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("../type1/images/answer.png") left center no-repeat; border-top:1px solid #ccc; border-bottom:1px dotted #cecece;} #contents .commentList dd dl dd{padding:25px;} /* 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;} #contents dl.questionsList dt:before{content:"Q"; display:block; position:absolute; top:-2px; left:40px; font-size:18px; font-weight:600; color:#d70000} #contents dl.questionsList dt:after{content:""; display:block; position:absolute; top:50%; right:40px; width:12px; height:12px; margin-top:-6px; background:url("../type1/images/on01.png") 0 0 no-repeat;} #contents dl.questionsList dt.active:after{background:url("../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;} /* 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 iframe{display:block; width:100%; } #contents .lectureViewTop .sampleVideo > img{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;} #contents .viewBuyInfo .viewInfo dd{width:100%; padding:15px 0 10px; } #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;margin-bottom:20px;} #contents .viewBuyInfo .viewInfo dd.priceB ul{min-height:104px;} #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%; } #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; } #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; } /* 강의상세탭 */ #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;} #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;} #contents .Introduce > li:after{content:""; display:block; clear:both;} #contents .Introduce > li .imgD{float:left; width:360px; height:100%; text-align:center; line-height:348px; border-right:1px solid #ccc;} #contents .Introduce > li .imgD img{display:inline-block; width:auto; max-width:80%; margin:0 auto;} #contents .Introduce > li .infoD{float:left; width:818px; height:100%; padding:40px;} #contents .Introduce > li .infoD strong{display:block; padding-bottom:10px; font-size:22px; font-weight:500; color:#32186d;} #contents .Introduce > li .infoD a{display:block; padding-bottom:10px; font-size:22px; font-weight:500; color:#32186d;} #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;} #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:330px; width:1px; height:100%; 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; } #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;} #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; } #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;} #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; } #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; } #contents .viewIntro{width:100%; padding:30px; font-size:18px; line-height:40px; color:#333; background:#f8f8f8; border-top:1px solid #ccc; } /* 영상후기 / 무료강의 */ #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; } #contents .bigVideo > img{display:block; width:100%;} #contents ul.videoThum{width:104%; margin-left:-4%;} #contents ul.videoThum:after{content:""; display:block; clear:both;} #contents ul.videoThum li{float:left; width:21%; height:400px; margin-left:4%;} #contents ul.videoThum li > div > a, #contents ul.videoThum li > div > a > img{/*display:block; width:100%;*/} /*#contents ul.videoThum li > div > a > img{display:block; width:100%;}*/ #contents ul.videoThum li .videoMove{margin-bottom:10px; border:1px solid #ccc;} #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 .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;} #contents .bookList > li:after{content:""; display:block; clear:both;} #contents .bookList > li .imgD{float:left; width:30%; height:100%; text-align:center; line-height:296px; border-right:1px solid #ccc;} #contents .bookList > li .imgD a{display:block; width:100%;} #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 40px;} #contents .bookList > li .infoD strong{display:block; padding-bottom:10px; font-size:22px; font-weight:500; color:#32186d;} #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;} #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 40px; } #contents .bookList > li .priceD .price{width:100%; height:110px; padding:0 20px; } #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;} #contents .teacherinfoBox .infoBox{width:910px; padding:30px 250px 0 70px; background:url("../type1/images/teacdot.gif") 0 0 repeat;} #contents .teacherinfoBox .word{font-size:35px; } #contents .teacherinfoBox dl.teachCareer{padding:40px 0 0 0;} #contents .teacherinfoBox dl.teachCareer dt{padding-bottom:32px; font-size:26px; font-weight:600; } #contents .teacherinfoBox dl.teachCareer dd{padding-bottom:70px; font-size:18px; line-height:28px; color:#666; } #contents .teacherinfoBox .imgBox{position:absolute; top:0; right:-100px; } #contents .teacherinfoBox .imgBox: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{width:101%; margin-left:-0.5%; } #contents .lectureList > ul:after{content:""; display:block; clear:both;} #contents .lectureList > ul > li{position:relative; float:left; width:32.33%; margin:15px 0.5%;} #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; } #contents .lectureList > ul > li .botInfo .box_t{height:50px; margin:10px 0; overflow:hidden; } #contents .lectureList > ul > li .botInfo .box_t p{font-size:16px; color:#333; } #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;} #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; border-top:1px solid #e0e0e0; } #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:#d70000; 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 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:#d70000;} #contents .stepArea li.active span.num{background:#d70000;} /* 장바구니/결제진행 */ #contents .paymentArea{position:relative; width:100%; margin-bottom:25px; /* min-height:850px; padding-right:420px; */} #contents .choice{width:100%; margin:15px 0 0 0; font-size:16px; font-weight:500; } #contents .choice a{display:inline-block; width:60px; height:30px; margin-left:10px; font-size:12px; font-weight:500; line-height:28px; text-align:center; background:#fff; border:1px solid #000; } #contents .choice span{display:inline-block; padding-left:15px; font-size:14px; font-weight:300; color:#666;} #contents .paymentBox{position:absolute; top:0; right:0; z-index:100; width:380px; padding:20px 35px 35px 35px; background:#fff; border:5px solid #ccc; } #contents .paymentBox.move{position:fixed;} #contents .paymentBox > p.tit{padding-bottom:15px; font-size:24px; font-weight:500; border-bottom:1px solid #000; } #contents .paymentBox ul.payment{width:100%; min-height:90px;} #contents .paymentBox ul.payment li{width:100%; padding:14px 0; border-bottom:1px solid #ccc; } #contents .paymentBox ul.payment li:after{content:""; display:block; clear:both; } #contents .paymentBox ul.payment li > span{font-size:16px; font-weight:300; } #contents .paymentBox ul.payment li span.tit{float:left; margin-right:10px; padding-top:6px;} #contents .paymentBox ul.payment li span.val{float:right; text-align:right;} #contents .paymentBox ul.payment li span.val b{font-size:24px; } #contents .paymentBox .bottomA{width:100%; margin-top:60px; } #contents .paymentBox .bottomA .payPrice{width:100%;} #contents .paymentBox .bottomA .payPrice:after{content:""; display:block; clear:both;} #contents .paymentBox .bottomA .payPrice span{font-size:16px;} #contents .paymentBox .bottomA .payPrice span.tit{float:left; padding-top:12px; font-weight:600; } #contents .paymentBox .bottomA .payPrice span.val{float:right; color:#d70000;} #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; }/* 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 > a:after{content:""; display:block; clear:both;} #contents ul.evevtList > li .banIn{position:relative; float:left; width:585px; height:150px;} #contents ul.evevtList > li .banIn img{display:block; width:100%; /*max-width:100%;*/ height:100%; } #contents ul.evevtList > li .txtIn{float:right; width:470px;} #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("../type1/images/endEvent.png") 0 0 no-repeat;} #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("../type1/images/pPrev.gif") 0 0 no-repeat;} .pager2 #jsPageNext{width:28px; height:28px; font-size:0; vertical-align:12px; background:url("../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:#d70000;} .condition.conIco2{background:#32186d;} .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; } ul.snsConnect li span.tit{position:absolute; top:15px; left:15px; } ul.snsConnect li .caption{font-size:14px;} /* 자동등록방지 이미지 */ #kcaptcha_image{display:inline-block; height:50px;} .agree_info{width:557px; padding:50px 38px 0 38px;} .agree_info > h1{padding-bottom:25px; font-size:26px; font-weight:400; } .agree_info .infoin{width:100%; height:450px; padding:15px; border:1px solid #ccc; overflow-y:auto;} .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; } /* 교육대상 */ .targer_area{padding:20px 20px 20px 0; margin:30px 0; border:1px solid #d7d6e1; overflow:hidden; box-sizing:border-box;} .targer_area .tit{padding:0 0 0 40px; box-sizing:border-box; float:left; font-size:26px; color:#09458e;} .targer_area .tit:after{content:""; display:block; clear:both; width:30px; height:2px; background:#00c5d5; margin-top:15px;} .targer_area .list_box{float:right; overflow:hidden;} .targer_area .list_box li{float:left;text-align:center;margin-left:20px;} .targer_area .list_box li a{display:block; width:180px; height:180px; box-sizing:border-box;border-radius:50%;border:1px solid #1c1d23;} .targer_area .list_box li a p {padding-top: 110px;font-size:18px;color:#1c1d23;font-weight:300;} .targer_area .list_box li a p {padding-top: 44px;font-size:35px;color:#1c1d23;font-weight:300;line-height: 1.2em;} .targer_area .list_box li.list01 a p{padding-top: 65px;} .targer_area .list_box li.on a {border:2px solid #00c5d5; border-radius:50%;} .targer_area .list_box li.on a p {color:#00c5d5; font-weight:500;} /* .targer_area .list_box li.list01 a{background:url("../html/images/ico_tg01_off.png") center 30px no-repeat;} .targer_area .list_box li.list02 a{background:url("../html/images/ico_tg02_off.png") center 30px no-repeat;} .targer_area .list_box li.list03 a{background:url("../html/images/ico_tg03_off.png") center 30px no-repeat;} .targer_area .list_box li.list04 a{background:url("../html/images/ico_tg04_off.png") center 30px no-repeat;} .targer_area .list_box li.list01.on a{background:url("../html/images/ico_tg01_on.png") center 30px no-repeat;} .targer_area .list_box li.list02.on a{background:url("../html/images/ico_tg02_on.png") center 30px no-repeat;} .targer_area .list_box li.list03.on a{background:url("../html/images/ico_tg03_on.png") center 30px no-repeat;} .targer_area .list_box li.list04.on a{background:url("../html/images/ico_tg04_on.png") center 30px no-repeat;} */ input::-ms-clear, input::-ms-reveal {display: none; width : 0; height: 0;} input::-webkit-search-decoration, input::-webkit-search-cancel-button, input::-webkit-search-results-button, input::-webkit-search-results-decoration { display: none; } #email-error{display:block; z-index:10; width:100%; background-color: #fff;} /* 마이페이지 수정 */ .mypageGuide_renewal{width:100%; margin:60px 0; border-top:2px solid #000; } .mypageGuide_renewal .mypageGuide_top{width:100%; padding:26px; border-bottom:1px solid #ccc; } .mypageGuide_renewal .mypageGuide_top .top{font-size:15px; color:#333; } .mypageGuide_renewal .mypageGuide_top .name{font-size:14px; font-weight:300; color:#333; } .mypageGuide_renewal .mypageGuide_top .name b{font-size:20px; } .mypageGuide_renewal .mypageGuide_in{position:relative; width:100%; padding:20px 24px; background-color: #f6f6f6;} .mypageGuide_renewal .mypageGuide_info{width:100%; padding-right:150px;} .mypageGuide_renewal .mypageGuide_info li{width:100%; position: relative; padding:0 0 18px 150px; font-size:15px; color:#333;} .mypageGuide_renewal .mypageGuide_info li:last-child{padding-bottom:0;} .mypageGuide_renewal .mypageGuide_info li span.tit{position:absolute; top:0; left:0; width:145px; } .mypageGuide_renewal .mypageGuide_info li .btn_basic{margin-left:10px; } .mypageGuide_renewal .btn_modify{display:inline-block; margin-left:8px; padding:0 15px; height:30px; font-size:15px; font-weight:500; color:#fff; line-height:30px; background-color: #4c4a48; -webkit-border-radius: 15px; -moz-border-radius:15px; border-radius: 15px; } .btn_basic{display:inline-block; min-width:95px; height:35px; font-size:15px; color:#fff; text-align:center; line-height:35px; } ul.mypageGuide_tabs{width:100%; margin-bottom:20px;} ul.mypageGuide_tabs:after{content:""; display:block; clear:both;} ul.mypageGuide_tabs li{display:table; float:left; width:calc(100% / 3 + 1px); margin-right:-1px; } ul.mypageGuide_tabs li a{display:table-cell; width:100%; height:80px; font-size:18px; font-weight:500; color:#333; text-align:center; vertical-align:middle; border:1px solid #8d8d8d; } ul.mypageGuide_tabs li.active a{color:#fff; background-color: #f39800; border:1px solid #f39800; } .edu_info_area .totalProgress{position:relative; float:left; width:130px; min-height:100px; margin-right:30px; } .edu_info_area .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); } .exp_pop_box{position:relative; width:100%; } .exp_pop_box .exp_pop{display:none; position:absolute; top:0; left:0; z-index:500; min-width:380px; min-height:320px; padding:45px; text-align:left; background-color: #fff; border:1px solid #333; } .exp_pop_box .exp_pop .close_btn{position:absolute; top:15px; right:15px; width:23px; cursor:pointer; } .exp_pop_box .exp_pop .close_btn img{display:block; width:100%; } .exp_pop_box .exp_pop strong{display:block; padding-bottom:18px; font-size:20px; font-weight:500; color:#000; } .exp_pop_box .exp_pop dl dt{position:relative; margin-top:15px; } .exp_pop_box .exp_pop dl dt:first-child{margin-top:0; } .exp_pop_box .exp_pop dl dt:before{content:""; display:block; position:absolute; top:10px; left:0; width:3px; height:3px; background-color: #000;} .exp_pop_box .exp_pop dl dt, .exp_pop_box .exp_pop dl dd{padding-left:12px; font-size:15px; font-weight:300; color:#000;} .exp_pop_btn{display:inline-block; width:42px; margin-left:10px; font-size:12px; font-weight:300; color:#fff; text-align:center; line-height:23px; vertical-align:2px; background-color: #00479d; -webkit-border-radius: 2px; -moz-border-radius:2px; border-radius:2px;} .edu_info_tr td{border-bottom:none !important; } .edu_info_td{padding:25px !important; background-color: #f8f8f8;} .edu_info_area{display:table; width:100%;} .edu_info_area .table_cell_box{display:table-cell; vertical-align:middle; } .edu_info_area .edu_info{width:100%; } .edu_info_area .edu_info li{position:relative; min-height:22px; margin-bottom:15px; padding-left:80px; font-size:15px; font-weight:300; color:#000;text-align:left; } .edu_info_area .edu_info li:before{content:""; display:block; position:absolute; top:10px; left:0; width:3px; height:3px; background-color: #000;} .edu_info_area .edu_info li:last-child{margin-bottom:0; } .edu_info_area .edu_info li span{position:absolute; top:0; left:10px; width:68px; } .edu_info_area .progress_box{} .edu_info_area .progress_box .totalProgress{float:none; margin:0 auto 25px;} .edu_info_area .progress_box .totalProgress .progressRate{position:relative; } .edu_info_area .progress_box .totalProgress .progressRate:before{content:"나의진도율"; display:block; position:absolute; bottom:40px; left:0; width:100%; font-size:12px; color:#000; text-align:center; } .edu_info_area .progress_box .totalProgress .progressbar-text{top:42% !important; } .edu_info_area .progress_box .totalProgress .zero:after{top:42%;} .edu_info_area .progress_box p{font-size:16px; color:#000; } .edu_info_area .progress_box p span.score{font-weight:800; color:#f39800;} .edu_info_area .edu_info_btn{width:170px; margin:0 auto; } .edu_info_area .edu_info_btn li{width:100%; margin:6px 0; } .edu_info_area .edu_info_btn li a{display:block; width:100%; height:50px; padding:0 0 0 50px; font-size:16px; line-height:50px; text-align:left; background-position: 20px center; background-repeat: no-repeat;} .edu_info_area .edu_info_btn li.edu_btn01 a{color:#000; background-color: #fff; background-image: url("../html/images/edu_ico_01.png"); border:1px solid #000; } .edu_info_area .edu_info_btn li.edu_btn02 a{color:#fff; background-color: #00479d; background-image: url("../html/images/edu_ico_02.png"); border:1px solid #00479d; } .edu_info_area .edu_info_btn li.edu_btn03 a{color:#000; background-color: #ffd800; background-image: url("../html/images/edu_ico_03.png"); border:1px solid #ffd800; } .edu_info_area .edu_info_btn li.edu_btn04 a{color:#f39800; background-color: #000; background-image: url("../html/images/edu_ico_04.png"); border:1px solid #000; } .emailNumA{width:100%; margin-top:35px; } .emailNumA .input_b{position:relative; width:100%; } .emailNumA .input_b span.time{position:absolute; top:14px; right:15px; font-size:14px; color:#333; } .pw_btn_box{width:100%; font-size:0; text-align:center; } .pw_btn_box a{display:inline-block; width:200px; height:200px; margin:0 12px; padding:48px 0 0 0; font-size:20px; font-weight:500; color:#666; text-align:center; background-color: #f9f9f9; border:3px solid #fff; -webkit-border-radius: 50%; -moz-border-radius:50%; border-radius:50%; } .pw_btn_box a span.ico{display:block; width:100%; height:60px; margin-bottom:12px; } .pw_btn_box a.btnPw01 span.ico{background:url("../image/ico_pw01_off.png") center center no-repeat;} .pw_btn_box a.btnPw02 span.ico{background:url("../image/ico_pw02_off.png") center center no-repeat;} .pw_btn_box a:hover.btnPw01 span.ico{background:url("../image/ico_pw01_on.png") center center no-repeat;} .pw_btn_box a:hover.btnPw02 span.ico{background:url("../image/ico_pw02_on.png") center center no-repeat;} .pw_btn_box a:hover{color:#00c5d5; background-color: #fff; border:3px solid #00c5d5; } .board_notice_span{display: inline-block;margin-right: 5px;background-color:blue;border-radius:5px;color:white;font-size:13px;font-weight:bolder;padding:1px 4px;} .board_notice_span2{background-color:blue;border-radius:5px;color:white;font-size:16px;font-weight:bolder;padding:1px 4px;} .targer_area{position:relative;} .targer_area .tipinfo_trigger_btn{position:absolute;left:22px;bottom:30px;letter-spacing: -0.045em;font-size: 18px;font-weight: 500;padding: 7px 0 16px 57px;text-align: left;background-position: 0 center;background-repeat: no-repeat;background-image: url("../image/bg_tipinfo01.png");color: #333333;} .targer_area .tipinfo_trigger_btn:after {content:'';display: inline-block;vertical-align: middle;width: 8px;height: 13px;margin-top: -6px;margin-left: 10px;background: url('../image/ico_tipinfo01.png') 0 0 no-repeat;} .targer_area .tipinfo_trigger_btn:hover {color: #00c5d5;} .targer_area .tipinfo_trigger_btn:hover:after {background-image: url('../image/ico_tipinfo01_on.png');} .fancybox-skin {border-radius: 6px !important;} #tipinfo{width:600px;padding-bottom: 60px;} #tipinfo h4{border-radius: 5px 5px 0 0;padding: 38px 60px 18px;background: #00479d;font-size: 30px;font-weight: 700;letter-spacing: -0.045em;color: #fff;} #tipinfo dl{padding:0 60px;margin-top: 32px;} #tipinfo dl + dl {margin-top: 25px;} #tipinfo dt{font-size: 22px;letter-spacing: -0.045em;color: #00c5d5;} #tipinfo dd{margin-top: 2px;font-size: 18px;letter-spacing: -0.045em;line-height: 26px;font-weight: 300;color: #333333;}