@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
*{ font-family: 'Noto Sans KR', sans-serif; margin:0; padding:0; text-decoration: none; list-style: none;    box-sizing: border-box; font-size:inherit}
div p{font-size:inherit}

html, body{width:100%; margin:0 auto; background-color:#fff;background: #edf0f6;}
input{font-size:inherit}
.mo_view{display:none !important}
.mo_hide{display:inline-block !important}
.pc_hide{display:none !important}
.class_detail_info li.mo_hide{display:inline-block}
.class_detail_info li.pc_hide{display:none}
.bg-primary{background-color:#5aa3f2}
.bg-333{background-color:#333}
.bg-yellow{background-color:#FFE34A}
.bg-blue{background-color:#474EAD}
.bg-red{background-color:#ff0000}
.text-primary{color:#E5333C}
.text-white{color:#fff}
.text-333{color:#333}
.text-yellow{color:#FFE34A}
.text-blue{color:#474EAD}
.btn{padding:1px 5px 2px; display:inline-block; box-sizing:border-box}
.btn_blue{border:1px solid #474EAD}
.close{position:absolute; right:15px; top:15px; opacity: 1; width:20px; height:20px}
.close:active, .close:focus, .close:hover{opacity: .8}
.close:after, .close:before{display:block; content:''; width:2px; height:16px; background-color:#1f1f1f; position:absolute; top:0; left:0; right:0; bottom:0; margin:auto}
.close:before{transform:rotate(45deg)}
.close:after{transform:rotate(-45deg)}

.strikethrough {
  position: relative;
  display: inline-block; /* span을 인라인 블록 요소로 설정 */
  color: black; /* 텍스트 색상 설정 */
}

.strikethrough::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: linear-gradient(
      to top right, /* 대각선 방향: 왼쪽 아래에서 오른쪽 위로 */
      transparent 45%, 
      red 46%, 
      red 54%, 
      transparent 55%
  );
  opacity: 1; /* 줄의 투명도 */
  z-index: 99999999999;
}



.br50{border-radius:50px}
.br5{border-radius:5px}
.br3{border-radius:3px}
.br10{border-radius:10px}
.full-width{width:100%;}

.text-center{text-align:center}
.text-left{text-align:left}
.text-right{text-align:right}
.float-left{float:left}
.float-right{float:right}

table{border-spacing: 0;border:1px solid #ddd}
th{padding:8px; line-height:1.4; font-size:11pt; background-color:#f9f9f9; border-bottom:1px solid #ddd; font-weight:normal}
td{border:1px solid #ddd; border-width:0 1px 1px 0; padding:8px; font-size:10pt;}
td:last-child{border-right:0}
tr:last-child td{border-bottom:0}


a, .btn{cursor:pointer}
input, select{outline:none;}
select{
  appearance:none;
  position: relative;
  display: inline-block;
  padding: 0 40px 0 15px;
  background: #fff url('../img/icon_arrow2.png') no-repeat 90% 50%;
  letter-spacing: -0.05rem;
}
select:focus{outline:none;}
select.select1 {
    line-height: 45px;
    border: none;
    font-size: 15px;
    letter-spacing: -0.05rem;
}
select.select2 {
    line-height: 35px;
    border: 1px solid #dcdcdc;
    font-size: 13px;
    width:100%;
  }

.search_order{margin-top:13px}
.search_order select.select1{height:30px; line-height:30px; border-radius:3px; font-size:14px; padding: 0 20px 0 10px;}
select.select1.edu_select{background-color:#5aa3f2; color:#fff}
.checkbox_wrap span, .radio_wrap span{font-size:14px}
.checkbox_wrap input[type="checkbox"], .radio_wrap input[type="radio"]{width: 15px; height: 15px; display: inline-block; vertical-align: top;}
.fshrink {
    flex-shrink: 0;
}
textarea, button{outline:none}
textarea:focus,
input[type="password"]:focus,
input[type="text"]:focus{background-color: #fffac9;}

#fixed_header{position:fixed; top:0; left:0; width:100%; height:70px; padding:10px 0; background: rgba(255, 255, 255, 0.85); box-shadow:1px 1px 3px rgba(0, 0, 0, .06)}
#fixed_header .banner_btns{text-align:center; position:absolute; z-index: 99; right:15px; bottom:5px; margin:auto; line-height:1}
#fixed_header .banner_btns .btn{width:auto; display:inline-block; border-bottom:1px solid transparent; padding:0; margin-left:5px; color:#333; font-size:13px}
#fixed_header .banner_btns .btn:hover{border-bottom:1px solid #000}

#fixed_header .banner_btns .btn_go_login{position:relative; padding-right:10px}
#fixed_header .banner_btns .btn_go_login:after{display:block; content:''; width:1px; height:10px; background-color:#888; position:absolute; top:0; bottom:0; right:0; margin:auto}

#fixed_header .banner_btns .btn img{width: 12px;
    margin-top: 2px;
    display: inline-block;
    vertical-align: top;
    margin-right: 5px;}
#container{width:100%; max-width:1000px; margin:0 auto}
/* #wrap{max-width:1200px; width:100%; margin:30px auto 0;  padding:70px 20px 100px} */
#wrap{/* max-width:1200px; */width:100%;margin:30px auto 0;/* padding:70px 20px 100px; */}
/***********************************************************/

.fixed_banner{width:100%; z-index: 10; position:fixed; top:0; left:0; height:70px; background: #fff; box-shadow:1px 1px 3px rgba(0, 0, 0, .06)}
/* .fixed_banner.show_banner1{background-color:#333}
.fixed_banner.show_banner2{background-color:#ff0000}*/
.swiper-slide{height:100%; padding:10px 0}
.banner_slide{width:100%; margin:0 auto; overflow:hidden}
.banner1, .banner2{background-color:#333}
.banner1 p,
.banner1 h3{color:#fff}
.fixed_banner .close{right:15px; top:5px; z-index: 99;    filter: invert();}
.fixed_banner .banner_inner{position:relative; display:inline-block; width:90%; max-width:1000px; height:100%; box-sizing: border-box;}
/* .fixed_banner .banner_inner.banner2{padding:10px 0} */
.banner1 p{font-size:14px}
.banner2 img,
.lms_logo2{width:auto; vertical-align: top}
.lms_logo2{height:100%}
.banner2{padding:10px 0}
.banner2_01{float:left}
.banner2_02{float:right}
.lms_logo{position:absolute; right:0; left:0; margin:auto;}

.fixed_banner h3{font-size:23px; line-height:1.3}
.fixed_banner img.icon_click {filter: invert(); width: 40px; position: absolute; top: 0; right: 10%; bottom: 0; margin: auto;}

.fixed_banner .swiper-wrapper{height:100%}

/*******header ***********/
header {
    background: #fff;
    width: 100%;
    z-index: 9;
    line-height: 6rem;
    padding:0 1rem;
    width:100%;
    height:45px
}

ul.serach_box {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height:100%
}

ul.serach_box li{}
.search_tt{width:100%}
input.searchtt {
    font-size: 15px;
    color: #000;
    font-weight: 400;
    border:0;
    height:100%;
    line-height:60px;
    display:flex;
    width:100%;
}



ul.serach_box>li.search_li {
    cursor: pointer;
    padding: 0 0.7rem;
    height:100%;
}
ul.serach_box>li.search_li img{display:inline-block; vertical-align: top; margin-top:12px; width:20px}
.btn_details{display: inline-block;
    background: #5aa3f2;
    color: #fff;
    font-size: 15px; margin-top:9px;
    width:100px; height:33px; line-height:33px; text-align:center;}
.btn_details img{vertical-align: middle}
/**�곸꽭寃���**/
.details_box {
    display: none;
    background: #fff;
    border: 1px solid #e1e4e9;
    padding: 15px 20px;
    margin:15px auto 0;
    position:absolute;
    width:90%;
    max-width:1000px;
    background-color:#fff;
    left:0; right:0;
    z-index: 2;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, .15);

}

.det_lis {
    margin-bottom: 2rem;
}


.det_lis>dt {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.03rem;
}
.det_lis>dt span.text-red{color:#e5333c; font-size:14px; font-weight:normal}
.det_lis>dd {
    margin-top: 0.7rem;

}

.det_ul:after{display:block; content:''; clear:both}
  .det_ul>li{width:auto; min-width:80px; display:inline-block; float:left; margin-right:5px}
  .det_ul>li span{padding:0 8px}

.det_ul>li:last-child{
    margin-right: 0;
}

.det_btn>input[type="radio"],
.det_btn>input[type="checkbox"] {
    display: none;
}

.det_btn>input[type="radio"]+span,
.det_btn>input[type="checkbox"]+span {
    display: inline-block;
    width: 100%;
    font-size: 14px;
    height: 35px;
    line-height: 32px;
    text-align: center;
    border: 1px solid #b7bbc3;
    color: #000;
    font-weight: 300;
    text-align: center;
    cursor: pointer;
}

.det_btn>input[type="radio"]:checked+span,
.det_btn>input[type="checkbox"]:checked+span {
    background: #5aa3f2;
    border: 1px solid #5aa3f2;
    color: #fff;
    font-weight: 700;
    text-decoration: underline;
}
.det_lis:nth-child(4){display:inline-block; width:calc(65% - 3px)}
.det_lis:nth-child(5){display:inline-block; width:calc(35% - 3px)}
.det_lis:nth-child(5) ul{margin-top:-1px}
.det_lis:nth-child(4) li{width:30%; margin-right:1%; display:inline-block; float:left;}
.det_lis:nth-child(4) li:last-child{margin-right:0}
.det_lis:nth-child(4) li .det_btn{width:100%}
.det_lis:nth-child(5) .det_select li{display:inline-block; width:calc(50% - 3px)}
.det_lis:nth-child(5) .det_select select.select2{width:100%}
#container .contents .det_lis:nth-child(4) dt span{line-height:25px}
#container .contents .details_box .det_lis:nth-child(4) dt span.f_300{display:none}
.det_lis:nth-child(4) li.half-width{width:49.2%}
.date_input{position:relative; font-size: 14px;
    height: 35px;
    line-height: 32px;
    text-align: center;
    border: 1px solid #b7bbc3; overflow:hidden; padding:0 6px}
.date_input input{outline:none; border:0; width:100%; height:100%; font-size: 14px;}
.date_input:after{display:block; content:''; background-image:url(../img/date.svg); background-repeat:no-repeat; background-size:13px; width:13px; height:13px; position:absolute; top:9px; right:5px;}
.training_institution{width:calc(42% - 8px); float:right}
.training_institution .find_agency_txt{height:35px; line-height:32px; border:1px solid #b7bbc3; padding:0 6px; width:100px; display:inline-block}
.training_institution .find_agency_txt input{outline:none; border:0; width:100%; height:100%; font-size: 14px;}
.training_institution .select2 {width: calc(100% - 105px); display: inline-block; background-position: 94.5%;}
.start_date, .recruitment_period, .training_institution{display:none}

.det_lis.width28{width:28%}
.det_lis.width28 .date_input{display:inline-block; width:calc(49% - 7px); vertical-align: top}
.det_lis.width28 em{display:inline-block; width:10px; line-height:35px}
p.a_c {text-align:center}
p.a_c .btn{display:inline-block; width:100px; height:35px; line-height:30px; text-align:center; font-size:14px; color:#fff}
p.a_c .btn_reset{background-color:#6d6d6d}
p.a_c .btn_search{background-color:#000}
p.a_c .btn_close{background-color:#dedede; color:#000}


#container{margin-top:20px; margin-bottom: 20px;}
#container .contents dt{
  font-size: 15px;
    color: #000;}
.select_box{
  display: flex;
    justify-content: space-between;
    align-items: center;}
#container .contents dt span{font-weight:normal; line-height:2.5}
#container .contents dt h3 span{line-height:1.4}
#container .contents dd{position:relative;}
#container .contents dd.btn_wrap{float:right; padding-top:5px}
#container .contents > dd:nth-child(1){padding-bottom:30px}
#container .contents > dd:nth-child(2){margin-top:-50px; position: relative; z-index: 0}
#container .contents dd:after{display:block; content:''; clear:both}
.listcount_wrap{position:absolute; right:0; bottom:0; z-index: 1; font-size:13px}
#class_lists{width:1000px; margin:10px auto 0}
#class_lists li.class_list{padding:20px; width:100%;margin-bottom:15px; border-radius:10px; border:1px solid #E5E5E5; box-shadow:0 3px 6px rgba(0, 0, 0, .06); background-color:#fff}
#class_lists li.class_list:after{display:block; content:''; clear:both}
#class_lists li.class_list dl{display:inline-block; float:left; margin-top: 10px;}
.class_lists_{width:1000px; margin:10px auto 0}
.class_lists_ li.class_list{padding:20px; width:100%;margin-bottom:15px; border-radius:10px; border:1px solid #E5E5E5; box-shadow:0 3px 6px rgba(0, 0, 0, .06); background-color:#fff}
.class_lists_ li.class_list:after{display:block; content:''; clear:both}
.class_lists_ li.class_list dl{display:inline-block; float:left; }
.study_box1{width:calc(100% - 250px); position:relative; padding-right:25px}
/* .study_box2:before{display:block; content:''; width:1px; height:100%; background-color:#e5e5e5; position:absolute; top:0; bottom:0; left:-20px;} */
.study_box1:after{display:block; content:''; width:1px; height:100%; background-color:#e5e5e5; position:absolute; top:0; bottom:0; right:20px}
.study_box2{width:250px;}
#btn_sldupdown{display:none}
/* .hash_tags .tag{font-size:12px; color:#888; display:inline-block; padding-right:3px}
.hash_tags .tag:before{display:inline-block; content:'#'; width} */
.hash_tags{display:inline-block; width:calc(100% - 135px); vertical-align: top; margin-top:5px}
.hash_tags .tag{    display: inline-block;
    color: #9a9cae;
    font-size: 13px;
    font-weight: 400;
      /*padding: 0 5px;
   border: 1px solid #9a9cae; */
    font-style: normal;
    border-radius: 50px; height:25px; line-height:23px}
.btn_jipche{
  color: #9a9cae;
  font-size: 12px;
  font-weight: 400;
  padding: 0 5px;
  border: 1px solid #9a9cae;
  font-style: normal;
  border-radius: 50px; height:20px; line-height:18px
}
#class_lists li.class_list dl.study_box1 dt,
.class_lists_ li.class_list dl.study_box1 dt{margin-bottom:8px; width:98.5%}
/*.hash_tags{margin-bottom:10px}
 #class_lists li.class_list dl.study_box1 dt h3{display:inline-block; width:100%; word-wrap: break-word;}
#class_lists li.class_list dl.study_box1 dt h3 .chip{border-radius:50px; border:1px solid #e5333c; font-size:11px; display:inline-block; padding:1px 5px 2px; margin:4px 0 0 5px ; vertical-align: top} */
#class_lists li.class_list dl.study_box1 dt .chip,
.class_lists li.class_list dl.study_box1 dt .chip{
  background-color: #5aa3f2;
    border-radius: 3px;
    font-weight: normal;
    font-size: 12px;
    width: auto;
    display: inline-block;
    height: 20px;
    line-height: 20px;
    padding: 0 8px;
    vertical-align: top;
    margin-right: 3px;}
dl.study_box1 dt{position:relative;}
dl.study_box1 dt h3{font-size: 18px; line-height: 1.4; font-weight: 700; letter-spacing: -0.03rem;  color: #000; word-break: keep-all; word-wrap: break-word; margin-bottom:10px; width:calc(100% - 30px); display:inline-block}
dl.study_box1 dt .btn_share{
    display: inline-block;
    width: 26px;
    height: 26px;
    position: absolute;
    top: 5px;
    right: 0;
}
dl.study_box1 dd b{    display: inline-block;
    background: #5aa3f2;
    font-size: 17px;
    height: 35px;
    line-height: 33px;
    font-weight: 700;
    color: #fff;
    padding: 0 20px;
    border-radius: 50px;
    margin-bottom: 5px;
}
.class_detail_info li{font-size: 14px;
    margin-bottom: 8px;
    color: #636363;
    position: relative;
    /* padding-left: 8px; */
    font-weight: 300;
  width:98.6%}
#class_lists li.class_list .class_detail_info li:after,
.class_detail_info:after{display:block; content:''; clear:both}
.class_detail_info li:nth-child(5){width:98.5%}
.class_detail_info li .btn_class_apply {border-radius: 3px;
    padding: 1px 3px 3px;
    font-size: 11px;
    font-weight: bold;
    margin-top: -3px;
    vertical-align: middle;
    float: right;
    background-color: #ff0000; border:0; display:none}
.class_detail_info li.half-width{width:49%; display:inline-block; vertical-align: top}
.class_detail_info li.half-width .mng_info{font-style:normal; padding-left:5px;font-size: 14px;}
.class_detail_info li:before{display:none; content:''; width:3px; height:3px; background-color:#333; position:absolute; top:8px; left:0; margin:auto; border-radius:4px}
.class_detail_info li strong{font-size:14px; display:inline-block; width:55px; margin-right:5px; color:#636363 }
.class_detail_info li .address{width:calc(100% - 64px); display:inline-block; vertical-align: top; position:relative;}
.class_detail_info li .address p{display:inline-block;}
.class_detail_info li .address p.addr1{padding-right:5px}
.class_detail_info li .address .btn_show_map{position:absolute; top:3px; right:0}
.class_detail_info li a{}
.btn_show_map{border-radius:3px; padding:1px 3px 3px; font-size:11px; font-weight:bold; display:inline-block; margin-top:-3px; vertical-align: middle; float:right; background-color:#5aa3f2}
.btn_call{border-radius:3px; padding:1px 3px 3px; font-size:12px; display:inline-block; vertical-align: middle;}
.class_detail_info li .btn_call {background-color: #ed1b24; color: #fff !important; border: 0 !important}
.btn_call img{filter:invert(); width:11px; vertical-align: top; margin:4px 3px 0 0}
.class_detail_info li:last-child a.btn{padding:1px 10px 3px; margin-left:2px; font-size:11px; font-weight:500}
.class_detail_info li:nth-child(5) a.btn{padding:1px 10px 3px; margin-left:2px; font-size:11px; font-weight:500}
.class_detail_info li a.btn.btn_blue {margin-left:2px; font-size:11px; font-weight:500;background-color: #5aa3f2; color:#fff; border:0; float:right}
.class_detail_info li:nth-child(8) a.btn{background-color:#5aa3f2 !important}
.class_detail_info li .btn {width:85px; height:20px; text-align:center; font-size:11px; line-height:17px !important; font-weight:normal}
.class_lists_ .class_detail_info li .btn.btn_blog{background-color:#5CB433 !important; color:#fff}
.class_detail_info li:last-child a.btn{padding:1px 10px 3px; margin-left:2px; font-size:11px; font-weight:500}
hr{display: inline-block; width: 98.5%; margin: 10px auto; border: 1px solid #e5e5e5; border-width: 1px 0 0 0;}

.btn_recruit{padding:0px 10px 1px; width:100%; box-sizing: border-box;; font-size:14px; line-height:30px; background-color:#5aa3f2}
.btn_recruit span{font-size:12px; display:inline-block; margin-top:3px}

#class_lists li.class_list dl.study_box2 dt{    display: flex;
    flex-wrap: nowrap;}
#class_lists li.class_list dl.study_box2 dt p{}
#class_lists li.class_list dl.study_box2 dt .loca_share{display: flex;
    width: 26px;
    margin-left: 3px;}
.class_lists_ li.class_list dl.study_box2 dt{}
ul.cost{margin:5px auto 8px}
ul.cost li{text-align:right; font-size:14px; font-weight:normal}
ul.cost li strong{float:left}

.study_box2 .btn_lists li{width: 100%; box-sizing: border-box; height: 25px; line-height: 21px; font-size: 13px; text-align: center; margin-bottom: 5px; color:#fff; background-color:#ff0000;; border-radius:6px}

.study_box2 .btn_lists li:nth-child(3),
.study_box2 .btn_lists li:nth-child(4){background-color:#ed1b24 !important}
#class_schedule #class_lists li dl.study_box2 .btn_lists li{width:49%; margin-right:2%; float:left}
#class_schedule #class_lists li dl.study_box2 .btn_lists li a{color:#fff}
#class_schedule #class_lists li dl.study_box2 .btn_lists li:nth-child(2n){margin-right:0}
#class_schedule #class_lists li.class_list{margin-top:40px}
#class_schedule #class_lists li.class_list.notitle{margin-top:15px}
#class_schedule #class_lists li.class_list:nth-child(1){margin-top:55px}
/* #class_schedule #class_lists li.class_list p.edu_type{margin: -52px 0 0 -15px; padding-bottom: 30px;} */
#class_schedule #class_lists li.class_list p.edu_type{margin: -45px 0 0 -15px; padding-bottom: 30px;}
#class_schedule #class_lists li.class_list p.edu_type span{display:inline-block; position:relative;font-weight:bold; font-size:16px}
#class_schedule #class_lists li.class_list p.edu_type span:before{display:block; content:''; width:100%; height:5px; background-color:rgba(71, 78, 173, .4); position:absolute; bottom:0;}

.btn_apply_lists li{ background-color: #fff; border: 1px solid #5aa3f2; color:#5aa3f2; width:49%; margin-right:2%; border-radius:6px; float:left; text-align:center; font-size:12px; margin-top:9px}
.btn_apply_lists:after,
#class_schedule #class_lists li dl.study_box2 .btn_lists:after,
.btn_apply_lists li:after{display:block; content:''; clear:both}
.btn_apply_lists li:nth-child(2n){margin-right:0}

#share_popup{}
#share_popup h4.modal-header{padding-bottom:0}
#share_popup .modal-dialog{width:500px}
#share_popup .modal-body{max-height:none; overflow: inherit;}
#share_popup .modal-body > p{width:100%; text-align:left; margin-bottom:10px; background-color:#f2f2f2;  border:1px solid #e5e5e5; padding:5px 10px}
#share_popup .modal-body > p .checkbox_wrap input[type="checkbox"]{margin-top:5px}
#share_popup .modal-body > p .checkbox_wrap span{display: inline-block; vertical-align: top; margin-top: 2px;}
#share_popup .modal-body .share_list:after{display:block; content:''; clear:both}
#share_popup .modal-body .share_list{display:flex}
#share_popup .modal-body .share_list li{width:20%; display:inline-block; float:left; text-align:center; cursor:pointer}
#share_popup .modal-body .share_list li span{display:inline-block; width:50px; line-height:50px; border-radius:50px; margin-bottom:10px; padding:10px}
#share_popup .modal-body .share_list li:nth-child(1) span{background-color:#3c82fe}
#share_popup .modal-body .share_list li:nth-child(2) span{background-color:#ffeb3b}
/* #share_popup .modal-body .share_list li:nth-child(3) span{background-color:#888888} */
#share_popup .modal-body .share_list li:nth-child(3) span{background-color:#475993}
#share_popup .modal-body .share_list li:nth-child(4) span{background-color:#03a9f4}
#share_popup .modal-body .share_list li p{line-height:1.2; font-size:13px;}

/*page*/
.page{text-align:center; margin-top:25px}
.page>li {
    cursor: pointer;
    display: inline-block;
    background: #fff;
    border: 1px solid #e1e4e9;
    width: 30px;
    height: 30px;
    font-size: 14px;
    line-height: 28px;
    color: #666;
    text-align: center;
}

.page>li.sel {
    background: #000;
    color: #fff;
    font-weight: 700;
    text-decoration: underline;
}
.page>li a{display:block; width:100%; height:100%}
#footer{padding:20px 20px 130px 20px; font-size:14px; background-color:#fff}
#footer ul{padding-top:10px}
#footer ul li:nth-child(1){color:#5aa3f2; font-weight:bold}
#footer em{font-size:12px; color:#888; font-style:normal; display:block; padding-top:10px}
.footer_btns{padding-top:10px}
.footer_btns a{display:inline-block; color:#333; font-size:16px;  ;position:relative; border-bottom:1px solid #333;}
.footer_btns a:after{display:block; content:''; width:1px; height:15px; position:absolute; top:0; bottom:0; right:0; margin:auto; background-color:#333}
.footer_btns a:last-child:after{display:none}
/* #quick_menu{position:fixed; right:5px; bottom:100px;}
#quick_menu ul li{width:40px; height:40px; border-radius:6px; cursor:pointer}
#quick_menu ul li:nth-child(1){ background-color:#5aa3f2; margin-bottom:8px; padding:5px}
#quick_menu ul li:nth-child(2){ background-color:#f9e000; margin-bottom:8px;}
#quick_menu ul li:nth-child(3){ background-color:#5db534} */

/* bottom_sticy */
#quick_menu{position:fixed; right:5px; bottom:100px; z-index: 99; right:10px; width:40px;  display:inline-block}
#quick_menu ul li{display:inline-block; width:40px; height:40px; border-radius:40px; margin-top:5px; box-shadow:2px 2px 3px rgba(0, 0, 0, .15)}
#quick_menu ul li.btn_tel{padding:11px; background-color:#222; }
#quick_menu ul li#btn_to_top{padding:8px; background-color:#d61518}
#quick_menu ul li.btn_login{padding:10px;background-color:#d61518;}
#quick_menu ul li.btn_naver_blog{padding:5px; background-color:#5CB433}
#quick_menu ul li.btn_kakao{    background-color: #f9e000;}
#quick_menu ul li#btn_to_top img{filter: invert(); width:100%}
#quick_menu ul li.btn_tel img{margin-top:-0; filter: invert();}
#quick_menu ul li.btn_login img{margin-left:-2px;    margin-top: -1px; filter: invert();}
.btn_login{position:relative;padding-bottom:10px}
.btn_login em{font-style:normal; font-size:10px; color:#fff; position:absolute; bottom:0; left:0; width:100%; text-align:center; font-weight:normal; letter-spacing: -0.5px; display:none}

#footer_bar{background-color:#ff0000; width:100%; position:fixed; left:0; bottom:0; z-index: 2}
.footer_bar_inner{width:100%; max-width:1000px; margin:0 auto; padding:13px 0; text-align:center}
.footer_bar_inner img{width:20px; vertical-align: middle; margin-top:-3px}
.footer_bar_inner ul{display:inline-block; margin:0 6px}
.footer_bar_inner ul li{display:inline-block; color:#fff; position:relative; padding-right:16px}
.footer_bar_inner ul li:after{display:block; content:''; width:2px; height:16px; background-color:#fff; opacity: .8; position:absolute; top:2px; bottom:0; right:6px; margin:auto;}
.footer_bar_inner ul li:last-child{padding-right:0}
.footer_bar_inner ul li:last-child:after{display:none}
.footer_bar_inner ul li a{color:#fff; font-weight:bold}
.footer_bar_inner ul li:nth-child(2) a{color:#ffc700; }
.footer_bar_inner ul li:hover a{color:#ffc700; }

footer p.addr label{font-weight:bold; display:inline-block; margin-right:5px}

/**********************************************************************/
.modal{position: fixed; left:0; top:0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .6); z-index: 100; user-select: none; display:none}
.modal-dialog{ position:fixed; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0);  width: auto;  margin: auto;  height: auto;  background-color: #fff;
               text-align: center; box-sizing: border-box; z-index: 9999; border-radius: 3px; box-shadow: 3px 5px 5px rgb(0 0 0 / 20%);  padding: 15px; width:90%; max-width:1200px}
h4.modal-header{font-size:19px; font-weight:normal; margin-bottom:8px; padding:0 0 15px 0}
.modal-bottom{margin-top:15px;}
.modal-bottom .btn{width:150px; height:35px; line-height:32px; font-size:14px;}

.modal-body{max-height:80vh; overflow:auto}
.modal-body img{max-width:100%}
#jabibudam_popup .modal-dialog{width:1300px}
#jabibudam_popup .modal-body{padding:20px 0}
#jabibudam_popup .modal-body:after{display:block; content:''; clear:both}
#jabibudam_popup .table_area{display:inline-block; width:49%; margin-right:2%; float:left}
#jabibudam_popup .table_area h5{    font-size: 16px;
    font-weight: normal;
    text-align: left;
    padding-bottom: 5px;}
#jabibudam_popup .table_area:nth-child(2){margin-right:0}
#jabibudam_popup table{width:100%}
#jabibudam_popup table tbody tr td:nth-child(1){text-align:left}
#jabibudam_popup table tbody tr td:nth-child(2){text-align:right}
#jabibudam_popup .modal-header .btn_urllink{display: inline-block; font-size: 13px; padding: 3px 10px; vertical-align: top; margin-left: 5px; border-radius: 3px; margin-top: 3px;}

#consult_apply_popup .modal-dialog{width:310px}
#consult_apply_popup .modal-body{padding-top:0}
#consult_apply_popup .modal-body p{text-align:left}
#consult_apply_popup .modal-body p span{display:block; margin-top:5px; font-size:13px}
#consult_apply_popup .modal-body p strong{display:block; font-size: 17px; text-align: center;}
#consult_apply_popup .modal-body p strong img{width:50px; margin:0 auto 10px; display:block;}
.consult_apply_btns{margin:10px 0 0}
.consult_apply_btns:after{display:block; content:''; clear:both}
.consult_apply_btns li{width:32.5%; margin-right:1%; display:inline-block; cursor:pointer; float:left;
    border-radius: 3px;
    background-color: #4eaaff;
    color: #000;
    display: inline-block;
    padding: 5px 0 0;
    font-size: 12px; height:45px}
.consult_apply_btns li:last-child{margin-right:0}
.consult_apply_btns li:nth-child(1){color:#fff}
.consult_apply_btns li:nth-child(1) img{filter:invert(1);}
.consult_apply_btns li:nth-child(2){background-color: #ffeb3b; color:#3e2723}
.consult_apply_btns li:nth-child(3){color:#fff;line-height:30px}
.consult_apply_btns li img{height:15px; border:0; display:block; margin:0 auto}


/* #class_apply_popup table td{padding:5px}
#class_apply_popup table td input{border:1px solid #e5e5e5; height:100%; outline:none; display:inline-block; vertical-align: middle; height:30px; line-height:30px;padding:0 3px}
#class_apply_popup table tr:nth-child(1) td input{width: 265px;}
#class_apply_popup table tr:nth-child(3) td{background-color:#f8f8f8; font-size:11pt; text-align:center}
#class_apply_popup table .agreement_text{padding:10px}
#class_apply_popup table .agreement_text p{padding:0 0 8px 10px}
#class_apply_popup table .agreement_text *{max-width:100%}
#class_apply_popup .modal-bottom.btn_wrap .btn{width:100px}
#class_apply_popup .modal-dialog{width:90%; max-width:800px}
#class_apply_popup .modal-dialog table{width:100%} */

#class_apply_popup .modal-dialog{width:90%; max-width:1000px}
#class_apply_popup table tr:nth-child(3) td{background-color:#f8f8f8; font-size:11pt; text-align:center}
#class_apply_popup .table_area{max-height:70vh; overflow:auto; padding-top:0}
#class_apply_popup .table_area table tr td input{border-radius: 0; outline: none; border: 1px solid #ddd; height: 30px; width:31%}
#class_apply_popup .table_area table tr:nth-child(1) td:nth-child(2) input{width:100%}

#class_apply_popup ul{border: 1px solid #ddd; border-top:0}
#class_apply_popup ul:after{display:block; content:''; clear:both}
#class_apply_popup ul li{float:left; width:50%; border-top: 1px solid #ddd; height:100%;background-color: #f9f9f9;}
#class_apply_popup ul li.agreement{width:100%; }
#class_apply_popup ul li.agreement .control-label{width:100%; }
#class_apply_popup ul li.agreement ul.agreement_list{padding:8px}
#class_apply_popup ul li.agreement ul.agreement_list li{    display: inline-block;
    padding: 5px 15px;
    border-radius: 3px;
    background-color: #333;
    color: #fff;
    cursor: pointer;
    margin-right: 3px;
    font-size: 13px;
    font-family: 'notokr-regular';
    border-radius: 30px;
    display:inline-block; width:auto;
}
#class_apply_popup ul li.agreement ul.agreement_list li.not_use {
    color: #333;
    background-color: #ffe000;
}
#class_apply_popup ul li.agreement ul.agreement_list li.active {
    background-color: #5aa3f2;
    color: #fff;
}
#class_apply_popup ul li.agreement ul.agreement_list li label{display: inline-block; vertical-align: middle;}
#class_apply_popup ul li.agreement ul.agreement_list li span{font-size:13px; vertical-align: top; display:inline-block; margin-top:-1px}
#class_apply_popup ul li.agreement ul.agreement_list li .checkbox_wrap input[type="checkbox"]{margin-top:-1px}

#class_apply_popup ul li .control-label{width:100px; display:inline-block;  float:left;; height:100%; line-height:34px}
#class_apply_popup ul li .input_box{width:calc(100% - 100px); float:left; display:inline-block; background-color:#fff; padding:0 3px}
#class_apply_popup ul li .input_box input{    border: 1px solid #e5e5e5;
    height: 100%;
    outline: none;
    display: inline-block;
    vertical-align: middle;
    height: 30px;
    line-height: 30px;
    padding: 0 3px; margin:3px 0}
#class_apply_popup ul li .input_box.phonenumber input{    width: calc(33% - 10px);}
.agreement_text_wrap{width:100%; float:left; background-color:#fff}
.agreement_text{padding:8px}


#class_counsel_popup .modal-dialog{ width:auto;    min-width: 280px;}
#class_counsel_popup .modal-header{margin-bottom:0}
#class_counsel_popup .modal-body{border-top:1px solid #ddd; text-align:left; max-height:calc(90vh - 60px); overflow:auto; padding-top:15px}
#class_counsel_popup .modal-body ul li{margin-bottom:10px}
.select_class, .class_time{width:47%; display:inline-block}
/* .class_week, .student_gubun{width:60%; display:inline-block} */
#class_counsel_popup .personal_info:after{display:block; content:''; clear:both}
#class_counsel_popup .personal_info input{height:40px; line-height:40px; border:1px solid #ddd; padding:0 5px;/* width:calc(50% - 2px)*/}
#class_counsel_popup .personal_info .wish_area{width:100%; margin-top:5px}
#class_counsel_popup .personal_info .phone,
#class_counsel_popup .personal_info .name{width:49.5%; margin-right:1%; float:left}
#class_counsel_popup .personal_info .phone{margin-right:0}
.select_class, .class_time {
    width: 31%;
    display: inline-block;
}
.class_week, .student_gubun {
    width: 68.5%;
    display: inline-block;
    min-width:500px
}
.select_wish_area .input_box{margin-top:5px}
.select_wish_area .input_box:after{display:block; content:''; clear:both}
.select_wish_area .input_box .select_wrap{width:49.5%; margin-right:1%; float:left;}
.select_wish_area .input_box .select_wrap:last-child{margin-right:0}
#class_counsel_popup .select_wish_area select{height:40px; line-height:40px; border:1px solid #ddd; padding:0 5px; width:100%; background-position: 98% 50%;}
#class_counsel_popup .checkbox_wrap,
#class_counsel_popup .radio_wrap{margin-right:4px}
#class_counsel_popup .agreement p.text-left > span{font-size:13px}
#class_counsel_popup .agreement .agreement_text{background-color:#fff; border:1px solid #e5e5e5; padding:10px; font-size:13px; margin-top:10px; display:none}
#class_counsel_popup .agreement .agreement_text *{font-size:13px}
#class_counsel_popup .modal-bottom .btn{ background-color:#5aa3f2; color:#fff; height:38px}
#class_counsel_popup .modal-body ul li .control-label .agreement_toggle{display:inline-block; width:50px; vertical-align: top}


.toggleSwitch {width: 50px;height: 20px; margin-top:3px; display: block;position: relative;border-radius: 30px;background-color: #ddd; cursor: pointer; border:1px solid #ddd}
.toggleSwitch .togglebtn {width: 12px; height: 12px; position: absolute; top: 50%; left: 3px; transform: translateY(-50%); border-radius: 50%; background: #fff}
#agreement_togglebtn:checked ~ .toggleSwitch { background: #5aa3f2; border-color: #5aa3f2;}
#agreement_togglebtn:checked ~ .toggleSwitch .togglebtn { left: calc(100% - 15px); background: #fff}
.toggleSwitch, .togglebtn { transition: all 0.2s ease-in}

#button2_list .modal-header{padding:0 0 15px 0; border-bottom: 1px solid #e5e5e5;}
#button2_list .modal-body{padding:0}
#button2_list .modal-body table{border:0}
#button2_list .modal-body table tbody td{padding:0}
#button2_list .modal-body table tbody tr:nth-child(1) td{border-top:0}
#button3_list .modal-header{padding:0 0 15px 0; border-bottom: 1px solid #e5e5e5;}
#button3_list .modal-body{padding:0}
#button3_list .modal-body table{border:0}
#button3_list .modal-body table tbody td{padding:0}
#button3_list .modal-body table tbody td img{width:100%}
#button3_list .modal-body table tbody tr:nth-child(1) td{border-top:0}
#button4_list .modal-header{padding:0 0 15px 0; border-bottom: 1px solid #e5e5e5;}

.editor_timetable_top{text-align:left; margin-bottom:10px}
.editor_timetable_list{display:inline-block}
.editor_timetable_list li{background-color: #fbe5d6; color: #000; border-radius: 6px; margin-right: 3px; width: auto; padding: 0 8px; font-size:12px; height:25px; line-height:22px}


/* free_template */
.flyform .agreement_text_wrap{text-align:left}
.flyform .agreement_text_wrap *{font-size: 13px;    color: #000;}
.flyform .agreement_text_wrap .agreement_text{padding:0}

.noDataDiv {
  margin: 60px auto 60px;
}

.noData{
  font-size: 29px;
    color: #454545;
    line-height: 1.4;
    text-align: center;
    margin: 10px;
}

.ment {
  text-align: center;
  margin: 0px 0 30px;
  font-size: 30px;
  font-weight: bold;
  color: white;
  background: #5aa3f2;
  padding: 30px 20px 30px;
}

.headDiv {
  display: flex;
  align-items: center;
}

.distanceDiv {
  width: 100%;
  text-align: right;
  align-self: flex-start;
}

#locationMessage { 
  text-align: right;
  color: grey;
  font-size: 12px;
  margin-bottom: 10px;
}

.offlineDiv {
  text-align: right;
}

.titleBottom {
  display: flex;
  justify-content: space-between;
}

.keyCardKindBox {
    border-radius: 3px;
    font-weight: normal;
    font-size: 12px;
    width: auto;
    display: inline-block;
    height: 20px;
    line-height: 20px;
    padding: 0 8px;
    vertical-align: top;
    margin-right: 3px;
    border: solid 1px grey;
    color: black;
}

@media (max-width:1024px){
  /* #wrap{max-width:90%; padding-top:50px} */
  #wrap{max-width:90%;}
  .banner_slide{}
  #class_lists{width:100%}
  #class_lists li.class_list{padding:15px}
  #class_lists li.class_list dl.study_box1 dt h3{font-size:15px}
  #class_lists li.class_list dl.study_box1 dt h3 span{ line-height:1.4}
  #class_lists li.class_list dl.study_box1 dt h3 .chip{margin-top:0}
  .class_lists_{width:100%}
  .class_lists_ li.class_list{padding:15px}
  .class_lists_ li.class_list dl.study_box1 dt h3{font-size:15px}
  .class_lists_ li.class_list dl.study_box1 dt h3 span{ line-height:1.4}
  .class_lists_ li.class_list dl.study_box1 dt h3 .chip{margin-top:0}
  .study_box1{width:calc(100% - 200px)}
  .study_box2{width:200px}
  .hash_tags .tag{font-size:10px}

  #class_counsel_popup .modal-dialog{width:100%; max-width:90%; max-height:90vh}
  .select_class, .class_time{width:100%}
  #class_schedule #class_lists li dl.study_box2 .btn_lists li{font-size:12px; line-height:25px}
  .modal-dialog{max-width:90%}
  .ment { font-size: 25px; }
  
}

@media (max-width:812px){
  .select_box li:after{display:block; content:''; clear:both}
  .select_box li:nth-child(1) select.select1 {width:33%; margin-right:0.5%; float:left; line-height: 40px; font-size: 13px}
  .select_box li:nth-child(1) select.select1:last-child{margin-right:0}
  .select_box li:nth-child(2) #header{margin-top:5px}
  .btn_details{margin-top:0}
  .details_box{padding:15px}
  #container .contents .details_box dt{font-size:16px}
  .det_lis{margin-bottom:20px}
  .det_lis:nth-child(5) .det_select select.select2,
  .det_btn>input[type="radio"]+span, .det_btn>input[type="checkbox"]+span{font-size:13px; height:30px; line-height:30px; }
  .det_ul>li{min-width:60px; margin-bottom:5px}
  #class_counsel_popup .modal-body ul li{width:100%; min-width:0}

    .study_box1, .study_box2 { width: 100%}
    .study_left.study_box2:before,
    .study_left.study_box1:after{display:none}
  #class_lists li.class_list dl{padding-left:0; padding-right:0}
  .class_lists_ li.class_list dl{padding-left:0; padding-right:0}
  .study_box2:before{display:none}
  /* #class_lists li.class_list dl.study_box1 dt h3{margin:8px auto 15px} */
  #class_lists li.class_list dl.study_box1 dt h3{margin: 8px 8px 8px 0;}
  #class_lists li.class_list .class_detail_info li:before{top:8px; bottom:auto; display:none}
  #class_lists li.class_list .class_detail_info li strong{vertical-align: top;width:53px}
  /* #class_lists li.class_list .class_detail_info li p{width:calc(100% - 130px);display:inline-block} */
  .class_lists_ li.class_list dl.study_box1 dt h3{margin:8px auto 15px}
  .class_lists_ li.class_list .class_detail_info li:before{top:8px; bottom:auto}
  .class_lists_ li.class_list .class_detail_info li strong{vertical-align: top; width:70px}
  .class_lists_ li.class_list .class_detail_info li p{width:auto; max-width:calc(100% - 130px);display:inline-block}
  .btn_recruit{margin:5px auto; background-color:#5aa3f2}
  .class_detail_info li:last-child a.btn {padding: 0px 5px 2px;font-size: 11px}
  .class_detail_info li, .class_detail_info li.half-width .mng_info{font-size:12px;}
  #class_lists li.class_list .class_detail_info li strong .btn{margin-top:3px}
  .class_lists_ li.class_list .class_detail_info li strong .btn{margin-top:3px}
  .class_detail_info li .address{width:calc(100% - 61px)}
  .fixed_banner img.icon_click{top:auto; width:30px; bottom:-5px}
  .ment { font-size: 25px; }
}

@media (max-width:768px){
  .banner2{padding:16px 0}
  .banner2 img{max-height:40px}
  .mo_hide{display:none !important}
  .pc_hide{display:inline-block !important}
  .class_detail_info li.mo_hide{display:none}
  .class_detail_info li.pc_hide{display:inline-block}
  .banner_inner .pc_hide{display:none !important}

  .mobile_btn_bottom .btn{
    background-color: #5aa3f2;
    border-radius: 3px;
    font-weight: normal;
    font-size: 12px;
    width: auto;
    display: inline-block;
    height: 20px;
    line-height:18px;
    padding: 0 8px;
    vertical-align: top;
    color:#fff;
    margin-top:5px;
    border:0; margin-right:5px;
    float:left;
  }
  .mobile_btn_bottom .btn_class_apply{background-color:#ff0000}
  .mobile_btn_bottom .btn:last-child{margin-right:0}
  /* #class_lists li.class_list .class_detail_info li p{width:100%} */



  .study_box1, .study_box2,
  #class_lists li.class_list dl.study_box1 dt, .class_lists_ li.class_list dl.study_box1 dt{width:100%}
  .btn_show_map{margin-top:0}
  .modal-dialog{max-width:90%; width:90%}
  #class_lists li.class_list dl{padding-left:0; padding-right:0}
  .study_box1:after{display:none}
  .class_lists_ li.class_list dl{padding-left:0}
  .select_box{display:block}
  #header ul li{margin:0}
  #header ul li.fshrink{width:auto;}
  .search_order {margin-top: 4px;}
  hr{width:100%}
  .class_detail_info li:nth-child(5){width:100%}
  .class_detail_info li.half-width{width:50%; float:left}
  .class_detail_info li:last-child{min-width:100%; float:left}

  .class_detail_info li{width:100%}
  #container .contents dd.btn_wrap#btn_sldupdown{display:inline-block; font-size:13px; cursor:pointer; border-bottom:1px solid #000; font-weight:bold; position:absolute; bottom:6px; right:0}
  .study_box2{padding-top:10px}
  #class_lists li.class_list dl.study_box2{display:none}
  .class_detail_info li .btn_class_apply{display:inline-block}
  .class_detail_info li .btn.btn_call{font-weight:normal}
  .class_detail_info li .btn{width:85px}
    .class_detail_info li, .class_detail_info li.half-width .mng_info{font-size:13px;}
  .fixed_banner img.icon_click{display:none}
  #class_counsel_popup .personal_info input{width:calc(50% - 2px)}
  .class_lists_ li.class_list .class_detail_info li p{max-width:none}
  .ment { font-size: 20px; }

}

@media (max-width:768px) and (min-width:415px){
  .study_box2 .cost:after{display:block; content:''; clear:both}
  .study_box2 .cost li{width:49%; margin-right:2%; float:left;}
  .study_box2 .cost li:nth-child(2){margin-right:0}
  .study_box2 .btn_lists{margin-top:10px}
  .study_box2 .btn_lists li{width:32%; margin-right:2%; float:left}
  .study_box2 .btn_lists li:nth-child(3n){margin-right:0}
  .banner1 {padding: 19px 0 18px}
  .fixed_banner p{font-size:10px}
  .fixed_banner h3{font-size:19px}
  #header ul li.fshrink{width:auto;}
  .banner2{padding:10px 0}
  .banner2 img{max-height:50px}
  select{padding-right:30px}
  .fixed_banner, #fixed_header{height:60px}

}

@media (max-width:640px){
  #class_lists li.class_list dl{padding-right:0}
  .study_box1:after{display:none}
  .class_detail_info li{width:100%}
  .banner2 img.banner_img{display:block; float:none; margin:0 auto}
  .fixed_banner p{display:none}
  input.searchtt,
  .select_box li:nth-child(1) select.select1,
  .select_box li:nth-child(2) #header,
  .search_order select.select1{height:25px; line-height:25px; border-radius:3px; font-size:12px}
  #header ul li.fshrink{width:auto; margin-bottom: 0;}
  ul.serach_box>li.search_li img {margin-top: 10px; width: 16px;} 
  .btn_details { margin-top: 0; height: 25px; line-height: 25px; font-size: 13px; border-radius: 3px; width: 80px}
  #container .contents > dd:nth-child(2){margin-top: 10px;}
  .noData{
    font-size: 20px;
  }
  

}
@media (max-width:500px){
  #locationMessage { 
    text-align: center;
    color: grey;
    font-size: 10px;
    margin-bottom: 10px;
  }
  .banner_inner .pc_hide{display:block !important}
  hr{width:100%; margin:8px auto}
  .select_box:after{display:block; content:''; clear:both}
  select.select1 {width:33%; margin-right:0.5%; float:left; line-height: 40px; font-size: 13px}
  select.select1:last-child{margin-right:0}
  .select_box{display:block}
  .select_box li{margin-bottom:8px; display:inline-block}
  .select_box > li:nth-child(1){width:100%}
  .select_box .det_ul>li{float:none}
  .select_box > li:nth-child(2){float:right; width:auto; margin:0}
  .select_box li:nth-child(2) #header{padding:0; background-color:transparent; height:34px; line-height:34px}
  /* ul.serach_box{display:inline-block; } */
  ul.serach_box{background-color: white; border-radius: 3px; }
  .searchtt::placeholder {
    padding-left: 10px; /* 원하는 여백의 크기 */
  }


  /* .select_box li:nth-child(2) .serach_box li{display:none} */
  .select_box li:nth-child(2) .serach_box li:last-child{display:block}
  .select_box li:nth-child(2) .serach_box li .btn_details{margin-top:5px; height:25px; line-height:23px; border-radius:6px; width:auto; padding:0 4px}
  .select_box li:nth-child(2) .serach_box li .btn_details{display: inline-block;
      background: #fff;
      color: #000;
      border:1px solid #ccc; font-size:12px}
  .select_box li:nth-child(2) .serach_box li .btn_details img{filter: invert(1); margin-top:-3px}
  .det_lis:nth-child(4),
  .det_lis:nth-child(5){width:calc(50% - 3px)}
  .det_lis:nth-child(5) .det_select li{margin:0}
  dl.contents dd:nth-child(2){position:relative;}
  .search_order {position:absolute; bottom:31px; left:0; width: 130px; margin-top:0}
  .search_order li{width:100%}
  .search_order li select{width:49.5%; margin-right:1%; float:left}
  .search_order li select:last-child{margin-right:0}
  #container .contents > dd:nth-child(1){padding-bottom:26px}
  select.select1, .search_order li select{border-radius:6px}
  .details_box{ width:100%}
  p.a_c .btn{width:32%}
  .title_bottom{position:relative;}
  .btn_jipche{position:absolute; top:0; right:0}

  /* .hash_tags{width:100%} */
  .hash_tags .tag{font-size:12px}
  .class_detail_info li.half-width{width:100%}
  #jabibudam_popup .modal-body{padding:0}
  #jabibudam_popup .table_area{width:100%; margin-right:0}
  #jabibudam_popup .table_area:nth-child(2){margin-top:12px}
  #jabibudam_popup .table_area h5{    font-size: 14px}
    .class_detail_info li:nth-child(5){width:100%}
    .study_box1:after{display:none}
  #class_apply_popup ul li{width:100% !important}
  #class_apply_popup ul li .input_box.phonenumber input { width: calc(33% - 10px) !important}
  #class_apply_popup ul li .control-label{max-width:48px; font-size:14px}
  #class_apply_popup ul li.agreement .control-label{max-width:100%}

  #class_apply_popup ul li .input_box{width:calc(100% - 48px) !important}
  .ment { font-size: 18px; }

}
@media (max-width:414px){
  /* .strongMobile {
    width: 100%;
  } */
  #fixed_header,.fixed_banner{height:60px}
  #fixed_header{padding:15px 0}
  .header_inner {width:96%; margin:0 auto}
  #fixed_header .banner_btns{bottom:5px; right:5px}
  .lms_logo2{height:30px; margin-top:0}
  #fixed_header .banner_btns .btn{margin-left:0; font-size:10px}
  #fixed_header .banner_btns .btn_go_login{padding-right:5px}
  .noData { font-size: 20px;}
  #wrap{max-width:100%; width:100%; margin:0; padding: 10px;}
  .fixed_banner h3{font-size:16px}
  .fixed_banner .close { right: 8px; top: 8px; width: 15px; height: 15px}
  .fixed_banner .btn{font-size:12px}
  .fixed_banner .banner_btns .btn img{width:11px}
  .banner2{padding:10px 0}
  .banner2 img { height:37px}
  .banner2 .lms_logo {display:none}

  .select_box li:nth-child(2) .serach_box li .btn_details{margin-top:0}
  .det_lis:nth-child(4), .det_lis:nth-child(5){width:100%}
  .select_box li:nth-child(2) #header{margin-top:0}
  .select_box > li:nth-child(2){height:30px; width: 50%;}

  .study_box1, .study_box2{width:100%}
  ul.cost li strong,
  ul.cost li{font-size:12px}
  .study_box2 .btn_lists li{font-size:13px}
  .class_detail_info li:before{top:9px; bottom:auto;}
  .class_detail_info li strong{display:block; text-align:left}
  .class_detail_info li:last-child .btns{margin-top:5px; display:block; margin-left:-8px; width:calc(100% + 8px)}
  .class_detail_info li:last-child .btns:after{display:block; content:''; clear:both}
  .class_detail_info li:last-child .btns a.btn{width:30%; margin-right:1%; float:left; padding:2px 0 3px; text-align:center}
  .class_detail_info li:last-child .btns a.btn:last-child{width:36%; margin-right:0}

  select{padding-right:20px; padding-left:10px}
  input.searchtt{font-size:14px; padding-left:10px;}
  header{height:45px; line-height:45px}
  .btn_details {font-size: 13px;width: 90px;margin-top:6px;vertical-align: top;height: 34px;line-height: 34px}
  ul.serach_box>li.search_li{padding:0 10px}
  ul.serach_box>li.search_li img{margin-top: 8px;width: 20px;}
  #container .contents dt{font-size:15px}
  .hash_tags .tag{height:20px; line-height:18px}
  .btn_jipche {
      padding: 2px 10px 4px;
      height: auto;
      line-height: initial;
      border-radius: 6px;
      font-size: 12px;
  }
  .class_detail_info li .address .btn_show_map{position:relative;}
  #container .contents dt span{line-height:1.4}
#class_lists li.class_list dl.study_box1 dt h3{margin: 8px 8px 8px 0;}
  .class_lists_ li.class_list dl.study_box1 dt h3{margin-bottom:8px}

  #class_lists li.class_list dl.study_box1 dt{margin-bottom:8px}
  #class_lists li.class_list dl.study_box1 dt .chip,
  .class_lists li.class_list dl.study_box1 dt .chip,
  .btn_jipche{margin-top:0; padding:0 8px; border-radius:3px; font-size:11px}
  #class_lists li.class_list .class_detail_info li{font-size:12px; padding-left:0; width: 100%;}

  #class_lists li.class_list .class_detail_info li strong{display:inline-block; width:100%; font-size:12px}
  /* #class_lists li.class_list .class_detail_info li strong{display:inline-block; width:45px; font-size:12px} */
  .class_detail_info li .address { width: calc(100% - 53px)}
  #class_lists li.class_list .class_detail_info li.cost strong{font-size:12px; width:100px; color:#000}
  #class_lists li.class_list .class_detail_info li.cost p{width:calc(100% - 110px); color:#000; font-weight:bold}
  .class_detail_info li .btn {
      width: 80px;
      font-size: 10px !important;
      font-weight: normal;
  }
  .class_lists_ li.class_list dl.study_box1 dt{margin-bottom:8px}
  .class_lists_ li.class_list .class_detail_info li strong{display:block}
  /* .class_lists_ li.class_list .class_detail_info li p{width:calc(100% - 90px)} */
  .class_lists_ li.class_list .class_detail_info li.cost strong{font-size:12px; width:100px; color:#000}
  .class_lists_ li.class_list .class_detail_info li.cost p{width:calc(100% - 110px); color:#000; font-weight:bold}

  #container .contents dt p.btn_recruit span{line-height:2.5}

  #class_schedule #class_lists li.class_list:nth-child(1){margin-top:44px}
  .class_detail_info li:nth-child(4) a.btn{padding:0}
  .footer_bar_inner ul li a{font-size:13px}
  .footer_bar_inner img {
    width: 18px;
    margin-top: -2px;
  }


  #class_counsel_popup .modal-body{padding:0; border:0}
  #class_counsel_popup .modal-body ul li .control-label{font-size:14px}
  #class_counsel_popup .checkbox_wrap span,
  #class_counsel_popup .radio_wrap span {font-size: 13px; display:inline-block; vertical-align: top; margin-top:5px}
  #class_counsel_popup .modal-body ul li.gukbi .input_box .radio_wrap{display:block; text-align:left}
  /* #class_counsel_popup .gukbi .input_box .radio_wrap{width:100%; display:block} */

  #class_counsel_popup .select_wish_area select,
  #class_counsel_popup .personal_info input{font-size:13px}

#footer{font-size:13px; padding:10px 10px 120px 10px}
.footer_bar_inner{padding:2px 0 6px 0}
.footer_btns a:after{display:none}

#quick_menu{bottom:50px}
#quick_menu ul li {
    width: 30px;
    height: 30px;
}


.class_detail_info li.half-width .mng_info{font-size:12px}
#class_schedule #class_lists li.class_list p.edu_type { margin: -40px 0 0 -14px; padding-bottom:10px}
#class_schedule #class_lists li.class_list p.edu_type span{font-size:13px}
dl.study_box1 dt .btn_share{top:10px}

#footer p.mo_img{font-size:11px}
#footer p.addr{margin-top:10px; font-size:11px}
footer p.addr label{font-weight:normal; }
#footer p.addr br{display:none}
#footer ul li,
#footer em{font-size:11px}
#locationMessage {font-size: 13px;}
}


#callLink {
  color: white;
  font-weight: bold;
  font-size: large;
}
@media (max-width:390px){
  .fixed_banner .banner_inner{max-width:90%}
    .class_detail_info li:last-child .btns a.btn{margin:5px 0 0 0; min-width:100%;padding:0; height:30px; line-height:30px}
    h4.modal-header{font-size:16px}
    .modal-dialog  .close{top:18px}
    .modal-dialog table th{font-size:13px; min-width:60px; padding-right:0; padding-left:0}
    .modal-dialog table td{font-size:13px}
    #class_apply_popup table tr:nth-child(1) td input{width:100%}
    #class_apply_popup table tr:nth-child(2) td input{width: 32.2%;}
    #class_apply_popup table tr:nth-child(2) td b{display:none}
    .modal-bottom .btn{font-size:13px; width:49%}
    #class_schedule #class_lists li.class_list:nth-child(1){margin-top:45px}
    #btn_sldupdown {font-size: 12px; bottom: 5px}
    #container .contents dd.btn_wrap#btn_sldupdown{font-size:12px}
    .noData { font-size: 18px;}
    .ment { font-size: 18px; }

}
@media (max-width:375px){
  .banner2 img { max-height: 40px; height:100%}
  select.select1{max-width:100%; width:100%; margin-bottom:5px}
  select {background: #fff url(../img/icon_arrow2.png) no-repeat 95% 50%;}
  .footer_bar_inner{max-width:90%}
  .footer_bar_inner img{display:none}
  .footer_bar_inner ul{margin:0}
  .hash_tags{line-height:1; margin-bottom:5px; margin-top:0}
  .hash_tags em.tag{font-size:11px}
  #class_lists li.class_list dl.study_box1 dt{margin-bottom:8px}
  .class_lists_ li.class_list dl.study_box1 dt{margin-bottom:8px}
  .class_detail_info li strong{font-size:13px}
  .class_detail_info li{margin-bottom:4px; font-size:13px}
  .details_box{padding:20px}
  .det_lis>dt{font-size:16px}

  .search_order{bottom:24px}
  .select_box li:nth-child(1) select.select1{margin-bottom:0}

}

@media (max-width:360px){
  #wrap{padding:50px 20px 20px}
  .select_box li:nth-child(2n) .select1{width:49%; margin-right:2%; float:left; margin-bottom:0}
  .select_box li:nth-child(2n) .select1:nth-child(2n){margin-right:0}
  .select_box > li:nth-child(2n){margin-bottom:0; width: 63%;}
  .select_box li:nth-child(2n):after{display:block; content:''; clear:both}
  .det_lis:nth-child(5) .det_select select.select2, .det_btn>input[type="radio"]+span, .det_btn>input[type="checkbox"]+span{font-size:12px}
  .search_order select.select1{margin-bottom:0}
  /* #class_lists li.class_list .class_detail_info li p{width:100%} */
  .footer_bar_inner ul li a {font-size: 12px}

  .footer_btns a{padding-right:0; margin-right:0; font-size:16px}

  #class_lists li.class_list {padding: 10px}
  .mobile_btn_bottom .btn{padding:0 4px; margin-right:2px}
  .search_order {bottom: 30px}
  #class_schedule #class_lists li.class_list p.edu_type{margin:-35px 0 0 -10px}
  #container .contents > dd:nth-child(2){margin-top:-43px}


}
@media (max-width:320px){
    .fixed_banner, #fixed_header{height:45px}
    .mo_view{display:block}
    .fixed_banner .banner1{padding:7px 0 10px}
    .fixed_banner .banner1 h3{font-size:13px; margin-top:0}
    .banner2{padding:10px 10px 0 0}
    .banner2 img { max-height: 26px; height:100%}
    .lms_logo2 {height:25px}
      #class_apply_popup ul li .input_box.phonenumber input { width: calc(33% - 9px) !important}
    .noData { font-size: 13px;}
    .noDataDiv { margin: 80px auto 60px; }
    .ment {padding: 20px 10px 20px;}
}
@media (max-width:280px){
  body{padding:0}
  #wrap{padding: 40px 10px 10px;}
  #class_apply_popup table tr:nth-child(2) td input {width: 31.9%}
  .select_box > li:nth-child(2n){margin-bottom:0; width: 60%;}
  .mobile_btn_bottom .btn{font-size: 11px;padding: 0 4px;}
  input.searchtt{font-size:12px; padding-left:10px;}
  .noData { font-size: 12px;}

}