@charset "utf-8";

/* size */
@media screen and (max-width: 1250px) { } /* tablet */
@media screen and (max-width: 650px) { } /* mobile */

/* default */
*{
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    color : inherit;
    box-sizing: border-box;
    letter-spacing: inherit;
    line-height: inherit;
}

body{  font-family: 'Pretendard', sans-serif; font-weight:400; font-size: 16px; letter-spacing: -0.04em; }
section{ display:block; }
a{ color:inherit; }

.inner{ width:1200px; margin:0 auto; }

.paging_box{ padding:10px 0; display:flex; align-items: center; justify-content: center; }

select{
    -webkit-appearance: none; -moz-appearance: none;  appearance: none;
    background: url('../img/common/select-icon.png') no-repeat 98% 50% #fff; 
}
select::-ms-expand{ display:none; }

@media screen and (max-width: 1250px) { 
    /* .inner{ width:100%; padding:0 10px; } */
} /* tablet */
@media screen and (max-width: 650px) { 
    .paging_box{ font-size: 13px; }
} /* mobile */
/* font-family: 'Paperlogy'; */

/* 공통 */
.ptd { font-family: 'Pretendard', sans-serif; }
p { word-break: keep-all; color: #222; }
b { font-weight: 700; }

/* 호버 */
nav li.on { background-color: #092C5B; }
nav li:hover a { background-color: #092C5B; }

/* --- 헤더 --- */
header { width: 100%; position: fixed; top: 0; left: 0; z-index: 9999; background-color: #fff; font-family: 'Paperlogy';   }
header .headerTop { padding: 25px 0; display: flex; justify-content: space-between; }
header .headerTop .callDiv { width: 272px; font-size: 26px; padding: 5px; display: flex; align-items: center; justify-content: center; gap: 5px; color: #fff; background-color: #3495CF; font-weight: 700; border-radius: 100px; }
header .headerTop .callDiv .text { color: #fff; }
header nav { background-color: #183D6E; color: #fff; font-weight: 700; }
header nav ul { width: 100%; display: flex; }
header nav ul > li { width: calc(100%/3); font-size: 18px; text-align: center; }
header nav ul > li a { padding: 15px 0; display: block; }

/* --- 메인 --- */
/* sec1 */
section.sec1 { padding: 80px 0; background-color: #EEEFF1; }
section.sec1.in_main { padding: 220px 0 80px; }
section.sec1 .formDiv { padding: 50px 300px; background-color: #fff; font-family: 'Paperlogy';  }
section.sec1 .formDiv .title { font-size: 28px; font-weight: 700; text-align: center;  }
section.sec1 .formDiv .title .navy { color: #183D6E; }
section.sec1 .formDiv .title .pink { color: #E3047F; }
section.sec1 .formDiv .subTitle { padding: 15px 0 30px; color: #7F7F7F; font-family: 'Pretendard', sans-serif; text-align: center; }
section.sec1 .formDiv .formList {  }
section.sec1 .formDiv .formList > li { padding: 0; }
section.sec1 .formDiv .formList .ipt { padding: 20px 25px; }
section.sec1 .formDiv .formList .ipt::placeholder { color: #999; }
section.sec1 .formDiv .formList input[type=text], input[type=password], textarea { border-radius: 10px; background-color: #F5F5F5; }
section.sec1 .formDiv  button.formBtn { width: 420px; padding: 15px 0; font-size: 24px; display: block; margin: 0 auto; border-radius: 10px; font-weight: 700; border: none; background-color: #183D6E; color: #fff;  }
section.sec1 .formDiv .agreeCheckDiv { justify-content: center; padding: 15px 0; }
section.sec1 .agreeCheckDiv label input[type="checkbox"] + .textBox {  color: #222; align-items: center; }
section.sec1 .agreeCheckDiv .privacyPopupBtn { padding: 2px 5px; font-size: 10px; display: block; color: #fff; background-color: #333; border-radius: 3px; }
/* sec2 */
section.sec2 { padding: 60px 0 74px; font-family: 'Paperlogy'; }
section.sec2 .title { font-size: 28px; font-weight: 700; text-align: center; }
section.sec2 .title .pink { color: #E3047F; }

section.sec2 .sec2Div { display: flex; justify-content: space-between;  margin-top: 30px; gap: ; }
section.sec2 .sec2Div .box {  }
section.sec2 .sec2Div .box1 { width: 800px; padding: 30px 0 0 40px; border: 1px solid #E4E4E4; border-right: none;  }
section.sec2 .sec2Div .box1 .titleBox { padding-bottom: 25px; border-bottom: 2px solid #000; }
section.sec2 .sec2Div .box1 .titleBox .s_title { font-size: 28px; font-weight: 700; margin-bottom: 10px; }
section.sec2 .sec2Div .box1 .titleBox .s_subTitle { color: #7f7f7f; }

section.sec2 .sec2Div .stepUl { width: 100%; }
section.sec2 .sec2Div .stepUl > li { width: 700px; padding: 25px 0; display: flex; align-items: center; gap: 20px; border-bottom: 1px solid #E4E4E4; }
section.sec2 .sec2Div .stepUl > li.list1 { background: url(../img/main/sec2/1.png) no-repeat right bottom / 72px; }
section.sec2 .sec2Div .stepUl > li.list2 { background: url(../img/main/sec2/2.png) no-repeat right bottom / 72px; }
section.sec2 .sec2Div .stepUl > li.list3 { background: url(../img/main/sec2/3.png) no-repeat right bottom / 72px; }
section.sec2 .sec2Div .stepUl > li.list4 { background: url(../img/main/sec2/4.png) no-repeat right bottom / 72px; }
section.sec2 .sec2Div .stepUl > li .stepImg {  }
section.sec2 .sec2Div .stepUl > li .stepBox {  }
section.sec2 .sec2Div .stepUl > li .stepBox .title2 { font-size: 22px; font-weight: 700; color: #426687; margin-bottom: 10px; }
section.sec2 .sec2Div .stepUl > li .stepBox .text { font-size: 15px; line-height: 140%; color: #7F7F7F; }

section.sec2 .sec2Div .box2 {  }
section.sec2 .sec2Div .box2 .imgBox { width: 400px; aspect-ratio: 1; }
section.sec2 .sec2Div .box2 .imgBox .text_1 { font-size: 26px;  }
section.sec2 .sec2Div .box2 .imgBox .text_2 { font-size: 14px; margin: 10px 0; }
section.sec2 .sec2Div .box2 .imgBox1 p { color: #3495CF; line-height: 140%; }
section.sec2 .sec2Div .box2 .imgBox2 p { color: #3B1C1C; }
section.sec2 .sec2Div .box2 .imgBox1 { padding: 40px 0 0 40px;  background: #D0E4EF url(../img/main/sec2/img1.png) no-repeat right bottom / 324px;  }
section.sec2 .sec2Div .box2 .imgBox2 { padding: 30px 0 0; display: flex;  align-items: center;  flex-direction: column; background: #FCCF04 url(../img/main/sec2/img2.png) no-repeat center bottom / 346px; }
section.sec2 .sec2Div .box2 .imgBox2  .text_3 { width: 300px; display: block; width: ; padding: 13px 0; border-radius: 10px; color: #FCCF04; background-color: #3B1C1C; text-align: center;  }

/* sec3 */
section.sec3 { padding: 80px 0; background-color: #E4E7F6; font-family: 'Paperlogy';  }
section.sec3 .title { font-size: 28px; font-weight: 700; text-align: center; }
section.sec3 .title .pink { color: #E3047F; }

section.sec3 .sec3Div {  }
section.sec3 .sec3Div .sec3Ul { margin-top: 20px; background-color: #fff; display: flex; flex-wrap: wrap; justify-content: center; }
section.sec3 .sec3Div .sec3Ul > li { width: calc(100%/2); display: flex; justify-content: space-between; }
section.sec3 .sec3Div .sec3Ul > li.list1 { justify-content: space-between; }
section.sec3 .sec3Div .sec3Ul > li.list1,
section.sec3 .sec3Div .sec3Ul > li.list3 { padding: 100px 29px 100px 30px ;   text-align: right; border-right: 1px solid #E4E4E4; }
section.sec3 .sec3Div .sec3Ul > li.list1,
section.sec3 .sec3Div .sec3Ul > li.list2 { border-bottom: 1px solid #E4E4E4; }
section.sec3 .sec3Div .sec3Ul > li.list2,
section.sec3 .sec3Div .sec3Ul > li.list4 { padding: 100px 8px 100px 29px ;   }
section.sec3 .sec3Div .sec3Ul > li .img1 {  }
section.sec3 .sec3Div .sec3Ul > li .box {  }
section.sec3 .sec3Div .sec3Ul > li .box .text_1 .color1 { color: #43A4FF; }
section.sec3 .sec3Div .sec3Ul > li .box .text_1 .color2 { color: #426687; }
section.sec3 .sec3Div .sec3Ul > li .box .text_1 .color3 { color: #0D2048; }
section.sec3 .sec3Div .sec3Ul > li .box .text_1 .color4 { color: #436FDE; }
section.sec3 .sec3Div .sec3Ul > li .box .text_1  { margin-bottom: 15px; font-size: 22px; color: #7F7F7F; }
section.sec3 .sec3Div .sec3Ul > li .box .text_2 { line-height: 160%; }
section.sec3 .sec3Div .sec3Ul > li.list1 .box .text_2 { color: #43A4FF; }
section.sec3 .sec3Div .sec3Ul > li.list2 .box .text_2 { color: #426687; }
section.sec3 .sec3Div .sec3Ul > li.list3 .box .text_2 { color: #0D2048; }
section.sec3 .sec3Div .sec3Ul > li.list4 .box .text_2 { color: #436FDE; }

/* --- 푸터 --- */
footer { padding: 60px 0; background-color: #333; color: #fff; font-family: 'Paperlogy'; }
footer p { color: #fff; }

footer .footerTop { padding-bottom: 25px; border-bottom: 1px solid #fff; }
footer .footerTop ul { display: flex; align-items: center; }
footer .footerTop ul > li {  }
footer .footerTop ul > li:nth-of-type(1)::after { content: ''; width: 3px; height: 15px; background-color: #fff; display: inline-block; margin: 0 10px; }
footer .footerTop ul > li:nth-of-type(2)::after { content: ''; width: 3px; height: 15px; background-color: #fff; display: inline-block; margin: 0 10px; }
footer .footerTop ul > li a { font-size: 18px; font-weight: 700; }

footer .footerBottom { padding-top: 25px; display: flex; flex-direction: column; gap: 35px; }
footer .footerBottom .text { font-weight: 700; } 
footer .footerBottom .text_1 { line-height: 180%; }
footer .footerBottom .text_3 { line-height: 180%; }
footer .footerBottom .text_4 { line-height: 180%; }

footer p.copyright { color: #7f7f7f; margin-top: 20px; }


/* --- 서브 --- */
/* sub1 */

/* arti_1 */
section.sub1 { padding: 200px 0 80px; }
section.sub1 .arti_1 { padding: 60px 100px; background: url(../img/sub/sec1/bg.png) no-repeat center / cover; font-family: 'Paperlogy'; border-radius: 50px; }
section.sub1.sub2 .arti_1 {  background: url(../img/sub/sec2/bg.png) no-repeat center / cover; font-family: 'Paperlogy'; border-radius: 50px; }
section.sub1.sub3 .arti_1 {  background: url(../img/sub/sec3/bg.png) no-repeat center / cover; font-family: 'Paperlogy'; border-radius: 50px; }
section.sub1 .arti_1 .arti_1_div {  }
section.sub1 .arti_1 .arti_1_div .text_1 { font-size: 24px; }
section.sub1 .arti_1 .arti_1_div .text_2 { font-size: 46px; margin: 10px 0 30px; color: #ffb10a; text-shadow: 3px 4px 4px rgba(0, 0, 0, 0.25); }
section.sub1.sub2 .arti_1 .arti_1_div .text_2 { color: #1A69CA; }
section.sub1.sub3 .arti_1 .arti_1_div .text_2 { color: #1A69CA; }
section.sub1 .arti_1 .arti_1_div ul { display: flex; flex-direction: column; gap: 10px; }
section.sub1 .arti_1 .arti_1_div ul > li { display: flex; align-items: center; gap: 10px; }
section.sub1 .arti_1 .arti_1_div ul > li .text_3 { font-size: 24px; }
section.sub1 .arti_1 .arti_1_div ul > li .text_3 span { font-size: 14px; }
section.sub1 .arti_1 .arti_1_div ul > li .navyBox { font-size: 24px; width: 77px; text-align: center; padding: 5px 0; font-weight: 700; color: #fff; background-color: #183D6E; }
section.sub1 .arti_1 .arti_1_div ul > li .navyBox .text_3 { font-size: 24px; }

/* arti_2 */
section.sub1 .arti_2 {  }
section.sub1 .arti_2 ul { width: calc(100% + 20px ); margin-left: -10px; display: flex; flex-wrap: wrap; margin-top: 30px; }
section.sub1 .arti_2 ul > li {  width: calc(100%/4);  padding: 10px; text-align: center;  }
section.sub1 .arti_2 ul > li.grayList { width: calc((100%/4) * 2); }
section.sub1 .arti_2 ul > li.grayList .item { aspect-ratio: unset; background-color: #F8F8F8; }
/* section.sub1 .arti_2 ul > li.list2 { justify-content: flex-start; } */
/* section.sub1 .arti_2 ul > li.list2 .item { padding-top: 20px; justify-content: flex-start; } */
section.sub1 .arti_2 ul > li.list8 { width: 100%; text-align: left; }
section.sub1 .arti_2 ul > li.list8 .item { gap: 50px; padding: 30px 0 30px 50px; aspect-ratio: unset; flex-direction: row; justify-content: flex-start;  }
section.sub1 .arti_2 ul > li.list8 .box2 { text-align: center; }
section.sub1 .arti_2 ul > li .item { aspect-ratio: 1; height: 100%; padding: 5px 0;  border: 1px solid #E4E4E4; display: flex; flex-direction: column; align-items: center; justify-content: center; }
section.sub1 .arti_2 ul > li .img1 {  }
section.sub1 .arti_2 ul > li .text_1 { margin: 5px 0; font-size: 22px; color: #426687; text-align: center;  }
section.sub1 .arti_2 ul > li .text_2 { font-size: 14px; line-height: 140%; }
section.sub1 .arti_2 ul > li .text_2 b {  }

/* arti_3 */
section.sub1 .arti_3 { margin-top: 50px; }
section.sub1 .arti_3 .title { font-size: 22px; padding: 25px 0; color: #426687; border-top: 2px solid #222; border-bottom: 2px solid #222; font-family: 'Paperlogy'; }
section.sub1 .arti_3  ul { padding-bottom: 30px; display: flex; flex-direction: column; gap: 30px; margin-top: 35px; border-bottom: 1px solid #E4E4E4; }
section.sub1 .arti_3  ul > li {  }
section.sub1 .arti_3  ul > li p.text_1 { line-height: 170%; }
section.sub1 .arti_3  ul > li b { font-size: 14px; display: block; margin-bottom: 5px; color: #1882CA; }
section.sub1 .arti_3  ul > li strong { font-weight: 700; }
section.sub1 .arti_3  ul > li p.text_1 span { font-size: 14px; line-height: 170%; }







/* popup */

.f_popup_bg{ 
    background-color:rgba(0,0,0,0.5); position:fixed;
    left:0; top:0; width:100%; height:100%; z-index:9999; 
    display:flex; align-items: center; justify-content: center;
    padding:10px; font-family: 'Noto Sans KR', sans-serif;
    opacity:0; visibility: hidden; transition: all 0.5s;

}
.f_popup_bg.on{ opacity:1; visibility: visible; }
.f_popup_bg .popup_box{ width:100%; max-width:1000px; border-radius: 20px; overflow: hidden; }
.f_popup_bg .btn_wrap{ width:100%; display:flex; justify-content: space-between; background-color: #183D6E; align-items: center; padding: 15px 50px; }
.f_popup_bg .btn_wrap .btn{ width:30px; height:30px; cursor:pointer; padding:0; }
.f_popup_bg .btn_wrap .btn span{ display:block; width:100%; height:2px; background-color:#fff;  }
.f_popup_bg .btn_wrap .btn span:nth-child(1){ transform: translateY(14px) rotate(-45deg); -webkit-transform: translateY(14px) rotate(-45deg); }
.f_popup_bg .btn_wrap .btn span:nth-child(2){ transform: translateY(12px) rotate(45deg); -webkit-transform: translateY(12px) rotate(45deg); }
.f_popup_bg .content_wrap{ padding: 20px; background-color:#fff; overflow-y: scroll; max-height: 80vh; }
.f_popup_bg  p.title{  color: #fff;  font-weight: 600; font-size: 20px;  }
.f_popup_bg .content_wrap p.content{ color: #181818; padding:0 50px 40px 50px; font-size: 20px; margin-top:30px;  }

@media screen and (max-width: 650px) {
    .f_popup_bg .content_wrap p.content{ font-size: 14px; margin-top: 20px; }
    .f_popup_bg .content_wrap{ padding: 20px 15px;  }
}