@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700|Noto+Sans+KR:100,300,400,500,700,900&display=swap&subset=korean');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css');
@import url('https://cdn.jsdelivr.net/gh/fonts-archive/KoPubDotum/subsets/KoPubDotum-dynamic-subset.css');


/* Font-Face */
* {box-sizing: border-box;}
html{margin:0; padding:0; width:100%; height: 100%; }
body{margin:0; padding:0; width:100%; height: 100%;  font-family:'KoPub Dotum','Pretendard', 'noto sans kr','Nanum Gothic','TheJamsil','Malgun Gothic',Dotum,Helvetica,AppleGothic,Sans-serif; font-size:16px; line-height:1.5; color:#808080; -webkit-text-size-adjust: 100%;}
img{margin:0; padding:0; border: 0; vertical-align: middle;}
a, a img{border:none; outline:0; selector-dummy : expression(this.hideFocus=true); text-decoration:none;}
a:hover {color: #ff9900;}
ul, ol, dt, dd, li {list-style-type: none; margin: 0; padding: 0;}
a:link, a:visited, a:active {color:inherit; text-decoration:none;}
p, div {margin:0; padding:0;}
::placeholder {color: #bbb;}
select {border: 1px solid #ddd; margin: 1px 0;}
table {border-spacing: 0; display: table;}
button, input, optgroup, select, textarea {color: inherit; font: inherit; margin: 0;}
button, .pointer {cursor: pointer;}
input[type="password"] {font-family: 'Nanum Gothic',sans-serif;}
input:hover{border-color: #0265cd; outline: none;}
input:focus{border-color: #0265cd; outline: none;}
/* layout */
#wrap {position: relative; margin:0; width: 100%; height:auto;}
#wrapmain {position: relative; margin:0 auto; width:100%;}
#header {position:relative; margin:0 auto; width:100%; height: auto;}
#footer {position:relative; clear:both; margin:0 auto;  bottom:0; width:100%; height:156px; background:#353d4a;}
.sub-body {padding-bottom: 30px;}
.section {width: 100%; max-width: 1100px; margin: 0 auto; position: relative;}
.section_full {width: 100%; position: relative;}
.inlineblock {display: inline-block; width: 100%; margin-top:-6px;}

input[type="checkbox"] {appearance: none; -moz-appearance: none; -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; vertical-align:middle; width: 20px; height: 20px; border-radius: 5px; border: 1px solid #aaa; background: #ffffff; box-sizing:border-box; margin:0 6px 0 0 !important; position:relative; }
input[type="checkbox"]:checked {background:#ffffff; border:2px solid #0063b6;}
input[type="checkbox"]:checked::before {content:'\e876'; font-family:var(--icon); font-size:20px; color:#0063b6; font-weight:500; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}


/* font */
h1,h2,h3,h4,h5 {font-weight: 700; color: #000; margin: 0;}
h1 {font-size: 15px;}
h2 {font-size: 18px;}
h3 {font-size: 28px; letter-spacing:-1.5px;}
h4 {font-size: 36px;}
h5 {font-size: 40px;}
hr {display: none;}
.f-rd {color: #ff0000;}
.font-red {color: #ca2500;}
.font-green {color: #1fa944;}
.font-blue {color: #3461ca;}
.font-sky {color: #648dec;}
.font-yellow {color: #d8d311;}
.font-orange {color: #ff9900;}

/* color */
.s-red {background: #ca2500;}
.s-green {background: #1fa944;}
.s-blue {background: #3461ca;}
.s-sky {background: #648dec;}
.s-yellow {background: #d8d311;}
.s-orange {background: #ff9900;}
.red {color:#FF0000;}
.green {color:#339900;}

/* faq */
.table_stats{width:100%;  border-top:1px solid #d7d7d7;  padding-bottom:10px; border-left:1px solid #d7d7d7; border-right:1px solid #d7d7d7; border-bottom:1px solid #d7d7d7; }
.table{width:100%; margin-top:10px;  border-top:1px solid #000000;  padding-bottom:10px; }
.table>thead>tr>th {display:none; height:60px; border-bottom:1px solid #d7d7d7; background:#fcfcfc; font-size:15px; text-align:center; color:#333333; font-weight:bold;}
.table>tbody>tr>td {height:60px; padding:20px 0px 20px; border-top:0px solid #dddddd; border-bottom:1px solid #d7d7d7; font-size:15px; vertical-align: middle;}
.table>tbody>tr>td p{line-height:230%; color:#444444;}
.table>tbody>tr>td a{padding-left:10px;}
.faqdate{display:none;}
.faq_search{width:100%;}

li.answer_faq{position: relative; }
li.answer_faq span.answer_icon{position:absolute; left:10px; width:40px; display:inline-block; top:5px; vertical-align:top;}
li.answer_faq .answer_txt{margin-left:46px;}

.pagination {display: inline-block;  padding-left: 0;  border-radius: 0;}
.pagination > li {  display: inline;}
.pagination > li > a,
.pagination > li > span {position: relative;  float: left;  padding: 7px 13px;  line-height: 1.42857143;  text-decoration: none;  color: #2780e3;  background-color: #ffffff;  border: 1px solid #dddddd;  margin: 2px;}
.pagination > li:first-child > a,
.pagination > li:first-child > span {margin-left: 0;  border-bottom-left-radius: 0;  border-top-left-radius: 0;}
.pagination > li:last-child > a,
.pagination > li:last-child > span {border-bottom-right-radius: 0;  border-top-right-radius: 0;}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {z-index: 2;  color: #165ba8;  background-color: #e6e6e6;  border-color: #dddddd;}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {z-index: 3;  color: #999999;  background-color: #f5f5f5;  border-color: #dddddd;  cursor: default;}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {color: #999999;  background-color: #ffffff;  border-color: #dddddd;  cursor: not-allowed;}



/* form */
li{list-style-type:none;}
textarea { font-family:'Nanum Gothic',Dotum,AppleGothic,sans-serif; height:74px; font-size:12px; padding: 4px; line-height:1.6; border:1px solid #ddd; resize:none;}
input {padding: 4px; font-size:14px; border:1px solid #ddd; box-sizing:border-box; margin-bottom:0px;}
input[type="checkbox" i], input[type="radio" i] {}
input.sss {width: 50px;}
input.ss {width: 100px;}
input.ls {width: 80%;}
input.hs {width: 50%;}
input.fs {width: 100%;}
.form-control {min-width: 43px;height: 35px;padding: 5px 10px;}
.btn-r{color:#777777;}

/* 커스텀체크 */
.check-con {text-align: left;display: inline-block;position: relative;padding-left: 22px; cursor: pointer;font-size: 14px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; max-width: 100%; font-weight: 500; white-space: nowrap;}
.check-con input {position: absolute;opacity: 0;cursor: pointer;margin: 4px 0 0;}
.check-con input:checked ~ .marking {background-color: #2196F3;}
.marking {position: absolute; top: 2px; left: 0; height: 15px; width: 15px; background-color: #ddd;}
.check-con input:checked ~ .marking:after {display: block;}
.check-con .marking:after {left: 5px;top: 1px;width: 4px;height: 9px;border: solid white;border-width: 0 2px 2px 0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);}
.marking:after {content: "";position: absolute;display: none;}

/* 커스텀 셀렉트 */
.select_dsg {position: relative; display: inline-block; width: 100%;}
.select_dsg::after {content:"▼"; display: inline-block; right: 10px; top: 10px; width: 10px; height: 10px; position: absolute;}
.option {width: 100%; display: none; position: absolute; background: #fff;}
.option li, .def-opt {background: #f9f9f9; color: #333; font-size: 13px; padding: 0 10px; height: 35px; line-height: 35px; cursor: pointer; border: 1px solid #ddd;}
.select_dsg .option li {border-top: 1px solid #ddd; border-top: 0; width: 100%; margin: 0; padding: 0 10px; z-index: 9; height: auto;}
.select_dsg .option li:hover {background: #f5f5f5;}
.def-opt {display: block; font-weight: 700;}
.saleBefore {text-decoration: line-through; color: #aaa;}

/* 페이징 */
.page {text-align:center; width:100%; padding: 20px 0;}
.page section {display:inline-block; font-weight:normal; }
.cd-pagination {overflow:hidden;}
.cd-pagination li{margin:0 2px;  float:left; font-size:15px; line-height:33px;  box-sizing:border-box;}
.cd-pagination li a {width:36px; height:36px; display:block; color:#666; border: 1px solid #eee; line-height: 36px;}
.cd-pagination li.on a{background:#061f5c; color:#fff; cursor:default;}
.cd-pagination li.button a{width:38px; height:36px; line-height: 36px; border:1px solid #eee;}
.cd-pagination li.button a.disabled, .page li.button a.disabled:hover {background: #f5f5f5; cursor: not-allowed;}
.cd-pagination li.button-none{display:none;}
.cd-pagination li.off a:hover, .page li.button a:hover{background:#d5d5d5; color:#666;}
.cd-pagination li .current {width:36px; height:36px; display:block; background:#000000; color:#ffffff;}

/* 여백 */
.space10 {height: 10px; clear: both;}
.space20 {height: 20px; clear: both;}
.space30 {height: 30px; clear: both;}
.space50 {height: 50px; clear: both;}
.space80 {height: 80px; clear: both;}
.space100 {height: 100px; clear: both;}

.book_banner div.banner3 {width:100%;}
.book_banner div.banner {width:49.7%; margin-right:0.6%;}
.book_banner div.banner:last-child{margin-right:0;}
.book_banner div.banner img {width:100%;}
.book_banner div.banner:hover {overflow:hidden;}
.book_banner div.banner:hover img {transform:scale(1.05); transition:all 0.5s;}
.banner4-space {margin-top:0.6%;}

@media only screen and (min-width : 361px) and (max-width : 768px){
    .book_banner div.banner {width:100%;}
    .book_banner div.banner:last-child {margin-top:5px;}
    .banner4-space {margin-top:6px;}
}
@media only screen and (min-width : 100px) and (max-width : 360px){
    .book_banner div.banner {width:100%;}
    .book_banner div.banner:last-child {margin-top:5px;}
}


/* 테이블 */
.table_board_for {width:100%; margin-bottom:15px;}
.table_board_for th {height:46px; text-align:center; border-top:1px solid #000; color:#000; font-weight:500; background:#fff; font-size:15px; border-bottom:1px solid #dddddd; vertical-align: middle;}
.table_board_for td {line-height: 150%; height:46px; font-size:15px; color:#555; padding-top:5px; padding-bottom:5px; text-align:center; border-bottom:1px solid #ddd; vertical-align: middle;}
.table_board_for td.gallery {margin-top:10px; padding-bottom:15px; color:#666; border-bottom:1px solid #fff; font-size:13px; text-align:center; letter-spacing:0px;}
.table_board_for td.gallery img{height:120px;  width:180px; margin-top:15px; margin-bottom:10px; color:#666; border:1px solid #dddddd;  font-size:13px; text-align:center; letter-spacing:0px;}
.table_board_for td.noline{border-bottom:1px solid #fff;}
.table_board_for td.bleft{text-align:left;}
.table_board_for td.bright{text-align:right;}
.table_board_for td.nleft {height:36px; color:#666; padding-left:15px; padding-top:10px; padding-bottom:10px; border-bottom:1px solid #d7d7d7; font-size:13px; text-align:left; letter-spacing:0px;}
.table_write{width:100%; height:100%;  border-top:1px solid #333333;  margin-bottom: 10px;}
.table_write tr>th {width: 18%; vertical-align: middle; height:40px; padding-left:10px; border-bottom:1px solid #d7d7d7;  color:#333333; background:#fcfcfc; font-size:13px; text-align:left;  border-right:1px solid #d7d7d7;}
.table_write tr>th:last-child  { border-right:1px solid #ffffff; }
.table_write tr>td { vertical-align: middle; padding:10px 5px; border-bottom:1px solid #d7d7d7; font-size:13px; text-align:left; border-right:1px solid #d7d7d7; word-break: break-all;}
.table_write tr>td.wh{height:40px; padding-left:10px; padding-bottom:7px; border-bottom:1px solid #d7d7d7; font-size:13px; text-align:left; border-right:1px solid #d7d7d7;}


.contable {overflow:hidden; width:100%; margin:0 0 12px; word-break:break-all;}
.contable .section-box {display: table; width: 100%;}
.table-title, .table-color {text-align: center; margin: 0;}
.contable .section-box .ul-1 {border-top: 2px solid #000; overflow: hidden; background: #ffffff; border-bottom: 1px solid #ddd; display: table; width: 100%;}
.contable .section-box .ul-1 > li {line-height: 30px; padding: 12px 15px; display: table-cell; vertical-align: middle; min-height: 50px;}
.table-title .section-box .ul-1 li {padding: 12px 0; line-height: 1.6;}
.table-color .section-box .ul-1 {border-top: 0;}
.table-color .section-box:nth-child(odd) .ul-1 {background: #fff;}
.table-textlist .section-box .ul-1 > li {line-height: 1.6; padding: 15px 3px; display: table-cell; vertical-align: middle; float: none;}
.table-color .section-box:nth-child(odd) .ul-1 {background: #fff;}
.table-color .section-box:nth-child(even) .ul-1 {background: #fff;}
.table-title .section-box .ul-1 {color: #333; font-weight: 700;}
.inline-block {display: inline-block; width: 100%;}

.dtable {width: 100%; display: table;}
.table-th {background: #f5f5f5; display: table-cell; border-top: 1px solid #ddd; padding: 10px 15px; height: 50px; vertical-align: middle; font-weight: 700; color: #333;}
.table-td {display: table-cell; border-top: 1px solid #ddd; height: 50px; vertical-align: middle; padding: 10px 15px; line-height: 1.5;}
.dtable .table-th {width: 15%;}
.dtable.col2 {width: 100%;}
.dtable.col2 .table-th {width: 15%;}
.dtable.col2 .table-td {width: 35%;}
.table-textlist section:last-child  ul.ul-1 {border-bottom: 1px solid #ddd;}

.issueBox {margin-top:20px;}
.issueBox:after {content:""; display:block; clear:both;}
.taxBox .dtable.col2 {width:50%; float:left;}
.taxBoxList {display:inline-block; width:100%; }
.taxBoxList:after {content:""; display:block; clear:both;}
.taxBoxList ul li {width:calc(100% / 2); float:left; padding:10px; position:relative;}
.taxBoxList ul li:before {content:""; display:inline-block; width:3px;height:3px; border-radius:50%; background:#28b9b4; position:absolute; left:0; top:50%; margin-top:-1px;}
.taxBoxList ul li + li {border-top:1px dotted #ddd;}
.taxBoxList ul li.col1 {width:100%;}
.cashType .check-con {margin-right: 20px;}


/* button */
.btn-box {padding: 5px; text-align: center;}
.lecture-btn-box {padding: 5px; text-align: center;position: absolute;width: 100%;bottom: 5px;}
#btn {position:relative; margin:0 auto; width:100%; height:30px; padding-top:10px; padding-bottom:10px;}
button {outline: none; margin:0px 0; border:0; height: 35px; color: #fff; border-radius: 2px; font-weight: 600; cursor: pointer; padding: 0 15px;}
button:hover {opacity: 0.7;}
button > img {width: 20px; height: 20px; margin-right: 5px;}
button.confirm {background: #0082ca; margin-bottom: 5px;}
button.cancel {background: #c73131; margin-bottom: 5px;}
button.payment {background: #0082d0; margin-bottom: 5px;}
button.file-down {padding: 2px 5px; font-size: 11px; background: #000;}
button.file-down img {width: 15px; height: 15px;}
button.small.sample_btn {margin-bottom: 3px;}
.btn {font-weight: 700; outline: none;}
.btn_center {text-align:center; padding-bottom:10px; padding-top:20px; width:100%; }
.icon_qna_notice { background: #000; font-size: 11px; width: 72px; cursor: default; height: 20px;}
.repl-1, .repl-2, .repl-3 {font-size: 11px; width: 72px; cursor: default; height: 20px;}
.repl-1 {background: #ca2500;}
.repl-2 {background: #1fa944;}
.repl-3 {background: #3461ca;}
.question {margin-bottom: 10px;}
.answer {margin-top: 30px; padding-top: 20px; border-top: 1px dashed #ddd; margin-bottom: 10px;}
.btn_board_right {width:50%; text-align:right; float:right; padding-bottom:5px;}
.btn_white {text-align:center; height:24px; border:1px solid #cccccc; color:#666666;  padding-left:7px; padding-right:7px; cursor:pointer;  border-radius:2px; font-weight:bold; background:#fafafa; text-decoration:none;}
.btn_white:hover{text-decoration:none; background:#c0c0c0; color:#fff; font-weight:bold;}
.bbs-normalbtn {color: #000; background: none; border: 1px solid #ddd; font-size: 15px; border-radius:3px; }
.bbs-normalbtn.bbs-confirm {background: #000; color: #fff; border-color: #000;}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.aactive > a:focus {cursor: pointer;}
.wrap_sms_auth_number{border:0px solid #ddd; padding-left:10px; padding-top:5px;}
button.add-btn {font-size: 11px; font-weight: 400; background: #fff; color: #000; border: 1px solid #000;}
button.large {border: 0; border-radius: 5px; font-size: 12px; width: 49%; height: 50px;}
button.small {font-size: 12px;letter-spacing: -1px;background: #af0d23;padding: 5px;border-radius: 3px;color: #fff; width: 80px; display: block; margin-bottom: 1px;}
button.small img {width: 14px; height: 14px; margin-left: 10px; position: relative; top: -1px;}
button.round-btn {font-size: 11px; border-radius: 5px; position: relative; top: -2px;left: 5px; height: 20px; padding: 0 10px; min-height: auto; line-height: 20px;}
button.small-line {border: 1px solid #ddd;background: #fff;color: #333;font-size: 11px;padding: 5px;}
button.normal {border: 1px solid #ddd; background: #fff; color: #000; margin-left:2px;}
button.s-btn {font-size: 11px; width: 72px; height: 20px;}
button.btn-cate {background: #ff9900;}
button.buyGo {background: var(--main);}
button.buyCart {background: #ffffff; color: #2196f3;  border:1px solid #2196f3; font-weight:500;}
button.buyCart:hover{background: #2196f3; color: #ffffff;  border:1px solid #2196f3; font-weight:500; transition:all 0.2s ease-out;}
button.myStudy {background: #ff9900;}
.k-bnt, .k-bnt-l {background:#444; cursor:pointer; margin:0 2px;}
.k-bnt-s, .b-bnt-s, .rp-bnt-s, .g-bnt-s, .wk-bnt-s, .r-bnt-s, .bl-bnt-s, .et-btn-s {background:#444; width:150px; height:40px; font-size:12px; text-align:center; cursor:pointer; margin:0 2px; padding: 0;}
.k-bnt:hover, .k-bnt-s:hover, .k-bnt-l:hover{background:#111;}
.bl-bnt:hover, .bl-bnt-s:hover, .bl-bnt-l:hover {background:var(--mainOver);  opacity:1;}
.et-btn:hover, .et-btn-s:hover, .et-btn-l:hover {background:#6600cc;}
.b-bnt:hover, .b-bnt-s:hover, .b-bnt-l:hover{background:#203c6c;}
.rp-bnt:hover, .rp-bnt-s:hover{background:#b0204c;}
.g-bnt:hover, .g-bnt-s:hover{background:#246440;}
.y-bnt:hover, .y-bnt-s:hover, .y-bnt-l:hover {background:#de8500;}
.wk-bnt:hover, .wk-bnt-s:hover, .wk-bnt-l:hover, .sms-bnt:hover{background:#d5d5d5;}
.r-bnt:hover, .r-bnt-s:hover{background:#222222;}

.bnt-ss {margin:0; padding:0; width:70px; height:22px; line-height:22px; text-align:center; font-size:11px; font-weight:normal; letter-spacing: -1px;}
.b-bnt, .b-bnt-s, .b-bnt-l{background:#284b87;}
.bl-bnt, .bl-bnt-s, .bl-bnt-l{background:var(--main);}
.et-btn, .et-btn-s, .et-btn-l{background:#6633cc;}
.rp-bnt, .rp-bnt-s{background:#dc285f;}
.g-bnt, .g-bnt-s{background:#2d7d50;}
.y-bnt, .y-bnt-s, .y-bnt-l{background:#ff9900;}
.wk-bnt, .wk-bnt-s, .wk-bnt-l, .sms-bnt{background:#eee; color:#444;}
.r-bnt, .r-bnt-s{background:var(--gray)}

.gry-bnt {background: #a0a0a0;}
.sms-bnt {width:30px; height:30px; padding:7px; margin:0 5px 10px 0; font-size:16px; line-height:16px; color:#444;}
.btn-confirm {border: 0; background: var(--main); color: #fff; padding:12px 0; font-weight: 600; height:45px; width: 100%; font-size: 16px; margin-top: 5px; border-radius:4px;}
.btn-confirm img {width: 20px; height: 20px; margin-top: -4px;}


/* icon */
.recomIco {background: #b11116; color:#ffffff; padding:1px 5px 1px 5px; font-size:11px; font-weight:bold;}
.bestIco {background: #339900; color:#ffffff; padding:1px 5px 1px 5px; font-size:11px; font-weight:bold;}
.popuIco {background: #02b7df; color:#ffffff; padding:1px 5px 1px 5px; font-size:11px; font-weight:bold;}
.newIco {background: #ff9900; color:#ffffff; padding:1px 5px 1px 5px; font-size:11px; font-weight:bold;}
.saleIco {background: #b11116; color:#ffffff; padding:1px 5px 1px 5px; font-size:11px; font-weight:bold;}


/* SNS공유버튼 */
.social-btn {width: 100%; text-align: right; margin: 20px 0;}
.social-btn button {width: 25px; height: 25px; border: 0; border-radius: 0; margin-right: 5px; padding: 0;}
.social-btn button.facebook {background: url(/files/default-img/facebook-icon.png) no-repeat center top;}
.social-btn button.instar {background: url(/files/default-img/insta-icon.png) no-repeat center top;}
.social-btn button.kakao {background: url(/files/default-img/kakao-icon.png) no-repeat center top;}
.social-btn button.tellegram {background: url(/files/default-img/tellegram-icon.png) no-repeat center top;}
.abcRioButtonContentWrapper {display: none;}


/* 신청폼 */
.memoform {width: 100%; max-width: 700px; margin: 30px auto;}
.addEtc {padding-top: 5px;}

/* 게시판 탭메뉴 */
.category-tap {display: flex; display: -ms-flexbox;}
.cate-tap.bottom-line {border-bottom: 1px solid #ddd; margin-bottom: 30px;}
.cate-tap {width: 100%; display: inline-block;}
.cate-tap li {height: 40px; background: #fff; float: left; font-size: 13px; line-height: 40px; border: 1px solid #ddd; border-bottom: 0;}
.cate-tap li a {display: block; padding: 0 20px;}
.cate-tap li:hover {background: #f5f5f5;}
.cate-tap li.active {background: #000;}
.cate-tap li.active a {color: #fff;}
.cate-tap li + li {margin-left: 2px;}

/* 게시판 */
.btn_left  {width:75%; text-align:left; float:left; padding-bottom:10px;}
.bbslist.btn_right {width: 25%; text-align: right; float: right; padding-bottom: 10px;}
.boardSearch {text-align: center;}
.btn_bbs_search {background: #000000; position: relative; height: 35px; font-size: 13px;}
.bbsRead-img img {width: auto; max-width: 100%;}
.youtubeWrap {position: relative;width: 100%;padding-bottom: 56.25%; margin-bottom: 10px;}
.youtubeWrap iframe {position: absolute;width: 100%;height: 100%;}
.bbsbox-table {background: #fff; width: 170px; text-align: center; padding: 10px; border: 1px solid #ddd;}
.bbsbox-table thead tr:first-child td {background: #ff9900; color: #fff; font-weight: 700; padding: 5px 0;}
.bbsbox-table thead tr:first-child td img {width: 15px; height: 15px;}
.bbsbox-table input {margin: 5px 0;}
.bbsbox-table button {width: 48.7%;}
.bbsSubject {text-align: left; cursor: pointer;}
span.date {position: absolute; right: 10px; font-size:15px;}
.cateName {color: #ff9900;}
.utbThumbWrap {padding-bottom:56%;}
.utbThumbWrap .utbThumb {top:-17%;}
.utbThumbWrap .g_list_img {height:auto;}


/* 좋아요 */
.thumb-up {display: inline-block; margin-left: 3px; width: 40px;}
.thumb-up img {width: 18px; height: 18px; position: relative;}
.thumb-up.readpage .thumbup_bg {color: #fff; font-size: 11px; margin-left: 5px;}
.thumb-up.readpage .thumbup_bg.on {color: #ff0000;}
.thumb-up.readpage {float: left; cursor: pointer; width: auto; background: #4267b2; color: #fff; padding: 3px 10px; border-radius: 10px; white-space: nowrap;}
.thumb-up.readpage img {width: 25px; height: 25px;}


/* 댓글 */
.commnet_title {font-size:13px; line-height:100%; margin-bottom:5px; margin-top:20px; padding-left:10px; vertical-align:middle; color:#333333; font-weight:bold; text-align:left;}
#comment_total {color: #ff0000;}
.table_comment {width:100%; background:#f9f9f9; padding: 10px;}
.ctext {height: 30px; font-size: 12px; line-height: 1.5; padding: 10px; vertical-align: middle;}
.clock-icon {width: 14px; height: 14px; margin-left: 10px;}
.comment-btn {display: inline-block;}
.comment_header tr td:last-child {width: 100px;}
.comment_list > td {border-bottom: 1px dashed #ddd;}
.comment_list > td li {padding: 5px;}
.comment_list:last-child td {border-bottom: 0}
.commSbm {width: 100px; height: 55px; position: relative; top: 7px;}

/* 뉴스게시판 */
.ul-news {width: 100%; margin-bottom: 5px; border: 1px solid #ddd; border-spacing: 5px;}
.ul-news * {-webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.45s ease-in-out; transition: all 0.45s ease-in-out;}
.ul-news td {vertical-align: top; position: relative;}
.ul-news td:first-child {width: 140px;}
.ul-news td:last-child {width: auto;}
.news-txt {margin-bottom: 10px; padding-right: 20px;}
.news-txt .title {font-size: 13px; margin: 5px 0; font-weight: 700; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap: break-word; height: 20px;  color: #000;}
.news-txt p {color: #969696;}
.news-txt p.news-con {color: #444; font-size: 13px; margin-top: 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; word-wrap:break-word; height: 50px; line-height: 1.8;}
.new-padding-wrap {position: relative; width: 120px; height: 0; overflow: hidden; padding-bottom: 90%;}
.new-wrap {position: absolute; top: 0; left: 0; width: 120px; height: 120px;}
.new-wrap img {width: 120px;}
.new-wrap:hover img {-webkit-transform: scale(1.15); transform: scale(1.15); -webkit-filter: grayscale(120px); filter: grayscale(120px);}

/* 갤러리게시판 */
.ul-photo {display: table; width: 100%; margin-bottom: 30px;}
.ul-photo > li {width: 22%; margin: 10px 1.5%; float: left; border: 1px solid #ddd; position: relative;}
.ul-photo > li * {-webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.45s ease-in-out; transition: all 0.45s ease-in-out;}
.padding-wrap {position: relative; width: 100%; height: 0; overflow: hidden; padding-bottom: 90%;}
.img-wrap {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.img-wrap img {width: 100%;}
.img-wrap:hover img {-webkit-transform: scale(1.15); transform: scale(1.15); -webkit-filter: grayscale(100%); filter: grayscale(100%);}
.photo-txt {padding: 10px; text-align: left;}
.photo-txt .title {font-weight: 700; margin-bottom: 10px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word; height: 36px;}
ul.photo-date {width: 100%; display: table; background: #f5f5f5; padding: 10px;}
ul.photo-date li {border: 0; float: left; margin: 0;}
ul.photo-date li:last-child {float: right;}
.ul-photo .newIcon {position: absolute; left: 0; top: 0; margin: 0;}
.utbThumbWrap {padding-bottom: 66%;}
.utbThumb {margin-top: -14%;}



/* 일반게시판 */
.content_box {line-height: 2; padding: 20px 0;}
.bbslist-t li {width:10%;}
.bbslist-t li.bbsSubject{width:auto;}


/* 질문게시판 */
.boardQna li:nth-child(1){width:10%;}
.boardQna li:nth-child(2){width:auto;}
.boardQna li:nth-child(3){width:12%;}
.boardQna li:nth-child(4){width:12%;}
.boardQna li:nth-child(5){width:10%;}
.boardQna li:nth-child(6){width:80px;}

/* FAQ */
section.faq {border-top: 1px solid #000;}
.ul-faq {width: 100%; display: table;}
.ul-faq li {border-bottom: 1px solid #ddd;}
.ul-faq .flip {width: 100%; padding: 20px 0 20px 10px; font-size: 15px; font-weight: 700; cursor: pointer; position: relative; color: #000;}
.ul-faq .panel {display: none; padding: 40px 20px; width: 100%; font-size: 15px;}
.ul-faq .panel p img {width: auto; max-width: 100%;}
.q-icon {width: 30px; height: 30px; fill: #ca2500; position: absolute; top: 14px; left: 10px;}

/* boxreview */
.bbody.boxreview ul {padding: 10px; position: relative; border: 1px solid #ddd;}
.bbody.boxreview ul li:first-child {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;word-wrap:break-word; white-space: normal;}
.bbody.boxreview ul li:first-child a {font-size: 15px; line-height: 1.4; display: block; height: 53px; padding-bottom: 10px; border-bottom: 1px solid #000;}
.bbody.boxreview ul li a > span:first-child, .bbody.boxreview ul li a .newIcon {display: none;}
.bbody.boxreview ul li.contents {height: 238px; font-size: 14px; line-height: 1.8; padding: 10px 0; white-space: normal;}
.bbody.boxreview .bx-wrapper .bx-prev {left: 0;}
.bbody.boxreview .bx-wrapper .bx-next {right: 0;}


/* 매거진 */
/*REFERENCE*/
.text-class{width:100%; overflow:hidden; line-height:14px; font-size:14px; color:#505050; margin:50px 0 12px;}
.text-class > li{ width:50%;display:block; float:left; padding-left:20px;}
.text-class li ul{float:right;}
.text-class li ul li{float:left; padding:0 20px; border-right:1px solid #ccc;}
.text-class li ul li:hover{cursor:pointer;}
.text-class li ul li:last-child{border:0; padding-right:0;}

.text-list{width:100%; padding:40px 20px 50px; border-top:1px solid #ccc;}
.text-list:last-child{border-bottom:1px solid #ccc;}
.text-list .text-title{font-size:18px; color:#2c5698; font-weight:bold;}
.text-list .text-body{font-size:16px; color:#505050; line-height:1.4; width:100%; overflow:hidden; text-overflow:ellipsis; white-space:normal; word-wrap:break-word;  display:-webkit-box;
    -webkit-line-clamp:2; -webkit-box-orient:vertical;  margin:20px 0;}
.text-list .text-date li{font-size:13px; color:#808080; float:left; padding:0 15px; border-left:1px solid #ccc; }
.text-list .text-date li:first-child{padding-left:0; border:0;}

.right-paging{padding-top:80px;}
.right-paging ul{display:block; overflow:hidden; width:540px; padding-left:100px; margin:0 auto;}
.right-paging li{width:50px; height:50px; line-height:50px;  background:#f0f0f0; color:#808080; font-size:22px; text-align:center; float:left; margin-right:10px;}
.right-paging li:last-child{background:none; width:130px; text-align:right; font-size:20px; }
.right-paging li a{width:100%; height:100%; display:block;}


/* 메인캘린더 */
.calendar {background:#fbfbfb; border:1px solid #ddd; padding:50px 30px; display:inline-block; width:100%; margin-top:40px;}
.calendar .cal_area {width:70%; float:left; border-right:1px solid #ddd; padding-right:30px;}
.calendar .scheduleList {width:calc(30% - 30px); float:left; margin-left:30px;}
.calendar .cal_header .cal_month {display:inline-block;}
.calendar .cal_header .cal_month h1 {font-size:35px; letter-spacing:-1px;}
.calendar .cal_header .cal_btn{ display:inline-block; float:right;}
.calendar .cal_header .cal_btn a {width:50px; height:50px; display:block; border:1px solid #ddd; text-align:center; line-height:50px; font-size:25px; float:left;}
.calendar .cal_header .cal_btn a + a {border-left:0;}

.calendar .line_row {display: table; width:100%;}
.calendar .line_row div {width:calc(100% / 7); text-align:center; height:70px; display: table-cell; vertical-align: middle;}
.calendar .line_row .day-name {font-size:17px; color:#000; font-weight:600;}
.calendar .line_row .day {font-size:17px; color:#000; font-weight:600; cursor:pointer;}
.calendar .line_row .day-name.sun, .calendar .line_row .day.sun {color:#ff3268;}
.calendar .line_row .day-name.sat, .calendar .line_row .day.sat {color:#6a7dea;}
.calendar .line_row .day.inactive {color:#e3e3e3 !important;}
.calendar .line_row .day span {border-radius:50%; width: 50px; height: 50px; display: block; margin: 0 auto; line-height: 50px;}
.day.onEvent span {background: #f2f2f2; color: #000;}
.day.today span {background: #5e7fe6; color: #fff;}
.day.active span {background: #f44336; color: #fff;}
.calendar .scheduleList .list_header h1 {font-size:35px;}
.calendar .scheduleList .default_txt {display:table-cell; height:400px; vertical-align:middle;}
.calendar .scheduleList .schedule {height: 490px; overflow: auto; position: relative; padding-bottom: 50px; display: none;}
.calendar .scheduleList .schedule.active {display:inline-block;}
.calendar .scheduleList .schedule .schedule_header {margin:20px 0 0; letter-spacing:-0.8px;}
.calendar .scheduleList .schedule .schedule_header .clickDate {font-size:18px; font-weight:400; margin-bottom:5px;  border-bottom:1px solid #ddd; padding-bottom:20px;}
.calendar .scheduleList .schedule .schedule_header .title {font-size: 17px; padding-top:5px;}
.calendar .scheduleList .schedule .schedule_content {font-size: 13px; line-height:21px; letter-spacing:-0.5px; padding-bottom: 20px; border-bottom: 1px dashed #ddd;}
.calendar .scheduleList .schedule::-webkit-scrollbar {width: 0;}
.calendar .scheduleList .list_txt {position: relative;}
.calendar .scheduleList .list_txt:after {content:''; display: block; width: 100%; height: 50px; position: absolute; left: 0; bottom: 0; background: linear-gradient(rgba(251,251,251,.5), rgba(251,251,251,.9));}
.calendar .schedule_date {color: #666; margin-bottom: 10px;}


/* 내글만보기 */
.table_board_for.myBoard th,.table_board_for.myBoard td {width:15%;}
.table_board_for.myBoard th:nth-child(1), .table_board_for.myBoard td:nth-child(1) {width:8%;}
.table_board_for.myBoard th:nth-child(3), .table_board_for.myBoard td:nth-child(3) {width:50%;}


/* 메인게시판 */
.newIcon {margin-left: 3px;}

/* 강사소개/상세 */
.teacher_con {position:relative; overflow:hidden; padding-top:20px; padding-bottom:20px;}
.teacher_con_box {overflow:hidden; border-bottom:1px solid #e1e1e1; padding-bottom:20px;}
.teacher_box {float:left; width: 23%; border:1px solid #d6dce7; margin: 10px 1%;}
.teacher_box > a > .techer-img {width: 100%; height: 0; overflow: hidden; padding-top: 100%; position: relative;}
.teacher_box > a > .techer-img img {width: 100%; border: 0; position: absolute; top: 0; left: 0;}
.teacher_box .teacher_title {height:46px; text-align:left; padding: 10px; font-size:13px; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap:break-word; width: 100%;}
.teacher_box .teacher_name {padding: 10px; height:45px; text-align:left; color:#3f8dc2; font-size: 18px; font-weight:bold;}
.teacher_box .teacher_name a:hover {color:#3f8dc2;}
.teacher_box .teacher_text {font-size:12px; height:68px; text-align:left; padding-left:18px; padding-top:11px; color:#545454; line-height:120%;}
.teacher_box .teacher_box img {bottom:0; width:128px;}
.teacherview-tap {margin: 30px 0;}
.teacherview-tap ul {width: 100%; border-bottom: 1px solid #ccc; display: inline-block;}
.teacherview-tap ul li {width: 32.5%; float: left; text-align: center; height: 54px; line-height: 54px; font-size: 17px; transition: 0.3s; cursor: pointer; border: 1px solid #ddd; border-bottom: 0; background: #f5f5f5;}
.teacherview-tap ul li + li {margin-left: 1%;}
.teacherview-tap ul li a, .teacherview-tap ul li a:visited {color: #000; font-weight: 700; display: block;}
.teacherview-tap ul li:hover {background-color: #efefef;}
.teacherview-tap ul li.active {background-color: #000;}
.teacherview-tap ul li.active a {color: #fff;}
.teacher_kate_con {margin-bottom: 30px; line-height: 1.5;}
.teacherTop {display: table; width: 100%;}
.teacherTop .left {width: 40%; float: left;}
.teacherTop .left img {width: 100%;}
.teacherTop .right {width: 55%; float: right;}
.couponDown {background: #8bc34a;}
.teacherName {font-size: 24px; color: #333; font-weight: 700; margin-bottom: 10px;}

/* 단과리스트 */
.c-List-Type {}
.c-List-Type ul {display: table; width: 100%; padding: 10px; border: 1px solid #ddd; margin-bottom: 17px; background: #fff; height: 200px; border-radius:9px;}
.c-List-Type ul:hover{border: 1px solid #4e609f; transition:all 0.2s ease-out;}
.c-List-Type ul li {display: table-cell; vertical-align: top; font-size: 13px; position: relative;}
.c-List-Type ul li:nth-child(1) {width: 230px; position: relative;}
.c-List-Type ul li:nth-child(1) img {width: 100%; height:175px; border-radius:10px;}
.c-List-Type ul li:nth-child(2) {padding: 10px 20px;}
.c-List-Type ul li:nth-child(3) {width: 250px;}
.course-Name {font-size: 20px; font-weight: 500; color: #000;}
.c-List-Type ul li p, .c-Album-Type ul li p {margin: 0px 0; font-size:17px;}
.choice-t {float:left; font-size: 15px; font-weight: 700; color: #000; margin-top: 0; padding-right:8px;}
.tck-box {margin-top:2px; font-size: 12px;}
.tck-box label {margin-right: 20px; font-size: 13px;}
.lecture-Price {position: absolute; bottom: 0; width: 100%;}
.lecture-Price p {float: left; font-weight: 400; font-size: 20px; color:#000000; padding-top:5px;}
.lecture-Price .sale-P {float: right; color: #c94545; font-size: 28px; font-weight: 500; font-family: 'Noto Sans KR', sans-serif; letter-spacing: -1px;}
.lecture-Price .sale-P span {font-size: 18px;}
.c-List-Type ul li .lecture-Price p {margin: 10px 0;}
button.detail-btn {width: 100%; background: #4ea5a6;}
button.detail-btn.myClass {background: #ff9900;}
.sale-Price {margin-bottom: -11px;}
.c-List-Type ul li .lecture-Price .sale-Price p {margin: 0;}
.lineth {float: right; font-size: 15px; font-weight: 700; text-decoration: line-through; margin-top:7px;}
.dsrt {color: #8c8c8c; font-weight: 500; font-size:16px;}
.noneLecture {text-align: center; font-size:14px; margin-bottom:20px;}
.stateBtn {position: absolute; top: 0; left: 0; color: #fff; letter-spacing: -1px; font-size: 12px; white-space: nowrap; padding: 3px 6px; border-radius: 5px; margin: 5px;}
.state1 {background: #2196f3;}
.state2 {background: #ff0000;}
.state3 {background: #000000;}
.state4 {background: #795548;}
.appDate{font-size:16px;}
span.list_tit{color:#222222;}
/*detail-btn 마우스오버 효과*/
button.detail-btn {
    position: relative;
    transition: all 0.3s ease;
}
button.detail-btn:after {
    position: absolute;
    content: "";
    width: 0;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    background: linear-gradient(#03a8c9 0%, #0080e3 100%);
    transition: all 0.3s ease;
}
button.detail-btn:hover:after {
    top: 0;
    left: 0;
    width: 100%;
}


/* 단과앨범 */
.c-Album-Type {width: 100%; display: inline-block;}
.c-Album-Type ul {width: 31%; float: left; padding: 6px; margin: 0 1% 20px; background: #fff;  border:1px solid #eee; border-radius:10px;}
.c-Album-Type ul li {font-size: 13px; position: relative; }
.c-Album-Type ul li img{}
.c-Album-Type ul li .block-thumb img {height:230px; width: 100%; border: 1px solid #ddd;  border-radius:10px;}
.c-Album-Type ul li:nth-child(2) {margin-top: 4px; height: 60px; padding-left:3px;}
.c-Album-Type ul li:nth-child(3) {margin-top: 4px; height: 80px; padding-left:3px;}
.c-Album-Type ul li .course_point{height:60px; margin-bottom:10px;}
.c-Album-Type ul li .course_point p{font-size:16px;}
.c-Album-Type ul li .appDate {display:none; font-size: 13px; letter-spacing: -0.5px; padding-top:3px;}
.c-Album-Type ul li .appDate span {margin-left:2px; color:#999999; font-weight:300; font-size: 13px;}
.c-Album-Type ul li .course-Name {font-size: 20px; color:#000000; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word;  height: 28px;}

.c-Album-Type ul li > img {width: 100%;}
.c-Album-Type .lecture-Price {position: relative; margin-top: -60px;}
.c-Album-Type .tck-box label {margin-right: 10px;}

.c-Album-Type button.detail-btn {width: 100%; background: #4e609f; display:none;}

.courselist_btn {float:right; margin-bottom:15px;}
.courselist_btn ul li {float:left; width:45px; height:45px; border:1px solid #c6c6c6; border-radius:5px; display:inline-block; text-align:center; line-height:42px; }
.courselist_btn ul li + li {margin-left:10px;}
.courselist_btn ul li img {width:20px;}

.course_p_box{height:20px; margin-top:0px; display:none;}
.course_p_left{float:left; width:78%;}
.course_p_right{float:right; width:22%;}

/* 강좌아이콘 */
.inlineblock {display: inline-block; width: 100%; margin-top:2px;}
.icon-Box {margin: 0px 0 1px; display: inline-block; width: 100%; }
.priceWrap{padding-top:15px;}
.item-icon {display: inline-block; line-height: 14px; font-size: 12px; text-align: center; padding: 0 6px; margin-right: 4px; letter-spacing: -1px;}
.bestItem {color: #155183; background: #76d0f2;}
.newItem {color: #77650f; background: #fbe365;}
.sampleItem {color: #fff; background: #af0d23; border-radius:13px; font-size:10px; letter-spacing: 0px; padding:3px 5px; float:right;}
.saleItem {color: #fff; background: #ff9900;}
.freeItem {color: #fff; background: #000;}
.offlineItem {width:100%; color: #ffffff; background: #2196f3; float: right; border-radius:12px;padding:2px 5px;}
.saleIcon {display: inline-block; font-size: 12px; color: #fff; background: #ec4b69; padding: 0 6px; border-radius: 3px; height: 18px; line-height: 18px; margin-left: 10px;}
.saleIcon img {width: 14px; height: 14px;}


/* 강좌상세 */
.detail-top {width: 100%; display: inline-block;}
.detail-top .left {width: 40%; max-width: 400px; float: left; border-radius:11px; border: 1px solid #ddd; position: relative;}
.detail-top .left > img {width: 100%; margin-bottom:0px; border-radius:10px;}
.detail-top .right {width: 60%; float: right; padding: 0px;}
.detail-top .right p {font-size: 15px; font-weight: 700; margin-bottom:5px; }
.detail-top .right select {height: 35px;}
.detail-top .right h2 {color: #000; margin-bottom: 7px; font-size:19px;}
.detail-top .right table {border-top: 1px solid #000; border-bottom: 1px solid #000; width: 100%; font-size: 15px;}
.detail-top .right th {padding: 10px; background: #f5f5f5; width: 30%; color: #333;}
.detail-top .right td {padding: 10px; width: 70%;}
.detail-top .right td .line {text-decoration:line-through;}
.detail-top .right td .price {font-size: 18px; color: #ca2500; font-weight: bold;}
#discount {text-decoration: line-through; color: #999;}
.pay-btn {margin-top: 20px; text-align: center;}
.detail-center, .detail-bottom {padding: 30px 0;}
#lec-list table {width: 100%; font-size:16px;}
#lec-list table th {background: #ffffff; color: #333; font-weight: 700; text-align: center; padding: 10px 0; height: 50px; border-top: 1px solid #000000; border-bottom: 1px solid #ddd;}
#lec-list table td {padding: 10px 0; border-bottom: 1px solid #ddd; height: 50px;}
#lec-list table td.number {width: 7%; max-width: 60px; text-align: center;  color:var(--main); font-weight:500;}
#lec-list table td.title {width: auto; line-height: 1.5;}
#lec-list table td.title span {margin-right: 5px;}
#lec-list table td.time {width: 15%; max-width: 130px; text-align: center;}
#lec-list table td.data {width: 10%; max-width: 70px; text-align: center;}
#lec-list table td.data img {width: 24px; height: 24px;}
#lec-list table td.view {width: 15%; max-width: 130px; text-align: center;}
#lec-list table td.view a.sample-veiw {font-size: 12px;letter-spacing: -1px; color:#ffffff; background: #af0d23;padding: 5px;  border: 2px solid #af0d23; border-radius: 15px; width: 85px; display: block; margin-bottom: 1px;}
#lec-list table td.view a.sample-veiw img {width: 14px; height: 14px; margin-left: 10px; position: relative; top: -1px;}
#lec-list table td.view > button {background: #fff; border: 1px solid #000; color: #000; height: 27px; margin: 2px auto; min-height: auto; width: 90px;}
#lec-list table td.view > button img {width: 15px; height: 15px; top: 0px;}
#course-list .modal-body p {padding-left: 20px; background: url(/files/default-img/menu-right.svg) no-repeat top left;}
.detail-tab {overflow: hidden;border-bottom: 1px solid #ccc; margin-bottom: 20px; margin-top: 10px;}
.detail-tab button {border-top-left-radius:5px; border-top-right-radius:5px; background-color: inherit; border: none;outline: none;cursor: pointer;padding: 0 5%;transition: 0.3s;font-size: 17px;color: #333; border: 1px solid #ddd; border-bottom: 0; height: 48px;}
.detail-tab button:hover {background-color:  var(--main); color:#ffffff; opacity:1;}
.detail-tab button.active {background-color: #ffffff; color: var(--main); border-top:2px solid var(--main); }
.tabcontent {display: none;padding: 20px 0px;}

/* 패키지상세 */
.listTable {width: 100%; display: table;}
.listTable .packCont {display: table; float: left;}
.listTable .packCont h2{margin-top:0px; font-size: 20px;}
.listTable .packCont h2:hover{color:#4e609f;;}
.listTable .listView {display: table; width: 120px; float: right; margin-top:20px;}
.btn_pack_list {width: 100%; background: #061f5c; border-radius:10px;}
.pack_list {display:none; margin-top: 30px;}
ul.lecture-block {width: 100%; position: relative;}
ul.lecture-block li {width: 100%; display: inline-block; padding: 15px; border: 1px solid #ddd; position: relative; margin-bottom: 10px; border-radius:5px; }
ul.lecture-block li:hover{border: 1px solid #4e609f; transition:all 0.2s ease-out;}
#lec-list table tr:last-child td {border-bottom: 0;}

/* 교재리스트/상세 */
.book-page {overflow:hidden; border-top:1px solid #555555; margin:10px 0;}
.book-list {border-top:1px solid #e1e1e1; overflow:hidden; }
.book_box {float:left; width:48%; margin: 20px 1%; display: table;}
.book_left {width: 130px; display: table-cell; vertical-align: top;}
.book_left img{width:100%;}
.book_right {text-align:left; padding-left: 20px; display: table-cell; vertical-align: top;}
.book_right li {line-height: 2; font-size: 16px}
.book_right li h2 {font-size: 17px; line-height: 1.3; margin-bottom: 10px;}
#book_detail, #tran_detail {text-align:left; padding-top:20px;}
.book-cate {text-align: right;}
#book_detail p img {width: auto; max-width: 100%;}

/* 쇼핑몰 */
.shopping-page {position:relative; padding: 20px 0; display: inline-block; width: 100%;}
.goods-box {float:left; width: 23%; margin: 10px 1%;}
.shopping_top{width: 100%;}
.shopping_bottom {width:100%; padding: 10px 0;}
.shopping_title a {font-size: 12px; line-height:1.4; color:#333;}
.shopping_title {text-align:center; padding-top:5px; height: 40px; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;word-wrap:break-word; line-height: 1.2em;}
.shopping_text {font-size:14px; font-weight:bold; text-align:center; padding-left:18px; padding-top:10px; letter-spacing:-1px; color:#920000; line-height:120%;}
.shopping_text a{color:#920000;}
.shopping_top img {width: 100%;}
.shop-price {text-align: center; padding-top: 5px; font-size: 14px; font-weight: 700; color: #000; height: 35px;}
.shop-price strike {color: #ca2500;}
.no-sales {padding-top:10px;font-weight:bold;font-size:13px;}
.shopview_img {width: 35%; float: left; text-align: center; margin-bottom: 20px; margin-right:1%;}
.shopview_img img {width: 100%; padding: 1px;}


/* 나의강의실 */
.lecturestudy {width: 100%; position: relative;}
.lecturestudy li {padding: 17px; border: 1px solid #ddd; margin-bottom: 40px; position: relative; border-radius:8px;}
.lecturestudy li.finishstudy {background: #f5f5f5;}
.lecturestudy li.finishstudy .lectureTxt h2, .lecturestudy li.finishstudy .lectureTxt p, .lecturestudy li.finishstudy .lectureTxt div {color: #ccc;}
.lecturestudy li.finishstudy p.term {color: #ff0000;}
.mylecBox {display: table; width: 100%;}
.lectureImg {width: 170px; display: table-cell; vertical-align: top;}
.lectureImg img {width: 100%;}
.lectureTxt {display: table-cell; vertical-align: top; padding-left: 20px; text-align: left; position: relative;}
.lectureTxt h2 {margin-bottom: 10px; cursor: pointer;}
.lectureTxt p, .lectureTxt div {font-size: 13px; line-height: 2;}
.btn-area.pause {width: 150px; display: table-cell; position: relative;}
.pause-btn {border: 1px solid #000; color: #000; font-size: 15px; background: #fff; width: 150px; height: 42px;}
.pause_date_input {height: 42px; padding: 10px; background: #efefef; border: 1px solid #ddd; position: relative; top: 1px; width: 150px; margin-bottom: 5px;}
.pause_close {width: 150px; text-align: center; background: #000; color: #fff; position: relative; padding: 5px; cursor: pointer; margin-top: 5px;}
.pause-btn.pauseStop {border: 1px solid #ff0000; color: #ff0000;}
.pause-btn.pause_date {border: 1px solid #061f5c; color: #061f5c;}
.my-class h1 {background: url(/files/default-img/play.svg) no-repeat 0 16px; font-size: 15px; cursor: pointer; background-size: 20px; padding: 15px 0 15px 30px; border-top: 1px dashed #ddd;}
p.term {font-weight: 700; color: #509f09;}
.mystudytap {display: inline-block; width: 100%; border-bottom: 1px solid #ddd; margin-bottom: 30px;}
.mystudytap li {width: 200px; padding: 10px; text-align: center; border-bottom: 0; font-size: 16px; margin:0; float: left; margin-right: 2px; border-bottom-left-radius:0px; border-bottom-right-radius:0px;}
.mystudytap li:hover {background: #f5f5f5;}
.mystudytap li.active {background: #061f5c; color: #fff;}
#lec-list {padding: 0; margin-bottom: 50px;}
.empty {text-align: center;}
.w3-light-grey {margin-top: 10px; width: 100%; background: #f5f5f5;}
.w3-light-grey .w3-red {background: #ff0000;}
.my_board {margin-bottom: 30px;}
.macDown {position:relative; width:50%; margin-top:-35px; float:right; text-align: right; z-index:999999;}
.macDown button {background: #000; line-height: 35px;}
.myClassTab {width: 100%; margin: 0px auto 20px; display: inline-block; border-bottom: 1px solid #ddd;}
.myClassTab a {font-size: 15px; padding:10px; display: block; width: 33%; background: #f5f5f5; color: #555; text-align: center; float: left; font-weight: 400;}
.myClassTab a + a {margin-left: 0.5%;}
.myClassTab a.active, .myClassTab a:hover.active {color: #fff; background: #2c5698;}
.myClassTab a:hover {background: #ddd; color: #333;}
.starImg {position: relative; display: inline-block; width: 80px; padding: 0;}
.starImg span {display: inline-block; width: 100%; height: 15px; background: url(/files/default-img/star.png) no-repeat top left; background-size: 80px; position: absolute; left: 0; top: 0;}
.starImg span.on {z-index: 1; background: url(/files/default-img/star.png) no-repeat bottom left; overflow: hidden; background-size: 80px;}
.starBox {float: left; text-align: left; display: inline-block; font-weight: bold; color: #000;}
.starBox div {float: left;}
.starBox .starImg {margin-left: 20px;}
.starBox .starImg button {width: 10%; height: 15px; padding: 0; background: none; position: absolute; z-index: 2;}
.starBox .starImg button.one {left: 0;}
.starBox .starImg button.two {left: 10%;}
.starBox .starImg button.three {left: 20%;}
.starBox .starImg button.four {left: 30%;}
.starBox .starImg button.five {left: 40%;}
.starBox .starImg button.six {left: 50%;}
.starBox .starImg button.seven {left: 60%;}
.starBox .starImg button.eight {left: 70%;}
.starBox .starImg button.nine {left: 80%;}
.starBox .starImg button.ten {left: 90%;}
button.certificateView {width: 200px; background: #000; position: absolute; right: 0; top: 0;}
.WrapBtn button {width: 32%; max-width: 150px; color: #444; background: #fff; border: 1px solid #ddd; height: 30px;}
button.listOpen {width: 100%; margin-top: 5px; background: #2c5698; display: block; border-radius:5px;}
#lec-list .number {width: 65px;}
#lec-list .title {width: auto;}
#lec-list .time {width: 120px;}
#lec-list .page {width: 100px;}
#lec-list .data {width: 80px;}
#lec-list .view {width: 120px;}








/* 쿠폰 */
#coupon_no {width: 30%;}
.coupon-mobile {text-align: left; font-size: 12px;}
.add-coupon {text-align: right; position: relative; margin: 5px 0;}
.add-coupon-btn {height: 35px;padding: 0 15px;font-size: 13px; background: #4c81e4; position: absolute;width: 100px;right: 0;border-radius: 0; top: 0;}
.couponUse-p {background: #3366cc;}
.couponCancel-p {background: #ff9900;}
.impossible-p {background: #ff0000;}
.couponList th {width: 10%;}
.couponList th:nth-child(1) {width: 13%;}
.couponList th:nth-child(2) {width: 25%;}
.couponList th:nth-child(5) {width: auto;}
#couponCode {width: 350px;}


/* 쪽지 */
#memo > .modal-dialog {z-index:9999; top:100px; height:90px; max-width:400px; width: 95%;}
.memo-btn {text-align: center; padding-bottom: 10px; width: 100%; max-width: 700px; margin: 0 auto;}
.memo-num {width: 40px;}
.memo-send {width: 120px;}
.memo-name {width: auto;}
.memo-sd {width: 120px;}
.memo-rd {width: 120px;}
.memo-del {width: 40px;}
.table_write.max480 tr>th {width: 27%;}
.table_write.memoform tr>td {width: auto;}
table.table_write.memoform > tbody > tr > th {width: 25%;}
table.table_write.memoform > tbody > tr > td {width: 75%;}
table.table_write.memoform > tbody > tr > td > input.text {width: 100%;}
ul.memolist {text-align: center; max-width: 700px; width: 100%; margin: 0 auto;}
ul.memolist li {display: inline-block; padding: 15px 20px; font-size: 15px; font-weight: 700; background: #efefef; width: 32.5%; color: #333;}
ul.memolist li.active {background: #061f5c; color: #fff;}
.memoPaging {width: auto; max-width: 700px; margin: 0 auto; text-align: center; display: table}
#goMemo {font-size: 15px;}
#goMemo span {color: #ff9900;}

/* 주문결제내역 */
.order_con_box{border-top:1px solid #555555;}
.order_box {margin-top:20px; margin-bottom:20px;  border:5px solid #e8e8e8; height:80px; }
.order_text {margin:0 auto; padding-top:22px; width:100%;}
.order_text .oleft{text-align:left; float:left; margin-right:18px; padding-left:18px; letter-spacing:0px; color:#545454; line-height:120%;}
.order_text .oleft .period{background:#f8f8f8; border:1px solid #d5d5d5; height:25px; border-radius:2px;}
.order_text .oleft .period .data{border-left:1px solid #d5d5d5; padding:4px; float:left; font-size:11px;}
.order_text .oleft .period .data:first-child{float:left; border-left:0px solid #d5d5d5; font-size:11px;}
.order_text .oright{font-size:12px; text-align:left; left:22px; letter-spacing:0px; color:#545454; line-height:120%;}
.order_detail_box {margin-top:20px; margin-bottom:20px;  border:2px solid #3f8dc2; background:#f6f6f6;min-height:80px;}
table.table_order {width:90%; margin-top:15px; margin-left:15px; margin-bottom:15px;}
table.table_order th {height:25px; text-align:left; padding-left:35px; font-size:13px; color:#333;}
table.table_order td {height:25px; text-align:left; color:#666666; font-size:13px; letter-spacing:0px;}
.myorder-tab {width: 100%; display: inline-block;}
.myorder-tab li, .ord-view li {padding: 10px; font-size: 15px 0; width: 33%; border: 0; float: left; background: #f5f5f5; text-align: center; font-size: 15px; font-weight: 400; cursor: pointer; color: #333; border: 0px solid #ddd;}
.myorder-tab li + li, .ord-view li + li {margin-left: 0.5%;}
.myorder-tab li.active, .ord-view li.active {background: #2c5698; color: #fff; border: 0px solid #061f5c;}
.myorder-tab li a, .ord-view li a {color: #000; font-size: 15px; font-weight: 700;}
.myorder-tab li.active a, .ord-view li.active a {color: #fff;}
table.myOrder th:nth-child(1) {width: 9%;}
table.myOrder th:nth-child(2) {width: auto;}
table.myOrder th {width: 110px;}
table.orderTermRead th {width: 10%;}
table.orderTermRead th:nth-child(3) {width: auto;}
table.orderTermRead2 th {width: 10%;}
table.orderTermRead2 th:nth-child(3) {width: auto;}
table.orderTermRead2 th:nth-child(4) {width: 15%;}
.btn-tran.small.s-red {min-width: 60px; text-align: center;}

/* 내포인트 */
.pointList th {width: 15%;}
.pointList th:nth-child(1) {width: 8%;}
.pointList th:nth-child(4) {width: auto;}
.board_note{font-size:14px;}

/* 장바구니/주문결제 */
.cartList th {width: 15%;}
.cartList th:nth-child(1) {width: 40px;}
.cartList th:nth-child(2) {width: 80px;}
.cartList th:nth-child(3) {width: auto;}
.cartList-btn > button {width: 24.5%;}
.refund_area {height: 150px; overflow: auto; white-space: inherit; background: #f5f5f5; padding: 20px;}
.refund_label {margin-top: 10px; display: block;}
.selectAdr label {display: inline-block; margin-right: 50px;}
.selectAdr label input {height: auto;}
.totalprice {width:100%; border-top: 2px solid #000; margin-top: 5px;}
.totalprice th {border-bottom: 1px solid #eaeaea; font-weight: bold; padding: 10px; background: #f7f7f7; width: 25%; min-width: 120px; vertical-align: middle; text-align: right;}
.totalprice td {border-bottom: 1px solid #eaeaea; padding: 10px; text-align: left; vertical-align: middle; line-height: 150%;}
.carttitle {padding: 25px 0 5px;}
.cart_list_image {width: 70px;}
span.paytitle {padding: 0 10px;}
.pay_mode .check-con {margin-right: 20px;}
.ec-base-help {margin: 20px 0;border: 1px solid #e7e7e7;font-size: 13px;line-height: 20px;}
.ec-base-help h3 {padding: 10px 0 9px 15px;border-bottom: 1px solid #e7e7e7;color: #101010;font-size: 15px;background: #fbfbfb;}
.ec-base-help .inner {padding: 0 9px 18px;}
.ec-base-help h4 {margin: 22px 0 -5px 10px;color: #404040;font-size: 15px; font-weight: 700;}
.ec-base-help h4:first-child {margin-top: 17px;}
.ec-base-help ul, .ec-base-help ol {margin: 18px 0 0 10px;}
.address-find {background: #fff; color: #666; font-size: 13px; border: 1px solid #ddd; box-shadow: 0 1px 2px rgba(0,0,0,0.04);}
.btn_center.cartPay button {max-width: 270px;}
.orderResult th {width: 10%;}
.orderResult th:nth-child(2) {width: auto;}
.dtable:last-child {border-bottom: 1px solid #ddd;}
#address, #address1 {width: 49%;}


/* 모달공통 */
.couponModal, .memoModal {display: none;position: fixed;z-index: 99999; padding-top: 100px; left: 0;top: 0;width: 100%;height: 100%;overflow: auto;background-color: rgba(0,0,0,0.7);}
.couponContent, .memoContent {position: relative; background-color: #fff; margin: auto; width: 100%; max-width: 964px; height: 600px; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19); -webkit-animation-name: animatetop; -webkit-animation-duration: 0.4s; animation-name: animatetop; animation-duration: 0.4s; padding: 30px;}
@-webkit-keyframes animatetop {from {top:-300px; opacity:0} to {top:0; opacity:1}}
@keyframes animatetop {from {top:-300px; opacity:0}to {top:0; opacity:1}}
.couponModal-footer, .modal-footer {text-align: center;}
.memoContent {max-width: 370px; height: 230px; border: 7px solid #ddd;}
.memoContent .modal-body {padding: 30px 0;}



/* 강사매출 */
.courseStatics td, .packStatistics td, .goodsStatistics td, .bookStatistics td {width: 16.66666666666667%;}
.btn_center.salesMain {text-align: right;}
.cate-tap.salesMain {border-bottom: 1px solid #ddd;}
.sellerCourse th {width: 10%;}
.sellerCourse th:nth-child(3) {width: auto;}

/* 로그인/회원가입 */
h3.tit_center{text-align:center; font-size:32px; }
input.hss{width:50%;}
.login_top_margin{margin-top:100px;}
#login_box {width: 100%; max-width: 900px; padding: 20px 10px 30px; border-radius: 10px; margin:0px auto 40px; position: relative; background:#ffffff; border: 1px solid #ddd;}
.login_sbox {width: 390px; margin: 0 auto; text-align: center;}
.login-title {color: #222222;font-size: 38px;font-weight: 600;margin: 30px auto; text-align: center; width:auto;}
.naverlogin {width: 100%; height: 55px; background: url(/files/default-img/ico_naver.png) 13% 50% no-repeat; color: #ffffff; border-radius: 5px; margin: 5px 0; background-color:#5ebc4e;}
.kakaologin {width: 100%; height: 55px; background: url(/files/default-img/ico_kakao.png) 13% 50% no-repeat; color: #000000; border-radius: 5px; margin: 5px 0; background-color:#f9e000;}
.googlelogin{width: 100%; height: 55px; background: url(/files/default-img/ico_google.png) 13%  50% no-repeat; color: #000;  background-size: auto; border-radius: 5px; margin: 5px 0;  background-color: #fff; border: 1px solid #ddd;}
.web_login {margin-bottom:10px; width: 100%; height:50px; border-radius: 5px;}
.box_btn > button {background:var(--main); width: 100%; font-size:18px; height: 50px;  border-radius: 5px;}
.box_member {width: 100%; padding:0; margin-top:10px;}
button.joinFind{font-size:14px; margin:0px 0; border:0; height: 35px; color: #666; border-radius: 2px; font-weight: 500; cursor: pointer; padding: 0 10px; background:#ffffff;}
button.joinCode {width: 100%; color:var(--main); text-align: center; font-weight:500;  font-size:17px; height:50px; margin-left:0px; border: 1px solid var(--main);}
.loginForm {display: table; margin: 30px auto; width: 100%; position: relative;}
.login_sbox .box_id {width: 100%;}
.login_sbox .box_btn {width: 100%; }
.idpw_box {width: 550px; margin:0 auto;}
.find_form_box {padding: 0 15%;}
.stit_all {padding-top: 10px; font-size: 20px; padding-bottom:10px; font-weight:600;}
.find_form .small_txt {font-size: 14px; line-height: 1.5; color:#222222; margin-top: 10px;}
.find_form fieldset {margin: 0; padding: 0; border: 0;}
.find p {margin: 3px 0px;}
.web_find_info {font-size: 13px; padding: 6px; width: 100%; margin-left:0px; height:45px; border-radius:5px;}
.form_context {margin: 0; font-size: 14px; padding: 0 15%; color: #3f51b5; line-height: 1.2;}
.pw_find .find_form_box .find_form{padding-top:20px; border-top: 1px solid #ddd; }
.id_find {padding-top: 40px; margin-bottom: 30px; width:100%;}
.pw_find {padding-top: 40px;  margin-bottom: 30px; width:100%;}
.pbox_con {min-height: 430px;}
.pbox {margin: 0 auto; padding-top: 5px; height: 520px; width: 96%;}
.pbox .provision {height: 153px; overflow: auto; margin-top: 25px; font-size: 13px; line-height: 1.5;  background: #ffffff; padding: 10px; border: 1px solid #dddddd;}
p.provision_r {padding-top:0px; font-size: 16px; width: 100%; height: 20px; color: #444444; font-weight: 400; text-align:right; margin-top: 10px;}
.provision_r label {font-size: 1.111rem;font-weight: 500;line-height:160%;letter-spacing: -0.05rem;color:var(--black);}
.joinForm, .btn_center.joinForm, .mody-title {width: 90%; margin: 0 auto;}
.joinForm .dtable{border-bottom:1px solid #dddddd;}
.joinForm .dtable .table-th {display: table-cell; width: 17%; padding: 10px 15px; height: 30px; vertical-align: middle; font-weight: 500; color: #333; border-top: 0px solid #d2d2d2; background:#ffffff;}
.joinForm .dtable .table-td {display: table-cell; min-height: 50px; vertical-align: middle; padding: 10px 15px 10px; line-height: 1.5; margin-bottom:15px; border: 0px solid #dddddd;}
.joinForm .dtable .table-td p{vertical-align:middle;}
.joinForm .dtable .table-td p.mod_text{min-height: 50px;}
.joinNew .dtable{border-bottom:0px solid #dddddd;}
.joinNew .dtable .table-th {background: #ffffff; display: table-cell; border-top: 1px solid #ddd; font-size:16px;  padding: 10px 15px; height: 40px; vertical-align: middle; font-weight: 500; color: #000000; line-height: 1.5;}
.joinNew .dtable .table-td  {display: table-cell; border-top: 1px solid #ddd; font-size:16px; height: 40px; vertical-align: middle; padding: 10px 15px; line-height: 1.5;}
.form-control_new {min-width: 43px;height: 40px;padding: 0px 10px; font-size:14px; transition: border-color 0.3s ease; background:#F5F5F5; border:1px solid #eff1f1; border-radius:4px;}
p.joinNew_txt{}
.info-text {width: 90%; text-align: left; margin: 10px auto; font-size: 15px; line-height: 150%;}
#member_join {margin: 30px auto; width: 90%; text-align: center;}
.member_box {font-size: 18px; font-weight: 700;}
.agree-box {width: 80%; padding: 30px; border-radius: 10px; position: relative; margin: 0px auto 80px; border: 1px solid #d2d2d2; background:#ffffff;}
.agree-box h2{margin:0 auto; text-align:center; padding: 20px 0px; }
.agree-box h2 span{margin-bottom:20px; color: #333; font-size: 32px; font-weight: 700; line-height: 1.3em;  letter-spacing: -.03em;}
.dash_cont {margin-top:30px;border-top:1px dashed #dddddd; color:#000000; text-align:right;}
.dash_cont label {display:block; margin:15px 0 23px; font-size:18px;}
.box_title{font-weight:500; margin-top:50px;}
.box_text{margin:0 auto; width:60%; font-weight:300; padding-top:20px; padding-bottom:20px; margin-top:20px; line-height: 150%; border-top: 1px solid #d2d2d2; border-bottom: 1px solid #d2d2d2;}
.checkin_box{width:100%;}
.check-id {float:left; text-align: left; font-size:15px; padding:15px 0 20px 0; color:#666666;}
.btnwrapper { }


.wrapper {float:right; padding:17px 0 20px 0; }
.wrapper ul {max-width: 200px; display: flex; width: 100%; justify-content: space-between;}
.wrapper ul li:nth-of-type(1) {padding-right: 6px; position: relative;}
.wrapper ul li:nth-of-type(1):after {position: absolute; content: ''; width: 1px; height: 13px; background-color: #666; top: 50%; right: 0; transform: translateY(-50%);}
.wrapper ul li a {font-size: 13px; padding-left:6px; display: block; color: #666; transition: all .15s linear;}
.wrapper ul li a:hover {text-decoration: underline;}
.address-find {background: #ffffff; color: #0082ca; font-size: 16px; height:42px; width:150px; border: 1px solid #0082ca; box-shadow: 0 1px 2px rgba(0,0,0,0.04); border-radius:4px;}
.sms_auth_number {background: #ffffff; font-size: 16px; height:42px; width:150px; border: 1px solid #0082ca; box-shadow: 0 1px 2px rgba(0,0,0,0.04);}
span.tpoint{color:#0082ca;}

/********** ## Step List **********/
.member_process {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin:0 0 30px;}
.member_process dl {display:flex; flex-wrap:wrap; align-items:center;}
.member_process dl::after {content:'\e5e1';  font-size:20px; color:var(--black); font-family:var(--icon);  opacity:0.3; margin:0 30px;}
.member_process dl:last-of-type::after {display:none;}
.member_process dl dt {position:relative; width:60px; height:60px; background:var(--basic); border-radius:100%;  opacity:0.5;}
.member_process dl dt::after {content:''; width:calc(100% - 8px); height:calc(100% - 8px); border-radius:100%; border: 1px dashed var(--white); position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.member_process dl dt span {display:block; width:100%; height:100%; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.member_process dl dt span::before {content:''; font-size:28px; color:var(--white); font-family:var(--icon);}
.member_process dl.st01 dt span::before {content:'\e78a';}
.member_process dl.st02 dt span::before {content:'\f4ca';}
.member_process dl.st03 dt span::before {content:'\f604';}
.member_process dl.st04 dt span::before {content:'\e877';}

.member_process.cart_ver dl.st01 dt span::before {content:'\e8cc';}
.member_process.cart_ver dl.st02 dt span::before {content:'\eff1';}

.member_process dl dd {padding-left:12px; opacity:0.5;}
.member_process dl dd span {font-size: 0.777rem; font-weight: 700; line-height: 142.857%; display:block; color:var(--black);}
.member_process dl dd p {font-weight: 500; letter-spacing: -0.72px; color:var(--black);}

.member_process dl.on dt {opacity:1; background:var(--main);}
.member_process dl.on dd {opacity:1;}
/********** ## Step List **********/


/* 통합검색 */
.top_search {display: inline-block;}
.top_search .search_word {background: #eee; border: 1px solid #eee; width: 322px; height: 45px; padding: 5px; float: left;}
.top_search .search_btn {height: 45px; background: #000 url(/files/default-img/search-white.svg) no-repeat center; padding: 0; width: 45px; background-size: 25px; float: left; border-radius: 0; position: relative; top: 1px;}
.searchCourse, .searchBook {border-top:1px solid #000; border-bottom:1px dotted #ccc; padding: 10px 0; margin-top: 50px;}
.searchCourse h1 span, .searchBook h1 span {color:#ff9900; letter-spacing:1px;}
.book_con {margin-top: 50px;}
.searchBoard {width: 100%; border-top: 1px solid #000; border-bottom: 1px dotted #ccc; padding: 10px; margin-top: 50px; margin-bottom: 70px; clear: both; display: inline-block;}
.tword-box {margin: 0 auto; width: 100%; max-width: 500px; position: relative;}
.tword-box .searchBar {width: 100%; height: 50px; border: 2px solid #000000;}
.tword-box .btn-tword {width: 50px; height: 50px; position: absolute; right: 0; background: #000000 url(/files/default-img/search-white.svg) no-repeat center; border: 2px solid #000000; cursor: pointer;}
.search-con-ico {text-align: center;}
.search-con-ico p {font-size: 24px; margin: 20px; letter-spacing: -1px;}





/* 모바일메뉴 */
.sidenav {height: 100%; width: 0; position: fixed; z-index: 99999999; top: 0; right: -1px; background-color: #fff; overflow-x: hidden; transition: 0.2s; padding-top: 40px; border-left: 1px solid #ccc;}
.sidenav a {padding: 8px 0 8px 20px; text-decoration: none; font-size: 15px; color: #818181; display: block; transition: 0.3s;}
.sidenav a:hover {color: #af0d23; font-weight: 700;}
.sidenav > button {width: 100%; text-align: left; background: #fff; color: #333; font-size: 17px; border-bottom: 1px solid #ddd; height: 50px;}
.sidenav > button:hover {color: #af0d23;}
.sidenav .closebtn { position: absolute; top: -10px; right: 8px; }
.sidenav .closebtn > img {}
.menu-icon {font-size: 23px; cursor: pointer; padding: 10px; position: relative;}
.dropdown-btn > img {position: absolute; right: 5px;}
.dropdown-container {display: none;background-color: #fff;padding: 8px; transition: 0.2s;}
.m-login {display: block; border-top: 1px solid #333; border-bottom: 1px solid #333; margin-bottom: 30px;}
.m-login > button {width: 50%; border: 0; border-radius: 0; color: #333; background: #fff; height: 50px;}
.m-login > div {padding: 10px; background: #af0d23; color: #fff; width: 100%;}
.sidenav .search_word {margin-left:5px; width: 200px; float: left; border: 1px solid #9e9e9e;}
.sidenav .search_btn {width: 35px; height: 35px; margin-left: -1px; background: #9e9e9e; border: 1px solid #9e9e9e;}
#mobile_search {margin-bottom: 4px; padding: 0px 5px;}
.m-menu {position: absolute; right: 0; top: 0; z-index: 9;}

/* gnb_1 */
#gnb_area {height:55px; background: #ffffff; border-top:1px solid #eeeeee; border-bottom:1px solid #eeeeee;}
.gnbDiv {height:52px; overflow:hidden; z-index:9999; }
.gnbDiv .gnbWrap .gnb {position:relative; margin:0 auto; width: 100%; max-width:1100px; z-index:9999;  height:54px;}
.gnbDiv .gnbWrap .gnb .oneDep {height:30px; padding:0px 0 20px 0;}
.gnbDiv .gnbWrap .gnb ul {overflow:hidden; width: 100%;}
.gnbDiv .gnbWrap .gnb ul li {float:left; text-align:center; }
.gnbDiv .gnbWrap .gnb ul li a.oneDep {display:block; position:relative; font-size:18px; line-height: 54px; height:54px; color:#222222; letter-spacing:-1pt; font-weight: 600;}
.gnbDiv .gnbWrap .gnb ul li.on {}
.gnbDiv .gnbWrap .gnb ul li.on a.oneDep {color:var(--main);;}
.gnbDiv .gnbWrap .twoDep {width:100%; display:block; position:relative; visibility: visible; background:#fff; z-index: 9;}
.gnbDiv .gnbWrap li .twoDep a {color:#353d4a; font-size:16px; font-weight:400;line-height:18px; padding:7px 0; letter-spacing:-1pt;}
.gnbDiv .gnbWrap li .twoDep a:first-child {padding-top:12px;}
.gnbDiv .gnbWrap li.on .twoDep { background:#f3f3f3;}
.gnbDiv .gnbWrap li.on .twoDep a.off:hover {color:var(--main);;}
.disB{display:block;}
.twoDep_bg{border-bottom:2px solid var(--main);}






/* 기타 */
.popup-layer4 {cursor: move;}
.pop-container {position: relative;}
.popup-layer4 .btn-r {position: absolute; bottom: -30px;}
.popclose {z-index:99; position:fixed; width:100%; bottom:0pt; text-align:right; color:#333; font-size:11px; padding: 5px;}
.popclose img {position:relative;padding-right:5px;}
.popclose a {display:inline-block; height:20px; padding:0 8px; background-color:#000; font-size:11px; color:#fff; border-radius: 2px; line-height: 20px; text-decoration: none;}

#elpt_banner .banner .btn_close { position:absolute; right:41px; bottom:31px; }
#elpt_banner .banner .btn_close label { font-size:11px; color:#fff; position: relative; top: -3px; }
#elpt_banner .banner .btn_close img {margin: -5px 0 0 -20px;}
#elpt_banner .banner .btn_close button { margin:0; margin-left:20px; padding:0; background:none; border:0; }
a.cbtn {display:inline-block; height:20px; padding:0 8px; background-color:#000; font-size:11px; color:#fff; border-radius: 2px; line-height: 20px;}
.top-logo {display: inline-block;}
.bx-wrapper {margin: 0 auto; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border: 0; background: none;}
.bx-wrapper .bx-controls-direction a {z-index: 999;}
.disB{display:block;}
.dropbnt {height:32px;}
.radio-st{vertical-align:-3px; width:15px; height:15px;}


/* 모의시험 */
#exam-container {width: 100%; position: relative; height: 100%;}
#exam-container .section_full {}
button.exam_btn {width: 90px;}
.myExam .table_board_for tr td:first-child {text-align: left;}
.section.exampage {padding: 10px;}
.examHeader {}
.examHeader div {height: auto;}
.examHeader .left {width: 100%; background: #fff; border: 1px solid #000;}
.examHeader .left h2 {font-size: 24px; padding: 30px; color: #000; font-weight: 700;}
.examHeader .arrow_header {width: 107px;}
.infoBox.sticky {position:fixed;top:0; left:0; width:100%; z-index:999; }
.infoBox.sticky ul {background:#fff;}
.infoBox ul li {float: left; width: 21%; border-left: 1px solid #000; border-bottom: 1px solid #000;}
.infoBox ul li:nth-child(3) {width: 37%;}
.infoBox ul li:last-child {border-right: 1px solid #000;}
.infoBox ul li div, .cardTop div {float: left; font-size: 13px;}
.infoBox ul li .left, .cardTop .left {height: 39px; font-weight: 700; padding: 0 10px; line-height: 39px; border-right: 1px solid #000;}
.infoBox ul li .right, .cardTop .right {height: 39px; font-weight: 700; line-height: 39px; text-align: center; padding: 0 10px;}
.right.res_time {color: #ff0000;}

.examBody {padding: 30px 0; width: 78%;}
.examBox {margin-bottom: 40px;}
.examBox:last-child {margin-bottom: 0;}
h1.examTitle {margin-bottom: 30px; font-size: 18px; position: relative; line-height: 1.5; display: table;}
h1.examTitle img.exam-o, h1.examTitle img.exam-x {position: absolute; top: -20px; left: -15px;}
h1.examTitle span {font-size: 28px; color: #eb6c5f; display: inline-block; margin-right: 10px; width: 48px; padding-left: 10px;}
h1.examTitle span, h1.examTitle p {display: table-cell; vertical-align: top;}
h1.examTitle p {position: relative; top: 8px;}
.examList td {text-align: center;}
.examList td:nth-child(1) {width: auto;}
.examList td:nth-child(2) {width: 100px;}
.examList td:nth-child(3) {width: 100px;}
.examList td:nth-child(4) {width: 100px;}
.examList td:nth-child(5) {width: 160px;}

.mchoice {padding: 0 30px;}
.mchoice li {margin: 10px 0; position: relative;}
.mchoice li img.examCheck {position: absolute; top: -9px; left: -4px;}
.mchoice li a {font-size: 15px;}
.mchoice li a span {display: inline-block; margin-right: 10px;}
.reference {padding: 10px; background: #f7f7f7; border: 1px solid #ddd; margin: 0 auto 30px; width: 95%;}
.reference p {padding: 10px; font-size: 13px; line-height: 1.8; width: 100%; word-break: keep-all;}
.schoice {padding: 0 30px;}
.schoice .answer {width: 100%; border: 0; border-bottom: 1px solid #ddd; padding: 10px; outline: none; font-size: 13px; color: #0056c5; height: 36px; line-height: 1.5; overflow: hidden;}
.examFooter {margin-top: 50px; padding: 30px 0; border-top: 1px solid #000; text-align: center;}
.examFooter button.examConfirm {border: 1px solid #000; padding: 20px; font-size: 18px; font-weight: 700; color: #000; background: #fff; width: 100%; max-width: 400px; height: auto;}
.omrcard {width: 230px; display: inline-block; position: absolute; top: 200px; right: 10px;}
.cardTop {width: 230px; display: inline-block; border: 1px solid #000;}
.cardTop .right {width: 130px;}
.omrsticky {position: fixed; top: 0; width: 230px; left: 50%; margin-left: 300px;}
.sticky + .content {padding-top: 60px;}
h1.audioSticky {position:fixed; top:0; left:10px; background:#fff; width:auto; padding:0px; z-index:999; border-radius:0 0 30px 30px;}
table.checking {width: 230px;}
table.checking th {width: 50px; font-size: 18px; font-weight: 700; text-align: center; background: #f7f7f7;}
table.checking th, table.checking td {border-top: 1px solid #ececec;}
table.checking td {padding: 10px; min-height: 55px;}
ul.ckpoint {width: 100%; display: inline-block;}
ul.ckpoint li {float: left; width: 20%; text-align: center; background: url(/files/default-img/ck_off.png) no-repeat center; height: 31px; line-height: 31px; font-size: 11px; color: #b7b7b7;}
ul.ckpoint li.on {background: url(/files/default-img/ck_on.png) no-repeat center; color: #ff9900;}
table.checking td .answer {width: 100%; border: 0; background: #f7f7f7; padding: 5px; margin: 0; height: 45px;}
.check-box {height: 100%; max-height: 720px; overflow-y: auto; overflow-x: hidden; border: 1px solid #ddd;}
.radio_container {display: block;position: relative;padding-left: 25px;margin-bottom: 12px;cursor: pointer;font-size: 15px;font-weight: 400;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; line-height: 1.6; word-break: keep-all;}
.radio_container input {position: absolute;opacity: 0;cursor: pointer;}
.exam_checkmark {position: absolute;top: 0;left: 0;}
.exam_checkmark:after {content: "";position: absolute;display: none;}
.radio_container input:checked ~ .exam_checkmark:after{display: block;}
.radio_container .exam_checkmark:after {top: -9px;left: -4px;width: 24px;height: 29px;background: url(/files/default-img/examCheck.png) no-repeat center top;}
.radio_container .exam_checkmark.on {width: 24px;height: 29px;background: url(/files/default-img/examCheck.png) no-repeat center -9px;}

.radio_container.chk_right {margin: 0; padding: 0;}
.answer_box, .answer, .exam_comment {padding: 10px; background: #f7f7f7; border: 1px solid #ddd; margin: 0 auto 10px; width: 95%; line-height: 1.5;}
.answer p, .answer_box p, .adm-comm {font-weight: 700; color: #000; margin-bottom: 10px;}
.answer {background: #fff2f2;}
.answer_box {background: #f1faff}
.exam_comment {background: #fffbe5;}
.commentary {background: #fff3e9;}
ul.lecture-block li .btn-area.pause {height: 100px; display: inline-block;}
#textBox {font-size: 15px;}
#examMsg a {width: 50px; height: 24px; line-height: 24px; background: #000; color: #fff; font-size: 13px; font-weight: bold; display: inline-block;}
#examWrap #wallWrap { position:fixed; top:0px; right:0; bottom:0; left:0; background-color:#fff; z-index:999; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; filter:alpha(opacity=75); -khtml-opacity:0.75; -moz-opacity:0.75; opacity:0.75; }
#examWrap #examMsg {position:fixed;  top:300px; right:0; bottom:0; left:0;  margin:0 auto; height:180px; width:400px; padding:35px; border:1px solid #8c90ae; background:#eee; border-radius:5px;  color:#000000; text-align:center; z-index:9999; }
#textBox {vertical-align:middle; padding-top:20px;}
#examWrap #examMsg #textBox .msg_red { color:#bb0c20; padding-bottom:20px;}
.btn_ok{ margin-top:20px; width:70px; height:26px;}
.mchoice img {width: auto; max-width: 100%;}

/* poll */
.pollList {margin: 30px auto; width: 100%; max-width: 500px; border: 1px solid #ddd;}
.pollList h2 {font-size: 18px; padding: 10px; background: #f5f5f5; border-bottom: 1px solid #ddd;}
.plistCon {padding: 15px;}
.pollBox {padding: 10px;}
.pollBtn {padding: 20px; text-align: center; border-top: 1px solid #ddd;}
.pollBtn .poll {background: #ff0000;}
.pollBtn .result {background: #000;}
.plistCon.polhead {font-size: 14px; font-weight: bold;}
.pollItemHead {padding: 10px; font-size: 13px; color: #333; border: 1px solid #ddd; margin-bottom: 10px; background: #fcfcfc;}
.etctext {border: 0; border-bottom: 1px solid #ddd; top: 0; outline: none; margin-left: 5px; padding: 0;}


/* radio button */
.radcontainer {display: block; position: relative; padding-left: 25px; margin-bottom: 12px; cursor: pointer; font-size: 14px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.radcontainer input {position: absolute; opacity: 0; cursor: pointer;}
.radcheckmark {position: absolute; top: 2px; left: 0; height: 16px; width: 16px; background-color: #eee; border-radius: 50%;}
.radcontainer:hover input ~ .radcheckmark {background-color: #ccc;}
.radcontainer input:checked ~ .radcheckmark {background-color: #2196F3;}
.radcheckmark:after {content: ""; position: absolute; display: none;}
.radcontainer input:checked ~ .radcheckmark:after {display: block;}
.radcontainer .radcheckmark:after {top: 5px; left: 5px; width: 6px; height: 6px; border-radius: 50%; background: white;}

/* poll Result */
.pollCon {margin: 30px auto; width: 100%; max-width: 600px;}
.pollView {border: 1px solid #ddd; padding: 20px;}
.pollView + .pollView {margin-top: 30px;}
.pollView h2 {margin-bottom: 20px;}
.total-poll {text-align: right; color: #ff0000; font-weight: 700; font-size: 15px; margin-bottom: 10px;}
.q-list ul {display: table; width: 100%;}
.q-list ul li {display: table-cell; font-size: 14px;}
.q-list ul li:last-child {width: 80px; text-align: right;}
.per-gr {width: 100%; border: 1px solid #ddd; background: #f5f5f5; border-radius: 5px; height: 26px; position: relative; margin: 10px 0 30px;}
.per-gr .on {height: 100%; width: 0%; color: #fff; font-weight: 700; line-height: 24px; text-align: center; background: #2196f3; border-radius: 5px 0 0 5px;}

/* 모의고사 */
.exam-page {display: inline-block; width: 100%;}
.exam_box {width: 21.8%; float: left; position: relative; border: 1px solid #ddd; margin: 0 1.6% 20px;}
.exam_img img {width: 100%;}
.examTxt {padding: 10px;}
.examTxt h1 {display:inline-block; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}
.examTxt p {padding: 5px 0; line-height: 2;}



/* 스케쥴보드 */
.scheduleCon {}
.scheduleCon .month {text-align: center; width: 100%; max-width: 300px; position: relative; margin: 0 auto 30px;}
.scheduleCon .month h3 {font-weight: 700;}
.scheduleCon .month a {position: absolute; width: 32px; height: 32px; top: 50%; margin-top: -15px;}
.scheduleCon .month a.leftBtn {background: url(/files/default-img/chevron-left.svg) no-repeat center; left: 0;}
.scheduleCon .month a.rightBtn {background: url(/files/default-img/chevron-right.svg) no-repeat center; right: 0;}
.calenBody {border: 1px solid #ddd;}
.calenBody .weekLine {display: table; width: 100%; border-top: 2px solid #000; background: #f9f9f9; letter-spacing: -0.5px;}
.calenBody .weekLine li {display: table-cell; width: 14.28571428571429%; vertical-align: top; height: 122px;}
.calenBody .weekLine li + li {border-left: 1px solid #ddd;}
.calenBody .weekLine li h1 {padding: 8px 0; text-align: center; border-bottom: 1px solid #ddd;}
.calenBody .weekLine li h1.sunday {color: #ff0000;}
.calenBody .weekLine li h1.saturday {color: #0027ff;}
.calenBody .weekLine li .scheBox {background: #fff; font-size: 13px; padding: 8px; border-bottom: 1px solid #ddd;}
.calenBody .weekLine li .scheBox .time {font-size: 13px; font-weight: 500; color: #000; display: inline-block;}
.calenBody .weekLine li .scheBox p {color: #666; margin-top: 5px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word; height: 42px; word-break: break-all;}
.calenBody .weekLine li .scheBox span {height: 15px; color: #fff; font-weight: 500; font-size: 11px; display: inline-block; text-align: center; line-height: 16px; border-radius: 3px; padding: 0 6px; white-space: nowrap; margin-left: 5px; position: relative; top: -1px;}
.calenBody .weekLine li .scheBox .live {background: #ff0000;}
.calenBody .weekLine li .scheBox .offline {background: #717fea;}
.calenBody .weekLine li .scheBox .cate001 {background: #ff0000;}
.calenBody .weekLine li .scheBox .cate002 {background: #717fea;}
.calenBody .weekLine li .scheBox .cate003 {background: #ff5722;}
.calenBody .weekLine li .scheBox .cate004 {background: #00bcd4;}
.calenBody .weekLine li .scheBox .cate005 {background: #4caf50;}
.calenBody .weekLine li .scheBox .cate006 {background: #2196f3;}
.calenBody .weekLine li .scheBox .cate007 {background: #ffc107;}
.calenBody .weekLine li .scheBox .cate008 {background: #009688;}
.calenBody .weekLine li .scheBox .cate009 {background: #f44336;}

/* 메인게시판 */
.mblist .btext ul li {text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; width: 100%; overflow: hidden; position: relative; letter-spacing: -0.5px; padding-right: 100px; margin: 10px 0;}
.btext .newIcon {display: none;}
.mblist .btext span.date {position: absolute; right: 0;}

/* 메인갤러리 */
.mbgallery .bboard {display: inline-block; width: 100%;}
.mbgallery .btext {float: left; width: 23%; max-width: 280px; margin: 15px 0;}
.mbgallery .btext + .btext {margin-left: 2.2%;}
.mbgallery .btext li:first-child {position: relative; height: 0; padding-bottom: 70%; overflow: hidden;}
.mbgallery .btext li:first-child img {position: absolute; top: 0; width: 100%;}
.mbgallery .btext li:last-child {margin-top: 15px; font-size: 17px; color: #333; font-weight: 400; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word; width: 100%; height: 50px;}
.mbgallery .btext:nth-child(5) {margin-left: 0;}

/* 메인뉴스 */
.mbnews .bboard {display: inline-block; width: 100%;}
.mbnews .btext {float: left; width: 49%; margin: 10px 0;}
.mbnews .btext:nth-child(even) {margin-left: 2%;}
.mbnews .btext ul {width: 100%; padding-left: 24%; position: relative; height: 100px; overflow: hidden;}
.mbnews .btext ul li:first-child {width: 22%; position: absolute; top: 0; left: 0;}
.mbnews .btext ul li:first-child img {width: 100%;}
.mbnews .btext ul li:nth-child(2) a {font-size: 17px; color: #333; font-weight: 400; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap:break-word; width: 100%; height: 30px;}
.mbnews .btext ul li.contents {font-size: 15px; margin-top: 5px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word; height: 45px;}

/* 메인매거진 */
.mbmagazie .btext {padding: 20px 10px 25px;}
.mbmagazie .btext + .btext {border-top: 1px solid #ddd;}
.mbmagazie .btext li:first-child {font-size: 17px; color: #333; font-weight: 400;}
.mbmagazie .btext li.contents {margin: 10px 0; font-size: 15px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word; width: 100%; height: 47px;}

/* 별점 */
.starImg {position: relative; display: inline-block; width: 80px; padding: 0;}
.starImg span {display: inline-block; width: 100%; height: 15px; background: url(/files/default-img/star.png) no-repeat top left; background-size: 80px; position: absolute; left: 0; top: 0;}
.starImg span.on {z-index: 1; background: url(/files/default-img/star.png) no-repeat bottom left; overflow: hidden; background-size: 80px;}
.starBox {text-align: left; display: inline-block; font-weight: bold; color: #000; height: 15px; position: relative;}
.starBox div {float: left;}
.starBox .starImg {height: 15px;}
.starBox .starImg button {width: 10%; height: 15px; padding: 0; background: none; position: absolute; z-index: 2;}
.starBox .starImg button.one {left: 0;}
.starBox .starImg button.two {left: 10%;}
.starBox .starImg button.three {left: 20%;}
.starBox .starImg button.four {left: 30%;}
.starBox .starImg button.five {left: 40%;}
.starBox .starImg button.six {left: 50%;}
.starBox .starImg button.seven {left: 60%;}
.starBox .starImg button.eight {left: 70%;}
.starBox .starImg button.nine {left: 80%;}
.starBox .starImg button.ten {left: 90%;}
.contable .section-box .ul-1 > li.starpnt {width: 100px;}
.starWrap div {float: left;}
.starWrap .starImg {height: 15px;}
.starWrap .starImg button {width: 20%; height: 15px; padding: 0; background: none; position: absolute; z-index: 2;}
.starWrap .starImg button.one {left: 0;}
.starWrap .starImg button.two {left: 20%;}
.starWrap .starImg button.three {left: 40%;}
.starWrap .starImg button.four {left: 60%;}
.starWrap .starImg button.five {left: 80%;}

.markView {position: absolute; top: 0; left: 0; letter-spacing: -1px; font-size: 12px; white-space: nowrap; padding: 2px 6px; border-radius: 5px; margin: 5px;}
.btnRight {text-align: right;}
.zoomWrap {margin-top: 10px;}


/* 관련과정 */
.relation {width: 100%; display: inline-block; padding:20px 0; border-top:1px solid #ddd;}
.relation li {float: left; width: 19%; margin-right: 1.2%;}
.relation li:nth-child(5n) {margin-right: 0;}
.relation li .rimg {position: relative;}
.relation li .rimg img {width: 100%;}
.relation li .rtext {padding-top: 10px; font-size: 15px; height: 64px;  overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 라인수 */ -webkit-box-orient: vertical; word-wrap:break-word; }
.relation-title {font-size:17px; color:#000; height:45px; line-height:45px; background:#000; color:#fff; width:165px; text-align:center;}

/* 설문리스트 */
.pollBody {width: 100%; display: inline-block;}
ul.pollCont {width: 32%; padding: 20px; border: 1px solid #ddd; float: left; margin-right: 2%; margin-bottom: 30px;}
ul.pollCont:nth-child(3n) {margin-right: 0;}
ul.pollCont h2 {height: 54px; overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap:break-word; margin-bottom: 20px;}
ul.pollCont li:last-child {padding-top: 20px; margin-top: 20px; border-top: 1px solid #ddd; text-align: center;}
ul.pollCont li button {width: 49%;}
button.pollpct {background: #ca2500;}
button.pollview {background: #ff9900;}
.pollOut {background: #f9f9f9;}
ul.pollOut li button {width: 100%;}


/* 채팅 */
.chatBody {width: 100%; height: 100%; background: #f5f6f8; position: relative; padding-bottom: 50px;}
.chatCon {width: 100%; height: 100%; padding: 10px;}
.ftleft {text-align: left; width: 100%; margin-bottom: 10px; padding-right: 50px;}
.ftright {text-align: right; width: 100%; margin-bottom: 10px; padding-left: 50px;}
.chusnm {color: #39c0c3;}
.chatBox {padding: 10px; color: #000; border: 1px solid #ddd; background: #fff; display: inline-block; border-radius: 5px; position: relative;}
.chatBox.mine {text-align: left; background: #e5fbf8; border: 1px solid #cddfe1;}
.chatTxt {width: 100%; position: absolute; bottom: 0; left: 0;}
.chatinput {width: 100%; height: 50px; background: #fff; border: 1px solid #f5f5f5; padding-left: 15px; padding-right: 70px; outline: none;}
button.chatResult {width: 50px; height: 30px; padding: 0; background: #3cb6c3; position: absolute; right: 10px; bottom: 10px;}
.chatMsg {color: #000; text-align: center; padding: 10px 0;}
.chatMsg.chatOut {color: #ff0000;}


#qa-list, #rev-list {margin-bottom: 50px;}

/* 롤오버메뉴 */
.topmenu_center #m0 { padding-right:0px;}
.topmenu_container { width:100%; background:none; border-bottom: 1px solid #000;}
.topmenu {height:52px; box-sizing:content-box; margin:0 auto; line-height:1; width:100%; background:none; max-width: 1100px;}

#menu-line { position:absolute; top:0; left:0; height:3px;  background:#009ae1; -webkit-transition:all 0.25s ease-out; -moz-transition:all 0.25s ease-out; -ms-transition:all 0.25s ease-out; -o-transition:all 0.25s ease-out; transition:all 0.25s ease-out; }

.topmenu_center,.topmenu_center ul,.topmenu_center ul li,.topmenu_center ul li a,.topmenu_center #menu-button { margin:0; padding:0; border:0; list-style:none; line-height:1; display:block; position:relative; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; z-index:999; }
.topmenu_center > ul { padding-left: 40px;}
.topmenu_center:after,.topmenu_center > ul:after { content:'.'; display:block; clear:both; visibility:hidden; line-height:0; height:0; }
.topmenu_center #menu-button { display:none; }

.topmenu_center > ul > li { float:left; width: 10%;}
.topmenu_center.align-center > ul { font-size:0; text-align:center; }
.topmenu_center.align-center > ul > li { display:inline-block; float:none; }
.topmenu_center.align-center ul ul { text-align:left; }

.topmenu_center.align-right > ul > li { float:right; }
.topmenu_center > ul > li > a {text-align: center; font-weight: 600; padding:18px 0; font-size:16px; text-decoration:none; text-transform:uppercase; color:#333; -webkit-transition:color .2s ease; -moz-transition:color .2s ease; -ms-transition:color .2s ease; -o-transition:color .2s ease; transition:color .2s ease; }
.topmenu_center > ul > li:hover > a,.topmenu_center > ul > li.active > a { color:#ca2500; font-weight: 700;}
.topmenu_center > ul > li.has-sub > a { padding-right:45px; }
.topmenu_center > ul > li.has-sub > a::z { position:absolute; top:21px; right:25px; width:4px; height:4px; border-bottom:1px solid #ffffff; border-right:1px solid #ffffff; content:''; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); transform:rotate(45deg); -webkit-transition:border-color 0.2s ease; -moz-transition:border-color 0.2s ease; -ms-transition:border-color 0.2s ease; -o-transition:border-color 0.2s ease; transition:border-color 0.2s ease; }
.topmenu_center > ul > li.has-sub:hover > a::after { border-color:#ffff00; }

.topmenu_center ul ul li.has-sub > a::after { position:absolute; top:13px; right:10px; width:4px; height:4px; border-bottom:1px solid #ffffff; border-right:1px solid #ffffff; content:''; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg); -webkit-transition:border-color 0.2s ease; -moz-transition:border-color 0.2s ease; -ms-transition:border-color 0.2s ease; -o-transition:border-color 0.2s ease; transition:border-color 0.2s ease; }

.topmenu_center.align-right ul ul { text-align:right; }
.topmenu_center.align-right ul ul li.has-sub > a::after { right:auto; left:10px; border-bottom:0; border-right:0; border-top:1px solid #ffffff; border-left:1px solid #ffffff; }
.topmenu_center ul ul li.has-sub:hover > a::after { border-color:#ffff00; }
.topmenu_center ul ul { position:absolute; left:-9999px; top: 52px;}
.topmenu_center li:hover > ul { left:auto;}
.topmenu_center.align-right li:hover > ul { right:0; }
.topmenu_center ul ul ul { margin-left:100%; top:0; }
.topmenu_center.align-right ul ul ul { margin-left:0; margin-right:100%; }
.topmenu_center ul ul li { height:0; -webkit-transition:height .2s ease; -moz-transition:height .2s ease; -ms-transition:height .2s ease; -o-transition:height .2s ease; transition:height .2s ease; }
.topmenu_center ul li:hover > ul > li { height:32px; }
.topmenu_center ul ul li a {text-align: center; padding:10px 0; width:160px; font-size:13px; background-color: #000; text-decoration:none; color:#fff; font-weight:bold;-webkit-transition:color .2s ease; -moz-transition:color .2s ease; -ms-transition:color .2s ease; -o-transition:color .2s ease; transition:color .2s ease; }
.topmenu_center ul ul li:hover > a,.topmenu_center ul ul li a:hover { color:#ca2500; background-color: #f4f4f4;  }








@media (max-width: 1024px){
    .calendar .cal_area {width:67%}
    .calendar .scheduleList  {width:calc(33% - 30px);}
    .infoBox ul li .left {width:100%; text-align:center; border-right:0; border-bottom:1px solid #000;}
    .infoBox ul li .right {width:100%;}
}

@media (min-width: 835px){
    .max768 {display: none;}
    .category-tap select {display: none;}
}

@media (min-width: 481px){
    .max480 {display: none;}
}

@media (max-width: 834px) {
    .min768 {display: none;}
    .section {width: 96%;}
    .cate-tap, .cate-tap.bottom-line, .c-List-Type ul li:nth-child(1) {display: none;}
    .c-List-Type ul li:nth-child(2) {padding-left: 0;}
    .c-Album-Type ul {width: 46%;}
    .c-Album-Type ul {margin: 0 2% 20px;}
    .book_left {width: 110px;}
    .book_right {padding-left: 10px;}
    .book_right li h2 {font-size: 15px;}
    table.myOrder th {width: 90px;}
    .cate-tap.salesMain {display: block;}
    .teacher_box {width: 31%;}
    #formCate {width: 100%; margin-bottom: 10px;}
    .goods-box {width: 31.3%;}
    .ul-photo > li {width: 30.3%;}
    .omrcard {display: none;}
    .infoBox ul li, .infoBox ul li:last-child {width: 50%; margin-bottom: 0px;}
    .infoBox ul li:nth-child(3) {border-right:1px solid #000;}
    .infoBox ul li:nth-child(3),.infoBox ul li:nth-child(4) {width:100%;}
    .infoBox ul li:nth-child(2) {border-right:1px solid #000;}
    .infoBox ul li .left {width:78px; border-bottom:0; border-right:1px solid #000;}
    .infoBox ul li .right {width:auto;}
    .examBody {width: 100%;}
    .slider_boxnews .btext {width: 100%;}
    .slider_boxnews .btext:nth-child(even) {margin-left: 0;}
    .calendar .cal_area {width:100%; padding:0; border:0;}
    .calendar .scheduleList {width:100%; margin:0;}
    .calendar .scheduleList .default_txt {display:block; height:250px; text-align:center; line-height:250px; width:100%;}
    .calendar .scheduleList .list_header {margin-top:15px;}
    .relation li {width: 24%; margin-right: 1.33333333%;}
    .relation li:nth-child(4n) {margin-right: 0;}
	.pw_find .find_form_box{border-left: 0px solid #ddd;}
.id_find {float:auto; padding-top: 30px; margin-bottom: 30px; width:100%; }
.pw_find {float:auto; padding-top: 30px;  margin-bottom: 30px; width:100%; border-top:1px solid #ddd;}
}



@media (max-width: 480px) {
    h3 {font-size: 24px;}
    table {table-layout: fixed;}
    .min480 {display: none;}
    * {letter-spacing: -1px;}
    .form-control, input.ls, input.hs {width: 100%;}
    .ul-news td:first-child {width: 130px;}
    .ul-photo > li {width: 47%;}
    .contable.bbslist-t .ul-1 li:nth-child(4), .contable.bbslist-t .ul-1 li:nth-child(5) {display: none;}
    .bbslist-t li:nth-child(3), .boardQna li:nth-child(3) {width: 20%;}
    .contable.boardQna .ul-1 li:nth-child(4), .contable.boardQna .ul-1 li:nth-child(5) {display: none;}
    .c-List-Type {display: inline-block; width: 100%; }
    .c-List-Type ul {width: 100%; float: left; padding: 20px;}
    .c-List-Type ul li:nth-child(1), .c-List-Type ul li:nth-child(2), .c-List-Type ul li:nth-child(3) {display: block; width: 100%;}
    .c-List-Type ul li:nth-child(2) {padding: 0;}
    .cousse-Name {font-size: 15px;margin-top: 10px;}
    .lecture-Price {position: relative; margin-top: 20px;}
    .c-List-Type ul li:nth-child(3) {margin-top: 20px;}
    .c-Album-Type ul {width: 100%;}
    .c-Album-Type ul {margin: 0 0 20px;}
    #lec-list table .number, #lec-list table .time {display: none;}
    .detail-top .left {width: 100%; margin-bottom:10px;}
    .detail-top .right {width: 100%;}
    .listTable .packCont {display: block; float: none;}
    .listTable .listView {display: block; float: none; width: 100%; margin-top: 10px;}
    .tabcontent.pack {padding: 20px 0;}
    #lec-list .data {width: 50px;}
    #lec-list .view {width: 80px;}
    .book_left {display: block; width: 100%;}
    .book_right {display: block; padding: 0;}
    .book_right li h2 {margin-top: 10px;}
    .book_box {width: 44%; margin: 20px 3%;}
    .oderRead_1 td {width: 50%;}
    .dtable.col2 .table-th, .dtable.col2 .table-td {display: block; float: left;}
    .dtable.col2 .table-th, .dtable .table-th {width: 30%;}
    .dtable.col2 .table-td, .dtable .table-td {width: 70%;}
    .taxBox .dtable.col2 {width:100%;}
    .taxBox .dtable.col2 .table-th,.taxBox .dtable.col2 .table-td {display:table-cell; float:none;}
    .taxBoxList ul li {width:100%;}
    table.orderTermRead2 th {width: 20%;}
    .bbsview td {width: 100%;}
    .pointList th {width: 22%;}
    .cartList-btn > button {width: 49.5%; margin-bottom: 2px;}
    input.zipCode {width: 100%;}
    .couponContent {padding: 30px 10px;}
    .couponPopup th:last-child {width: 90px;}
    .btn_center.salesMain button {width: 100%;}
    .cate-tap.salesMain {border: 0;}
    .cate-tap.salesMain li {width: 32.5%; margin: 2px 1px; border-bottom: 1px solid #ddd;text-align: center;}
    .sellerCourse th, .orderResult th {width: 18%;}
    .find_form_box {padding: 0;}
    .joinForm, .info-text {width: 98%;}
    .boardSearch select, .boardSearch .board_search, .boardSearch button {width: 100%; margin: 1px 0;}
    .teacherTop, .teacherTop .left, .teacherTop .right {display: block; width: 100%; float: none;}
    .teacherTop .right {margin-top: 30px;}
    .teacher_box {width: 98%; margin-bottom: 30px;}
    .agree-box {padding: 10px 0px;}
    .book-cate select {margin-bottom: 2px;}
    button.btn-cate, button.address-find {width: 100%;}
    .goods-box {width: 48%;}
    .addEtc {padding-top: 0;}
    .ul-faq .panel {padding: 20px 10px;}
    .q-icon {left: 0; width: 25px; height: 25px;}
    .ul-faq .flip {padding: 10px 0 10px 35px;}
    button.coursFree {width: 100%;}
    #qa-list {padding: 0;}
    .mylecBox, .lectureImg, .lectureTxt, .btn-area.pause {display: block; width: 100%;}
    .lectureTxt {padding-left: 0; margin-top: 10px;}
    .pause-btn, .pause_date_input, .pause_close {width: 100%;}
    .mystudytap li {width: 32%;}
    .lecturestudy li {padding: 10px;}
    .my-class h1 {font-size: 13px; background-size: 16px; padding: 15px 0 15px 20px;}
    #lec-list table td.view > button {width: 68px; text-align:center;}
    .couponList th:nth-child(1) {width: auto;}
    .couponList th:last-child {width: 74px;}
    .coupon-mobile .coupon-num {color: #333; font-weight: bold; font-size: 15px;}
    .btn_center.salesMain .form-control {margin-bottom: 2px;}
    .cartList th:nth-child(4), .cartList th:nth-child(6) {width: 70px;}
    .infoBox ul li {border-right:1px solid #000;}
    .infoBox ul li, .infoBox ul li:last-child {width: 100%;}
    .infoBox ul li:nth-child(2) {width:100%}
    .infoBox ul li:nth-child(3) {width:100%;}
    .mchoice {padding: 0 10px;}
    .examHeader .left h2 {font-size: 18px; padding: 15px 10px;}
    #address, #address1 {width: 100%;}
    #couponCode {width: 100%;}
    .myClassTab a {font-size: 14px;}
    .WrapBtn {margin-bottom: 10px;}
    .examList td > button {width: 80px;}
    .examList td:nth-child(5) {width: 100px;}
    .calenBody .weekLine li {display: block; width: 100%; border-top: 1px solid #ddd;}
    .calenBody .weekLine li + li {border-left: 0;}
    .mbgallery .btext {margin: 7px 0; width: 49%;}
    .mbgallery .btext + .btext {margin-left: 0;}
    .mbgallery .btext:nth-child(even) {margin-left: 2%;}
    .mbgallery .btext li:last-child {font-size: 14px; margin-top: 5px; height: 44px;}
    .calendar .line_row .day {font-size:15px;}
    .calendar .cal_header .cal_month h1, .calendar .scheduleList .list_header h1 {font-size:25px;}
    .calendar .line_row div {height:55px; line-height:55px;}
    .calendar .cal_header .cal_btn a {width:40px; height:40px; line-height:40px; font-size:20px;}
    .calendar .line_row .day span {width: 40px; height: 40px; line-height: 40px;}
    .relation li {width: 49%; margin-right: 2%;}
    .relation li:nth-child(2n) {margin-right: 0;}
    ul.pollCont {width: 100%; margin-right: 0;}

    .section.exampage {padding: 0;}
    .add-coupon {margin-bottom: 40px;}
    .exemList th:last-child {width: 90px;}
    #lec-list .movie_list table .page {display: none;}
    .exam_box {width:48%; margin:0 1% 20px;}
    li.answer_faq span.answer_icon{position:absolute; left:0px; width:40px; display:inline-block; top:5px; vertical-align:top;}
    li.answer_faq .answer_txt{margin-left:36px;}
    li.answer_faq .answer_txt img{width:100%;}
    .popup-layer4 .btn-r {position: unset; bottom: -30px;}

	.joinNew {width:100%; padding: 10px 0; border: 0; border:1px solid #ddd;}
    .joinNew section{margin-top:0px;}
	.joinNew  h1{padding-left:20px;}
	.joinNew  h1:before{left:10px;}
	.joinForm .dtable .table-th {width: 25%; font-size:14px;}
	.joinForm .dtable .table-td  {width: 100%; height:auto; min-height:auto;}
	.joinNew .dtable .table-th {width: 25%; font-size:14px;}
	.joinNew .dtable .table-td  {width: 100%; height:auto; min-height:auto;}
	.joinNew .hss {width: 100%;}
	.joinNew .ss {width: 46%;}
	.joinNew .iemail {width:45%;}
	.joinNew .tel_txt {width:30%;}
	input.hss{width:100%;}
}