/*공통*/
.main_point { color:#19cbfa; }
.main_point2 { color: #012b57; }
.yellow_point { color: #fffd55;}
.main_point_bg { background-color: #19cbfa; }
.main_point_bg2 { background-color: #012b57; }
.scd8{font-family: 'scd8';}
.scd7{font-family: 'scd7';}
.scd5{font-family: 'scd5';}
.scd3{font-family: 'scd3';}
.ggs1{font-family: 'ggs1';}
.ggs2{font-family: 'ggs2';}
.paplg2 { font-family: 'Paperlogy2'; }
.paplg3 { font-family: 'Paperlogy3'; }
.paplg5 { font-family: 'Paperlogy5'; }
.paplg7 { font-family: 'Paperlogy7'; }
.paplg8 { font-family: 'Paperlogy8'; }
.jalnan { font-family: 'yg-jalnan'; }
.jalnan2 { font-family: 'YeogiOttaeJalnanGothic'; }

#Wrap { width: 100%; height: 100%; position: relative; }

.top { width: 100%; text-align: center; font-size: 25px; font-weight: 600; background-color: #fff; padding: 20px 0; }
.top > span { color:#0063cb; }

.main { width: 100%; float:left; background-image: url(/images/main_bg2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    height: 880px; }
.main .con_box { width: 100%; max-width: 1300px; margin: 0 auto; height: 880px; display: flex; align-items: center; }
.main .text_box { width: 57%; float:left;  }
.main .text_box .sub_tit { font-size: 30px; display: inline-block; box-shadow: inset 0 -17px 0 #ffffff3d; padding: 0 5px; font-style: italic; }
.main .text_box .title { font-size: 50px; line-height: 64px; margin-top: 25px; color:#fff;}
.main .text_box .sub_txt { font-size: 22px; color:#fff; font-weight: 300; margin-top: 15px; }
.main .text_box .main_btn { width: 100%; float:left; margin-top: 60px; }
.main .text_box .main_btn > a { width: 100%; float:left; }
.main .text_box .main_btn > a  > button { width: 380px; height: 62px; line-height: 62px; border-radius: 50px; color:#fff; text-align: center; font-size: 24px; font-weight: 600; }
.main .text_box .main_btn > a  > button:hover { background-color: #012b57; transition: all 0.5s; }
.main .img_box { width: 40%; float:left;  }

.form_bg { background-image: url(/images/sub_bg.jpg); position: relative; }
.form_bg .con_box { max-width: 1000px;}

.form_wrap { width: 100%; float:left;}
.form_wrap2 { display: none; position: absolute; }
.form_wrap3 { display: none; position: absolute; }
.form_box { width: 100%; float:left; background-color: #fff; border-radius: 50px; padding: 2% 5% 4% 5%; }
.form_box .btn_back { width: 100%; float:left; height: 50px; line-height: 50px; font-weight: 500; border-bottom: 1px solid #f1f1f1; color:#bebebe; font-size: 20px; }
.form_box .btn_back > span { cursor: pointer; }
.form_box .btn_back > span > i { margin-right: 5px; }
.form_box .text_box { width: 100%; float:left; border: 1px solid #f1f1f1; margin-top: 10px; display: flex; align-items: center; flex-direction: column; padding: 5% 8%; }
.form_box .text_box .num { width: 55px; height: 55px; line-height: 55px; font-size: 30px; text-align: center; border-radius: 50px; background-color: #012b57; }
.form_box .text_box .title { font-size: 40px; text-align: center; color:#222; }
.form_box .input_box { width: 100%; float:left; display: flex; align-items: center; margin-top: 3%; }
.form_box .input_box input { width: 100%; float:left; height: 75px; line-height: 75px; border: 3px solid #adadad; border-radius: 20px; text-align: center; color:#222; font-size: 22px; font-weight: 500; }
.form_box .input_box input::placeholder{color: #888;}
.form_box .input_box input::after { border: 3px solid #012b57; }
.form_box .btn_box { width: 100%; float:left; margin-top: 15px; }
.form_box .btn_box > button { width: 100%; float:left; height: 75px; line-height: 75px; border-radius: 20px; color:#fff; font-size: 22px; font-weight: 500; }
.mt_0 { margin-top: 0; }

.form_box .select_box { width: 100%; padding: 0 1.3%; margin-top: 2%; }
.form_box .select_box > ul { width: 100%; display: flex; gap:30px; margin-top: 10px; }
.form_box .checkbox_ctr { float:left; cursor: pointer; }
.form_box .checkbox_ctr input:checked ~ .checkmark { cursor:pointer; background: #f77700; border: 1px solid #f77700; }
.form_box .checkmark { cursor:pointer; position: absolute; top: 2px; left: 0; height: 24px; width: 24px; background: #999999; border: 1px solid #999; border-radius: 20px; transition:0.3s; transform-origin: left; }
.form_box .checkmark > i { text-align: center; color:#fff; margin:4px 5px; }
.form_box .agree_checkbox { float: left; padding: 0px 0px 0px 5px; font-size:1.2rem; font-weight:500; line-height:27px; color:#777; }
.form_box .etc { float: left; display: flex; align-items: center; left: -15px; cursor: pointer;  }
.form_box .etc .etc_btn { width: 80px; height: 22px; border-radius: 20px; line-height: 22px; color:#fff; background-color: #888; text-align: center; }
.form_box .checkbox_all { border-bottom: 1px solid #d3d3d3; padding-bottom: 10px; }

.graph_box { width: 100%; height: 40px; background-color: #fff; float:left; position: relative; border: 3px solid #fff; border-radius: 50px; margin-top: 3%; overflow: hidden; }
.graph_box .box { width: 30%; height: 34px; float:left; border-radius: 50px; background-image: linear-gradient(90deg, #19cbfa, #012b57); }
.graph_box .txt { font-size: 17px; font-weight: 500; line-height: 34px; margin-right: 20px; float: right; color: #012b57; position: absolute; right: 0; }
.form_wrap2 .graph_box .box { width: 60%; }
.form_wrap3 .graph_box .box { width: 100%; }
.form_wrap3 .graph_box .txt { color:#fff !important; }
.form_wrap3 .form_box .btn_box  { padding: 0 8%; }

/* 약관보기 팝업 */
.etc_popup{display: none; width: 100%; float: left; height:100%; background-color: rgba(0,0,0,0.8); position:fixed; top: 0; left: 0; z-index: 999;}
.etc_popup .popupwrap{width: 50%; float: left; text-align: left; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.etc_popup .popupwrap .title_box{width: 100%; float: left; height: 70px; line-height: 70px; background: #012b57; padding: 0 5%; color: #fff; border-radius: 7px 7px 0 0;}
.etc_popup .popupwrap .tt{width: 95%; float: left; font-size: 20px; font-weight: 600; }    
.etc_popup .popupwrap .closebtn{width: 5%; float: left; font-size: 24px; text-align: right; cursor: pointer; font-weight: 500; }
.etc_popup .popupwrap .contents{width: 100%; float: left; height: 550px; padding: 4% 3.5%; background: #fff; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;}
.etc_popup .popupwrap .contents .tit { width: 100%; float:left; font-size: 1.4rem; font-weight: 500; color:#222; }
.etc_popup .popupwrap .contents .txt { width: 100%; float:left; font-size: 1.1rem; font-weight: 500; color:#333; margin-top: 3%; }
.etc_popup .popupwrap .contents .sub_txt { width: 100%; float:left; font-size: 1.1rem; font-weight: 400; color:#666; margin-top: 3%; }
.etc_popup .popupwrap .contents .mglt { margin-left: 5px; }
.etc_popup .popupwrap .contents .sub_txt .red { color: #cc3333; }
.etc_popup .popupwrap .scroll{width: 100%; float: left; height: 480px; padding: 2%; overflow-y: scroll; overflow-x: hidden; border: 2px solid #f1f1f1; font-size: 17px; font-weight: 300; color:#666;}
.etc_popup .popupwrap .scroll::-webkit-scrollbar{width: 4px;}
.etc_popup .popupwrap .scroll::-webkit-scrollbar-thumb{background: #ededed; border-radius: 100px;}
.etc_popup .popupwrap .scroll::-webkit-scrollbar-track{border-radius: 100px; background-color: rgba(0,0,0,0);}
.etc_popup .popupwrap .scroll .tt { width: 100%; font-weight: 500; color:#333; font-size: 17px; } /*타이틀*/


.footer { width: 100%; float:left; background-color: #151c23; }
.footer .con_box{ width: 100%; max-width: 1300px; margin: 0 auto; padding: 4% 0; display: flex; justify-content: space-between; align-items: center;}
.footer .text { font-size: 15px; color:#909090; font-weight: 400; line-height: 28px; }
.footer .text .copyright { margin-top: 20px; }
.footer .f_logo { display: inline-block; text-align: right; }
.footer .f_logo > img { opacity: 0.3; }


/*반응형*/

/* 태블릿 세로 (1600 이하) */
@media only screen and (max-width: 1600px) {
    .main .con_box { max-width: 1100px; }
}

/* 태블릿 세로 (1300 이하) */
@media only screen and (max-width: 1300px) {
    .main .con_box { max-width: 1000px; }
    .footer .con_box { padding: 4% 5%; }
}

/* 태블릿 세로 (1000 이하) */
@media only screen and (max-width: 1000px) {
    .main { background-image: url(/images/main_bg.jpg); padding: 0 5%; }
    .main .con_box { max-width: 900px; }
    .main .text_box { width: 100%; }

    .footer .con_box { padding: 8% 5%; flex-direction: column-reverse; align-items: flex-start; gap: 30px; }
    
    /*신청폼*/
    .etc_popup .popupwrap{width: 70%;}
}

/* 태블릿 세로 (768 이하) */
@media only screen and (max-width: 768px) {
    .form_box { border-radius: 30px; }

    .main .text_box .title { font-size: 3rem; line-height: 55px; }
    .main .text_box .sub_txt { font-size: 1.5rem; }
    .main .text_box .main_btn > a > button { width: 300px; }


    .form_box .text_box .title { font-size: 2.5rem; margin-top: 6%; }
    .form_box .input_box input { height: 60px; line-height: 60px; border-radius: 10px; font-size: 1.4rem; }
    .form_box .btn_box > button { height: 60px; line-height: 60px; border-radius: 10px; font-size: 1.4rem; }
    .form_box .agree_checkbox { font-size: 1.1rem; padding: 0px; }
  
}


/* 태블릿 세로 (480 이하) -모바일 */
@media only screen and (max-width: 480px) {
    /*신청폼*/
    .etc_popup .popupwrap{width: 80%;}

    .top { font-size: 18px; }
    .main { height: 700px; padding: 5%; }
    .main .con_box { height: 680px; }
    .main .text_box .sub_tit { font-size: 2rem; }
    .main .text_box .title { font-size: 2.5rem; line-height: 47px; word-break: keep-all; }
    .main .text_box .sub_txt { font-size: 1.2rem; }
    .main .text_box .main_btn > a > button { width: 250px; height: 58px; line-height: 58px; font-size: 1.5rem; }
    
    .form_box .btn_back { font-size: 17px; height: 45px; line-height: 45px; }
    .form_box { padding: 2% 4% 6% 4%; }
    .form_box .text_box { padding: 7%; }
    .form_box .text_box .num { width: 45px; height: 45px; line-height: 48px; font-size: 22px; }
    .form_box .select_box > ul { gap: 18px; align-items: flex-start; }
    .form_box .agree_checkbox { font-size: 1rem; line-height: 19px; top: 1px; width: 66%; margin-left: 7px; }
    .form_box .checkmark { width: 20px; height: 20px; }
    .form_box .checkmark > i { margin: 1px 3px; }
    .form_box .etc .etc_btn {  line-height: 23px; width: 70px; font-size: 0.9rem; }
    .form_box .input_box { margin-top: 6%; }
    .form_box .input_box input { height: 58px; line-height: 58px; border-radius: 10px; font-size: 1.4rem; }
    .form_box .btn_box { margin-top: 10px; }
    .form_box .btn_box > button { height: 58px; line-height: 58px; border-radius: 10px; font-size: 1.4rem; }

    .graph_box .txt { font-size: 15px; }

    .footer .con_box { padding: 13% 5%; }
    .footer .text { font-size: 1rem; }
    
    
}

/* 태블릿 세로 (390 이하) -모바일 */
@media only screen and (max-width: 400px) {
    
    .main .con_box { height: 630px; }
    .main .text_box .title { font-size: 2.4rem; line-height: 43px; }
    .main .text_box .sub_tit { font-size: 1.8rem; }
    .form_box .agree_checkbox { font-size: 1rem; line-height: 19px; top: 3px; }

}