@charset "utf-8";

@font-face {
    font-family: 'MinSans-Regular';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/MinSans-Regular.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'MinSans-Medium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/MinSans-Medium.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'MinSans-Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/MinSans-Bold.woff') format('woff');
    font-weight: 500;
    font-style: normal;    
}    
@font-face {
    font-family: 'MinSans-Black';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/MinSans-Black.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

/*  Common  */
* {margin:0; padding:0;}
img { border:0; vertical-align:top;}
html,body {width:100%;}
body,input,textarea,select,button,table{font-size:18px; font-family: "MinSans-Regular", sans-serif; color:#000000; }
img,fieldset{border:0;}
a{color:#000000; text-decoration:none; cursor:pointer;}
a:hover,a:visited,a:active,a:focus{ text-decoration:none}
ul,ol { list-style:none}
.a11y-hidden {position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: polygon(0 0, 0 0, 0 0);}
.pt0 {padding-top:0px !important}
/* style */
#wrap {min-width: 1300px; margin:0 auto; position:relative;}
.inner {width: 1200px; margin:0 auto; position: relative; padding:110px 0px 120px 0px}

.visual h1 {position: absolute; top: 30px; left: 50px; z-index: 10;}
.top_btn {z-index: 10; position: absolute; right: 50px; top: 35px;}
.top_btn li,.bottom_btn li {display: inline;}
.top_btn li:last-child {margin-left:5px}
.top_btn li a {color:#666666; display: inline-block; border:1px solid #cccccc; border-radius: 300px; font-size:16px; padding:8px 20px;}
.top_btn li a:hover {color:#666666; display: inline-block; border:1px solid #cccccc; border-radius: 300px; font-size:16px; padding:8px 20px;}

.bottom_btn li:last-child {margin-left:30px}
.bottom_btn li a {font-size:22px; font-family: 'MinSans-Medium'; width:260px; height:70px; display: inline-block; line-height:70px; color:#ffffff; border-radius: 300px; text-align:left; padding-left:30px; position: relative;}
.bottom_btn .kakao a {background-color:#9501d1;}
.bottom_btn .kakao a:hover {background-color:#8100b4;}
.bottom_btn .blog a {background-color:#ff7713;}
.bottom_btn .blog a:hover {background-color:#f86909;}
.bottom_btn .kakao a::after {content: ''; position: absolute; right: 15px; top: 15px;  width: 40px; height: 40px; background:url('../img/common/kakao.png') no-repeat; background-size:40px;}
.bottom_btn .blog a::after {content: 'GO'; position: absolute; right: 15px; top: 15px; font-size: 16px; background: #fff; width: 24px; height: 40px; border-radius: 300%; padding:0px 8px; line-height: 40px;font-family: 'MinSans-Black';}
.bottom_btn .kakao a::after {color: #9501d1;}
.bottom_btn .blog a::after {color: #ff7713;}

.visual {width:100%; height:765px; background:url('../img/visual_bg.jpg') top center no-repeat; text-align:center; background-size: cover;} 
.visual .inner {padding:120px 0px 85px 0px !important}
.con01_bg02 {width:100%; background:url('../img/con01_img02_bg.jpg') top center no-repeat; text-align:center; padding:30px 0px 120px 0px !important}
.con01_bg03 {width:100%; background:url('../img/con01_img03_bg.jpg') top center no-repeat; text-align:center;}
.con02 {width:100%; background:url('../img/con02_bg.jpg') top center no-repeat; text-align:center;}
.con04 {width:100%; background:#f5f5f5; text-align:center;}
.con05 {width:100%; height:1417px; background:url('../img/con05_bg.jpg') top center no-repeat; text-align:center;}
.con06 {width:100%; background:#f5f5f5;}
.con08 {width:100%; background:url('../img/con08_bg.jpg') top center no-repeat; text-align:center;}
.con08 .box {background:#fff; border-radius:30px; border:1px solid #e5e5e5; padding:50px 0px; margin-top:70px; position:relative}
.con08 .box .tit {position: absolute; top: -20px; left: 50%; transform: translate(-50%, 0%);}
.con08 .box .img {margin-top:215px}
.con08 .inner {padding-top:60px !important}
.con09 {width:100%; background:url('../img/con09_bg.jpg') top center no-repeat; text-align:center;}
.con10 {width:100%; background:url('../img/con10_bg.jpg') top center no-repeat; text-align:center;}
.con11 {width:100%; background:url('../img/con11_bg.jpg') top center no-repeat; text-align:center;}
.con11 .inner {padding:120px 0px !important}
.con12 {width:100%; background:url('../img/con12_bg.jpg') top center no-repeat; text-align:center;}
.con12 .inner {padding:120px 0px !important}
.con12 .inner .btn  {display: flex; gap:30px; justify-content: center;}
.con12 .inner .btn a {position: relative; display: flex; align-items: center; gap:10px; justify-content: center; width:330px}
.con13 h3 {text-align:center; font-size:50px; font-weight: 900;}
.con13 table {border:1px solid #ddd; margin-top:60px}
.con13 table td {padding:20px; text-align: center; border-right:1px solid #ddd; border-bottom:1px solid #ddd}
.con13 table th {background:#63b500; border-bottom:1px solid #fff; color:#fff;} 
.con13 table .pay {background:rgba(99,181,0,0.1);} 
.con13 table .pay02 {background:rgba(99,181,0,0.18);} 
.con13 table .pay03 {background:rgba(99,181,0,0.25);} 
.con13 table td:last-child { border-right:0}
.con13 table tr:last-child td {border-bottom:0; border-right:0}
.btn {text-align:center;}
.btn a {margin-top:50px; display:inline-block; width:300px; height:80px;
background: #000000; /* Old browsers */
background: -moz-linear-gradient(left,  #000000 0%, #262626 50%, #000000 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #000000 0%,#262626 50%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #000000 0%,#262626 50%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=1 );
color:#fff; font-size:22px; line-height:80px; border-radius: 10px; font-family: 'MinSans-Medium';}


.btn button {cursor:pointer; border:none; margin:50px 15px 0px 15px; display:inline-block; width:300px; height:80px;
    background: #000000; /* Old browsers */
    background: -moz-linear-gradient(left,  #000000 0%, #262626 50%, #000000 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #000000 0%,#262626 50%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #000000 0%,#262626 50%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=1 );
    color:#fff; font-size:22px; line-height:80px; border-radius: 10px; font-family: 'MinSans-Medium';}

.btn02 a {margin-top:50px; display:inline-block; width:300px; height:80px; border:1px solid #ffe590; color:#ffe590; font-size:22px; line-height:80px; border-radius: 10px; font-family: 'MinSans-Medium';}

.footer {width:1200px; margin:30px auto; font-size:18px; color:#666666;}
.footer ul {color:#999; margin-top:20px;}
.footer copyright {font-size:16px; color:#aaa; margin-top:20px; display: inline-block;}

.swiper-slide {padding:120px 0px 120px 0px; text-align: center;}
.swiper-button-next, .swiper-button-prev {color:#000;}
.swiper-button-next:after, .swiper-button-prev:after {color:#000}

.quickmenu {position: fixed; top: 50%; transform: translateY(-50%); right:50px; z-index:100; text-align: center;}

.quickmenu li.top a {display: block; width: 45px; height: 45px; background: #13202f; color: #fff; line-height: 45px; margin: 0 auto; border-radius: 300px; position: relative;}
.quickmenu li.top a:before {content: ''; border-bottom: 13px solid #fff; position: absolute; border-left: 10px solid transparent; border-right:10px solid transparent; left: 13px; top: 15px; border-radius: 5px;}

.quickmenu li a {display:block; cursor: pointer;font-size:16px; font-family: 'MinSans-Medium'; width:100px; height:100px; line-height:100px; color:#fff; margin-bottom:10px}
.quickmenu li.toeng a {background:url('../img/quickmenu_img01.png') no-repeat center;}
.quickmenu li.literacy a {background:url('../img/quickmenu_img02.png') no-repeat center;}
.quickmenu li.academy a {background:url('../img/quickmenu_img03.png') no-repeat center; }
.quickmenu li.banner01 a {background:url('../img/quickmenu_img04.png') no-repeat center; }
.quickmenu li.banner02 a {background:url('../img/quickmenu_img05.png') no-repeat center; }
.quickmenu li.banner03 a {background:url('../img/quickmenu_img06.png') no-repeat center; }
.quickmenu li.banner04 a {background:url('../img/quickmenu_img07.png') no-repeat center; }

.popup-wrap .close {width: 40px; height: 40px; text-indent: -999em; position: absolute; right: 25px; background: #fff; border: none; cursor: pointer; display: inline-block; top: 32px;} 
.popup-wrap .close:before, .close:after {position: absolute; top: 0px; left: 18px; content: ''; height: 40px; width: 3px; background-color: #000;}
.popup-wrap .close:before {transform: rotate(45deg);} 
.popup-wrap .close:after {transform: rotate(-45deg);}
.popup-wrap{background-color: rgba(0,0,0,.3); position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: none;
padding: 50px; z-index: 999;}
.popup-wrap .popup{width: 100%; max-width: 1140px; background-color: #ffffff; border-radius: 30px; overflow: hidden; box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 30%); position: relative; padding: 30px; left:50%; top:50%; transform: translate(-50%, -50%);height:92%}
.popup-wrap .popup .popup-head{margin-right: 10px; height:50px; border-bottom:2px solid #000;}
.popup-wrap .popup .popup-head .head-title {font-size: 30px; font-family:'MinSans-Bold';}
.popup-wrap .popup .popup-body{width:100%; background-color:#ffffff; overflow-y:scroll; height:92%;}
.popup-wrap .popup .popup-body .body-contentbox{word-break:break-word; overflow-y:auto; padding-right: 10px;}
.popup-wrap .popup .popup-body::-webkit-scrollbar { width: 5px; } 
.popup-wrap .popup .popup-body::-webkit-scrollbar-track { background-color: #f0f0f0; border-radius: 100px; }
.popup-wrap .popup .popup-body::-webkit-scrollbar-thumb { background-color: #cccccc; border-radius: 100px; } 
.popup-wrap .popup .popup-body { scrollbar-color: #cccccc #f0f0f0; } 
.popup-wrap .info {text-align: center; padding: 20px; background: #f5f5f5; border-bottom: 1px solid #ddd;}

.boardlist th {padding:18px 0px; border-bottom:1px solid #000; text-align:center;}
.boardlist td {padding:12px 0px; border-bottom:1px solid #dddddd; text-align:center;}
.boardlist .mapbtn a {background: #aaaaaa; border-radius: 300px; font-size: 16px; color: #fff; display: inline-block; padding: 7px 15px;}
.boardview th {background:#f5f5f5; border-bottom:1px solid #ddd;}
.boardview td {padding:15px 10px; border-bottom:1px solid #ddd; text-align:left;}

.btn button.enter {cursor:pointer; border:none; margin:30px 0px 0px 0px; display:inline-block; width:250px; height:70px;
    background: #000000; /* Old browsers */
    background: -moz-linear-gradient(left,  #000000 0%, #262626 50%, #000000 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #000000 0%,#262626 50%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #000000 0%,#262626 50%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=1 );
    color:#fff; font-size:20px; line-height:70px; border-radius: 10px; font-family: 'MinSans-Medium';}

input,textarea {padding:8px; border:1px solid #e5e5e5; border-radius: 3px; box-sizing: border-box;}
input::placeholder {color: #cccccc;}
textarea::placeholder {color: #cccccc;}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.w100 {width:100% !important}
.w30 {width:30% !important}
.mt10 {margin-top:10px !important}
.mt20 {margin-top:20px !important}
.adrbtn {padding: 11px 20px; cursor: pointer; background: #333; color: #fff; font-size:16px;}

/* 로그인 & 회원가입 */
.member {background:#eff1f4; font-size:16px;}
.member input {font-size:16px;}
.member .member_box {width: 400px; padding: 59px 40px 60px; border-radius: 20px; box-shadow: 0px 3px 30px 0 rgba(0, 0, 0, 0.1); background-color: #fff; margin:0 auto; margin-top:100px; margin-bottom:100px;}
.member .member_box h1 {font-family: 'MinSans-bold'; font-size: 36px; line-height: 0.83; letter-spacing: normal; text-align: center; color: #242a2e; margin-bottom:20px;}
.member .input {width: 100%; height: 60px; margin-top: 20px; padding: 22px 20px 23px 25px; border-radius: 10px; border: solid 1px #d2d2d2;}
input[type=checkbox] {display:none;}
input[type=checkbox] + label {cursor: pointer; padding-left: 23px; background: url('../img/common/checkbox.png') 0px 1px no-repeat; width: 18px;  height: 18px; background-size: 18px; color:#767676;}
input[type=checkbox]:checked + label {background: url('../img/common/checked.png') 0px 1px no-repeat; width: 18px; height: 18px; background-size: 18px;}
.member .forgot {float:right; font-family: 'MinSans-bold';}
.member .btn_enter {width: 400px; height: 60px; border-radius: 10px; background-color: #ff7e00; border:none; font-family: 'MinSans-bold'; color:#fff; font-size:16px; margin-top:20px; cursor: pointer;}
.member .info {margin-top:40px;text-align: center; color:#767676;}
.member .info a {font-family: 'MinSans-bold';display: inline-block; margin-left:5px}
.member .form .email {background:url('../img/common/email.png') right no-repeat; background-size:17px; background-position-x: 360px;}
.member .form .password {background:url('../img/common/password.png') right no-repeat; background-size:16px; background-position-x: 360px;}

.member .member_box p {margin-top:20px;text-align: center; color:#767676; margin-bottom:20px;}

.member .btn_send {font-size:16px; border:none;color:#fff; height:60px; border-radius: 10px; background-color: #7d7d7d; width:35%; cursor: pointer;}

.input02 {width:calc(65% - 9px) !important; margin-right:5px}

.video ul {display: flex; flex-wrap: wrap; gap:30px}
.video ul li {flex:1 1 20%}
.video ul li .thum  {overflow: hidden;}
.video ul li .thum img {width:100%; object-fit: cover; height:155px; border:1px solid #ddd;transition: all 0.3s linear;}
.video ul li:hover .thum img {transform: scale(1.2);}
.video ul li .txt {font-weight: 500; font-size:20px; text-align: center; margin-top:15px; font-family: 'MinSans-Bold'; transition:all .3s ease ; position:relative; z-index: 5;}
.video ul li:hover a {color:#ff7713}


.video_modal_popup.reveal {display: flex; position: fixed; top: 0; left: 0; right: 0; bottom: 0; justify-content: center; align-items: center; z-index: 999; background: rgba(0, 0, 0, 0.7);}

.video ul li:last-child {display: flex; align-items: center;justify-content: center;}
.video ul li:last-child .thum img {width:auto; object-fit: cover; height:auto; border:none}
.video_modal_popup .video-wrapper {
    position: relative;
    width: 100%;
    z-index: 10
}
.video ul li:last-child:hover .thum img {transform: scale(1);}
.video_modal_popup .video-wrapper iframe {
position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
}
.video .video-wrapper .inner {width:1000px; padding:0 !important; height:563px;}

.video_modal_popup.reveal .video_modal_popup-closer { cursor: pointer;
    position: absolute;
    top:-50px;
    right: 0px;
    z-index: 9;
}
.video_modal_popup.reveal .video_modal_popup-closer img {width:30px; height:30px}
.greeting::after {content: ''; background:url('../img/con13_img.png') center no-repeat; background-size:cover; width:100%; height:225px; display: block; min-height: 225px;
    height: 100%;
    padding-top: 20px;}