@charset "utf-8";

@font-face {
  font-family: 'NanumSquareRound';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRound.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}


/* 공통 구조
**********************************************/
.only_pc { display: block;}
.only_mobile { display: none;}

/* Global */
body {overflow-x: hidden;}
.area { position: relative; width:1200px; margin: 0 auto;}

/* Container */

/* GNB */
.header { position: absolute; left: 0; top: 0px; z-index: 10; width: 100%; padding: 20px 0;background:#1e5df8;}
.header.index{top: 44px;background:transparent;}
.header.active { position: fixed; top: 0; background:#1e5df8;}
.header .area { clear: both; overflow: hidden;}
.header h1 { float: left;}
.header h1 a { display: block; padding-top: 4px; line-height: 0;}
.header .nav { float: right;}
.header .gnb { clear: left; overflow: hidden;}
.header .gnb li { float: left;}
.header .gnb li a { display: block; position: relative; margin: 0 33px; padding: 10px 5px; font-size: 15px; font-weight: 800; color: #fff; }
.header .gnb li a::after { content: ''; position: absolute; left: 0; bottom: 7px; width: 0; height: 3px; background-color: #3cfbb6; transition: all .3s ease;}
/* .header .gnb li a.active { color: #3cfbb6;} */
.header .gnb li a.active::after {  width: 100%;}
.header .gnb li a:focus-visible{outline: none;}

.logo_header{position: absolute;top: 0;left: 0;width: 100%;height:103px;display: flex;align-items: center;justify-content: center;background: #FFF;box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.08);border-bottom: 1px solid #ddd;}
.logo_header .logo_header_inner{}
.logo_header .mlive_logo{width:91px;}
.logo_header .mpay_logo{width:93px;}

/* 푸터 */
.footer { padding: 37px 0; background-color: #292d35;}
.footer .links a { display: inline-block; font-size: 13px; color: #fff;}
.footer .links a.color_blue { color: #05d8c9;}
.footer .links span { margin: 0 16px; font-weight: 400; color: #fff;}
.footer .question { margin-top: 34px; font-size: 18px; color: #fff;}
.footer .question span { color: #05d8c9;}
.footer .adress-group { margin-top: 32px; font-weight: 400; color: rgba(255,255,255,0.7);}
.footer .adress-group p { line-height: 1.6;}
.footer .apps { position: absolute; right: 0; top: 40px;}








/* 공통 STYLE
**********************************************/
/* 정렬 */
.text_left { text-align:left !important;}
.text_center { text-align:center !important;}
.text_right { text-align:right !important;}
/* Float */
.float-group { clear: both; overflow: hidden;}
.float-group .left { float: left;}
.float-group .right { float: right;}
/* Visibility */
.visibility { visibility:hidden; width: 0; height: 0;}
.visibility * { height:0;}
.visibility p { display: none;}
/* 밑줄 */
mark { color: inherit; background-color: transparent;}
.mark { position: relative;}
.mark span { position: relative; z-index: 1;}
.action .mark i { display: block; position: absolute; left: 0; bottom: 2px; width: 0; height: 17px; background: linear-gradient(to right,  #05dac8 0%,#3db0f1 100%); animation: textSpan .3s 1s ease forwards;}
@keyframes textSpan {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
/* 공통 텍스트 */
.text_sub { font-size: 13px; color: rgba(0,0,0,0.6);}
.text-group { margin-top: 35px;}
.text-group::after { display:block; clear:both; visibility:hidden; height:0; content:'.';}
.text-group .text_lh { line-height: 1.74;}
.text-group ul { clear: left; overflow: hidden; margin-top: 22px;}
.text-group ul li { float: left; padding: 0 13px; text-align: center;}
.text-group ul li:first-child { padding-left: 0;}
.text-group ul li figcaption { font-size: 13px; color: rgba(0,0,0,0.7); line-height: 1.3;}
h3.title { font-size: 44px; font-weight: 800;}
h3.title i { height: 22px;}
/* 메인 App Icons */
.apps { margin-top: 25px; padding-left: 20px;}
.apps a { display: block; float: left; width: 160px; height: 50px; margin-right: 10px; padding-top: 16px; text-align: center; border: 1px solid #eee; background-color: #fff; border-radius: 11px; transition: all .3s ease;}
.apps a:hover { box-shadow: 0 8px 8px rgba(0, 0, 0, .1);}
.apps a img { margin: 0 auto;}
.apps a:hover { border: 1px solid #1e5df8; background-color: #1e5df8;}
.apps a .android { width: 105px; height: 19px; margin: 0 auto; background: url(/land/images/main_android.png) no-repeat;}
.apps a:hover .android { background-position: 0 -19px;}
.apps a .ios { width: 88px; height: 17px; margin: 0 auto; background: url(/land/images/main_ios.png) no-repeat;}
.apps a:hover .ios { background-position: 0 -17px;}
/* sub_section  */
.sub_section .delay { position: relative; top:30px; opacity: 0; transition:all 0.6s ease;}
.sub_section.action .mark i { animation-delay: 1.6s;}
.sub_section.action .speed1 { top: 0; opacity: 1;}
.sub_section.action .speed2 { top: 0; opacity: 1; transition-delay: 0.2s;}
.sub_section.action .speed3 { top: 0; opacity: 1; transition-delay: 0.4s;}
.sub_section.action .speed4 { top: 0; opacity: 1; transition-delay: 0.8s;}
.sub_section.action .speed5 { top: 0; opacity: 1; transition-delay: 1s;}
.sub_section.action .speed6 { top: 0; opacity: 1; transition-delay: 1.2s;}
.sub_section.action .speed7 { top: 0; opacity: 1; transition-delay: 1.4s;}
/* 이미지 라디오 */
.comm_radio { display:none; overflow: hidden; position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; clip: rect(0, 0, 0, 0);}
.comm_radio +label { display: inline-block; height:20px; padding-left: 32px; line-height: 22px; background: url(../images/comm_radioB_2x.png) no-repeat;background-size: 20px 40px; cursor: pointer;}
.comm_radio:checked + label { background-position: 1px -20px;}






/* Split
**********************************************/
i.split, i.icon { display: inline-block; vertical-align: middle;}
i.program1 { width:68px; height:58px; background: url(../images/main_program_icon.png) no-repeat;}
i.program2 { width:70px; height:69px; background: url(../images/main_program_icon2.png) no-repeat;}
i.program3 { width:50px; height:70px; background: url(../images/main_program_icon3.png) no-repeat;}
i.program4 { width:62px; height:62px; background: url(../images/main_program_icon4.png) no-repeat;}
i.comm_width_height { width:60px; height:60px;}
i.accept1 { background: url(../images/service_small_icon.png) no-repeat;}
i.accept2 { background: url(../images/service_small_icon2.png) no-repeat;}
i.accept3 { background: url(../images/service_small_icon3.png) no-repeat;}
i.accept4 { background: url(../images/service_small_icon4.png) no-repeat;}
i.lecture1 { background: url(../images/lecture_small_icon.png) no-repeat;}
i.lecture2 { background: url(../images/lecture_small_icon2.png) no-repeat;}
i.lecture3 { background: url(../images/lecture_small_icon3.png) no-repeat;}
i.attendance1 { background: url(../images/attendance_small_icon.png) no-repeat;}
i.attendance2 { background: url(../images/attendance_small_icon2.png) no-repeat;}
i.attendance3 { background: url(../images/attendance_small_icon3.png) no-repeat;}
i.sms1 { background: url(../images/sms_small_icon.png) no-repeat;}
i.sms2 { background: url(../images/sms_small_icon2.png) no-repeat;}
i.sms3 { background: url(../images/sms_small_icon3.png) no-repeat;}
i.character1{width:70px;height:52px;background: url(../images/mlive_small_icon1_2x.png) no-repeat;background-size:70px 52px;}
i.character2{width:70px;height:52px;background: url(../images/mlive_small_icon2_2x.png) no-repeat;background-size:70px 52px;}
i.character3{width:70px;height:52px;background: url(../images/mlive_small_icon3_2x.png) no-repeat;background-size:70px 52px;}
i.teacher{width:41px;height:36px;background: url(../images/icon_teacher_2x.png) no-repeat;background-size:41px 36px;}
i.student{width:34px;height:34px;background: url(../images/icon_student_2x.png) no-repeat;background-size:34px 34px;}
i.strength1{width:44px;height:31px;background: url(../images/mlive_small_icon4_2x.png) no-repeat;background-size:44px 31px;}
i.strength2{width:38px;height:40px;background: url(../images/mlive_small_icon5_2x.png) no-repeat;background-size:38px 40px;}
i.strength3{width:42px;height:38px;background: url(../images/mlive_small_icon6_2x.png) no-repeat;background-size:42px 38px;}
i.sign{width: 16px;height: 16px;background: url("../images/icon_pencile_2x.png") no-repeat 0 0;background-size: 16px 16px;}
i.modify{width: 16px;height: 16px;background: url("../images/icon_modify_2x.png") no-repeat 0 0;background-size: 16px 16px;}
i.required{width: 14px;height: 12px;background: url("../images/icon_required_2x.png") no-repeat 0 0;background-size: 14px 12px;}
i.file{width: 24px;height: 22px;background: url("../images/icon_file_2x.png") no-repeat 0 0;background-size: 24px 22px;}
i.mpay{width: 82px;height: 28px;background: url("../images/M-pay_logo_white_2x.png") no-repeat 0 0;background-size: 82px 28px;}
i.about1{width: 80px;height: 61px;background: url("../images/mpay_small_icon1_2x.png") no-repeat 0 0;background-size: 80px 61px;}
i.about2{width: 70px;height: 61px;background: url("../images/mpay_small_icon2_2x.png") no-repeat 0 0;background-size: 70px 61px;}
i.about3{width: 87px;height: 68px;background: url("../images/mpay_small_icon3_2x.png") no-repeat 0 0;background-size: 87px 68px;}
i.document1{width: 44px;height: 51px;background: url("../images/mpay_small_icon4_2x.png") no-repeat 0 0;background-size: 44px 51px;}
i.document2{width: 44px;height: 58px;background: url("../images/mpay_small_icon5_2x.png") no-repeat 0 0;background-size: 44px 58px;}
i.document3{width: 64px;height: 44px;background: url("../images/mpay_small_icon6_2x.png") no-repeat 0 0;background-size: 64px 44px;}


/* 레이어
**********************************************/
.layer { position: fixed; left:0; top: 0; z-index: -1; overflow-x:hidden; width: 100%; height:100%; padding:20px; opacity: 0; background-color: rgba(0, 0, 0, .3); transition: all .3s ease;}
.layer.action { z-index: 100; opacity: 1;}
.layer .body { position:relative; left:50%; top:50%; z-index:100; width: 1120px; margin: -365px 0 0 -560px; padding: 84px 40px 100px; background-color: #fff; border-radius: 20px;}
.layer .layer_close { position: absolute; right: 20px; top: 20px;}
.layer .pop_title { font-size: 13px; color: rgba(0,0,0,0.6); text-align: center;}
.layer h3 { font-size: 44px; font-weight: 800; text-align: center;}
.layer h3.action .mark i { height: 22px;}
.layer h4 { font-size: 22px; font-weight: 800;}
.layer .list-group { margin-top: 30px;}
.layer .list-group >ul { clear: left; overflow: hidden; margin-left: -2%;}
.layer .list-group >ul >li { float: left; width: 23%; margin-left: 2%; padding-top: 16px; font-size: 16px; font-weight: 400; text-align: center; border-top: 2px solid #000;}
.layer .list-group >ul >li ul { margin-top: 6px;}
.layer .list-group >ul >li ul li { padding: 8px 0; font-size: 16px; font-weight: 400;}
.layer .list-group >ul >li ul li.height_1 { height: 70px;}
.layer .list-group >ul >li ul li.height_2 { height: 50px;}
.layer .list-group >ul >li ul li.height_3 { height: 70px;}
.layer .list-group >ul >li ul li.height_4 { height: 70px;}
.layer .list-group .color_blue { font-size: 14px; color: #1e5df8;}
.layer .list-group .line { margin-bottom: 8px; border-bottom: 1px solid #ddd;}
.layer .iframebody { position: relative; padding-bottom:56.25%;}
.layer .iframebody iframe { position: absolute; width: 100%; height: 100%;}








/* 메인
**********************************************/
.main { position: relative; padding-top: 48px; background: linear-gradient(to right,  #2752f2 0%,#2ec7db 100%);}
.main .box-container {max-width: 1030px;margin: 120px auto 0;padding: 0 20px;}
.main .box { position: relative; bottom:-52px; z-index: 1; height: 586px; background-color: #fff; border-radius: 33px; box-shadow:0 12px 23px rgba(0, 0, 0, .1);}
.main .icons { padding: 16px 29px; background-color: #f5f5f5; border-radius: 33px 33px 0 0;}
.main .icons span { display: inline-block; width: 8px; height: 8px; margin: 0 4px; border-radius: 50%;}
.main .icons .round-red { background-color: #ff5459;}
.main .icons .round-yellow { background-color: #ff9133;}
.main .icons .round-green { background-color: #27c232;}
.main .box-group { clear: both; overflow: hidden;padding: 0 65px 0 50px;}
.main .switch { float: left; padding-top: 60px;}
.main .switch .text { padding-left: 19px; font-size: 36px; line-height: 1.36;}
.main .switch .text.first { margin-top: -30px;}
.main .program { float: right;padding: 25px 0px 16px 0;}
.main .program h2 { font-size: 16px; font-weight: 800;}
.main .program .item { display: block; position: relative;width: 282px;height: 100px; margin-top: 10px; padding: 35px 0 0 110px; color: #000; border: 1px solid #eee; border-radius: 15px;}
.main .program .item:hover { box-shadow: 0 8px 8px rgba(0, 0, 0, .1);}
.main .program .item i { position: absolute;}
.main .program .item.i1 i { left: 28px; top: 26px;}
.main .program .item.i2 i { left: 21px; top: 15px;}
.main .program .item.i3 i { left: 34px; top: 16px;}
.main .program .item.i4 i { left: 25px; top: 18px;}
.main .program .item p { font-size: 20px;}
.main .round_icon1 { position: absolute; left: 50%; top: -49px; width: 190px; height: 190px; margin-left: 400px; border: 3px solid rgba(255,255,255,0.2); border-radius: 50%;}
.main .round_icon2 { position: absolute; left: 50%; top: 0; width: 58px; height: 58px; margin-left: -645px; border: 2px solid rgba(255,255,255,0.2); border-radius: 50%;}
.main .round_icon3 { position: absolute; left: 50%; top: 100px; width: 22px; height: 22px; margin-left: -572px; border: 2px solid rgba(255,255,255,0.2); border-radius: 50%;}
.main .bubbles{position: relative;}
.main .bg_left { position: absolute; left: 0; bottom: -6px;}
.main .bg_right { position: absolute; right: 0; bottom: -6px;}
.main .blet { margin:18px 0 0 20px; padding-left:10px; font-size:13px; color:#1e5df8; background: url(/land/images/main_icon_blet.png) no-repeat left center;}

/*section.height_fix{margin-top:-81px;padding-top:81px;}*/

.about { padding: 160px 0 75px; background-color: #eff4ff;}
.about h2 { font-size: 16px; color: #1e5df8;}
.about .title { width: 480px; font-size: 24px;}
.about .title p { margin-top: 25px; line-height: 40px;}
.about .mark i { height: 10px;}
.about .links { width: 680px; padding-top: 50px;}
.about .links li { display: inline-block; margin-left: 9px; padding: 0 0 25px;}
.about .links li a { display: block; padding: 17px 50px; font-size: 16px; color: #000; background-color: #fff; border: 1px solid #ddd; border-radius: 29px; box-shadow:0 12px 23px rgba(0, 0, 0, .1);}
.about .links li a span { color: #1e5df8;}
.about .links li:nth-child(3),
.about .links li:nth-child(4) { margin-top: -15px;}
.about .links li a:hover { color: #fff; background: linear-gradient(to right,  #06d9c9 0%,#3db0f0 100%);}
.about .links li a:hover span { color: #fff;}

.service { padding: 80px 0;}
.service .left figure { padding-left: 85px;}
.service h2 { font-size: 16px; color: #1e5df8; line-height: 1;}
.service .accept { width: 510px; padding-top: 10px;}
.service .btn_mpay{display: block;max-width: 240px;width: 100%;height: 60px;margin-top: 24px;line-height: 60px;background: #1E5DF8;border-radius: 30px;font-size: 16px;font-weight: 800;text-align: center;color: #FFF;font-family: 'NanumSquareRound';}
.service .btn_mpay i{margin-right:6px;}

.lecture { padding: 80px 0; background-color: #f7f7f7;}
.lecture .left { padding-left: 85px;}
.lecture .right { padding-right: 80px;}

.attendance { padding: 80px 0 55px;}
.attendance .left { padding: 0 0 0 80px;}
.attendance .right { width: 510px;}
.attendance .text_link { margin-top: 3px;}
.attendance .text_link a { display: inline-block; color: #1e5df8; text-decoration: underline;}
.attendance .text_gray { margin-top: 13px; color: rgba(0,0,0,0.7);}
.attendance .btns { margin: 35px 0 0 -7px; padding: 0 15px 25px;}
.attendance .btns a { display: inline-block; margin-right: 30px; color: rgba(0,0,0,0.78); vertical-align: middle;}
.attendance .btns a span { display: inline-block; width: 51px; height: 51px; margin-right: 9px; text-align: center; vertical-align: middle; border-radius: 15px; box-shadow:0 12px 23px rgba(0, 0, 0, .1);}
.attendance .btns a.google span { padding-top: 15px;}
.attendance .btns a.manual span { background: url(/land/images/attendance_sub_icon2.png) no-repeat; background-position: 16px 14px;}
.attendance .btns a:hover span { background-color: #1e5df8;}
.attendance .btns a.manual:hover span { background-position: 16px -50px;}

.sms { padding: 80px 0 75px; background-color: #f7f7f7;}
.sms .left { width: 590px; padding-left: 80px;}
.sms .right { padding-right: 80px;}
.sms table { margin-top: 22px; border-top: 2px solid #000;}
.sms table th { padding: 18px 0 10px;}
.sms table td { padding: 2px 0; text-align: center;}
.sms table tr:last-child td { padding-bottom: 16px;}
.sms table .color_blue { color: #1e5df8;}
.sms .guide { clear:both; overflow:hidden; margin-top: 10px;}
.sms .guide .plus { float:left; font-size: 12px; color: #1e5df8;}
.sms .guide .plus2 { float:right; font-size: 12px; color: rgba(0,0,0,0.5);}

.price { }
.price .price_wrap{padding: 80px 0; background-color: #1e5df8;}
.price h2 { font-size: 16px; color: #fff;}
.price .sub { margin-top: 25px; font-size: 24px; color: #fff;}
.price .sub .mark i { height: 10px;}
.price .price-group { margin-top: 75px;}
.price .price-group .addtax { margin-bottom:9px; padding-right:5px; font-weight:400; color: #fff; text-align: right;}
.price .price-group >ul{margin-left: -20px;}
.price .price-group >ul::after { display:block; clear:both; visibility:hidden; height:0; content:'.';}
.price .price-group >ul >li { float: left; width: 25%;}
.price .price-group >ul >li:first-child { margin-left: 0;}
.price .price-group >ul >li .box-group { position:relative; height: 435px;margin-left: 20px;padding: 30px 30px 0 30px; background-color: #fff; border-radius: 30px;  box-shadow:0 39px 23px rgba(0, 0, 0, .12);}
.price .price-group >ul >li .box-group a { display:block; position: absolute; left: 20px; right:20px; bottom:20px; padding:16px 0; font-size:18px; color: rgba(0,0,0,0.38); text-align:center; background-color: #eee; border: 1px solid #ddd; border-radius:30px;}
.price .price-group >ul >li .box-group a[href] { color: #fff; border:none; background: linear-gradient(to right,  #05dac8 0%,#3db0f1 100%);}
.price .price-group >ul >li h3 { font-size: 36px; font-weight: 800; text-align: center;}
.price .price-group >ul >li.basic h3 { color: rgba(0,0,0,0.5);}
.price .price-group >ul >li.business h3 { color: #05dac8;}
.price .price-group >ul >li.premium h3 { color: #1e5df8;}
.price .price-group .won { margin-top: 8px; font-size: 22px; text-align: center;}
.price .price-group .won sub { font-size: 14px; font-weight: 400; vertical-align: middle;}
.price .price-group .data_list { margin-top: 30px;}
.price .price-group .data_list dt { font-size: 16px;}
.price .price-group .data_list ul { margin-top: 10px;}
.price .price-group .data_list ul li { padding: 4px 0 4px 12px; font-weight: 400; background: url(/land/images/price_blet.png) no-repeat left center;}
.price .pc_table { margin-top: 55px; color: #fff;}
.price .pc_table th { padding-bottom: 13px; font-size: 16px; font-weight: 800; border-bottom: 1px solid rgba(255,255,255,0.5);}
.price .pc_table td { padding: 4px 0;}
.price .pc_table tr:first-child td { padding-top: 24px;}
.price .pc_table .text_left { font-size: 16px; font-weight: 700;}
.price .pc_table .text_right { font-weight: 400;}
.price .config { display: block; position:absolute; right:0; top:15px; width: 245px; padding:16px 0; font-size:18px; color:#fff; text-align: center; border: 2px solid #fff; border-radius:30px; transition: all .3s ease;}
.price .config:hover { color:#1e5df8; background-color: #fff;}

.aside { position: fixed; right: 50px; top: 150px;}
.aside .active { border: 1px solid #000;}

/* 약관 */
.privacy { padding: 40px 20px 20px; font-size: 14px; line-height: 1.5;}
.privacy h4 { margin-bottom: 20px; padding-bottom: 40px; font-size: 30px; text-align: center; border-bottom: 1px solid #ddd;}
.privacy h3 { margin: 15px 0 10px;}
.privacy p,
.privacy dl,
.privacy .depth1 { font-weight:400; letter-spacing: 0;}

.privacy table { margin: 8px 0; max-width: 1000px; margin-left: 16px; }
.privacy table th, .privacy table td{ border: 1px solid #ddd; padding: 8px; font-weight: 400; font-size: 13px; line-height: 1.4; }
.privacy table th { font-weight: 600; background-color: #f8f8f8; }

/* 무료체험 신청
**********************************************/
.exp_header {position: relative;padding: 33px 0; text-align: center; box-shadow: 0 12px 23px rgba(0, 0, 0, .1);background-color: #fff;}
.exp_header .exp_header_inner{position: relative;max-width: 1232px;margin: 0 auto;padding: 0 16px;}
.exp_header .logoutBtn{position: absolute;top: 50%;right: 16px;margin-top: -25px;padding-left: 22px;width: 103px;height: 50px;background-color: #fff;border: 1px solid #D8D8D8;border-radius: 8px;font-weight: 800;font-size: 13px;color: rgba(0, 0, 0, 0.58);font-family: NanumSquareRound, 'Sans-serif';transition: background-color 0.2s, color 0.2s, border-color 0.2s;}
.exp_header .logoutBtn:hover{background-color: #f5f5f5;}
.exp_header .logoutBtn::before{display: inline-block;content: '';position: absolute;top: 50%;left: 16px;margin-top: -9px;width: 18px;height: 18px;background: url("../images/ico_login_2x.png") no-repeat center;background-size: 18px 18px;}
.exp_con { width: 590px; margin: 0 auto; padding: 40px 0 60px;}
.exp_con .con_tab { position: relative; text-align: center;}
.exp_con .con_tab ul li { display: inline-block; width: 80px; height: 80px; margin:0px 38px; padding-top: 18px; font-size: 13px; color: rgba(0,0,0,0.38); border: 1px solid #ddd; border-radius: 50%;}
.exp_con .con_tab ul li b { display: block; font-size: 24px; color: rgba(0,0,0,0.78); line-height: 28px;}
.exp_con .con_tab ul li.active { color: #fff; background-color: #1e5df8;}
.exp_con .con_tab ul li.active b { color: #05dcca;}
.exp_con .con_tab .line { position: absolute; left: 50%; top: 40px; width: 80px; height: 1px; background-color: #ddd; transform:translate(-50%, 0);}
.exp_con h2 { margin-top: 20px; font-size: 44px; font-weight: 800; text-align: center;}
.exp_con .setp3 h2 { margin-top: 5px;}
.exp_con .t { margin-top: 25px; color: rgba(0,0,0,0.48); text-align: center; line-height: 1.7;}
.exp_con .t strong { font-weight:800; color: rgba(0,0,0,0.78);}
.exp_con .t strong.blue { color: rgba(30,93,248,0.78);}
.exp_con .consult { display: block; width: 190px; margin: 13px auto 0; padding: 8px 0; font-size: 15px; text-align: center; border: 1px solid #eee; background-color: #f5f5f5; border-radius: 19px;}
.exp_con .consult span { color: #1e5df8;}
.exp_con .action .mark i { height: 22px;}
.exp_con .exp_list li { position: relative; margin-top: 16px;}
.exp_con .exp_list li:first-child { margin-top: 30px;}
.exp_con .exp_list li .box { padding: 16px; border: 2px solid #ddd; border-radius: 10px;box-shadow: none;}
.exp_con .exp_list li .box.auth { margin: 20px -132px 0 0; background-color: #f5f5f5;}
.exp_con .exp_list li select,
.exp_con .exp_list li input[type=text],
.exp_con .exp_list li input[type=tel],
.exp_con .exp_list li input[type=email],
.exp_con .exp_list li input[type=password] { width: 100%; font-size: 16px; vertical-align: middle; border: none;font-family: 'NanumSquareRound';}
.exp_con .exp_list li input[type=email]::placeholder,
.exp_con .exp_list li input[type=text]::placeholder { color: rgba(0,0,0,0.38); letter-spacing: -0.5px;}
.exp_con .exp_list li select { margin-left: -4px;}
.exp_con .exp_list li .box >label { font-size: 13px;}
.exp_con .exp_list li .box >label i.required{margin-left: 12px;}
.exp_con .exp_list li .box >div { margin-top: 8px;}
.exp_con .exp_list li .box >div label { margin-right: 24px; color: rgba(0,0,0,0.38); vertical-align: middle;}
.exp_con .exp_list li .box >div.radio { margin-top: 10px;}
.exp_con .exp_list li .box .w_shot { width: 70px;}
.exp_con .exp_list li .box .w_shot2 { width: 135px;}
.exp_con .exp_list li .exp_search { position: absolute; right: 0; top: 0; width: 120px; height: 86px; font-size: 18px; font-weight: 800; color: #fff; background-color: #333; border-radius: 8px;}
.exp_con .exp_list li .exp_search.blur { background-color: rgba(51, 51, 51, .78);}
.exp_con .exp_list li .text {margin-top: 8px; font-weight: normal; font-size: 13px; color: rgba(0, 0, 0, 0.38);}
.exp_con .exp_list li .bb_line { margin: 0 8px; border-bottom: 2px solid #ddd !important;}
.exp_con .exp_list li.space { padding-right: 132px;}
.exp_con .exp_list li.bad .box { border-color: #ff0000; background-color: #ffe5e5;}
.exp_con .exp_list li.bad select,
.exp_con .exp_list li.bad input[type=text],
.exp_con .exp_list li.bad input[type=tel],
.exp_con .exp_list li.bad input[type=email],
.exp_con .exp_list li.bad input[type=password] { font-weight: 800; color: #ff0000;}
.exp_con .exp_list li.bad .text { display: block !important; color: #ff0000;}
.exp_con .exp_list li.bad .box >label { color: #ff0000;}
.exp_con .exp_list li.bad input[type=text]::placeholder { color: rgba(255,0,0,0.3);}
.exp_con .exp_list li.bad .http { background-color: rgba(255,0,0,0.1);}
.exp_con .exp_list li.good .text { display: block !important;color: #13b077;}
.exp_con .exp_list li.disabled .box { border-color: #D8D8D8; background-color: #F8F8FA;}
.exp_con .exp_list li.disabled .box >label{color: rgba(0, 0, 0, 0.3);}
.exp_con .exp_list li.disabled select, .exp_con .exp_list li.disabled input[type=text], .exp_con .exp_list li.disabled input[type=tel], .exp_con .exp_list li.disabled input[type=email], .exp_con .exp_list li.disabled input[type=password]{font-weight: 800;color: rgba(0, 0, 0, 0.3);}

.exp_con .btn { margin-top: 40px; text-align: center;}
.exp_con .btn button { width: 245px; padding: 17px 0; font-size: 18px; font-weight: 800; color: rgba(0,0,0,0.38); letter-spacing: -1px; border: 1px solid #ddd; background: #f5f5f5; border-radius: 30px; transition: all .2s ease;}
.exp_con .btn button:hover { color: #fff; background:linear-gradient(to right,  #05dac8 0%,#3db0f1 100%);}
.exp_con .check { margin-top: 42px; letter-spacing: 0;}
.exp_con .check input { margin: -3px 10px 0 0; vertical-align: middle;}
.exp_con .check a { color: #1e5df8; text-decoration: underline; vertical-align: middle;}
.exp_con .product { font-size: 44px; color: #a3a3a3; text-align: center;}
.exp_con .bold { margin-top: 35px; font-size: 20px; text-align: center; line-height: 1.4;}
.exp_con .btb { margin-top: 24px;font-size: 13px; color:rgba(0,0,0,0.58); font-weight: normal;text-align: center;}
.exp_con .btns { margin-top: 50px; text-align: center;}
.exp_con .btns a { display: inline-block; width: 245px; height: 60px; margin: 0 5px; padding-top: 17px; font-size: 18px; letter-spacing: -1px; border-radius: 30px; transition: all .2s ease;}
.exp_con .btns a.bg { color: #fff; background: linear-gradient(to right,  #05dac8 0%,#3db0f1 100%);}
.exp_con .btns a.round { color: #000; border: 2px solid #000;}

.exp_con .http { margin: 15px -13px -10px !important; padding: 18px 13px; font-size: 16px; background-color: #f5f5f5; border-radius: 0 0 10px 10px}
.spinner { position: fixed !important; left:50% !important; top:50% !important; transform:translate(-50%, -50%);}

.exp_con .file_input_form{margin-top: 40px;}
.exp_con .file_input_form > div {margin-bottom: 24px;}
.exp_con .file_input_form > div:last-child{margin-bottom: 0;}
.file_input_wrap{margin-bottom: 24px; padding-top: 24px; border-top: 1px solid #40454E;}
.file_input_wrap:last-child{margin-bottom: 0;}
.file_input_wrap > p{margin-bottom: 24px; font-size: 16px;color: rgba(0, 0, 0, 0.78);}
.file_input_wrap > p i{margin-left: 12px;}
.file_input_area{display: flex;}
.file_input_area .file_input_btn{flex-shrink: 0;flex-basis: 120px;}
.file_input_area .file_list_wrap{flex-grow: 1;padding-left: 24px;}
.file_input{width: 0.1px;height: 0.1px;opacity: 0;overflow: hidden;position: absolute;z-index: -1;}
.file_input + label{cursor: pointer;}
.file_input + label{display: inline-block;width: 120px;height: 120px;padding-top: 34px;background: #FFF;border: 1px solid #D8D8D8;box-shadow: 0px 18px 18px rgba(68, 68, 68, 0.12), 0px 0px 1px rgba(68, 68, 68, 0.31);border-radius: 8px;text-align: center;overflow: hidden;transition: 0.2s;}
.file_input + label:hover{background: #F5F5F5;}
.file_input + label span{display: block;margin-top: 8px;color: rgba(0, 0, 0, 0.58);}
.file_input_list li{position: relative;display: flex;align-items: center;margin-bottom: 10px;}
.file_input_list li:last-child{margin-bottom: 20px;}
.file_input_list li:last-child::after{display: block;content: '';position: absolute;bottom: -11px;left: 0;width: 100%;height: 1px;background-color: #dbdbdb;}
.file_input_list li span{margin-right: 4px;padding: 0px 12px;line-height: 24px;font-weight: bold;color: rgba(0, 0, 0, 0.58);font-size: 13px;border: 1px solid #D8D8D8;border-radius: 8px;}
.file_input_list li .file_delete{width: 26px;height: 26px;border: 1px solid #D8D8D8;border-radius: 8px;background: url("../images/icon_close_2x.png") no-repeat center;background-size: 10px 11px;transition: 0.2s;}  
.file_input_list li .file_delete:hover{background-color: #F5F5F5;}
.file_list_wrap .file_guide{padding-left: 28px; font-weight: normal;color: rgba(0, 0, 0, 0.58);background: url("../images/icon_info_2.png") no-repeat left top;background-size: 18px 19px;}
.file_list_wrap .file_guide p{margin-bottom: 16px;}
.file_list_wrap .file_guide p:last-child{margin-bottom: 0;}



/* 교육 영상
**********************************************/
.edu { padding: 80px 0 100px; background-color: #eff4ff;}
.edu h2 { font-size: 16px; color: #1e5df8;}
.edu .part { position: relative; margin-top: 25px;}
.edu .part p { font-size: 24px; line-height: 40px;}
.edu .part a { display: block; position: absolute; right: 0; top:0; width:246px; height:60px; padding-top:17px; font-size:18px; color:#1e5df8; text-align:center; border:2px solid #1e5df8; border-radius:30px;}
.edu .part a:hover { text-decoration: underline;}
.edu .part a img { width:28px; height:auto; margin:-4px 5px 0 0; vertical-align: middle;} 
.edu .part a span { vertical-align: middle;} 
.edu .youtube_box { margin-top:70px; padding:0 80px;}
.edu .youtube_list { border-top: 2px solid #000;}
.edu .youtube_list li { border-bottom: 1px solid #ddd;}
.edu .youtube_list li a { display: block; position: relative; padding:62px 80px 62px 205px; color:#000;}
.edu .youtube_list li a img { position: absolute; left: 0; top:50%; width:120px; height:auto; transform:translate(0, -50%);}
.edu .youtube_list li a .title { font-size: 18px;}
.edu .youtube_list li a .subtitle { margin-top: 5px;}
.edu .youtube_list li a i { display:block; position: absolute; right: 60px; top:50%; width:15px; height: 26px; background: url(/land/images/ico_youtube_arrow.png) no-repeat; transform:translate(0, -50%);}
.edu .youtube_list li a:hover { color: #1e5df8;}
.edu .youtube_list li a:hover i { background-position: 0 -34px;}





/* M 라이브
**********************************************/
#mlive{}
.mlive_content {padding-top: 103px;background:url("/land/images/mlive_wave_top_bg.png") no-repeat top 81px center;}
.mlive_content section{}
.mlive_content section .title {padding-top: 60px;text-align: center;}
.mlive_content section .title h3{font-size: 28px;color: #1e5df8;}
.mlive_content section .title span{display:block;margin-top: 4px;font-size: 18px;color: rgba(0,0,0,0.78);}
.mlive_characteristic .contents, .mlive_ui .contents{border-top:1px solid #ddd;}
.mlive_characteristic .contents, .mlive_ui .contents, .mlive_strength .contents, .mlive_edu .contents{margin-top:24px;}
.location_wrap{margin: 24px 0;}
.location_cont span, .location_cont span a{display:inline-block;color:rgba(0,0,0,0.58);}
.location_cont .on{color:#1e5df8;}
.location_cont .lc_arrow{display:inline-block;width:7px;height:10px;margin: 0 28px;background:url("/land/images/ico_location.png") no-repeat;}
.mlive_introduce{margin-top:16px;}
.mlive_introduce .box{position: relative;border-radius: 10px;filter: drop-shadow(0px 18px 9px rgba(0,0,0,0.06));background-color: #fff;border: 1px solid #d8d8d8;overflow: hidden;z-index: 1;}
.mlive_introduce_content{display:flex;padding: 70px 0 82px;}
.mlive_introduce_content.wave_bg{background:url("/land/images/mlive_intro_bg.png") no-repeat bottom center;}
.mlive_introduce_content .mlive_logo {width:50%;padding-right: 110px;}
.mlive_introduce_content .mlive_logo i{display:block;float: right;width:222px;height:122px;background:url("/land/images/mlive_logo.png") no-repeat center;}
.mlive_introduce_text{width:50%;padding-left: 20px;}
.mlive_introduce_text > span{font-size: 13px;color: #05dcca;}
.mlive_introduce_text .text{margin: 6px 0 16px;}
.mlive_introduce_text .text p{font-size: 24px;color: #383e65;}
.mlive_introduce_text .text .mark i{height:12px;}
.mlive_introduce_text .s_text{font-size: 13px;color: #787a87;}

.mlive_characteristic .contents{padding-bottom: 60px;}
.mlive_characteristic_list{display: flex;justify-content: space-between;padding: 50px 80px 0;}
.mlive_characteristic_list > li{width: 33.333%;}
.mlive_characteristic_list > li:nth-child(1){padding-right: 60px;}
.mlive_characteristic_list > li:nth-child(2){padding: 0 60px 0 20px;}
.mlive_characteristic_list > li:nth-child(3){padding-left: 30px;}
.mlive_characteristic_list > li .split{display:block;}
.mlive_characteristic_list > li strong{display: block;margin: 10px 0 16px;font-size: 16px;color: #000;}


.circle_list li{position: relative;margin-bottom:24px;padding-left: 20px;color: rgba(0, 0, 0, 0.78);word-break: keep-all;}
.circle_list li:last-child{margin-bottom:0px;}
.circle_list li::before{display:inline-block;content:'';position: absolute;top: 8px;left: 0;width: 4px;height: 4px;border-radius: 50%;background-color: #000;}
.circle_list li i{font-style: normal;color: #1e5df8;}


.mlive_ui{background-color:#f5f5f5;}
.mlive_ui .contents{padding-bottom: 100px;}
.mlive_ui .ui_slide{display:flex;margin-top: 32px;background-color: #f5f5f5;}
.mlive_ui .ui_slide .ui_img{flex-grow: 1;}
.mlive_ui .ui_slide .ui_img img{width:100%;}
.mlive_ui .ui_slide .ui_service{flex-shrink: 0;width: 262px;padding-top: 86px;word-break: keep-all;}
.mlive_ui .ui_slide .ui_service h4{color: #1e5df8;}
.mlive_ui .ui_slide .ui_service .ui_service_text > li:nth-child(1){margin-top:40px;}
.mlive_ui .ui_slide .ui_service .ui_service_text > li:nth-child(2){margin-top:60px;}
.mlive_ui .ui_slide .ui_service .ui_service_text span{margin-left: 4px;color: #383e65;vertical-align: bottom;}
.mlive_ui .ui_slide .ui_service .ui_service_text .text{margin-top: 12px;}
.mlive_ui .ui_slide .ui_service .ui_service_text .text p{line-height: 28px;color:rgba(0,0,0,0.58);}
.mlive_ui .ui_slide .ui_service .ui_service_text .text p:last-child{margin-top:0;}
.mlive_ui_slide .swiper-control{position: absolute;bottom: 70px;left:50%;width: 140px;height: 40px;margin-left: -70px;z-index: 1;}
.mlive_ui_slide .swiper-control .swiper-button{position: absolute;top: 0;display:inline-block;width: 40px;height: 40px;margin: 0;background: url("/land/images/ico_arrow_box2_2x.png") no-repeat 0 0;background-size: 80px;opacity: 1;}
.mlive_ui_slide .swiper-control .swiper-button::after{display:none;}
.mlive_ui_slide .swiper-control .swiper-button.swiper-button-prev{left: 0;background-position: -40px 0px;}
.mlive_ui_slide .swiper-control .swiper-button.swiper-button-next{right:0;background-position: -40px -40px;}

.mlive_strength{padding-bottom: 120px;}
.mlive_strength_list{margin-left:-16px;}
.mlive_strength_list::after{display:block;content:'';clear:both;}
.mlive_strength_list li{float:left;width: 33.333%;padding-left:16px;}
.mlive_strength_list li .box{position: relative;padding:32px;background: #FFF;border: 1px solid #DDD;box-sizing: border-box;box-shadow: 0px 18px 18px rgba(0, 0, 0, 0.06);border-radius: 12px;}
.mlive_strength_list li i.icon{position: absolute;top: 32px;left: 32px;}
.mlive_strength_list li .text{padding-left: 80px;}
.mlive_strength_list li .text h4{font-size: 18px;color: rgba(0, 0, 0, 0.78);}
.mlive_strength_list li .text p{margin-top: 12px;font-size: 14px;color: rgba(0, 0, 0, 0.58);}
.mlive_strength_list li .text p span{display:block;}


.mlive_banner{background: linear-gradient(#4390fa, #4a94fa);}
.mlive_banner .contents{height: 140px;background:url("/land/images/mlive_wave_banner_bg.png") no-repeat right bottom;}
.mlive_banner .text{padding-top: 38px;font-weight: bold;color:#fff;}
.mlive_banner .text strong{font-size:28px;}
.mlive_banner .text strong em{font-weight: bold;color: #05dcca;}
.mlive_banner .text > span{display:block;margin-top: 10px;font-size: 14px;letter-spacing: 0;font-weight: lighter;}

.wave_wrap {position: absolute;bottom: -50px;left: 0;width:100%;overflow: hidden;z-index: -1;}
.wave_wrap svg {width:1200px;}
.wave_wrap .wave {animation: wave 3s linear;animation-iteration-count:infinite;fill: #4478e3;}
#wave1{fill:#bdd5ff;}
#wave2 {animation-duration:5s;animation-direction: reverse;fill:#e1ecff;}
#wave3 {animation-duration: 7s;fill:#f0f5ff;}
@keyframes wave {
  to {transform: translateX(-100%);}
}


.mlive_edu{background: #1d5df7;}
.mlive_edu .area{padding-bottom:114px;background:url("../images/mlive_edu_bg.png") no-repeat right bottom;}
section.mlive_edu .title h3{color:#fff;}
section.mlive_edu .title h3 i{color:#05dcca;font-style: normal;}
section.mlive_edu .title span{color:#fff;}
.mlive_edu .contents{border-top:1px solid #7eb4ff;}
.mlive_edu .video_wrap{padding:20px 120px 0;}
.mlive_edu .video{position:relative;padding-bottom:56.25%;height:0;}
.mlive_edu .video iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;}
.mlive_edu .mlive_subscription{margin-top:40px;text-align: center;}
.mlive_edu .mlive_subscription a{display:inline-block;width: 245px;height: 60px;line-height: 62px;border-radius: 30px;background-image: linear-gradient(90deg, #05dac8 0%, #3db0f1 100%);color:#fff;font-size: 18px;text-align: center;}
.mlive_edu .mlive_subscription p{margin-top:18px;color:#fff;font-size: 15px;font-weight: normal;}




/* component */
.radioA{position: relative;display: inline-block;vertical-align: middle;margin-right: 4px;}
.radioA:last-child{margin-right: 0;}
.radioA input{display:none;}
.radioA input + label::before{content:'';position: absolute;left: 0;top: 1.5px;display: inline-block;width: 17px;height: 17px;margin-right: 2px;cursor: pointer;border-radius: 50%;background-image: url('../images/icon_radio_default_2x.png');background-size: 17px 17px;background-repeat: no-repeat;background-color: #fff;}
.radioA input:checked + label::before{background-image: url('../images/icon_radio_check_2x.png');}
.radioA input:disabled + label::before{background-image: url('../images/icon_radio_disabled_2x.png');}
.radioA label{position: relative;display: inline-block;padding-left:20px;line-height: 20px;cursor: pointer;vertical-align: middle;}
.radioA label span{margin-left: 28px;color: rgba(0, 0, 0, 0.58);}

.checkboxA { display:none; }
.checkboxA +label { display: inline-block; height:16px;margin-left: 8px; padding-left: 22px; vertical-align: middle; line-height: 16px; background: url("../images/checkbox_off_2x.png") no-repeat;background-size: 16px 16px; cursor: pointer;}
.checkboxA:checked +label {background-image: url("../images/checkbox_on_2x.png");}
.checkboxA:disabled +label {background-image: url("../images/checkbox_disabled_2x.png");}
.checkboxA:first-child + label{margin-left: 0;}
.checkboxB { display:none; }
.checkboxB +label { display: inline-block; height:16px;margin-left: 8px; padding-left: 22px; vertical-align: middle; line-height: 16px; background: url("../images/checkboxB_off_2x.png") no-repeat;background-size: 16px 16px; cursor: pointer;}
.checkboxB:checked +label {background-image: url("../images/checkboxB_on_2x.png");}
.checkboxB:first-child + label{margin-left: 0;}

/* modal */
.modal_wrap{display: none;position:fixed;top:0;left:0;width:100%;height:100%;text-align:center;background-color: rgba(0, 0, 0, 0.3);z-index: 9;}
.modal_wrap .modal_content{position: relative; display:inline-block;width: 80%;max-width: 963px;max-height: 90%;padding:32px; background:#fff;border: 1px solid #eee;box-sizing: border-box;vertical-align:middle;box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.07);border-radius: 12px;text-align: left;overflow: auto;}
.modal_wrap::after{display:inline-block;content: ''; width:0;height:100%;vertical-align:middle;}
.modal_header{display: flex;-webkit-justify-content:space-between; justify-content: space-between;align-items: center;margin-bottom: 16px;padding-bottom:16px;border-bottom: 1px solid #aaa;}
.modal_header h2{font-size: 16px;line-height: 160%;}
.modal_header .modal_close{width: 16px;height: 16px;background: url("../images/icon_close_2x.png") no-repeat center;background-size: 16px 16px;font-size: 0;text-indent: -999px;cursor: pointer;}
.modal_footer{padding-top: 32px; text-align: center;}
.modal_footer button{height: 38px;padding: 0 32px;}
.modal_wrap .modal_content::-webkit-scrollbar {width: 10px;height: 10px;}
.modal_wrap .modal_content::-webkit-scrollbar-thumb {background-color: #d1d1d1;border-radius: 10px;background-clip: padding-box;border: 3px solid transparent;}
.modal_wrap .modal_content::-webkit-scrollbar-corner{display: none;}

/* 관리자 로그인 */
.admin_wrap .modal_wrap{background-color: #F8F8FA;}
.admin_wrap .modal_wrap.login_wrap{display: block;font-family: "Noto Sans KR";}
.admin_wrap .modal_wrap .modal_content{max-width: 616px;padding: 0 24px;border: none;background: transparent;box-shadow: none;}
.admin_wrap .modal_wrap h2{display: flex;-webkit-justify-content:center; justify-content: center;align-items: center;margin-bottom: 16px;}
.admin_wrap .modal_wrap h2 img{width: 82px;}
.admin_wrap .modal_wrap h2 span{font-family: 'NanumSquareRound';display: inline-block;margin-left: 8px;padding: 4px 8px 3px;font-weight: 800;font-size: 13px;line-height: 140%;color: #3366E2;border: 1px solid rgba(51, 102, 226, 0.38);box-sizing: border-box;border-radius: 4px;vertical-align: middle;}
.admin_wrap .modal_wrap .cont_box{padding: 28px 20px 20px;background-color: #fff;box-shadow: 0px 18px 24px rgba(0, 0, 0, 0.12);border-radius: 8px;}
.login_wrap .form dt{margin-bottom: 8px; font-weight: bold;font-size: 11px;color: rgba(0, 0, 0, 0.58);}
.login_wrap .form dd input{width: 100%;height: 44px;margin-bottom: 20px;padding: 0 8px;border: none;box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.07);font-weight: bold;font-size: 14px;color: rgba(0, 0, 0, 0.58);}
.login_wrap .form dd input::placeholder{font-weight: bold;font-size: 14px;color: rgba(0, 0, 0, 0.3);}
.login_wrap .checkboxB + label{font-size: 12px;font-weight: normal;color: rgba(0, 0, 0, 0.58);}
.login_wrap .text{display: block;margin-bottom: 24px;line-height: 160%;font-size: 12px;color: rgba(0, 0, 0, 0.58);text-align: center;letter-spacing: 0;font-weight: normal;text-align: center;}
.admin_wrap .modal_wrap.ie_message{display: block;}
.admin_wrap .ie_message .modal_content{padding-bottom: 40px;}
.ie_message .text{text-align: center;font-size: 48px;color: rgba(0, 0, 0, 0.58);font-family: 'NanumSquareRound';}
.btn_wrap .lbtn{width: 100%;height: 60px;margin-top: 20px;padding: 0;background: #FFF;border: 2px solid #1E5DF8;box-sizing: border-box;border-radius: 8px;text-align: center;line-height: 55px;font-weight: 700;font-size: 16px;color: #3366E2;transition: background .3s, color .3s;font-family: 'Noto Sans KR', sans-serif;}
.btn_wrap .lbtn:hover{background:#3366E2;color: #fff;}
.login_wrap .guide{margin-top: 48px;text-align: center;}
.login_wrap .guide .remote{display: inline-block;margin-bottom: 8px;padding: 5px 9px;background: #fff;border: 1px solid #ddd;border-radius: 4px;color: rgba(0, 0, 0, 0.58);font-weight: bold;font-size: 12px;}
.login_wrap .guide .tell{display: block;font-weight: bold;color: rgba(0, 0, 0, 0.38);font-size: 12px;}
.login_wrap .guide .tell b{margin-left: 6px;color: #3366E2;}

/* M.pay 신청 */
.mpay_apply .box{padding: 24px;background: #FFF;border: 1px solid #ECECEC;box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.1);border-radius: 12px;}
.mpay_apply .exp_con{padding-top: 48px;}
.mpay_apply .exp_con .title h2{margin-top: 0;font-size: 28px;color: #40454E;}
.mpay_apply .exp_con .title p{margin-top: 4px;font-size: 16px;color: rgba(0, 0, 0, 0.58);font-weight: normal;letter-spacing: -1px;font-family: "Noto Sans KR";text-align: center;}
.mpay_apply_form{margin-top: 16px;}
.mpay_apply_form  .form{margin-top: 8px;}
.mpay_apply_form .text_required{letter-spacing: -1px;color: rgba(0, 0, 0, 0.58);font-weight: normal;font-family: "Noto Sans KR";text-align: right;}
.mpay_apply_form .text_required i{margin-right: 8px;}
.mpay_apply_form .exp_list li:first-child{margin-top: 16px;}
.mpay_apply_form .exp_list:first-child li:first-child{margin-top: 0px;}
.tiny_link{margin-top: 16px;text-align: right;}
.tiny_link a{display: inline-block;color: #40454E;}
.tiny_link a::after{display: block;content: '';width: 100%;height: 1px;background-color: #40454E;}
.mpay_apply_form .btn button{max-width: 240px;width: 100%;height: 54px;padding: 0;background: #1E5DF8;font-size: 16px;color: #FFF;border:none;font-family: 'NanumSquareRound';}
.mpay_banner{margin-top: 26px;}
.mpay_banner img{max-width: 590px;width: 100%;}
.mpay_btn{position: relative;top: -37px;display: block;max-width: 240px;width: 100%;height: 60px;margin: 0 auto;line-height: 60px;background: #1E5DF8;border-radius: 30px;text-align: center;font-size: 16px;font-weight: 800;color: #FFF;font-family: 'NanumSquareRound';}
.mpay_btn i{margin-right: 6px;}
.step3 .btns {position: relative; margin-top: 32px;}
.step3 .btns::before{display: block;content: '';position: absolute;top: -32px;left: 0;width: 100%;height: 1px;background-color: #D8D8D8;}
.step3 .btns a{max-width: 240px;width: 100%;padding-top: 18px;border: 2px solid #40454E;font-size: 16px;color: #40454E;}


/* 교육기관 리스트 */
.mpay_apply_center{padding: 64px 0;}
.mpay_apply{max-width: 800px;margin: 0 auto;}
.mpay_apply_center .title{position: relative;}
.mpay_apply_center .title::after{display: block;content: '';position: absolute;top: 50%;left: 0;margin-top: -1px;width: 100%;height: 1px;background: #D8D8D8;z-index: -1;}
.mpay_apply_center .title h2{display: inline-block;padding-right: 24px;font-size: 22px;color: rgba(0, 0, 0, 0.78);background: #F8F8FA;}
.mpay_apply_center .center_list{max-width: 264px;margin: 8px auto 0;}
.mpay_apply_center .center_list > li{min-height: 134px;margin-bottom: 16px;border: 1px solid #D8D8D8;box-sizing: border-box;border-radius: 16px;}
.mpay_apply_center .center_list > li:last-child{margin-bottom: 0;}
.mpay_apply_center .center_list > li.status_01{border: 2px solid #1E5DF8;box-shadow: 0px 18px 18px rgba(68, 68, 68, 0.12), 0px 0px 1px rgba(68, 68, 68, 0.31);background-color: #fff;}
.mpay_apply_center .center_list > li.status_01 > div .status{color: #1E5DF8;}
.mpay_apply_center .center_list > li.status_02{box-shadow: 0px 18px 18px rgba(68, 68, 68, 0.12), 0px 0px 1px rgba(68, 68, 68, 0.31);background-color: #fff;border: none;}
.mpay_apply_center .center_list > li.status_02 > div .status{color: #31C4A0;}
.mpay_apply_center .center_list > li > div{padding: 24px;}
.mpay_apply_center .center_list > li > div .status{margin-bottom: 10px;font-size: 12px;color: rgba(0, 0, 0, 0.3);}
.mpay_apply_center .center_list > li > div .center_name{display: flex;flex-direction: row;}
.mpay_apply_center .center_list > li > div .center_name em{margin-right: 8px;font-weight: 800;font-size: 16px;color: rgba(0, 0, 0, 0.38);}
.mpay_apply_center .center_list > li > div .center_name span{font-size: 16px;color: rgba(0, 0, 0, 0.58);overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mpay_apply_center .center_list > li > div a{display: flex;justify-content: center;align-items: center;width: 100%;height: 35px;margin: 10px 0 8px;border: 1px solid #D8D8D8;border-radius: 4px;background: #FFF;text-align: center;transition: 0.2s;font-size: 12px;letter-spacing: -1px;color: rgba(0, 0, 0, 0.78);}
.mpay_apply_center .center_list > li > div a:hover{background: #F5F5F5;}
.mpay_apply_center .center_list > li > div a i{margin-right: 6px;}


/* 교육기관 선택 */
.mpay_apply_center_result{padding: 48px 0;}
.mpay_apply_center_result .title{text-align: center;}
.mpay_apply_center_result .title h2{font-size: 28px;color: #40454E;}
.mpay_apply_center_result .title p{margin-top: 4px;font-size: 16px;color: rgba(0, 0, 0, 0.58);font-weight: normal;letter-spacing: -1px;font-family: "Noto Sans KR";}
.mpay_apply_center_result .center_info{margin-top: 26px;}
.mpay_apply_center_result .center_info .box{padding: 48px;}
.mpay_apply_center_result .center_info .center_title{position: relative; text-align: center;}
.mpay_apply_center_result .center_info .center_title::after{display: block;content: '';position: absolute;top: 9px;left: 0;width: 100%;height: 1px;background: #EEE;}
.mpay_apply_center_result .center_info .center_title span{position: relative;padding: 0 10px;font-size: 12px;color: #999CA2;background-color: #fff;z-index: 1;}
.mpay_apply_center_result .center_info .center_title h3{margin-top: 4px; font-size: 18px;color: #1E5DF8;}
.mpay_apply_center_result .center_info .text{margin-top: 24px;text-align: center;}
.mpay_apply_center_result .center_info .text div{display: inline-block; padding: 24px;border: 1px solid #D8D8D8;border-radius: 8px;font-size: 16px;font-weight: normal;color: rgba(0, 0, 0, 0.58);word-break: keep-all;}
.mpay_apply_center_result a{display: block;max-width: 240px;width: 100%;height: 60px;margin: 24px auto;line-height: 60px;background: #1E5DF8;border-radius: 30px;font-size: 16px;font-weight: 800;text-align: center;color: #FFF;font-family: 'NanumSquareRound';}
.mpay_apply_center_result a i{margin-right: 6px;}
.mpay_apply_center_result .guide{text-align: center;word-break: keep-all;}
.mpay_apply_center_result .guide p{font-weight: normal;color: rgba(0, 0, 0, 0.58);}
.mpay_apply_center_result .guide p span{font-weight: 800;}
.mpay_apply_center_result .guide strong{display: block; margin-top: 16px;color: rgba(0, 0, 0, 0.78);}
.mpay_apply_center_result .guide strong span{color: #1E5DF8;}



/* mpay 소개 */
.mpay_content{padding-top: 81px;}
.mpay_content section .title {padding-top: 48px;text-align: center;}
.mpay_content section .title h3{font-size: 26px;color: #1e5df8;}
.mpay_content section .title span{display:block;margin-top: 4px;font-size: 14px;color: rgba(0,0,0,0.78);word-break: keep-all;}
.mpay_about .contents, .mapy_document .contents{margin-top:24px;padding-top: 32px;padding-bottom: 32px; border-top:1px solid #ddd;}

.mpay_intro{width: 100%;height: 320px; background: url("../images/mpay_intro_banner.png") no-repeat center;background-size: cover;}
.mpay_intro > .area{padding-top: 74px;}
.mpay_intro h2 img{width: 120px;}
.mpay_intro p{margin-top: 10px; font-size: 22px;color: #FFF;}
.mpay_intro a{display: inline-block;margin-top: 16px;padding: 19px 31px;font-size: 16px;color: #FFF;text-align: center; background: #1E5DF8;box-shadow: 0px 8px 8px rgba(68, 68, 68, 0.12), 0px 0px 1px rgba(68, 68, 68, 0.31);border-radius: 30px;}

.mpay_about .contents{padding-bottom: 64px;}
.mpay_about_list{display: flex;margin-bottom: 16px; text-align: center;}
.mpay_about_list li{width: 33.333%;padding-bottom: 18px;}
.mpay_about_list .icon{display: block;height: 80px;margin: 0 auto;background-position: center;}
.mpay_about_list strong{display: block;margin: 20px 0; font-size: 16px;color: rgba(0, 0, 0, 0.78);}
.mpay_about_list span{color: rgba(0, 0, 0, 0.58);font-weight: normal;}
.mpay_about .table_wrap{margin-top: 32px;margin-bottom: 16px;}
.mpay_about .table_wrap p{margin-bottom: 16px; font-size: 18px;}
.mpay_about .table_wrap p span{color: #1E5DF8;}


.htable {display: table;font-family: "Noto Sans KR";font-weight: normal;}
.htable thead tr{height: 37px;}
.htable tbody tr{height: 45px;}
.htable thead tr th{border-top:2px solid #1E5DF8;border-bottom:1px solid #ddd;font-weight: bold;}
.htable thead tr.brb0 th{border-bottom:none;}
.htable th {font-size:13px;border-left:4px solid #fff;}
.htable th:first-child {border-left:none;}
.htable td {text-align: center; font-size:13px; word-break:break-all; word-wrap:break-word;border-bottom: 1px solid #ddd;border-left:4px solid #fff;color: rgba(0, 0, 0, 0.58);}
.htable td:first-child {border-left:none;}
.htable td.fwb{font-weight: bold;color: rgba(0, 0, 0, 0.78);}

.circle{position: relative; padding-left: 10px;font-weight: normal; font-size: 13px;color: rgba(0, 0, 0, 0.58);font-family: "Noto Sans KR";}
.circle::before{display: inline-block;content: '';position: absolute;top: 7px;left: 0; width: 4px;height: 4px;border-radius: 50%;background: #1E5DF8;}

.mapy_document{background: #F5F5F5;}

.mpay_document_list{display: flex;}
.mpay_document_list > li{width: 33.333%;padding-left: 12px;}
.mpay_document_list > li:first-child{padding-left: 0;}
.mpay_document_list > li .box{position: relative; padding: 40px; background: #FFF;border: 1px solid #D8D8D8;border-radius: 8px;}
.mpay_document_list > li .box .icon{position: absolute;top: 40px;left: 40px; width: 64px;height: 64px;background-position: center;}
.mpay_document_list > li .text{padding-left: 84px;} 
.mpay_document_list > li .text > p{margin-bottom: 4px; font-size: 13px;color: #1E5DF8;} 
.mpay_document_list > li .text > h4{font-size: 18px;color: rgba(0, 0, 0, 0.78);} 
.mpay_document_list > li .text > ul{margin-top: 20px;}

.mpay_button{padding: 32px 0 64px;}
.mpayBtn{display: block;max-width: 240px;width: 100%;height: 60px;margin: 0 auto;line-height: 60px;background: #1E5DF8;border-radius: 30px;text-align: center;font-size: 16px;font-weight: 800;color: #FFF;font-family: 'NanumSquareRound';box-shadow: 0px 8px 8px rgba(68, 68, 68, 0.12), 0px 0px 1px rgba(68, 68, 68, 0.31);}
.mpayBtn i{margin-right: 4px;}

.circle_depth_list li{position: relative; padding-left: 11px;}
.circle_depth_list li::before{display:inline-block;content:'';position: absolute;top: 7px;left: 0;width: 3px;height: 3px;border-radius: 50%;background-color: #1E5DF8;}
.circle_depth_list p{margin-bottom: 4px; color: rgba(0, 0, 0, 0.58);}
.circle_depth_list span{display: block;margin-bottom: 4px; font-size: 13px; color: rgba(0, 0, 0, 0.58);font-weight: normal;}