@charset "utf-8";
@import url("normalize.css");
@import url("common.css");
@import url("nav.css");
@import url('https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined|Material+Icons+Two+Tone|Material+Icons+Round|Material+Icons+Sharp');
/*@import url("contents.css");*/


html {height:100%;}
body {font:  13px/1.2 ng,'나눔고딕', NanumGothic, '돋움', Dotum, '굴림', Gulim, Helvetica,sans-serif; color:#333333; background-color:#fff; line-height:1.2;}
#wrap {word-wrap: break-word; word-break: keep-all;}
img{max-width: 100%;}
table th{text-align:center;}

html,body{height:100%}
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,aside,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;}
/* body{-webkit-text-size-adjust:none;font-size:0.9em;color:#444;font-family:'돋움',Dotum,AppleGothic,Arial Unicode MS,sans-serif;overflow-y:scroll;*overflow-y:visible} */
h1,h2,h3,h4,h5,h6{font-weight:400;font-size:1em}
dl,ul,ol,li{list-style:none}
button{border:0 none;background-color:transparent;cursor:pointer;margin:0;}
input,select,textarea,button{font-size:100%;vertical-align:middle; padding: 5px; border: 1px solid #bebebe; color: #555;}
table{border-collapse:collapse;border-spacing:0;}
table{ word-break:break-all;}/*2015-09-21 추가*/
caption,legend { visibility:visible; width:0; height:0; overflow:hidden; font-size:0; line-height:0; text-indent:-3000em;}
input[type=text],input[type=password],input[type=submit],input[type=search],input[type=tel],input[type=email]{-webkit-appearance:none;border-radius:0; }
input[type="radio"], input[type="checkbox"]{margin: 0; top:4px;}
input:checked[type=checkbox]{background-color:#666;-webkit-appearance:checkbox}
button,input[type=button],input[type=submit],input[type=reset],input[type=file]{-webkit-appearance:button;border-radius:0;cursor:pointer;border:none;/*height:22px;*/}


img { -ms-interpolation-mode: bicubic;}
img	{vertical-align:middle;}

*, *:after, *::before { -moz-box-sizing:border-box; box-sizing:border-box; -moz-box-sizing:border-box; }
* {outline: none;}

a { color: #333333; text-decoration: none !important; }
a:link { color: #333333; text-decoration: none !important; }
a:visited { color: #333333; text-decoration: none !important; }
a:hover { color: #333; text-decoration: none !important; }
a:active { color: #333; text-decoration: none !important; }
a:focus { color: #333; text-decoration: none !important; }

input[type=radio] {width:auto; border:none !important;}
input[type=image] {width:auto; border:none !important;padding: 0;}

* strong {font-weight:600;}
* table th {font-weight:600; vertical-align:middle;}
* table td {vertical-align:middle;}

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12{ padding-left: 15px; padding-right: 15px;}
.pdrl20{padding-right: 20px; padding-left: 20px;}
.pdtb20{padding-top: 20px; padding-bottom: 20px;}
.pd0{padding: 0;}
.mg0{margin: 0;}
.mT4{margin-top: 4px !important;}
.width80{width:80% !important;}
h3.title{font-size: 1.1em; font-weight: 600;}
.btnbox{width: 100%; text-align: center;}
.comingsoon img{width: 100%; }
.Tcenter{text-align: center;}
.btnSet{padding-top: 10px;}
.btn_sky_big{ background: #0b2754; padding: 6px 14px; text-align: center; color: #fff; display: inline-block; box-sizing: border-box;
    font-size: 14px; border: solid 1px #0b2754; border-radius: 0;}
.btn-zipcode{display: inline-block; border: solid 1px #ccc; padding: 6px 10px 8px; margin: 1px 0; line-height: 1;}
.width500{width: 100% !important; max-width: 500px !important;}

/*찜하기*/
.btn_zzim, .btn_nozzim{display: inline-block;font-size: 13px; font-weight: bold; padding-left: 22px; height: 18px; line-height: 18px; margin: 0 10px;}
.btn_zzim{background:url(/images/common/icon_zzim.png) no-repeat 0 0;}
.btn_nozzim{background:url(/images/common/icon_nozzim.png) no-repeat 0 0;}

/*로그인페이지*/
#login_container{padding-top: 5vh; text-align: center;}
#login_container > #contents > #footer{text-align:center; margin-top: 20px; border: none; }
#login_container{ box-sizing: border-box; }
#login_container > #contents{background-size: contain; width: 100%; max-width: 640px; margin: 0 auto; padding: 20px;}
.login_box{ width: 100%;  margin: 0 auto; background: rgba(255, 255, 255, 0.6); padding: 40px; box-sizing: border-box; position: relative; }
.login_box ul{ display: flex; align-content: center; flex-wrap: wrap; justify-content:flex-start;}
.inputidpw{ display: flex; align-content: center; flex-wrap: wrap; justify-content:flex-start; width: 60%;}
.inputidpw div{display: flex; align-content: center; flex-wrap: wrap;}
.inputidpw div:nth-child(1), .inputidpw div:nth-child(2) {padding-bottom: 4px;}
.inputidpw div:nth-child(1n){ width: 20%; }
.inputidpw div:nth-child(2n){ width: calc((100% - 20%) - 2px);}
.login_box .btnbox{width: 40%; display: flex; align-content: center; flex-wrap: wrap; justify-content: space-around; font-size: 15px; }
.login_box .btn_findid{padding-left:16px;}
.login_box .btn_login, .login_box .btn_join{display: inline-block; width: calc((100% / 2) - 4px); height: 100%; margin-left: 4px; font-weight: 700;border-radius: 2px; text-align: center; box-sizing: border-box; font-family: 나눔고딕,NanumGothic,ng,"돋움",Dotum,AppleGothic,Arial Unicode MS,sans-serif;}
.login_box .btn_login{background: #ed1c24; color: #fff;}
.login_box .btn_join{background: #0b2754; color: #fff;}
.login_box .id, .login_box .pass{margin-top:6px;}
.login_box .id span, .login_box .pass span{display:inline-block; width:80px; font-size:13px;}
.login_box .id input, .login_box .pass input{width:186px; border:solid 1px #ccc; padding:10px; box-sizing: border-box;}
.login_box .id_save{padding: 10px 0; text-align: left; margin-left: 12%;}
.login_box .smsbtn{text-align: left; margin-left: 12%;}
.login_box .smsbtn a{display: inline-block; }
.login_box .smsbtn a img{width: 100%; max-width: 300px;}
.btn.btn_submit{color: #ffffff; background: #27344e; border: 1px solid #27344e;}
.btn.btn-search{color: #000; background: #fff; border: 1px solid #ccc;}
@media (max-width:640px){
	.inputidpw, .login_box .btnbox{width: 100%;}
	.inputidpw div:nth-child(2n){width: 80%;}
	.login_box .btnbox{padding-left: calc(20% - 4px); padding-top: 5px; height: 40px; font-size: 14px;}
	.login_box .id_save{margin-left: 20%;}
	.login_box .smsbtn{margin-left: 20%;}
}


/*  로그인 아이디 패스워드 찾기 */
#container_lmenu {position:relative; width:100%; max-width:1080px; margin:0 auto; clear:both;}
#container_lmenu .member_idpass {width:100%; text-align:center;}
#container_lmenu #lnb{float: left;  border-bottom: solid 4px #ddd; }
#member_join {width:100%; ;margin:20px auto 0; padding:0; display:inline-block;border:none;}

.member_idpw {width:70%; text-align:left; background:#ededed; border:1px solid #cccccc; margin:0 auto; padding:20px 0 10px 0;}
.member_idpw h3 {font-size:15px; text-align:center;}
.members  h3.title {font-size:14px;  font-weight:500;}
.member_idpw_title {display:inline-block; width:80px; text-align:center; color:#ffffff; padding:5px 0; margin:0 0 10px 0; background:#398ad8; border-radius:50px;}
.member_idpw .info {width:40%; text-align:left; margin:0 auto;}
.member_idpw .info .fontblue {display:inline-block; font-size:15px; font-weight:500; margin:0 0 0 5px;}
.field label {display:inline-block; }
.members .form-control {width:106px; padding:7px !important; border:1px solid #bebebe; margin:0 2px;}
.btn_idpw {text-align:center;}
.btn-normal {width:30%; margin:0 auto; text-align:center; background:#398ad8; padding:10px 0; color:#ffffff; font-size:16px;}

.members .finish h3{text-align: center; font-size: 20px; font-weight: 600;}
.members .finish p {width: 80%; max-width: 500px; margin: 0 auto; border: solid 1px #ccc; padding: 40px; text-align: center;}
.members .finish p strong{font-size: 1.2em; font-weight: 600;}
 
/*  비밀번호 변경 */
.change_title {background:#398ad8; width:500px; height:40px; line-height:40px; text-align:center; color:#ffffff; font-size:16px; font-weight:500; margin:0 auto; border-radius:100px;}
.change_pass {width:500px;  padding: 25px 40px;   font-size: 13px;   /*border: 1px solid #cccccc; */  overflow: hidden;   box-sizing: border-box;   margin: 20px auto; background:#fafafa;}
.change_pass .change_info {margin:10px 0; font-size:14px; font-weight:500; color:#505050;}
.change_pass .change_info label {display:inline-block; width:140px; }
.change_pass .change_info span {display:inline-block; background:#a0d154; width:5px; height:5px; border-radius:100%; margin:0 7px 3px 0;}
.change_pass .change_info input {padding:7px 10px !important;}
.btn_change { display:block; width:50%;  margin: 40px auto 0;  text-align: center;  background: #a0d154;  padding:6px 0;  color: #ffffff;  font-size: 16px;}
.change_notice {width:500px;  padding: 25px 40px;   font-size: 13px;   /*border: 1px solid #cccccc; */  overflow: hidden;   box-sizing: border-box;   margin: 20px auto; background:#fcfcf5;}
.change_notice_tit span {font-weight:500; border-bottom:1px solid #333333; display:inline-block; padding:0 0 3px 0;}
.change_notice_info {padding:10px 0; line-height:140%;}
.change_notice_info span {font-weight:500;}
.change_notice_point {color:#de4b44;}
.change_notice_point1 {font-weight:500; border-bottom:1px solid #de4b44; display:inline-block; padding:0 0 3px 0; margin:0 0 7px 0;}
.change_notice_point2 {font-size:0.9em;}


/* ID/PASS 찾기 */
#member_join {border:solid 1px #ccc; padding:10px 0 10px 0; width:100%; margin:40px auto; box-sizing: border-box;}
/*.member_joinidpw {border:solid 1px #ccc; padding:15px 0 !important; width:100%; margin:20px auto !important; box-sizing: border-box;}*/
#member_join .members {min-height:100px; margin:30px 0;}
.members .idCheck {width:70%; padding:25px 50px; font-size:13px;border:1px solid #cccccc; overflow:hidden; box-sizing: border-box; margin:20px auto;}
/*.idCheck div {width:644px; padding:21px 28px 0 28px; background:url('/Images/Member/bg_idpass01.gif') no-repeat left top;}*/
.idCheck div p {font-size:14px; text-align:left; font-weight:500; line-height: 160%;}
/*.idCheck div p:first-child {color:#398ad8;}*/
.idCheck div div {text-align:center; overflow:hidden; padding:30px; margin-top: 10px; background:#F5F5F5;}
.idCheck div div ul li {text-align:left; margin:10px 0 0 0;}
.idCheck div div ul li input {width:106px; padding:7px !important; border:1px solid #bebebe; margin:0 2px;}
.idCheck div div ul li select {width:60px; padding:6px 7px !important; border:1px solid #bebebe; margin:0 2px;}
.idCheck div div ul li label {display:inline-block; width:45px;}
.idCheck div div ul li span {display:inline-block; width:45px;}
.idCheck div div ul li span.idpass_line {display:inline-block; width:210px !important;}
.idCheck div div ul li span.idpass_line input {display:inline-block; width:45px;}
.idCheck div div ul li .hidden {display:inline-block; width:100px;}
.idCheck div div ul li  a img {margin:5px 0 0 0;}
.idCheck div div ul li #email1 {width:105px !important;}
.idCheck_two {display:inline-block;}
.idCheck div div ul.Tleft {width:500px; margin:20px auto 0;}
.idCheck div div ul.Tleft li {text-align:left;}
.idCheck .btn_pass_default {display:inline-block; height:30px; width:80px; text-align:center; line-height:30px; border-radius:3px; background:#a0d154; color:#ffffff; font-size:0.9em; margin:0 0 0 7px;}

#member_join .btn_navy {background: #3a3c54;  color: #fff !important;  font-size: 14px; font-weight: 500;  padding: 8px 25px; border-radius:50px; margin: 0 0 15px 0; display:inline-block;}
.idCheck .btn_navy {background: #3a3c54;  color: #fff !important;  font-size: 14px; font-weight: 500;  padding: 8px 25px; border-radius:50px; margin:20px 0 15px 0; display:inline-block;}
.idresult {color:#398ad8; font-weight:500; font-size:1.1em;}
.idresult_btn {background: #a0d154;  width:55%; color: #fff !important;  font-size: 14px; font-weight: 500; text-align:center; padding:10px 0; margin:20px auto 15px; display:inline-block;}

.members .box {border:1px solid #dddddd; padding:3px 10px;}

.idCheck input {border:1px solid #cccccc !important; padding:5px !important;}
.idCheck select {border:1px solid #cccccc !important; padding:1px !important;}

#member_join .members label{background: none; left:0; position: relative;}

/*입학안내*/
.studyclass{text-align: center; padding: 20px;}
.studyclass div div div{border:solid 2px #dfdfdf; border-top:solid 2px #bb292f; padding: 0 10px 20px; box-sizing: border-box; vertical-align: text-top; height: 370px;
    margin-bottom: 30px; }
.case{display: flex; align-content: center; flex-wrap: wrap; justify-content: space-between; margin-top: 20px;}
.case > div{border: solid 1px #ebebeb; border-top: solid 2px #bb292f; background: url(/images/sub_page/sub01_03_csebg.png) no-repeat center top; color: #333; box-sizing: border-box; padding: 0 40px 40px; margin-bottom: 10px; height: 850px; width: 49%;}
.case .step{width: 100%;  background: url(/images/sub_page/sub01_03_csebg2.png) repeat-y 40px top; }
.case .step dl {margin-bottom: 20px;}
.case .step dt {font-size: 1.2em; font-weight: 600;}
.case .step dt img{margin-right: 26px;}
.case .step dd {margin: 6px 0 6px 33px;}
.case .step dt span, .case .step dd span{width: 60%; display: inline-block; vertical-align: middle; margin-left: 6px;}
@media only screen and (max-width:1200px) { 
.case > div{width: 100%;}
}
/* 강사소개 */
.teacherlist ul, .teacherlist li{padding: 0; margin: 0;}
.teacherlist .subject{text-align: center; margin: 50px 0 30px;}
.teacherlist .subject span{background: url("/images/common/icon_rarrow1.png") no-repeat left center; padding-left: 60px; font-size: 2em; line-height: 160%; display: inline-block; font-weight: 500;}
.teacherlist .subject span strong{color: #bb292f;}
.teacherlist .teacher_box{width: 100%; border: solid 1px #ddd; padding: 20px 40px; box-sizing: border-box;  margin-bottom: 10px;}
.teacherlist .teacher_box .teachername{font-size: 1.6em; margin-bottom: 14px; float: right;  width: 50%; font-weight: 500;}
.teacherlist .teacher_box .teachername span{font-size: 0.65em; background: #bb292f; padding: 2px 24px; border-radius: 80px; display: inline-block; color: #fff; margin-bottom: 10px;} 
.teacherlist .teacher_box .teacherpic_box{background: url(/images/common/teacherpic_bg.jpg) no-repeat center top; width: 50%; height: 268px; float: left;}
.teacherlist .teacher_box .teacherpic{ width: 220px; height: 240px; margin: 13px auto 0; box-sizing: border-box; overflow: hidden; }
.teacherlist .teacher_box .teacherinfo{margin-bottom: 20px; line-height: 1.4; height: 180px; float: right; width: 50%;}
.teacherlist .teacher_box .reply{clear: both; height: 70px; margin-top: 36px;}
.teacherlist .teacher_box .reply li{background:url("/images/common/icon_arrow2.png") no-repeat 4px 22px; padding: 20px 0 0 30px;  width: 47.5%; box-sizing: border-box; float: left; margin: 0 1% 5%; overflow: hidden; text-overflow: ellipsis; white-space: normal; line-height: 1.6;  height: auto; text-align: left; word-wrap: break-word;
display: -webkit-box;  -webkit-line-clamp: 2; -webkit-box-orient: vertical; border-top:solid 1px #ddd;}
@media only screen and (max-width:1180px) { 
	.teacherlist .teacher_box .teachername, .teacherlist .teacher_box .teacherpic_box, .teacherlist .teacher_box .teacherinfo, .teacherlist .teacher_box .reply li{width: 100%; float: none; padding-top: 12px;}
	.teacherlist .teacher_box .teachername{text-align: center;}
	.teacherlist .teacher_box .teacherpic{margin:1px auto 0;}
	.teacherlist .teacher_box .teacherinfo{height: auto;}
	.teacherlist .teacher_box .reply{height: auto;}
	.teacherlist .teacher_box .reply li{background-position: 4px 12px;}
}  
   
/* //강사소개 */

/* 가문스타일 */
.subcont{line-height: 1.6;}
.sectiontitle{font-size: 1.5em; line-height: 1.2; margin: 30px 0; font-weight: 700; }
.sectiontitle.icon{padding-left: 20px; background: url("/images/sub_page/icon_sectiontitle.png") no-repeat left center;}
.sectiontitle strong{color:#bb292f; font-weight: 700;}
.sectiontitle2{margin-top: 30px; text-align: center;}
.sectiontitle2 span{font-size: 2em; line-height: 3; font-weight: 700; border-bottom: solid 1px #bb292f; padding-bottom: 4px;}
.sectiontitle2 span strong{color:#bb292f; }
.sectiontitle2 span strong  .strongb{color:#000; }
.contslogan{font-size: 2.3em; line-height:1.2; color:#bb292f; font-weight: 700;}
.contslogan span{font-size:0.65em; font-weight:400;}
.contslogan2{font-size: 2.5em; line-height:1.2; color:#bb292f; font-weight: 700;}
.contslogan2 span{font-size:0.6em; font-weight:600; color: #000;}
.studyclass{text-align: center;}
.studyclass li{display: inline-block; width:19.5%; border:solid 2px #dfdfdf; border-top:solid 2px #bb292f; padding: 0 20px 20px; box-sizing: border-box; vertical-align: text-top;  height: 380px; }
.classinfo{text-align: center; padding-bottom: 80px;}
.classinfo > ul li{display: inline-block; width:32%; box-sizing: border-box; vertical-align: text-top;  height: 380px; }
.classinfo > ul li span{font-size: 1.2em; font-weight: 600; line-height: 2; border-bottom: solid 1px #ddd; display: block; margin: 0 30px;}
/* 담당강사 */
.classteacher .teacher_box{width: 100%; border: solid 1px #ddd; box-sizing: border-box;   margin-bottom: 10px; height: 240px; text-align: left;}
.classteacher .teacher_box .teachername{font-size: 1.6em; }
.classteacher .teacher_box .teachername span{font-size: 0.65em; background: #bb292f; padding: 2px 24px; border-radius: 80px; display: inline-block; color: #fff; margin-bottom: 10px;} 
.classteacher .teacher_box .teachername, .classteacher .teacher_box .teacherinfo{ margin: 20px 20px 0px 20px; float: right; width: calc(100% - 250px);}
.classteacher .teacher_box .teacherpic_box{width: 200px; height: 240px; float: left; border-right: solid 1px #ddd; overflow: hidden;}
.classteacher .teacher_box .teacherpic img{width: 100%;}
.classteacher .teacher_box .teacherinfo{ line-height: 1.6; }
.classteacher .teacher_box .teacherinfo p{margin-bottom: 20px;}
.classteacher .teacher_box .reply{clear: both; height: 70px; margin-top: 36px;}
.classteacher .teacher_box .reply li{background:url("/images/common/icon_arrow2.png") no-repeat 4px 22px; padding: 20px 0 0 30px;  width: 47.5%; box-sizing: border-box; float: left; margin: 0 1%; overflow: hidden; text-overflow: ellipsis; white-space: normal; line-height: 1.6;  height: 5em; text-align: left; word-wrap: break-word;
    display: -webkit-box;  -webkit-line-clamp: 2; -webkit-box-orient: vertical; border-top:solid 1px #ddd;}

/* //담당강사 */
.contpara ul li{padding-left: 80px; margin: 20px 0 40px;}
.contpara ul li.para1{background: url("/images/sub_page/icon_redbgnum1.png") no-repeat left top;}
.contpara ul li.para2{background: url("/images/sub_page/icon_redbgnum2.png") no-repeat left top;}
.contpara ul li .paratitle{font-size: 1.7em; font-weight: 600; padding-bottom: 20px;}
.contpara ul li dl dt {color: #0b2754; background: #dfdfdf; font-size: 1.3em; padding: 8px 30px; min-width:40%; margin: 10px 0; display: inline-block; font-weight: 600;}
.contpara ul li dl dd{margin-bottom: 10px;}
.cont_classcard {background: #f5f5f5; text-align: center; padding: 30px 0 60px;}
.cont_classcard ul{padding: 50px; display: flex; flex-wrap: wrap; justify-content: space-evenly;}
.cont_classcard ul li{display: inline-block; text-align: center; width: 30%; margin: 0 1%;}
.cont_classcard ul li img{width: 100%; max-width: 200px; margin-bottom: 26px;}
.eclasinfo{width: 100%; background: url(/images/sub_page/sub03_06_img1.jpg) no-repeat center top; margin-top: -50px; padding: 80px 20px 20px; box-sizing: border-box; background-size: cover; }
.eclasinfo .slogan3{margin: 0 0 5% 10%; width: 50%; max-width: 354px;}
.eclasinfo ul{width: 60%; display: flex;}
.eclasinfo li{ display: inline-block; width: 46%; margin: 0 1%; background: rgba(255, 255, 255, 0.9) url("/images/sub_page/icon_arrow3.png") no-repeat center top; font-size: 1.1em; padding: 60px 20px 20px; text-align: center; box-sizing: border-box; vertical-align: top;}
.eclasinfo2{border-bottom: solid 1px #dddddd; padding: 50px 0; }
.eclascont1{background: url("/images/sub_page/sub03_06_img3.png") no-repeat center top; width: 100%; max-width: 740px; height: 746px; margin: 0 auto; padding-top: 290px; background-size: 100%; }
.eclascont2{background: url("/images/sub_page/sub03_06_eclas3.png") no-repeat center 186px; width: 100%; max-width: 810px;  margin: 0 auto; background-size: 100%;}
.eclascont2 > .sectiontitle2{position: absolute; top: 38%; left: 40%;}
.eclascont2 ul{width: 100%; margin: 0 auto;}
.eclascont2 ul li{width: 29%; display: inline-block; vertical-align: top;}
.eclascont2 ul.eclascont2_1 li{background:url("/images/sub_page/sub03_06_eclas1.png") no-repeat center top; padding: 26px 0 50px;}
.eclascont2 ul.eclascont2_2 li{background:url("/images/sub_page/sub03_06_eclas2.png") no-repeat center top; padding: 80px 0 0; margin: 27% auto 0;}
.eclascont2 ul li p{padding-top: 30px; letter-spacing: -1px;}
.eclasbook{text-align: left; width: 100%; max-width: 810px; margin: 30px auto; display: flow-root;}
.eclasbook dt{background: #0b2754; border-radius: 50px; padding: 6px 40px; display: inline-block; color: #fff; font-size: 1.2em; font-weight: 500; margin-bottom: 10px;}
.eclasbook ul {display: flex; align-content: center; flex-wrap: wrap; justify-content: space-between; margin: 10px 0 60px;}
.eclasbook ul li{width: 19%; height: 0; padding-bottom: 27.5%; position: relative;}
.eclasbook ul li span{display: block; width: 100%; position: absolute; height: 100%; overflow: hidden; border: solid 1px #ddd; margin: 0 auto; top:0; left: 0;}
.eclasbook ul li span img{width:100%; height: 100%;}
.eclasbook ul li p{margin: 10px 0 30px; position: absolute; top: 97%;}
/*
.eclasbook ul li{display: inline-block; vertical-align: top; text-align: center; width: 19%;  }
*/

@media (max-width:1120px){
    .classinfo{padding-bottom: 20px;}
    .classteacher .teacher_box{height: auto;}
    .classteacher .teacher_box .teachername{text-align: center;}
    .classteacher .teacher_box .teachername, .classteacher .teacher_box .teacherinfo, .classteacher .teacher_box .teacherpic_box{float:none; }
    .classteacher .teacher_box .teachername, .classteacher .teacher_box .teacherinfo{width: 100%; box-sizing: border-box; margin: 0; padding: 20px;}
    .classteacher .teacher_box .teacherpic_box{margin: 0 auto; border:solid 1px #ddd;}
    .classinfo > ul li{height: auto;}
    .classinfo > ul li span { margin: 0 10px; display: inline;}
     #notice.notice, .jmculture_cont dl{font-size: 14px;}
}
@media (max-width:1080px){
	.eclascont1{padding: 38% 0 48%; height: auto;}
}
@media (max-width:860px){
	.eclasinfo ul{display: flow-root;}
	.eclasinfo li{ width: 100%; margin-bottom: 10px;}
}
@media (max-width:640px){
	.sectiontitle2 span{font-size: 1.6em;}
	.eclascont1{padding: 37% 0 45%;}
}
@media (max-width:412px){
	.sectiontitle2 span{font-size: 1.3em;}
	.eclascont1{padding: 35.5% 0 45%;}
}
/* 사진, 그래프 등*/
.contpic{width:100%; text-align: center;padding: 20px 0;}
.contimgbox img{max-width:100%; display:block;}
/*지도*/
.map_how {width:100%; height:35px; line-height:35px; text-align:center; color:#ffffff; background:#0b2754;}
.Tmap {width:100%; }
.Tmap th {background:#f2f1f0; padding:7px 0; border-bottom:1px solid #cccccc; text-align: center; font-weight: bold;}
.Tmap td {padding:10px; border-bottom:1px solid #cccccc; text-align: left;}
.root_daum_roughmap{width: 100% !important; height: 360px;}
.C_green {color:#009D3E !important;}
/*설명회신청하기버튼*/
a.applybtn{background: #27344e; padding: 6px 14px; text-align: center; color: #fff; display: inline-block; box-sizing: border-box; font-size: 14px;  border: solid 1px #27344e; border-radius: 5px;}
a.applybtn:hover{ background: #143e82;}
.edu_apply{box-sizing: border-box; padding: 20px 30px 10px;}
.popup_title{ text-align: center; font-size: 1.5em; line-height: 3; font-weight: 600; color: #27344e;}
/* 텝메뉴 */
.tab_green {width:100%; margin:0 0 10px; box-sizing: border-box; }
.tab_green .depth { position:relative;}
.tab_green li { display:inline-block; line-height:36px; text-align:center; width:auto!important;  }
.tab_green li a { padding:2px 20px; color:#27344e; font-weight:500; font-size:1.15em; float:left; line-height:30px;text-align:center; letter-spacing: -1px; border: solid 1px #a8b4cc; border-radius:2px;}
.tab_green li a:hover { background: #27344e; box-sizing: border-box; color: #fff; border: solid 1px #27344e;}
.tab_green li.on a, .tab_green li.on1 a, .tab_green li.on a:hover, .tab_green li.on1 a:hover  { color:#fff; background: #27344e; box-sizing: border-box; border: solid 1px #27344e;}
.tab_green li.ui-state-active a {color: #fff; background: #27344e; box-sizing: border-box; border: solid 1px #27344e;}



/* //본문스타일 */


@media (max-width: 1079px) {
.members .idCheck {width:90%; padding:25px 50px; font-size:13px;border:1px solid #cccccc; overflow:hidden; box-sizing: border-box; margin:20px auto;}
.tab { width:90%; height:36px; margin:5px auto 15px; border-left:1px solid #cccccc;}
.members .idCheck {width:90%; padding:25px 15px; font-size:13px;border:1px solid #cccccc; overflow:hidden; box-sizing: border-box; margin:20px auto;}
}

@media (max-width: 690px) {
.member_idpass img {width:90%;}
#member_join{border:solid 1px #ccc; padding:20px 0; width:100%; margin:40px auto; box-sizing: border-box;}
.tab li { float:left; height:36px; font-size:13px; display:inline-block; line-height:36px; text-align:center; width:50%;}
.tab li a { padding:0 12px; width:100%; display:inline-block; color:#555; font-size:13px; float:left; line-height:34px;text-align:center; border:solid 1px #cccccc; border-left:none;background:#fafafa;}
.idCheck div div {text-align:center; overflow:hidden; padding:10px; margin-top:10px; background:#F5F5F5;}
.idCheck div div ul {width:100%; }

.member_idpw {width:90%; text-align:left; background:#ededed; border:1px solid #cccccc; margin:0 auto; padding:20px 0 10px 0; letter-spacing:-1px;}
.member_idpw .info {width:70%; text-align:left; margin:0 auto;}
.members .form-control {width:60px; padding:7px !important; border:1px solid #bebebe; margin:0 2px;}

}



/*  서브 페이지  */

#contents_sub {background:#ebebeb; margin:0 auto; overflow:hidden;} /* 11.4 배경색 바꿈 */
#contents_sub_w {margin:0 auto; background:#ebebeb;}
#contents_sub .sub_title, #contents_sub_w .sub_title {width:100%; height:90px; line-height:90px; font-size:30px; text-align:center; font-weight:500; background:#fafafa; border-bottom:1px solid #d7d5d4;}
#widthsize {width:100%; max-width:1400px; margin:0 auto; padding:0 15px 50px 0;}
#widthsizecenter {width:100%; max-width:1400px; margin:0 auto; padding:15px 15px 30px 15px; background:#ffffff;}


#contents_area {width:100%; max-width:1400px; margin:0 auto; padding:0 15px 0 0; position:relative; overflow:hidden; background:#ffffff;}
#sub_leftnav {width:18%; float:left; overflow:hidden; }
#widthsizesub {width:82%; float:right; margin:0 auto; padding:25px 25px 50px 30px; overflow:hidden; background:#ffffff; min-height:100vh;}
#widthsizesubcenter {width:100%; margin:0 auto; padding:0 0 30px 0; overflow:hidden;}
#widthsizesubcenter2 {width:100%; margin:0 auto; padding:0 20px 30px 20px; overflow:hidden;}

.bggray {background:#f9f9f9;}

/* 회원정보수정 */
.member_edit_agree {padding:35px 15px 15px 15px; text-align:center;}
.member_edit_agree .agree_title {font-size:18px; color:#1678b8; font-weight:500; padding:0 0 20px 0; text-align:left;}
.member_edit_agree textarea {display:inline-block; width:100%; height:185px;margin:0 auto 15px; padding:15px 15px 0 15px;}
.member_edit_table {width:100%; margin:35px auto 25px;  border-top:2px solid #333333; font-size:1.1em;}
.member_edit_table th {padding:10px 15px; border-bottom:1px solid #dae1e5; text-align:left; width:20%;}
.member_edit_table td {background:#ffffff; padding:12px 10px 12px 20px; border-bottom:1px solid #dae1e5; width:80%; text-align:left;}
.member_edit_table td input[type=text], .member_edit_table td input[type=password] {padding:10px; width:35%; margin:0 10px 0 0;}
.member_edit_table .input_notice {display:inline-block; width:100%; padding:10px 0 0 0;}
.member_edit_table td select {padding:10px; margin:0 10px 0 0; width:90px;}
.member_edit_table td select.email {padding:10px; margin:0 10px; width:120px;}
.member_edit_table td input[type=text].tel {width:15%; margin:0 10px;}
.member_edit_table td input[type=text].tel:first-child {margin:0 10px 0 0;}
.member_edit_table input[type=radio] {margin:0 5px 0 10px;}
.blindtext {visibility:visible;width:0;height:0;overflow:hidden;font-size:0;line-height:0;text-indent:-3000em;position:absolute;}


.member_edit_agree_check {font-weight:500; color:#1678b8;}
.member_edit_agree_check span {color:#333333;}
.member_edit_agree_check input {margin:0 0 0 20px;}

.member_edit_btn a {display:block; width:50%; height:60px; line-height:60px; background:#1678b8; border:1px solid #215a7f; color:#ffffff !important; text-align:center; font-size:20px; margin:30px auto 0;}




/*  카드뉴스 */
#card_news_area {position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.6); z-index:99999999;}
.card_news {width:100%; max-width:1000px; height:800px; margin:0 auto; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:#ffffff; z-index:9999999;}
.card_news_top {height:60px; border-bottom:2px solid #0994db;}
.card_news_top li.news_title {float:left; font-size:23px; font-weight:500; line-height:60px; width:40%; padding:0 0 0 20px;}
.card_news_top li.news_con {float:left; width:52%;text-align:right; line-height:60px; position:relative;}
.card_news_top li.news_con img {margin:0 7px; width:26px;}
.card_news_top li.news_close {float:right; width:8%; text-align:right;}
.card_news_top li.news_close a {display:inline-block; width:60px; text-align:center; line-height:58px; font-size:28px; color:#969595; background:#fbfbfb;}

.card_news_img {position:relative; height: 740px; margin:0 auto; width:100%; border-top:1px solid #005ca3;}
.card_news_img .swiper-container {border-top:2px solid #a3cd4d;}
.card_news_img .swiper-container .swiper-slide {width:100%; max-width:1000px; padding:0 25px; text-align:center;}
.card_news_img .swiper-container .swiper-slide img {height:100%;}
.share_area {display:none; border:1px solid #4db2e5; background:#fbfbfb; padding:5px; position:absolute; top:60px; right:0; z-index:9999999;}
.share_area .share_area_close {padding:7px 10px; background:#efefef;}

.card_news_img .swiper-button-next {width:50px; height:100%; position:absolute; top:22px; right:0; background:#e6e6e6;}
.card_news_img .swiper-button-prev {width:50px; height:100%; position:absolute; top:22px; left:0; background:#e6e6e6;}
.card_news_img .swiper-button-next img, .card_news_img .swiper-button-prev img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:35px;}

.card_news_top_mobile {display:none;}


/* 사이트맵 */


.sitemap_list {padding:30px 0 0 0; overflow:hidden;}
.sitemap_list .sitemap_1depth {width:100%; padding:10px 0 10px 15px; border-left:5px solid #a3cd4d; font-size:18px; font-weight:500; background:#384150; color:#ffffff; margin:0 0 20px 0;}
.sitemap_sublist  {float:left; width:23%; padding:0 0 0 0; margin:0 1% 15px 1%; border:1px solid #efefef;}
.sitemap_sublist .sitemap_2depth {font-weight:500; font-size:16px; width:100%; border-bottom:1px solid #0994db; padding:7px 0; margin:0 0; text-align:center; background:#f0f0f0;}
.sitemap_sublist .sitemap_3depth {padding:7px; background:#ffffff;}
.sitemap_sublist .sitemap_3depth a {display:inline-block; width:100%; border-bottom:1px dotted #efefef; padding:6px 0;}
.sitemap_sublist .sitemap_3depth a:last-child {border-bottom:none;}


/*  아침방송 캘린더 */

#widthsize_calendar {width:100%; margin:0 auto; padding:30px 15px 50px 15px; background:#fdfdfd url("/images/sub/calendar_bg.png") repeat 0 0;}
.calendar_area {width:100%; margin:0; overflow:hidden; }
.calendar_top {text-align:center; padding:15px 0 25px 0; }
.calendar_top a {display:inline-block;  background:#ffffff; padding:10px; border:1px solid #d7d7d7; margin:0 2px;}
.calendar_top .today_btn {background:#398ad8; color:#ffffff; border:1px solid #3881c7;}
.calendar_top .nowdate {font-weight:500; font-size:1.8em; display:inline-block; margin:0 15px; min-width:110px;}

.calendar_data {width:100%; margin:0 auto;}
.calendar_table {width:100%; margin:0 auto; border:1px  solid #d3d3d3; background:#ffffff;}
.calendar_table th {background:#eeeeee; border-right:1px solid #d3d3d3; padding:15px 0;}
.calendar_table th:last-child {border-right:none; color:#398ad8;}
.calendar_table th:first-child {color:#cd0202;}
.calendar_table td {width:14.2%; padding:7px; height:120px; border-top:1px solid #d3d3d3; border-right:1px solid #d3d3d3; vertical-align:top;}
.calendar_table td:last-child {border-right:none;}
.calendar_table .calendar_subtit {display:inline-block; padding:3px 5px; background:#9fd053; font-size:12px; margin:2px 0;font-weight:500; color:#ffffff; border-radius:4px;}



/*  아침방송 캘린더 모바일용 */

#widthsize_calendar_m {display:none;}


#widthsize_calendar_m {width:100%; padding:30px 15px; margin:0 auto; background:#fdfdfd url("/images/sub/calendar_bg.png") repeat 0 0; overflow:hidden;}
.calendar_top_m {margin:0 0 15px 0; overflow:hidden;}
.calendar_top_m .calendar_title {float:left; width:30%; font-size:20px; font-weight:500;}
.calendar_top_m .calendar_select {float:right; width:70%; text-align:right;}
.calendar_top_m .calendar_select select {background:#fafafa; padding:5px 10px; margin:0 2px; border-radius:5px;}
.calendar_top_m .calendar_select .nowmonth {display:inline-block; background:#398ad8; color:#ffffff; border:1px solid #3881c7; padding:6px 10px;  border-radius:5px;}

.calendar_date_area {margin:10px 0 0 0; border:1px solid #d5d5d5; background:#ffffff; border-radius:5px; overflow:hidden; position:relative;}
.calendar_date_area .datearea {float:left; width:20%; text-align:center;}
.calendar_date_area .datearea .week {padding:7px 0; background:#eff8ff;}
.calendar_date_area .datearea .date {font-size:24px; font-weight:500; padding:7px 0; background:#e2ebf3;}
.calendar_date_area .conarea {float:left; width:80%; padding:15px 10px;}
.calendar_date_area .conarea .calendar_subtit  {display:inline-block; padding:3px 5px; background:#9fd053; margin:0 0 3px 0; color:#ffffff; border-radius:4px;}
.calendar_date_area .conarea .reply {position:absolute; top:7px; right:7px; display:inline-block;}
.calendar_date_area .conarea .reply a {color:#7281af;}


/*  다른곳 스타일 수정 */

.class_ing, .ing_ing, .class_ok, .ing_ok, .ing_no {line-height:18px;}

/* 회원가입 */
/* //회원가입 */
#leftmenuno #wrap.lmenu{background:#fff;}
#leftmenuno #container{padding: 20px;}


@media (min-width:1024px) and (max-width:1024px) {
		.calendar_table td {width:14.2%; padding:7px; height:80px; border-top:1px solid #d3d3d3; border-right:1px solid #d3d3d3; vertical-align:top;}
		.card_news {width:100%; max-width:1000px; height:auto ; margin:0 auto; position:absolute; top:15px; left:50%; transform:translate(-50%,0%); background:#ffffff; z-index:9999999;}
		.card_news_img {position:relative; height: 550px; margin:0 auto; width:100%; border-top:1px solid #005ca3;}

}


@media (max-width: 768px) {

/* 회원정보수정 */
.member_edit_agree {padding:35px 15px 15px 15px; text-align:center;}
.member_edit_agree .agree_title {font-size:18px; color:#1678b8; font-weight:500; padding:0 0 20px 0; text-align:left;}
.member_edit_agree textarea {display:inline-block; width:100%; height:185px;margin:0 auto 15px; padding:15px 15px 0 15px; letter-spacing:-1px;}
.member_edit_table {width:100%; margin:35px auto 25px;  border-top:2px solid #333333; font-size:1em;}
.member_edit_table th {padding:5px; border-bottom:1px solid #dae1e5; text-align:left; width:2012311%;}
.member_edit_table td {background:#ffffff; padding:10px 5px ; border-bottom:1px solid #dae1e5; width:80%; text-align:left;}
.member_edit_table td input[type=text], .member_edit_table td input[type=password] {padding:7px; width:100%; margin:0 10px 0 0;}
.member_edit_table .input_notice {display:inline-block; width:100%; padding:10px 0 0 0;}
.member_edit_table td select {padding:7px; margin:0 10px 0 0; width:60px;}
.member_edit_table td select.email {padding:7px; margin:0 10px; width:120px;}
.member_edit_table td input[type=text].tel {width:15%; margin:0 10px;}
.member_edit_table td input[type=text].tel:first-child {margin:0 10px 0 0;}
.member_edit_table input[type=radio] {margin:0 5px 0 10px;}
.member_edit_table .blindtext {width:100%; display:inline-block; margin:0 10px 0 0;}
.member_edit_table .input_choice {width:100%; display:inline-block; margin:7px 0 0 0;}
.member_edit_agree_check {font-weight:500; color:#1678b8;}
.member_edit_agree_check span {color:#333333;}
.member_edit_agree_check input {margin:0 0 0 20px;}
.member_edit_btn a {display:block; width:100%; height:45px; line-height:45px; background:#1678b8; border:1px solid #215a7f; color:#ffffff !important; text-align:center; font-size:16px; margin:30px auto 0;}
.mT7 {margin-top:7px; display:inline-block;}
}

@media (max-width: 640px) {


/*  비밀번호 변경 */
#member_join { border: solid 1px #ccc;  padding: 15px 0 5px 0;  width: 100%;  margin: 10px auto;  box-sizing: border-box;}
.change_title {background:#398ad8; width:95%; height:40px; line-height:40px; text-align:center; color:#ffffff; font-size:16px; font-weight:500; margin:0 auto; border-radius:100px;}
.change_pass {width:95%;  padding:10px 20px;   font-size: 13px;   /*border: 1px solid #cccccc; */  overflow: hidden;   box-sizing: border-box;   margin: 20px auto; background:#fafafa;}
.change_pass .change_info {margin:10px 0; font-size:14px; font-weight:500; color:#505050;}
.change_pass .change_info label {display:inline-block; width:140px; }
.change_pass .change_info span {display:inline-block; background:#a0d154; width:5px; height:5px; border-radius:100%; margin:0 7px 3px 0;}
.change_pass .change_info input {padding:7px 10px !important; width:50%;}
.btn_change { display:block; width:50%;  margin:20px auto 0;  text-align: center;  background: #a0d154;  padding:6px 0;  color: #ffffff;  font-size: 16px;}
.change_notice {width:95%;  padding: 10px 20px;   font-size: 13px;   /*border: 1px solid #cccccc; */  overflow: hidden;   box-sizing: border-box;   margin: 20px auto; background:#fcfcf5;}
.change_notice_tit {font-weight:500; font-size:14px;}
.change_notice_tit span {font-weight:500; border-bottom:1px solid #333333; display:inline-block; padding:0 0 3px 0;}
.change_notice_info {padding:10px 0; line-height:140%;}
.change_notice_info span {font-weight:500;}
.change_notice_point {color:#de4b44;}
.change_notice_point1 {font-weight:500; border-bottom:1px solid #de4b44; display:inline-block; padding:0 0 3px 0; margin:0 0 7px 0;}
.change_notice_point2 {font-size:0.9em;}

}


.fontred {color:#DB0A5B;}
.fontblue {color:#0090d9;}

#wrap{position: relative; width: 100%; }
#container {position:relative; width:100%; max-width:1400px;min-height:70vh; margin:0 auto; padding:20px 20px 20px 310px; overflow:hidden;}
#container > div > div > #container {padding: 0 20px;}
#contents { margin: 0 ; overflow: hidden; height: auto; padding: 0 0 30px 0;}


@media (max-width: 1280px) {
#widthsize {width:100%; max-width:1400px; margin:0 auto; padding:0 15px 50px 15px;}
#contents_area {width:100%; max-width:1400px; margin:0 auto; padding:0 15px; position:relative; overflow:hidden; background:#ffffff;}
#contents_sub .sub_title_myclass, #contents_sub_w .sub_title_myclass {width:100%; font-size:30px; text-align:center; font-weight:500; background:#ffffff; color:#0090d9; padding:25px 0 25px 0; line-height:150%;}

}

@media (min-width: 769px) {
	#wrap.lmenu{background: url(/images/common/nav_bg.png) repeat-y left 0; }
	/*#contents {min-height: 700px !important;}*/
	#footer{z-index: 2;/* position: absolute; bottom: 0;*/ }
	#container{min-height: calc(70vh + 70px);}
	#contents {min-height: 450px !important;}
	#nav .depth2 {width:280px; height: calc(100vh - 30px); display: flex; flex-direction: column;
		/*align-items:flex-start;flex-wrap: wrap; */}
/*	#nav .depth3 {margin: 0 auto; position: relative; max-width: 1400px; overflow: visible; }
	#nav .depth3 ul{max-width: 1070px; margin: 0 auto; position: absolute; z-index: 10; top: 80px; left: 310px; width: calc(100% - 330px); text-align: left; background: #fff; border-bottom: solid 1px #afafaf; padding-bottom: 10px;}
	#nav .depth3 ul li {margin: 2px;}*/
	.ch_btn{ margin-top: -100px; text-align: left;}	
	#bottom_area{display: none;}
	#navigation{position:absolute; text-align:right; top:50px; right: 40px;  color:#27344e; z-index:0;}
	#navi_title{color: #bb292f; font-weight: 600; font-size: 1.35em; padding:36px 0 20px;}
	#navi_title::after{content: ''; display: block; width: 80%; height: 1px; background:#afafaf; margin-left: 10%; margin-top:20px;}
	
	#subtitle {font-size:20px; padding:27px 0 30px 10px; margin-bottom: 30px; color:#27344e; font-weight:bold; border-bottom:1px solid #afafaf;z-index:0;}
	#subtitle span {font-size: 14px; display: block; margin-bottom: 10px; margin-top: -25px; font-weight: normal;}
	.subtitle{font-size:18px; padding:36px 0 20px 10px; margin-bottom: 20px; color:#333; font-weight:bold; border-bottom:1px solid #afafaf;z-index:0;}
	.subtitle span{font-size: 14px; color: #6174e2;}
}

@media (min-width: 641px) and (max-width: 860px) {


/*.card_news_top {display:none;}
.card_news_top_mobile {display:block;}*/
.card_news {width:100%; max-width:100%; height:650px; margin:0 auto; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:#ffffff; z-index:9999999;}
.card_news_top {height:48px; border-bottom:2px solid #0994db;}
.card_news_top li.news_title {float:left; font-size:18px; font-weight:500; line-height:48px; width:30%; padding:0 0 0 20px; letter-spacing:-0.5px;}
.card_news_top li.news_con {float:left; width:50%;text-align:right; line-height:48px; position:relative;}
.card_news_top li.news_con img {margin:0 7px;}
.card_news_top li.news_close {float:right; width:20%; text-align:right;}
.card_news_top li.news_close a {display:inline-block; width:40px; text-align:center; line-height:46px; font-size:28px; color:#969595; background:#fbfbfb;}

.card_news_img {position:relative; height:98%; margin:0 auto; width:100%; border-top:1px solid #005ca3;}
.card_news_img .swiper-container {border-top:2px solid #a3cd4d;}
.card_news_img .swiper-container .swiper-slide {width:100%; max-width:100%; padding:0; text-align:center;}
.card_news_img .swiper-container .swiper-slide img {height:100%;}
.share_area {display:none; border:1px solid #4db2e5; background:#fbfbfb; padding:5px; position:absolute; top:60px; right:0; z-index:9999999;}
.share_area .share_area_close {padding:7px 10px; background:#efefef;}

.card_news_img .swiper-button-next {width:50px; height:100%; position:absolute; top:22px; right:0; background:#e6e6e6;}
.card_news_img .swiper-button-prev {width:50px; height:100%; position:absolute; top:22px; left:0; background:#e6e6e6;}
.card_news_img .swiper-button-next img, .card_news_img .swiper-button-prev img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:35px;}
}

@media (max-width:640px) {
.myclass_classinfo .classinfo_tit {margin:40px 0 20px; height:18px; line-height:18px; border-left:6px solid #a3cd4d; padding:0 0  0 10px; font-size:18px; font-weight:500;}
.member_edit_agree .agree_title {font-size:14px; color:#1678b8; font-weight:500; padding:0 0 20px 0; text-align:left; letter-spacing:-0.5px;}
.member_edit_table th {padding:10px 7px; border-bottom:1px solid #dae1e5; text-align:left; width:40%; letter-spacing:-1px;}
.member_edit_table td {background:#ffffff; padding:10px 7px; border-bottom:1px solid #dae1e5; width:60%; }
.member_edit_table td input[type=text] {padding:7px; width:100%; margin:0 10px 7px 0;}
.member_edit_table .input_choice {display:inline-block; width:100%; padding:10px 0 0 0;}
.member_edit_table td input[type=text].tel {width:24%; margin:0 5px; padding:10px 5px; }
.member_edit_table td input[type=text].tel:first-child {margin:0 5px 0 0;}
.member_edit_table td input[type=text].telmail {width:40%; margin:0 5px; padding:7px 5px; }
.member_edit_table td select.email {padding:7px; margin:0 7px; width:85px;}
.member_edit_agree_check span {display:inline-block; width:100%; color:#333333; padding:10px 0 0 0;}
.card_news {width:100%; max-width:100%; height:500px; margin:0 auto; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:#ffffff; z-index:9999999;}
.card_news_top {height:48px; border-bottom:2px solid #0994db;}
.card_news_top li.news_title {float:left; font-size:18px; font-weight:500; line-height:48px; width:40%; padding:0 0 0 10px; letter-spacing:-0.5px;}
.card_news_top li.news_con {float:left; width:45%;text-align:right; line-height:48px; position:relative;}
.card_news_top li.news_con img {margin:0 5px;}
.card_news_top li.news_close {float:right; width:15%; text-align:right;}
.card_news_top li.news_close a {display:inline-block; width:40px; text-align:center; line-height:46px; font-size:20px; color:#969595; background:#fbfbfb;}
.card_news_img {position:relative; height:100%; margin:0 auto; width:100%; border-top:1px solid #005ca3;}
.card_news_img .swiper-container {border-top:2px solid #a3cd4d;}
.card_news_img .swiper-container .swiper-slide {width:100%; max-width:100%; padding:0; text-align:center;}
.card_news_img .swiper-container .swiper-slide img {height:100%;}
.share_area {display:none; border:1px solid #4db2e5; background:#fbfbfb; padding:5px; position:absolute; top:60px; right:0; z-index:9999999;}
.share_area .share_area_close {padding:7px 10px; background:#efefef;}
.card_news_img .swiper-button-next {width:30px; height:30px; position:absolute; top:50%; right:0; transform:translate(0%,-50%);  background:#e6e6e6;}
.card_news_img .swiper-button-prev {width:30px; height:30px; position:absolute; top:50%; left:0; transform:translate(0%,-50%); background:#e6e6e6;}
.card_news_img .swiper-button-next img, .card_news_img .swiper-button-prev img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:25px;}
.share_area {display:none; border:1px solid #4db2e5; background:#fbfbfb; padding:3px 10px; position:absolute; top:48px; right:0; z-index:9999999; width:250px;}
.share_area .share_area_close {padding:4px 10px; background:#efefef;}
.sitemap_sublist  {float:left; width:48%; padding:0 0 10px 0; margin:0 1% 15px 1%; border:1px solid #efefef;}
}


/*내강의실 무비 플레이어*/
.myclass_moviebox{display: none;  /* background: rgba(0, 0, 0, 0.8);*/  position: fixed; top:15%; left: 50%;  transform: translateX(-50%); z-index: 999; border: 14px solid #0060a0;}
.myclass_moviebox .myclass_movie{margin: auto 0; }
.myclass_moviebox .btn_cls{width: 140px; background: #0060a0; color: #fff; font-weight: bold; position: absolute; bottom: -44px; right: -14px; text-align: center;
 line-height: 200%; border-radius: 0px; font-size: 15px; cursor: pointer;}
.skin-mcvod .mpv-close-openlayer-btn{display: none !important;}
.myclass_moviebox .movie_title {padding:5px 0; text-align:center; color:#ffffff; background:#0060a0;}

.textleft, .Tleft{text-align:left !important;}


/* 마이페이지 내강의실 */
.board_s3 {width:100%; padding:0px; border-left:1px solid #d1d1d1;}
.board_s3 th {border:1px solid #d1d1d1;  height:30px; background-color:#f0f0f0;}
.board_s3 tr.txtmyclass td.on a{color:#0899a1; font-weight:bold; font-size: 120%;}
.board_s3 td {text-align:center; line-height:18px; padding:3px 10px; border:1px solid #e5e5e5; background:none;}
.board_s3 td.reply {background:url(/images/common/iconbg_reply.png) no-repeat 10px 13px; padding-left:29px;}

.board_s4 {width:100%; padding:0px; }
.board_s4 th {border-bottom:1px solid #cccccc; border-top:1px solid #cccccc; height:36px; background-color:#fff;}
.board_s4 td {text-align:center; line-height:18px; padding:3px 10px; border-bottom:1px solid #cccccc; background:none; height:36px;}
.board_s4 th.first {border-left:none;}
.board_s4 th.last {border-right:none;}

/*수료정보*/
.btn-normal-s:hover, .btn-normal-s:active, .btn-normal-s:focus { background: #00babc; color: #fff !important;}
.class_ing, .ing_ing, .class_ok, .ing_ok, .ing_no{display: inline-block; border-radius: 20px; padding: 2px 6px; color: #fff; box-sizing: border-box;}
.class_ok, .ing_ok {background: #00babc !important;}
.class_ing, .ing_ing{background: #bb292f !important; }
.ing_no{background:#999999 !important; }
.btn_ok {background: #00babc !important; border:solid 1px #00babc; box-shadow:0 0 0 0 rgba(0,0,0,0); width: 82px;}
.btn_ing {background: #bb292f !important; border:solid 1px #e88901; box-shadow:0 0 0 0 rgba(0,0,0,0); width: 82px;}
.btn_no{background:#999999 !important; border: solid 1px #888888; box-shadow:0 0 0 0 rgba(0,0,0,0); width: 82px;}
.btn-retake{display: inline-block; padding: 5px 10px; color: #fff; box-sizing: border-box; border: 1px solid #00babc; background: #34b9c0;}
.btn-retake:hover{background: #00babc;}
/* // 수료정보 */
span.ing_ok {width:54px; padding:2px 8px; text-align:center; display:inline-block; background:#00babc !important; border-radius:50px; color:#ffffff;}
span.ing_ing {width:54px; padding:2px 8px; text-align:center; display:inline-block; background:#bb292f !important; border-radius:50px; color:#ffffff;}
span.ing_no {width:54px; padding:2px 8px; text-align:center; display:inline-block; background:#999 !important; border-radius:50px; color:#ffffff;}
span.class_ok {padding:2px 8px; text-align:center; display:inline-block; background:#00babc !important; border-radius:50px;  color:#ffffff; }
span.class_vod {padding:2px 5px; border:1px solid #b4b4b4; text-align:center; display:inline-block; background: #ffffff; color:#176ca7; -webkit-border-radius: 2; -moz-border-radius: 2; border-radius: 2px; font-weight:normal;}
span.class_vod a {color:#176ca7;}
span.class_vod a:hover {color:#333333;}

/*내강의실 검색*/
.top_table{width:100%; display:inline-block; margin:0 0 10px;}
.search {width:60%;margin:10px auto;text-align:left;}
.search input{border:1px solid #CCC; padding: 7px; box-sizing: border-box;}
.search select {border:1px solid #cccccc; padding:6px; box-sizing: border-box;}
.search li {display:inline-block;*display:inline;*zoom:1;margin-right:5px; vertical-align: middle;}
.search li.inputtext {width: 60%;}
.search li.inputtext input{width: 100%;}
.search li .btn_search {background: #27344e; color: #fff; padding: 8px 12px; border: 1px solid #27344e;}
.left_search {float:left; margin:0 auto;text-align:left;}
.left_search select, .right_search select {border:1px solid #27344e;}
.left_search input, .right_search input {border:1px solid #27344e; padding: 6px;}
.left_search, .right_search {margin:0 0 5px 0; padding:0;}
.left_search li,.right_search li {display:inline-block;*display:inline;*zoom:1;margin-right:5px;}
.left_search li button,.right_search li button {background: #27344e; color: #fff; padding: 6px 12px; border: 1px solid #27344e;}
.right_search {float:right; margin:0 auto;text-align:right;}
.right_search select{border: 1px solid #cccccc; padding:4px;}
.right_search input {border:1px solid #cccccc; padding:5px;}
.right_search input:hover, input:active, input:focus {background:#faffbd;}
.right_btns {width:230px;  padding:0; float: right; text-align: right; display: none;}
.right_btns p { margin:0 0 0 2px; display:inline-block; }
.top_table input:hover, input:active, input:focus {background:#faffbd;}
.top_table input[type=checkbox] {width:auto; border:none;}
.top_table input.width150 {width:150px;}
/* 회원정보수정 */
.board01 {width:100%; border-top:1px solid #cccccc; border-left:1px solid #cccccc; padding:0px; margin:0px; letter-spacing:0px;}
.board01 th {text-align:center; padding:10px; vertical-align:middle; border-bottom:1px solid #cccccc; border-right:1px solid #cccccc; background-color:#f5f5f5; word-wrap: break-word; word-break: keep-all;}
.board01 td {font-size:1em; padding:10px; border-bottom:1px solid #cccccc; border-right:1px solid #cccccc; letter-spacing:0px;}
.board01 td div {margin:5px 0 0 0; clear:both;}
.board01 td p {margin:8px 0 0 0; clear:both; }
.board01 ul li {width:116px; float:left; margin:5px 0 0 0;}

.board01 input {width:calc((100% / 3) - 20px); border:1px solid #cccccc; padding:5px; margin: 1px 0;}
.board01 input:hover, input:active, input:focus {background:#faffbd;}
.board01 select {border:1px solid #cccccc; padding:4px;}
.board01 input[type=radio] {width:auto; border:none !important; margin-left:10px; vertical-align:middle;}

.board01 .forigner {width:500px; padding:0px; margin:0px }
.board01 .forigner li {float:left; line-height:18px; margin:0 0 0 0; padding:0 0 0 0;}
.board01 .forigner li.address {width:600px;}
.board01 .forigner li.phone {width:220px;}
.board01 .forigner li.phone2 {width:200px; padding:18px 0 0 0;}
.board01 .forigner li p {margin:0px;}

/* //마이페이지 내강의실 */

/*   -------------------------------------------서브 페이지--------------------------------------------     */

/*  WM 센터업무 */

.center_table {width:100%; border-radius:10px; background:#ffffff;}
.center_table .center_title {width:100%; padding:15px 0; color:#ffffff; font-size:1.2em; text-align:center; border-radius:10px 10px 0 0 / 10px 10px 0 0; background:#27344e; font-weight:500;}
.center_table table.center_input {width:100%; margin:1px 0; border:1px solid #d9d9d9; background:#d9d9d9;}
.center_table .center_input tr {border-bottom:1px solid #ffffff;}
.center_table .center_input .input_tit {display:inline-block; width:29%; line-height:40px; text-align:center; font-weight:500; padding:0;}
.center_table .center_input .input_txt {display:inline-block; width:70%; background:#ffffff; padding:0; margin:0; float:right; border:1px solid #e8e8e8; min-height:38px; text-indent:10px;}
.center_table .center_input .input_txt2 {display:inline-block; width:70%; background:#ffffff; padding:8px 0 7px 0; margin:0; float:right; border:1px solid #e8e8e8; min-height:38px; text-indent:5px; line-height:180%;}

.center_userinput .user_tit {margin:20px 0 10px 0; font-weight:500; font-size:1.1em;}

.center_table .center_qaarea {padding:15px; border-left:1px solid #cbcbcb; border-right:1px solid #cbcbcb;}
.center_qainput {width:100%;}
.center_qainput th {background:#f1f1f1; padding:10px 0; text-align:center; font-weight:500; border:1px solid #dfdfdf; width:100px;}
.center_qainput td {padding:10px; border:1px solid #dfdfdf;}
.center_qainput td.qaarea_userinput {padding:0;}
.center_qainput td.qaarea_userinput textarea {padding:10px; border:1px solid #ffffff;}
.txt-pblue {font-size:0.8em; color:#7160f7;}
.txt-pred {font-size:0.8em; color:#f46f6b;}

.center_notice1 {color:#978f6d; margin:20px 0 10px 0;}

/*  검색영역 */
.search_area {padding:0; margin:10px 0 !important; clear:both;}
.search_area input {border:1px solid #27344e; height:33px; width:40%; margin:0 0 0 0;}
.search_area input::placeholder {color:#4d5463; letter-spacing:-1px;}
.search_area a {display:inline-block; width:70px; height:33px; line-height:31px; text-align:center; margin:0 0 0 7px; color:#ffffff; background:#27344e; border:1px solid #27344e;}
.search_area .array_btn {float:right;}
.search_area .array_btn a {display:inline-block; width:70px; height:33px; line-height:31px; text-align:center; margin:0 0 0 4px; color:#726943; background:#ffffff; border:1px solid #f8d123;}
.search_area .array_btn a.on {display:inline-block; width:70px; height:33px; line-height:31px; text-align:center; margin:0 0 0 4px; color:#726943; background:#f8d123; border:1px solid #f8d123;}

.center_list {width:100%; margin:0 0 20px 0;}
.center_list th {background:#f1f1f1; border:1px solid #dddddd; font-weight:500; padding:8px; text-align:center;}
.center_list td {border:1px solid #dddddd; padding:8px; text-align:center;}
.center_list td:nth-child(2) {text-align:left;}
.center_list td.list_re {text-indent:10px;}
.center_list td.list_re::before {content :"└ "}

/* 검색페이지 */

.searchlist {width:100%; margin:15px 0 0 0;}
.searchlist h3.titleboard {font-size:1.1em; color:#5e5a4c; margin:0 auto 10px; padding:0 0 5px 0; border-bottom:1px solid #eeece3; width:98%;}
.searchlist h3.titleboard::before {content :" ⊙ "; display:inline-block; color:#f2ba1f; font-weight:600; font-size:1.1em; margin:0 2px 0 0;}
.searchlist .table-custom-col {width:100%; margin:0 0 15px 0; padding:0 0 0 0;}

/*  페이징 */
.kb_paging {width:100%; text-align:center; margin:50px 0 20px 0;}
.kb_paging a {display:inline-block; border:1px solid #dfdfdf; height:25px; width:25px; line-height:23px; text-align:center; margin:0 3px; background:#ffffff;}
.kb_paging a.on {display:inline-block; border:1px solid #27344e; height:25px; width:25px; line-height:23px; text-align:center; background:#27344e; color:#fafafa;}
.kb_paging a:hover {display:inline-block; border:1px solid #27344e; height:25px; width:25px; line-height:23px; text-align:center; background:#27344e; color:#fafafa;}
.kb_paging .paging_btn {display:inline-block; border:1px solid #dfdfdf; height:25px; width:25px; line-height:18px; text-align:center; margin:0 3px; background:#ffffff; font-size:1.5em;}
.kb_paging .paging_btn:hover {display:inline-block; border:1px solid #27344e; height:25px; width:25px; line-height:18px; text-align:center; margin:0 3px; background:#786e5a; font-size:1.5em; color:#f8d123;}


.center_table .center_input input[type=text] {width:100%; border:none; min-height:38px; padding:0 10px; float:right;}
.center_table input[type=radio] {width:17px; height:17px; margin:0; padding:0;}
.center_table input[type=radio]:first-child {margin:0;}
.center_table input[type=checkbox] {width:17px; height:17px; margin:0;}
.input_txt2 label {margin:0;}
.input_txt2 .txt2_width20 {display:inline-block; width:20%; margin:0; padding:0;}
.center_table input[type=checkbox]:first-child {margin:0; padding:0;}
.center_table .center_input .input_txt input[type=date] {border:none; height:38px; line-height:37px; padding:0 10px;}
.center_table textarea {width:100%; height:150px; border:1px solid #d9d9d9; padding:10px;}
.center_table input::placeholder {color:#747474;}

.center_table .center_btn {width:100%; padding:15px 0; color:#27344e; font-size:1.2em; text-align:center; border-radius:0 0 10px 10px / 0 0 10px 10px; background:#f8d123; margin:2px 0 0 0; font-weight:500;}

.center_table .center_btn_modify {width:100%; padding:10px 0; color:#27344e; font-size:1.15em; text-align:center; border-radius:0; background:#f8d123; margin:2px 0 0 0; font-weight:500;}
.center_table .center_btn_reply {width:100%; padding:10px 0; color:#ffffff; font-size:1.1em; text-align:center; border-radius:0; background:#979797; margin:1px 0 0 0; font-weight:500;}
.center_table .center_btn_list {width:100%; padding:10px 0; color:#fafafa; font-size:1.1em; text-align:center; border-radius:0 0 10px 10px / 0 0 10px 10px; background:#27344e; margin:1px 0 0 0; font-weight:500;}
.center_table .center_btn_del {width:100%; padding:10px 0; color:#fafafa; font-size:1.1em; text-align:center; border-radius:0 0 10px 10px / 0 0 10px 10px; background:#333333; margin:1px 0 0 0; font-weight:500;}

@media (max-width:1023px) {

.input_txt2 .txt2_width20 {display:inline-block; width:auto; margin:0; padding:0;}

}


/*datetime-local*/

input[type="date"]::-webkit-calendar-picker-indicator {
	color: rgba(0, 0, 0, 0);
	opacity: 1;
	display: block;
	background: url(https://cdn3.iconfinder.com/data/icons/linecons-free-vector-icons-pack/32/calendar-16.png)
		center/80% no-repeat white; // 여기서 중앙정렬과 배경색을 준다.
	width: 20px;
	height: 20px;
	border-width: thin;
	cursor: pointer;
}


/*
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
   color: rgba(0, 0, 0, 0); //숨긴다
   opacity: 1;
   display: block;
   background: url(https://mywildalberta.ca/images/GFX-MWA-Parks-Reservations.png) no-repeat; // 대체할 아이콘
   width: 20px;
   height: 20px;
   border-width: thin;
}
*/

/* 자료실 */

.data_list {width:100%; display: flex; flex-wrap:wrap; align-items:center; margin:0;}

.data_area {width:31.3%; flex-grow: 1; margin:0 1% 25px 1%;}
.data_area .data_thumbnail {width:100%; /*max-width:127px;*/ background:#fafafa; position:relative;}
.data_area .data_thumbnail img {position:relative; width: 100%; /*height: 95px;*/ z-index: 1; background:#ebeae9; border:1px solid #ebeae9;}
.data_area .data_thumbnail .data_type {position:absolute; bottom:0; right:0; padding:0 7px; height:20px; line-height:20px; background:#000000; color:#ffffff; font-size:0.9em; z-index:9;}

.data_area .data_info {width:100%; padding:15px 0 0 0;}
.data_area .data_info .info_tit {font-size:1.1em; font-weight:500;}
.data_area .data_info .info_info {padding:5px 0 0 0;}
.data_area .data_info span {margin:0 10px 0 0; display:inline-block;}

.banner_btn {width:100%; height:40px; line-height:37px; background:#f8d123; text-align:center; color:#27344e; border:1px solid #f9dd49; font-size:1.2em; font-weight:500; margin:0 0 20px 0; }


/* 공지사항 */

.list_area {width:100%; padding:10px 15px; background:#f1f1f1; margin:0 0 10px 0;}
.list_area .list_tit {font-weight:600; font-size:1.1em; padding:0 0 10px 0;}
.list_area .list_info span {display:inline-block; font-size:0.9em; color:#3c3c3c; margin:0 15px 0 0;}

.listview_area {width:100%; min-height:300px; border:1px solid #c3c0bc; padding:15px;}

.list_btn {width:100%; padding:10px 0; color:#ffffff; font-size:1.1em; text-align:center; border-radius:5px; background:#27344e; margin:20px 0 0 0; font-weight:500;}

.board_s1 {width:100%; border-top:1px solid #e8e8e8; border-left:1px solid #e8e8e8; border-right:1px solid #e8e8e8;}
.board_s1 th {padding:10px 0; text-align:center; width:100px; background:#f5f5f5; border-bottom:1px solid #e8e8e8;}
.board_s1 td {padding:10px 10px; border-bottom:1px solid #e8e8e8;}


/* 마이클래스 */

.myclass_top {width:100%; font-weight:500; margin:0 0 20px 0;}

.myclass_topinfo {width:100%; margin:0 0 10px 0; text-align:center; font-weight:500;}
.myclass_topinfo th {width:50%; background:#d9d9d9; border:1px solid #ceccc9; border-bottom:1px solid #b4b1ad; padding:8px 0;}
.myclass_topinfo td {border:1px solid #ceccc9; padding:8px;}

.myclass_list {width:100%; padding:10px 15px; background:#f1f1f1; margin:0 0 10px 0;}
.myclass_list .list_tit {font-weight:500; font-size:1.1em; padding:0 0 10px 0;}
.myclass_list .list_info span {display:inline-block; width:50%; color:#3c3c3c; margin:0;}

.myclass_lectit {width:100%; font-size:1.5em; font-weight:600; padding:0 0 15px 0; border-bottom:1px solid #f3f3f3; text-align:center;}
.myclass_lectab {width:100%; text-align:center; margin:15px 0 0 0;}
.myclass_lectab a {display:inline-block; height:24px; line-height:22px; padding:0 25px; background:#d9d9d9; border-radius:15px; margin:0 10px; font-size:1.1em;}
.myclass_lectab a.on {display:inline-block; height:24px; line-height:22px; padding:0 25px; background:#f8d123; font-weight:500; border-radius:15px; color:#000000;}
.myclass_lectab a:hover {display:inline-block; height:24px; line-height:22px; padding:0 25px; background:#f8d123; font-weight:500; border-radius:15px; color:#000000;}

.myclass_view {width:100%;line-height:39px;font-weight:bold; border:1px solid #d9d9d9; border-radius:8px; padding:20px; margin:10px 0 0 0;}
.myclass_view .myclass_viewtit {font-weight:600; font-size:1.2em; margin:0 0 15px 0;}
.myclass_view .myclass_viewtxt {margin:0 0 25px 0;}
.myclass_view .myclass_viewdata {width:100%; background:#f1f1f1; padding:10px; margin:0 0 10px 0; font-weight:500;}
.myclass_view .myclass_viewdata p {margin:2px 0;font-weight:600;font-size:1.2em;}
.myclass_view .myclass_viewdata_bar {position:relative; width:100%; height:15px; background:#d9d9d9; margin:5px 0 2px 0 !important;}
.myclass_view .myclass_viewdata_bar span {position:absolute; top:0; left:0; width:100%; height:15px; background:#f8d123; display:inline-block; z-index:9;}

.myclass_viewinfo {width:100%; margin:10px 0 0 0; text-align:center;} /* 말줄임 white-space:nowrap; overflow:hidden; text-overflow:ellipsis; */
.myclass_viewinfo th {background:#f1f1f1; padding:8px 0; border:1px solid #e8e8e8;}
.myclass_viewinfo td {padding:8px 0; border:1px solid #e8e8e8;}

.board_s3 {width:100%; margin:10px 0 0 0; text-align:center;} /* 말줄임 white-space:nowrap; overflow:hidden; text-overflow:ellipsis; */
.board_s3 th {background:#f1f1f1; padding:8px 0; border:1px solid #e8e8e8;}
.board_s3 td {padding:8px 0; border:1px solid #e8e8e8;}

.myclass_viewlec {width:100%; display: flex; flex-wrap:wrap; align-items:center; margin:15px 0 0 0; padding:0 0 15px 0; border-bottom:1px solid #e2e2e2;}
.myclass_view .myclass_viewlec:first-child {margin:0 0 15px 0;}
.myclass_view .myclass_viewlec:last-child {border-bottom:none;}
.myclass_viewlec li.myclass_viewlectit {flex-grow: 1; font-weight:500; width:100%; display: flex; align-content: center; flex-wrap: wrap; justify-content: space-between; border-bottom:solid 1px #eee;}
.myclass_viewlec li.myclass_viewlectit .lectop_title{width:calc(100% - (140px + 70px));}
.myclass_viewlec li.myclass_viewlecbtn {width:70px; flex-shrink: 0; margin:5px 0 0 0;}
.myclass_viewlec li.myclass_viewlectit span {display:inline-block; margin:0 0 0 7px;}
.myclass_viewlec li.myclass_viewlectit p:nth-child(2) {font-weight:400; font-size:0.9em; margin:2px 0 0 0; width:140px;}
.listview_area {width:100%; min-height:300px; border:1px solid #c3c0bc; padding:15px;}

.myclass_management {width:100%; font-weight:500; font-size:1.1em; text-align:center; margin:0 0 20px 0;}
.myclass_management a {display:inline-block; font-size:1.4em; margin:0 10px;}


/* 마이클래스 버튼 */
.myclass_btntest {display:inline-block; background:#d9d9d9; padding:3px 7px; border-radius:5px; font-weight:500;}
.myclass_btntest:hover {display:inline-block; background:#ededed; padding:3px 7px; border-radius:5px; font-weight:500;}
.myclass_btnview {display:inline-block; background:#27344e; color:#ffffff !important; padding:4px 7px; line-height:18px; border-radius:5px; font-weight:500;}
.myclass_btnview:hover {display:inline-block; background:#27344e; padding:4px 7px; line-height:18px; border-radius:5px; font-weight:500;}
.myclass_btndown {display:inline-block; background:#27344e; padding:3px 7px; border-radius:5px; font-weight:500; color:#fff; line-height:18px;}
.myclass_btndown:hover {display:inline-block; background:#27344e; padding:3px 7px; border-radius:5px; font-weight:500; color:#fff; line-height:18px;}
.management_btn {color:#647ef8 !important;}
.management_btn:hover {color:#000000 !important;}
.listview_area_management {width:100%; min-height:300px; border:1px solid #dddddd; padding:15px; border-radius:0 0 8px 8px;}


/* KB STAR WM */
.kbstar_top {width:100%; padding:0; margin:0 0 20px 0; border-bottom:1px solid #9f9f9f;}
.kbstar_top span {display:inline-block; width:100%; font-weight:500; font-size:1.1em; text-align:center; padding:3px 0 15px 0; border-bottom:1px solid #1f1f1f;}

.kbstar_tit {width:100%; background:#fcf4cd; font-weight:500; height:27px; line-height:25px; margin:0 0 10px 0; text-align:center; font-size:1.1em; border-radius:20px;}

.kbstar_notice {width:100%; text-align:right; color:#faaf18; margin:0 0 5px 0;}

.kbstar_con {width:100%; margin:8px 0 !important; padding:0 15px 8px 0; font-weight:500; overflow:hidden; border-bottom:1px dotted #e8e8e8;}
.kbstar_con li.kbstar_contit {float:left; width:50%; position:relative; padding:8px 0 0 28px;}
.kbstar_con li.kbstar_contit::before {content :"■ "; font-size:0.5em; padding:8px 3px 0 0; margin:0 0 0 0; position:absolute; top:0; left:15px;}
.kbstar_con li.kbstar_coninfo {float:right; width:50%; text-align:right; }
.kbstar_con li.kbstar_coninfo input {padding:5px 0; border:1px solid #dedede; text-align:center;}
.kbstar_con li.kbstar_coninfo input::placeholder {color:#a4a4a4; font-size:0.9em; letter-spacing:-1px;}
.kbstar_con li.kbstar_coninfo input.coninfo1 {width:38%; margin:0 2% 0 0;}
.kbstar_con li.kbstar_coninfo input.coninfo2 {width:60%;}

.kbstar_contit2 {width:100%; padding:6px 15px 0 28px; font-weight:500; margin:0 0 10px 0; position:relative;}
.kbstar_contit2::before {content :"■ "; font-size:0.5em; padding:6px 3px 0 0; margin:0 0 0 0; position:absolute; top:0; left:15px;}
.kbstar_con_textinput {width:100%; margin:10px 0; padding:0 15px;}
.kbstar_con_textinput textarea {width:100%; height:150px; border:1px solid #f2f2f2; padding:15px;}
.kbstar_coninfo2 {padding:0 15px; margin:0 0 10px 0;}
.kbstar_coninfo2 input {margin:0 0 0 10px !important;}
.kbstar_coninfo2 input:first-child {margin:0;}

/*.kbstar_con_textinput textarea::placeholder {color:#d8d8d8; font-size:0.9em; text-align:center;}*/

/* 요청답변보기 */

.councel_view_tit {font-size:1.25em; text-align:center; padding:10px 0 15px 0;}
.councel_view_subtit {background:#f1f1f1; border-top:1px solid #e5e5e5; border-left:1px solid #e5e5e5; border-right:1px solid #e5e5e5; border-bottom:1px solid #d9d9d9; text-align:center; padding:8px 0; font-size:1em;}
.councel_view_con {padding:15px; border:1px solid #ececec; margin:0 0 15px 0;}
.councel_view_btn {text-align:center;}
.councel_view_btn a {display:inline-block; width:130px; margin:10px auto 0; background:#27344e; border:1px solid #aeaba5; padding:10px 0; text-align:center; color:#ffffff; font-size:1.1em;}

/* 비밀번호 변경 */
.password_edit {width:100%; margin:30px 0 0 0;}
.password_edit input {width:100%; height:35px; line-height:35px; padding:0 15px; border:1px solid #e3e3e3; border-radius:8px; margin:5px 0;}
.password_edit input::placeholder {color:#696357; letter-spacing:-1px; font-weight:500; font-size:0.9em; font: 12px/1.2 ng,"Noto Sans KR","MalgunGothic","맑은고딕","Arial","sans-serif";}


/*  FAQ */
.faq_area {width:100%; margin:0 0 20px 0;}
.faq_area > .faq_list {margin:0 0 4px 0;}
.faq_area .faq_question {cursor:pointer; padding:15px 10px; background:#f1f1f1; font-weight:500;}
/*.faq_area .faq_question::after {content:"▼"; float:right;}*/
/*.faq_area > .faq_list.hover > .faq_question::after {content:"▲";}*/
.faq_area .faq_answer {display:none; background:#fcf4cd; padding:15px 10px 15px 20px;}
.faq_area span {font-weight:500;}

.ch_btn {width:100%; background:url('/Images/sub_img/ch_icon.png') no-repeat 0 0;}
.ch_btn p {height:41px; line-height:41px; margin:0 0 0 45px;background:#f3e626; padding:0 10px; color:#000000; font-weight:500; border-radius:8px; position:relative;}
.ch_btn p span.chbtn_plus {display:inline-block; position:absolute; top:10px; right:10px; width:20px; height:20px; line-height:18px; border-radius:30px; background:#000000; color:#f3e626; font-size:1.2em; text-align:center;}

/* WM 소개 */

.wm_info_m {display:none;}
.wm_info_t {display:block;}


.swiper-pagination-bullet {
	width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,10px)) !important;
    height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,10px)) !important;
    display: inline-block;
    border-radius: 50%;
	background:#8d8d8d !important;
	opacity: var(--swiper-pagination-bullet-inactive-opacity, 1) !important;
	}
.swiper-pagination-bullet-active {opacity: 1;}

:root {
    --swiper-theme-color: #8d8d8d !important;
}

.swiper {padding:0 0 45px 0 !important;}
.swiper-slide img {width:100%; max-width:1250px;}
#sliderWrap{background: #fff; padding: 0; overflow: hidden; margin-bottom: 30px;}
.swiper{width: 100%; text-align: center; height: 360px; overflow: hidden; margin-bottom: 10px;}
.swiper .swiper-pagination{bottom: 10px;}
.swiper-slide{font-size: 14px; border-bottom: solid 1px #ddd;}
.swiper-slide .link{display: inline-block; padding: 8px 10px; width: 100%;}
.swiper-slide .link a{ font-size: 1.05em; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: normal; line-height: 1.2; height: 2.4em; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.swiper-slide a{display: block;}
.swiper .thumb{display: inline-block; width: 100%; height: 100%; background-size: auto 100% !important;}



.wm_filedown_v1 {display:none;}
.wm_filedown_v2 {display:block;}
.wm_filedown {width:100%; padding:10px 0; color:#000000; text-align:center; border-radius:5px; border:1px solid #d9d9d9; background:#ffffff; margin:20px 0 0 0; font-weight:500;}
.wm_filedown span {display:inline-block; font-weight:500; margin:0 10px 0 0;}
.wm_filedown a {display:inline-block; margin:0 0 0 8px;}

@media (max-width:767px) {
 #contents { margin: 0; border-left: none; }

}

.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
   background-image: none;
    left: 15px;
    right: auto;
}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
    background-image: none;
    right: 15px;
    left: auto;
}




/*  레이어 팝업  */

#layer_pop {width:100%; max-width:600px; margin:0 auto; padding:5px; overflow:hidden;}

.kbstar_layer {width:100%; padding:10px 20px 50px 20px; border:2px solid #000000; border-radius:15px; position:relative;background:#FFF;}
.layer_topbtn {text-align:right;}
.layer_topbtn a.layer_close {display:inline-block; font-weight:500; font-size:20px; padding:0 10px 10px 10px;}
.layer_btn1 {width:100%; padding:10px 0; color:#ffffff; font-size:1.2em; text-align:center; border-radius:0 0 10px 10px / 0 0 10px 10px; background:#000000; margin:2px 0 0 0; font-weight:500; position:absolute; left:0; bottom:0;}

.qa_layer {width:100%; padding:10px 20px 60px 20px; border:1px solid #e3e3e3; border-radius:15px; position:relative;}
.qa_title {width:100%; padding:10px 0 15px 0; font-size:1.3em; text-align:center; font-weight:500;}

.layer_qainput {width:100%;}
.layer_qainput th {background:#f1f1f1; padding:10px 0; text-align:center; font-weight:500; border:1px solid #dfdfdf; width:100px;}
.layer_qainput td {padding:10px; border:1px solid #dfdfdf;}
.layer_qainput td.qaarea_userinput {padding:0;}
.layer_qainput td.qaarea_userinput textarea.qaarea_userinput1 {width:100%; height:250px; padding:10px; border:1px solid #ffffff;}
.layer_qainput td.qaarea_userinput textarea.qaarea_userinput2 {width:100%; height:124px; padding:10px; border:1px solid #ffffff;}
textarea.qaarea_userinput3 {width:100%; height:236px; padding:10px; border:1px solid #ffffff;}
.qalayer_btn {width:100%; background:#f8d123; color:#27344e; text-align:center; padding:10px 0; font-weight:500; font-size:1.1em;}
.layer_btn2 {width:100%; padding:10px 0; color:#ffffff; font-size:1.2em; text-align:center; border-radius:0 0 10px 10px / 0 0 10px 10px; background:#27344e; margin:2px 0 0 0; font-weight:500; position:absolute; left:0; bottom:0;}
.layer_btn3 {width:100%; padding:10px 0; color:#ffffff; font-size:1.2em; text-align:center; border-radius:0 0 10px 10px / 0 0 10px 10px; background:#27344e; margin:2px 0 0 0; font-weight:500; position:absolute; left:0; bottom:0;}




.fontc_red {color:#fa4d46 !important;}
.fontc_blue {color:#647ef8 !important;}
.m0 {margin:0 !important;}
.mT10 {margin:10px 0 0 0 !important;}
.fontsize09 {font-size:0.9em !important;}
.mT05 {margin:5px 0 0 0 !important;}



/*  공통버튼 */
.list_btn{width:100%; padding:10px 0; color:#ffffff; font-size:1.1em; text-align:center; border-radius:5px; background:#27344e; margin:20px 0 0 0; font-weight:500;}
.del_btn {width:100%; padding:10px 0; color:#ffffff; font-size:1.1em; text-align:center; border-radius:5px; background:#ed8b37; margin:20px 0 0 0; font-weight:500;}
.cancle_btn {width:100%; padding:10px 0; color:#ffffff; font-size:1.1em; text-align:center; border-radius:5px; background:#979797; margin:20px 0 0 0; font-weight:500;}
.submit_btn {width:100%; padding:10px 0; color:#27344e; font-size:1.1em; text-align:center; border-radius:5px; background:#f8d123; margin:20px 0 0 0; font-weight:500;}
.insert_btn {width:100%; padding:10px 0; color:#27344e; font-size:1.1em; text-align:center; border-radius:5px; background:#27344e; margin:20px 0 0 0; font-weight:500;color:#ffffff;}

.act_write_area {width:100%; text-align:right;}
.act_write_area .act_submit_btn {display:inline-block; width:150px; padding:10px 0; color:#27344e; font-size:1.1em; text-align:center; border-radius:5px; background:#f8d123; margin:12px 5px 0 0; font-weight:500; border-radius:4px;}
.act_write_area .act_insert_btn {display:inline-block; width:150px; padding:10px 0; color:#27344e; font-size:1.1em; text-align:center; border-radius:5px; background:#27344e; margin:12px 0 0 0; font-weight:500;color:#ffffff; border-radius:4px;}

.center_table .act_write_area .center_btn_modify {display:inline-block; width:100px; padding:10px 0; color:#27344e; font-size:1.1em; text-align:center; background:#f8d123; margin:0 0 0 5px; font-weight:500;  border-radius:4px;}
.center_table .act_write_area .center_btn_reply {display:inline-block; width:100px; padding:10px 0; color:#ffffff; font-size:1.1em; text-align:center;  background:#979797; margin:0 0 0 5px; font-weight:500;  border-radius:4px;}
.center_table .act_write_area .center_btn_list {display:inline-block; width:100px; padding:10px 0; color:#fafafa; font-size:1.1em; text-align:center; background:#27344e; margin:0 15px 15px 5px; font-weight:500;  border-radius:4px; }
.center_table .act_write_area .center_btn_del {display:inline-block; width:100px; padding:10px 0; color:#fafafa; font-size:1.1em; text-align:center; background:#333333; margin:0 0 0 5px; font-weight:500;  border-radius:4px;}

/*  검색영역 */
.SearchBox_playList {padding:0; margin:10px 0 !important; clear:both; }
.SearchBox_playList input {border:1px solid #27344e; height:33px; width:40%; margin:0 0 0 0; display: inline-block;}
.SearchBox_playList input::placeholder {color:#4d5463; letter-spacing:-1px;}
.SearchBox_playList a {display:inline-block; width:65px; height:33px; line-height:31px; text-align:center; margin:0 0 0 2px; color:#ffffff; background:#27344e; border:1px solid #27344e;}
.SearchBox_playList .right_btns {float:right;}
.SearchBox_playList .right_btns p {display:inline-block;}
.SearchBox_playList .right_btns a {display:inline-block; width:65px; height:33px; line-height:31px; text-align:center; margin:0 0 0 3px; color:#726943; background:#ffffff; border:1px solid #f8d123;}
.SearchBox_playList .right_btns a.right_btnson {display:inline-block; width:70px; height:33px; line-height:31px; text-align:center; margin:0 0 0 5px; color:#726943; background:#f8d123; border:1px solid #f8d123;}

.qnawrite_btn {float:right;}
.qnawrite_btn a {display:inline-block; width:120px; color:#27344e; background:#f8d123; border:none; font-size:1.05em;}



/* 동영상 */
.movie_list  {width:24%; margin:0 0.5% 25px 0.5%; float:left;}
.movie_list  .movie_box {width:100%; /*max-width:127px;*/ background:#fafafa; position:relative; line-height: 0;}
.movie_list  .movie_box img {position:relative; width: 100%; /*height: 95px;*/ z-index: 1; background:#ebeae9; border:1px solid #ebeae9;}
.movie_list  .movie_box .icon4depth_s3 {position:absolute; bottom:1px; right:1px; padding:0 7px; height:20px; line-height:20px; background:#000000; color:#ffffff; font-size:0.9em; z-index:9;}

.movie_list  .movie_title {width:100%; padding:15px 0 0 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: break-word; word-break: keep-all;}
.movie_list  .movie_title .title4depth_tit {font-size:1.1em; font-weight:500; overflow:hidden; width:100%; white-space:nowrap; text-overflow:ellipsis; letter-spacing:-0.5px;}
.movie_list  .movie_title .title4depth_info {padding:5px 0 0 0; letter-spacing:-0.5px;}
.movie_list  .movie_title span {margin:0 10px 0 0; display:inline-block;}
.movie_list  .movie_title span.review {display:none;}

.paging {width:100%; text-align:center; padding:50px 0 20px 0;}
.paging li {display:inline-block;}
.paging li a {display:inline-block; border:1px solid #dfdfdf; height:25px; width:25px; line-height:23px; text-align:center; margin:0 2px; background:#ffffff;}
.paging li a:hover {display:inline-block; border:1px solid #27344e; height:25px; width:25px; line-height:23px; text-align:center; background:#27344e; color:#fafafa;}
.paging li.select span {display:inline-block; border:1px solid #27344e; height:25px; width:25px; line-height:23px; text-align:center; background:#27344e; color:#fafafa;}

@media (max-width:1000px) { .movie_list  {width:31.3333%; margin:0 1% 25px 1%; float:left;}  }
@media (max-width:768px) { .movie_list  {width:48%; margin:0 1% 25px 1%; float:left;}  }
@media (max-width:640px) {

#container {position:relative; width:100%; max-width:1400px; margin:15px auto 30px; padding:0 10px; overflow:hidden;}

.movie_list  {width:100%; margin:0 0 20px 0; float:none; overflow:hidden;}

.movie_list  .movie_box {width:35%; /*max-width:127px;*/ background:#fafafa; position:relative; float:left;}
.movie_list  .movie_box img {position:relative; width: 100%; /*height: 95px;*/ z-index: 1; background:#ebeae9; border:1px solid #ebeae9;}
.movie_list  .movie_box .icon4depth_s3 {position:absolute; bottom:1px; right:1px; padding:0 7px; height:20px; line-height:20px; background:#000000; color:#ffffff; font-size:0.9em; z-index:9;}

.movie_list  .movie_title, .movie_list  .social{width:65%; padding:5px 0 0 10px; float:left;}
.movie_list  .movie_title .title4depth_tit {font-size:1.1em; font-weight:500; overflow:hidden; width:100%; white-space:nowrap; text-overflow:ellipsis;}
.movie_list  .movie_title .title4depth_info {padding:5px 0 0 0;}
.movie_list  .movie_title span {margin:0 0 0 0; display:inline-block; width:100%;}
.movie_list  .movie_title span.review {display:none;}
}


.content_table {width:100%; margin:0; display:flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start;}

.lec_open  {width:24%; margin:0 0.5% 25px 0.5%; float:left;}
.lec_open  .lec_open_img {width:100%; /*max-width:127px;*/ background:#fafafa; position:relative;}
.lec_open  .lec_open_img img {position:relative; width: 100%; /*height: 95px;*/ z-index: 1; background:#ebeae9; border:1px solid #ebeae9;}
.lec_open  .lec_open_img .icon4depth_s3 {position:absolute; bottom:1px; right:1px; padding:0 7px; height:20px; line-height:20px; background:#000000; color:#ffffff; font-size:0.9em; z-index:9;}

.lec_open  .lec_title {width:100%; padding:15px 0 0 0;}
.lec_open  .lec_title .title4depth_tit {font-size:1.1em; font-weight:500; overflow:hidden; width:100%; white-space:nowrap; text-overflow:ellipsis; letter-spacing:-0.5px;}
.lec_open  .lec_title .title4depth_info {padding:5px 0 0 0; letter-spacing:-0.5px;}
.lec_open  .lec_title span {margin:0 10px 0 0; display:inline-block;}
.lec_open  .lec_title span.review {display:none;}

.paging {width:100%; text-align:center; padding:50px 0 20px 0;}
.paging li {display:inline-block;}
.paging li a {display:inline-block; border:1px solid #dfdfdf; height:25px; width:25px; line-height:23px; text-align:center; margin:0 2px; background:#ffffff;}
.paging li a:hover {display:inline-block; border:1px solid #27344e; height:25px; width:25px; line-height:23px; text-align:center; background:#27344e; color:#fafafa;}
.paging li.select span {display:inline-block; border:1px solid #27344e; height:25px; width:25px; line-height:23px; text-align:center; background:#27344e; color:#fafafa;}

@media (max-width:1000px) { .lec_open  {width:31.3333%; margin:0 1% 25px 1%; float:left;}  }
@media (max-width:768px) { .lec_open  {width:48%; margin:0 1% 25px 1%; float:left;}  }
@media (max-width:640px) {

#container {position:relative; width:100%; max-width:1400px; margin:15px auto 30px; padding:0 10px; overflow:hidden;}

.lec_open  {width:100%; margin:0 0 20px 0; float:none; overflow:hidden;}

.lec_open  .lec_open_img { background:#fafafa; position:relative; float:left;}
.lec_open  .lec_open_img img {position:relative; width: 100%; /*height: 95px;*/ z-index: 1; background:#ebeae9; border:1px solid #ebeae9;}
.lec_open  .lec_open_img .icon4depth_s3 {position:absolute; bottom:1px; right:1px; padding:0 7px; height:20px; line-height:20px; background:#000000; color:#ffffff; font-size:0.9em; z-index:9;}

.lec_open  .lec_title {width:65%; padding:5px 0 0 10px; float:left;}
.lec_open  .lec_title .title4depth_tit {font-size:1.1em; font-weight:500; overflow:hidden; width:100%; white-space:nowrap; text-overflow:ellipsis;}
.lec_open  .lec_title .title4depth_info {padding:5px 0 0 0;}
.lec_open  .lec_title span {margin:0 0 0 0; display:inline-block; width:100%;}
.lec_open  .lec_title span.review {display:none;}
.searchlist h3.titleboard {font-size:1.1em; color:#5e5a4c; margin:0 auto 10px; padding:0 0 5px 0; border-bottom:1px solid #eeece3; width:100%;}
}
/* //동영상 */

@media (max-width:768px) {

#container {position:relative; width:100%; max-width:1400px; min-height:70vh; margin:20px auto 30px; padding:0 20px; overflow:hidden;}
.data_list {width:100%; margin:0;}
.data_area {width:100%; display: flex; flex-wrap:wrap; align-items:center; margin:0 0 15px 0;}
.data_area .data_thumbnail {width:30%; max-width:127px; flex-shrink: 0; background:#fafafa; position:relative;}
.data_area .data_thumbnail img {position:relative; width: 100%; height: 95px; object-fit: contain;  z-index: 1; background:#ebeae9; border:1px solid #ebeae9;}
.data_area .data_thumbnail .data_type {position:absolute; bottom:0; right:0; padding:0 7px; height:20px; line-height:20px; background:#000000; color:#ffffff; font-size:0.9em; z-index:9;}
.data_area .data_info {width:67%; flex-grow: 1; padding:0 0 0 15px;}
.data_area .data_info .info_tit {font-size:1.1em; font-weight:500;}
.data_area .data_info .info_info {padding:25px 0 0 0;}
.data_area .data_info span {margin:0; width:100%; display:inline-block;}
.contslogan{font-size: 1.8em;}
.sectiontitle {font-size: 1.4em;}
.teacherlist .subject span{font-size: 1.6em;}
.classteacher .teacher_box .teachername{ font-size: 1.4em;}
.classinfo > ul li span {font-size: 1.1em;}

@media (max-width:640px) {
* {letter-spacing:-0.05em;}
}

@media (max-width:480px) {

	* {letter-spacing:-1px;}
#container {position:relative; width:100%; max-width:1400px; min-height:70vh; margin:10px auto 30px; padding:0 10px; overflow:hidden;}

.kbstar_contit2 .span100 {display:inline-block; width:100%;}
.kbstar_coninfo2 .span100 {display:inline-block; width:100%; padding:5px 0 0 0;}

.kbstar_con {width:100%; margin:8px 0 !important; padding:0 0 0 0; font-weight:500; overflow:hidden;}
.kbstar_con li.kbstar_contit {float:left; width:50%; position:relative; padding:8px 0 0 13px;}
.kbstar_con li.kbstar_contit::before {content :"■ "; font-size:0.5em; padding:8px 3px 0 0; margin:0 0 0 0; position:absolute; top:0; left:0;}
.kbstar_contit2 {width:100%; padding:0 0 0 15px; font-weight:500; margin:0 0 10px 0; position:relative;}
.kbstar_contit2::before {content :"■ "; font-size:0.5em; padding:0 3px 0 0; margin:0 0 0 0; position:absolute; top:0; left:0;}
.kbstar_con_textinput {width:100%; margin:10px 0; padding:0;}
.kbstar_coninfo2 {padding:0; margin:0 0 10px 0;}

.width100_480 {display:inline-block; width:100% !important; margin:0 0 0 5px !important;}

.board_s1 th {padding:10px 0; text-align:center; width:50px; background:#f5f5f5; border-bottom:1px solid #e8e8e8;}
.board_s1 td {padding:10px 5px; border-bottom:1px solid #e8e8e8;}

.search_area a {display:inline-block; width:50px; height:33px; line-height:31px; text-align:center; margin:0 0 0 7px; color:#ffffff; background:#27344e; border:1px solid #27344e;}
.search_area .array_btn a {display:inline-block; width:50px; height:33px; line-height:31px; text-align:center; margin:0 0 0 4px; color:#726943; background:#ffffff; border:1px solid #f8d123;}
.search_area .array_btn a.on {display:inline-block; width:50px; height:33px; line-height:31px; text-align:center; margin:0 0 0 4px; color:#726943; background:#f8d123; border:1px solid #f8d123;}

/* 오른쪽 영역 2줄일경우 */
.center_table .center_input .input_tit_2line {display:inline-block; width:29%; line-height:64px; text-align:center; font-weight:500; padding:0;}

}

#Board_Div {position:fixed;width:100%;height:100%;background-color:rgb(0,0,0, 0.8);z-index:99999999999;display:none;overflow-y: auto; /* 세로 스크롤이 필요한 경우만 활성화 */}
.popup_close {position:absolute;right:30px;margin-top:-37px;}
.popup_close a {color:#FFF;}



/* 이북 리스트페이지 */

.ebooktitle {font-size:2em; font-weight:500; background:#ffffff; padding:30px 0; text-align:center;}

#ebook_list {padding:20px 0; margin:0 auto; background:#ffffff; width:95%; max-width:860px; overflow:hidden;}


#ebook_list .listarea {width:32.333333333333333333333%; float:left; margin:0 0.5% 10px 0.5%; background:#f8f8f8; overflow:hidden; box-sizing: border-box; text-align:center;}
#ebook_list .listarea .thumbnail {padding:10px 10px 0 10px; box-sizing: border-box; text-align:center; border:none; background:none; margin:0;}
#ebook_list .listarea .title {padding:15px 10px; font-size:15px;  font-weight:500; box-sizing: border-box; text-align:left;}
#ebook_list span.subtitle {border-radius:25px; padding:7px 15px; font-size:13px; margin:10px 0; background:#faaf18; color:#ffffff; display:inline-block; font-size:15px;}
#ebook_list span.subtitle span {display:inline-block; font-weight:500;}
#ebook_list span.listtitle {letter-spacing:-0.5px;}

#ebook_list .listarea .title_2line {min-height:65px;  display:inline-block;}

#ebook_list .letter1 {letter-spacing:-1px;}

#ebook_onelist {padding:0 0 20px 0; margin:0 auto; background:#ffffff; width:95% !important; max-width:640px; overflow:hidden; text-align:center; }

#ebook_onelist .listarea  {width:100%; background:#f3f2f8; overflow:hidden; box-sizing: border-box; text-align:center; margin:0 0 15px 0 !important; padding:15px 0;}
#ebook_onelist .listarea .thumbnail {float:left; width:30%; padding:0; box-sizing: border-box; text-align:center; border:none; background:none; margin:0;}
#ebook_onelist .listarea .title {float:left; width:70%; padding:0 10px; font-size:15px;  font-weight:500; box-sizing: border-box; text-align:left;}
#ebook_onelist span.subtitle {border-radius:25px; padding:5px 10px; font-size:12px; margin:0 0 7px 0; background:#faaf18; color:#ffffff; display:inline-block;}
#ebook_onelist span.subtitle span {display:inline-block; font-weight:500;}
#ebook_onelist .thumbnail img {width:30%;}
#ebook_onelist span.listtitle {letter-spacing:-1px;}

@media only screen and (max-width: 720px) { 

.ebooktitle {font-size:2em; font-weight:500; background:#ffffff; padding:20px 0; text-align:center;}
#ebook_list .listarea {width:48%; float:left; margin:0 1% 10px 1%; background:#f8f8f8; overflow:hidden; box-sizing: border-box; text-align:center;}

#ebook_list .listarea .title_3line {display:inline-block;}
#ebook_list .listarea .title_4line {min-height:90px;}
}


@media only screen and (max-width: 640px) { 
.ebooktitle {font-size:1.7em; font-weight:500; background:#ffffff; padding:30px 0; text-align:center;}

#ebook_list span.subtitle {border-radius:25px; padding:6px 10px; font-size:13px; margin:10px 0; background:#faaf18; color:#ffffff; display:inline-block; font-size:15px;}
#ebook_list {padding:0 0 20px 0; margin:0 auto; background:#ffffff; width:90%; max-width:860px; overflow:hidden;}
#ebook_list .listarea .title {padding:15px 10px; font-size:14px;  font-weight:500; box-sizing: border-box;  text-align:left; }

#ebook_list .thumbnail img {width:25%;}

#ebook_list .listarea .title_4line {min-height:90px !important;}

.center_table .act_write_area .center_btn_modify {display:inline-block; width:80px; padding:10px 0; color:#27344e; font-size:1.1em; text-align:center; background:#f8d123; margin:0 0 0 5px; font-weight:500;  border-radius:4px;}
.center_table .act_write_area .center_btn_reply {display:inline-block; width:80px; padding:10px 0; color:#ffffff; font-size:1.1em; text-align:center;  background:#979797; margin:0 0 0 5px; font-weight:500;  border-radius:4px;}
.center_table .act_write_area .center_btn_list {display:inline-block; width:80px; padding:10px 0; color:#fafafa; font-size:1.1em; text-align:center; background:#27344e; margin:0 15px 15px 5px; font-weight:500;  border-radius:4px; }
.center_table .act_write_area .center_btn_del {display:inline-block; width:80px; padding:10px 0; color:#fafafa; font-size:1.1em; text-align:center; background:#333333; margin:0 0 0 5px; font-weight:500;  border-radius:4px;}

}

@media only screen and (max-width: 460px) { 

#ebook_onelist .listarea .thumbnail {float:left; width:35%; padding:0; box-sizing: border-box; text-align:center;}
#ebook_onelist .listarea .title {float:left; width:65%; padding:0 10px; font-size:15px;  font-weight:500; box-sizing: border-box; text-align:left; }
#ebook_onelist .thumbnail img {vertical-align:middle; width:32%;}
#ebook_onelist .listarea .thumbnail {float:left; width:30%; padding:7px 0 0 0; box-sizing: border-box; text-align:center; border:none; background:none; margin:0;}

#ebook_list .listarea .title_3line {min-height:60px; display:inline-block;}
#ebook_list .listarea .title_4line {min-height:110px !important;}

}


@media only screen and (max-width: 419px) { 

#ebook_onelist .listarea .thumbnail {float:left; width:30%; padding:10px 0 0 0; box-sizing: border-box; text-align:center;}
#ebook_onelist .listarea .title {float:left; width:70%; padding:0 10px; font-size:15px;  font-weight:500;  box-sizing: border-box; text-align:left;}
#ebook_onelist .thumbnail img {vertical-align:middle; width:40%;}

#ebook_list .listarea .title {min-height:70px;}

}


@media (max-width:360px) {

.card_news {width:100%; max-width:100%; height:400px; margin:0 auto; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:#ffffff; z-index:9999999;}

.center_table .act_write_area .center_btn_modify {display:inline-block; width:70px; padding:10px 0; color:#27344e; font-size:1em; text-align:center; background:#f8d123; margin:1px 0 0 0; font-weight:500;  border-radius:4px;}
.center_table .act_write_area .center_btn_reply {display:inline-block; width:70px; padding:10px 0; color:#ffffff; font-size:1em; text-align:center;  background:#979797; margin:1px 0 0 0; font-weight:500;  border-radius:4px;}
.center_table .act_write_area .center_btn_list {display:inline-block; width:70px; padding:10px 0; color:#fafafa; font-size:1em; text-align:center; background:#27344e; margin:1px 15px 15px 0; font-weight:500;  border-radius:4px;}
.center_table .act_write_area .center_btn_del {display:inline-block; width:70px; padding:10px 0; color:#fafafa; font-size:1em; text-align:center; background:#333333; margin:1px 0 0 0; font-weight:500;  border-radius:4px;}

/*
.card_news_img {position:relative; height:350px; margin:0 auto; width:100%; border-top:1px solid #005ca3;}
.card_news_img .swiper-container .swiper-slide img {height:100%;}
*/
}