@charset "utf-8";

/*서브 공통*/
.sub_wrap {position: relative;}
.sub_inner {width: 100%; max-width: 760px; margin: 0 auto;}
.sub_container  {width: 100%; max-width: 760px; margin: 80px auto 180px;}

.list_line {padding-left: 10px; position: relative;}
.list_line::before {content:""; position: absolute; top:10px; left:0; width:5px; height: 1px; background: #333;}

.list_dot {padding-left: 10px; position: relative;}
.list_dot::before {content:""; position: absolute; top:10px; left:0; width:5px; height: 5px; border-radius: 50%; background: #003777;}

.list_type1 {padding-left: 10px; position: relative;}
.list_type1 span {content:""; position: absolute; top:3px; left:0;}

a.link {font-size: 15px; position: relative; color: #398de0; text-decoration: underline;}
/* a.link::before {content:""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #398de0;} */

@media (max-width:800px) {
    .sub_inner {width: 92%; max-width: 100%;  margin: 0 auto;}
    .sub_container {width: 92%; max-width: 100%;  margin: 10% 4% 22%;}
}



/*서브 탑배너*/
.sub_top {background: #002653; height: 570px; margin-top: 87px; color: #fff; text-align: center; display: flex; flex-flow: column wrap; justify-content: center; align-items: center;}
.sub_top_tit {justify-content: center; align-items: center; color: #fff; padding-bottom: 50px;}
.sub_top_tit h2 {font-size: 68px; font-weight: 700;}
.sub_top img {margin-right: 10px;}
.sub_top > h2 {font-size: 60px; font-weight: 700;font-family: 'SCoreDream'; margin-bottom: 20px;}
.sub_top h3 {font-size: 52px; font-weight: 700; line-height: 1.4;}
.sub_top h3.sm {font-size: 42px; font-weight: 500;}
.sub_top h4 {font-size: 28px; padding-top: 20px;}

@media (max-width:1080px) {
    .sub_top {height: 550px;margin-top: 78px;}
    .sub_top_tit {padding-bottom: 40px;}
    .sub_top_tit h2 {font-size: 60px;}
    .sub_top > h2 {font-size: 54px;margin-bottom: 25px;}
    .sub_top h3 {font-size: 48px;}
    .sub_top h3.sm {font-size: 44px;}
    .sub_top h4 {font-size: 24px; padding-top: 15px;}
}
@media (max-width:800px) {
    .sub_top {margin-top: min(78px,13%); height: max(400px,75vw);padding: 0 4%;}
    .sub_top_tit {padding-bottom: max(25px,5%);}
    .sub_top_tit img {width: min(64px,10vw); object-fit: cover; margin-right: 0;}
    .sub_top_tit h2 {font-size: max(40px,7.5vw);}
    .sub_top > h2 {font-size: max(36px,7vw);     margin-bottom: min(24px,3%);}
    .sub_top h3 {font-size: max(30px,6.5vw);}
    .sub_top h3.sm {font-size: max(25px,6vw);;}
    .sub_top h4 {font-size: max(20px,3.2vw); padding-top: 3%;}
}


/*서브 회색박스*/
.box_gray {padding: 40px; background: #f5f5f5; border: 1px solid #b5b5b5;}
.box_gray h3 {font-size: 20px; font-weight: 700; text-align: center; padding-bottom: 15px;}
.box_gray p {font-size: 18px; line-height: 1.8; letter-spacing: -0.03em;}
.box_gray b {font-weight: 700;}
@media (max-width:1080px) {
    .box_gray {padding: 35px;}
}
@media (max-width:800px) {
    .box_gray {padding: max(20px,4.5%);}
    .box_gray h3 {font-size: max(18px, 2.5vw); padding-bottom: 3%;}
    .box_gray p {font-size: max(16px, 2.25vw); }
}


/*서브 태그*/
.tag {margin: 20px 0;}
.tag li {padding: 8px 24px 8px 15px; background: #bbdf32; clip-path: polygon(93% 0%, 100% 50%, 93% 100%, 0% 100%, 0 50%, 0% 0%); font-size: 15px; font-weight: 500; margin-right: 10px;}
@media (max-width:800px) {
    .tag {margin: 3% 0;}
    .tag li {font-size: 14px; padding: 6px 20px 6px 12px;}
}


/*서브 컨텐츠 타이틀*/
.sub_tit {text-align: center; margin-bottom: 47px;}
.sub_tit h2 {font-size: 36px; font-weight: 700; padding-bottom: 17px;}
.sub_tit h2.color_b2 {padding-bottom: 5px;}
.sub_tit h3 {padding-bottom: 40px; font-size: 26px; font-weight: 600;}
.sub_tit h4 {font-size: 20px;}
.sub_tit p {font-size: 20px; }
@media (max-width:1080px) {
    .sub_tit {margin-bottom: 44px;}
    .sub_tit h2 {font-size: 33px;}
    .sub_tit h3 {padding-bottom: 35px; font-size: 25px;}
    .sub_tit p {font-size: 20px; }
}
@media (max-width:800px) {
    .sub_tit {margin-bottom: 40px;}
    .sub_tit h2 {font-size: max(26px,4.5vw); padding-bottom: 3%;}
    .sub_tit h3 {padding-bottom:4%; font-size: max(22px,4vw);}
    .sub_tit h3 br {display: none;}
    .sub_tit h4 {font-size:18px;}
    .sub_tit p {font-size:17px; }
}


/*서브 포인트 박스*/
.box_point {border: 1px solid #dfe5f2; padding: 40px;}
.box_point .top {justify-content: center; align-items: center;}
.box_point .bottom > li {align-items: flex-start; margin-bottom: 20px;}
.box_point .bottom > li:last-child {margin-bottom: 0;}
.box_point .top h5 {display: inline-block; margin: 10px 0 20px; padding-bottom: 2px; border-bottom:2px solid #398de0; color: #398de0;font-style: italic;}
.box_point .bottom span {width: 115px; padding: 6px 0;background: #398de0; color: #fff; text-align: center; clip-path: polygon(0 0, 100% 0%, 90% 100%, 0% 100%);}
.box_point .bottom ul {width: calc(100% - 115px); padding:6px 0 0 15px;}
.box_point .bottom ul li {font-size: 18px;}
.box_point_sm_txt {font-size: 14px; color: #999;}
@media (max-width:1080px) {
    .box_point { padding: 35px;}
}
@media (max-width:800px) {
    .box_point { padding: max(20px,4.5%);}
    .box_point .bottom > li {margin-bottom: 3%; font-size: 15px;}
    .box_point .top h5 {margin: 2% 0 15px; font-size: 18px;}
    .box_point .bottom span {width: 95px; padding: 6px 0;}
    .box_point .bottom ul {width: calc(100% - 95px); padding:6px 0 0 10px;}
}
@media (max-width:500px) {
    .box_point .bottom span {width: 115px; padding: 6px 0;}
    .box_point .bottom ul {width: 100%; padding:6px;}
    .box_point .bottom ul br {display: none;}
}


/*서브 qna*/
.qna {margin-top: 85px; position: relative;}
.qna .q {text-align: center; padding-bottom: 35px; margin-bottom: 25px; position: relative;}
.qna .q::before {content:""; position: absolute; bottom:0; left: 50%; transform: translateX(-50%); width: 20px; height: 1px; background: #111;}
.qna .q h3 {font-size: 30px; font-family: 'Lato', sans-serif; font-weight: 700; color: #398de0;}  
.qna .q h4 {font-size: 24px; font-weight: 500; padding-top: 10px;}
.qna .a p {font-size: 18px; font-weight: 400; line-height: 1.8; text-align: justify; letter-spacing: -0.02em;}
.qna .a b {font-weight: 700;}
.qna .a i {font-size: 16px; padding-top: 5px;}
.qna .qna_img {margin-top: 50px;}
.qna .qna_img img {border-radius: 20px; overflow: hidden;}
.qna .qna_img p {font-size: 18px; font-weight: 700; margin-top: 5px;}
.qna .qna_ico {position: absolute; top:0; right: 0;transform: translate(50%,-25%); width:min(154px,20%);}
.qna .qna_img2 {justify-content: space-between;}
.qna .qna_img2 div {width: 49%;}
.qna .qna_date {font-size: 18px; font-weight: 300; color: #999; font-style: italic;}
@media (max-width:1080px) {
    .qna {margin-top: 70px;}
    .qna .q {padding-bottom: 30px; margin-bottom: 20px;}
    .qna .qna_img {margin-top: 40px;}
    .qna .qna_ico {transform: translate(0,-25%); width:15%;}
}

@media (max-width:800px) {
    .qna {margin-top: 60px;}
    .qna .q {padding-bottom: 4%; margin-bottom: 3%;}
    .qna .q h3 {font-size: max(26px,3.75vw); }  
    .qna .q h4 {font-size: max(20px,4vw);}
    .qna .a p {font-size: max(16px, 2.25vw);}
    .qna .a i {font-size: max(14px, 2vw);}
    .qna .qna_img {margin-top: 40px;}
    .qna .qna_img p {font-size: max(15px, 2.25vw);}
    .qna .qna_date {font-size: max(16px, 2.25vw);}
}

@media (max-width:500px) {
    .qna {margin-top: 50px;}
    .qna .qna_img2 div {width: 100%; margin-bottom: 2%;}
    .qna .qna_img2 div img {width: 100%; object-fit: cover;}
    .qna .qna_img2 div:last-child {margin-bottom: 0;}
}

/*말풍선*/
.bubble_top, .bubble_bottom {display: flex;}
.bubble_txt {padding:30px; border-left: 1px solid #398de0; border-right: 1px solid #398de0;}
.bubble_txt h3 {font-size: 24px; text-align: center; color: #398de0; letter-spacing: -0.02em; line-height: 1.5;}

/*컨텐츠 마지막 추가텍스트*/
.last_box p {font-size: 16px; color: #999; margin-top: 85px;font-family: 'Pretendard';}
@media (max-width:1080px) {
    .last_box {margin-top: 70px;}
    .last_box p {font-size: 15px;}
}

@media (max-width:800px) {
    .last_box {margin-top: 60px;}
    .last_box p {font-size: 14px;}
}


/*서브 하단 네비*/
.sub_navi {background: #333;}
.sub_navi ul {align-items: center; padding: 15px 0;}
.sub_navi ul li {color: #fff; padding: 6px 0; font-family: 'Pretendard'; width: calc(100%/3); border-left: 2px solid #fff;}
.sub_navi ul li:nth-of-type(1) {border-left: 0;}
.sub_navi ul li a {align-items: center; justify-content: center;}
.sub_navi ul li:not(:first-child) a img {margin-left:10px;}
.sub_navi ul li:nth-of-type(1) a img {margin-right:10px;}
@media (max-width:1080px) {
    .sub_navi ul li:not(:first-child) a img {margin-left:8px;}
    .sub_navi ul li:nth-of-type(1) a img {margin-right:8px;}
}
@media (max-width:500px) {
    .sub_navi ul {padding: 10px 0;}
    .sub_navi ul li {padding: 6px 0; font-size: 0;}
    .sub_navi ul li:not(:first-child) a img {margin-left:0;}
    .sub_navi ul li:nth-of-type(1) a img {margin-right:0;}
}


/*서브 탑버튼*/
.top_btn {position: fixed; width: 60px; height: 60px; background: #00b4d7; border-radius: 50%; align-items: center; justify-content: center; right:4%; bottom:2%; cursor: pointer;}
@media (max-width:800px) {
    .top_btn {width: 45px; height: 45px;}
}



/*sub1*/


/*sub2*/


/*sub3*/


/*sub4*/
.sub4 .sub_top {background: #003f53;}
.sub4 .sub_tit {margin-top:50px}

.sub4 .sub4_box1.box_gray {background: #fff;}
.sub4 .sub4_box1 h4 {font-size: 28px;color: #002653;}
.sub4 .sub4_box1 ul {margin-top: 30px; padding-top: 30px;background: url(../images/ico/dashed_line.png)  no-repeat top center / contain;}
.sub4 .sub4_box1 ul .img {width: 100px;}
.sub4 .sub4_box1 ul h5 {width: calc(100% - 100px); font-style: italic;color: #398de0;}
.sub4 .sub4_box1 ul li:first-child {margin-bottom: 5px;}

.sub4 .sub4_box2 .top {padding: 20px 0; background: #f4c963; color: #fb7000; font-size: 25px; border-radius: 15px; text-align: center; position: relative;}
.sub4 .sub4_box2 .top::before {content:""; position: absolute; bottom:0; left: 50%; transform: translate(-50%,50%) rotate(45deg);width: 15px; height: 15px; background: #f4c963;}
.sub4 .sub4_box2 .qna_img {margin-top: 35px;} 

@media (max-width:1080px) {
    .sub4 .sub_tit {margin-top:45px}
    .sub4 .qna .q h4 br {display: none;}

    .sub4 .sub4_box1 h4 {font-size: 26px;}
    .sub4 .sub4_box2 .top  {padding: 18px 0; font-size: 23px;}
}
@media (max-width:800px) {
    .sub4 .sub_tit {margin-top:40px}
    .sub4 .sub4_box1 h4 {font-size: max(22px,3.6vw);}
    .sub4 .sub4_box2 .top  {padding: 15px 0; font-size: 21px; border-radius: 12px;}
}


/*sub5*/
.sub5 .sub_top {background: #003f53;}
.sub5 .box_point li.list_line {color: #666;}
.sub5 .box_point li.list_line::before {background: #666;}

.sub5 .sub5_box1 {margin: 40px 0 70px; text-align: center;}
.sub5 .sub5_box1 h4 {font-size: 24px; font-weight: 700; color: #398de0; padding-bottom: 3px; border-bottom: 1px solid #398de0; display: inline-block;} 
.sub5 .sub5_box1 h4 br {display: none;}
.sub5 .sub5_box1 ul {justify-content: space-between; margin-top: 30px;}
.sub5 .sub5_box1 ul li:nth-of-type(2n+1) {width: 168px; height: 168px;text-align: center; border-radius: 50%; border:2px solid #cdcdcd; padding-top:30px; align-items: center; }
.sub5 .sub5_box1 ul li.arr_right {width: 24px; align-items: center;}
.sub5 .sub5_box1 ul li h5 {font-size: 30px;color: #398de0; font-weight: 700; padding-bottom: 8px;margin-bottom: 8px; position: relative;}
.sub5 .sub5_box1 ul li h5::before {content: ""; position: absolute; left: 50%; transform: translateX(-50%); bottom:0; width: 80%; height: 2px; background: #333;}
.sub5 .sub5_box1 ul li p {font-size: 18px; font-weight: 700;} 

.sub5 .sub5_box2 .img {width: 30%; padding-right: 30px;}
.sub5 .sub5_box2 .tag {margin: 0 0 10px;}
.sub5 .sub5_box2 .txt {width: 70%;}
.sub5 .sub5_box2 .txt h3 {color: #398de0; font-size: 28px; text-align: left;}
.sub5 .sub5_box2 .txt p {text-align: justify;}

.sub5 .box_point .ls {letter-spacing: -0.025em;}

.sub5 .qna .qna_ico {transform: translate(25%,-45%); width: min(194px,25%);}
@media (max-width:1080px) {
    .sub5 .qna .qna_ico {transform: translate(0,-45%); }
}
@media (max-width:800px) {
    .sub5 .sub5_box1 h4 {font-size:max(22px, 4vw);}
    .sub5 .sub5_box1 ul {margin-top: 5%;}
    .sub5 .sub5_box1 ul li:nth-of-type(2n+1) {width: calc(49% - 18px); height: 41.5vw; padding-top:0; align-items: center; justify-content: center; margin-top: 10px;}
    .sub5 .sub5_box1 ul li.arr_right {width: 20px; align-items: center;}
    .sub5 .sub5_box1 ul li.arr_right:nth-of-type(4) {display: none;}
    .sub5 .sub5_box1 ul li h5 {font-size: max(26px, 4.2vw); padding-bottom: 4px;margin-bottom: 4px;}
    .sub5 .sub5_box1 ul li p {font-size:max(16px, 3.2vw);} 

    .sub5 .sub5_box2 .img {width: 100%; padding-right:0; text-align: center;}
    .sub5 .sub5_box2 .tag {justify-content: center;}
    .sub5 .sub5_box2 .txt h3 {text-align: center;}
    .sub5 .sub5_box2 .txt {width: 100%;}
    .sub5 .sub5_box2 .txt p { text-align: center;}
}
@media (max-width:500px) {
    .sub5 .sub5_box1 h4 br {display: block;}
   
}


/*sub6*/
.sub6 .sub_top {background: #003f53;}
.sub6 .sub6_tit_img {margin: 30px 0;}
.sub6 .qna .qna_img2 > div {position: relative;}
.sub6 .qna .qna_img2 div div {z-index: 2; transform: translate(20%,-25%);width: auto;}
@media (max-width:1080px) {
    .sub6 .qna .qna_img2 div div {transform: translate(0%,-25%); }
}


/*sub8*/
.sub7 .sub_top {background: #5c4c3d;}
.sub7 .qna .qna_img .sub7_img_p {text-align: center; margin-top: 30px; padding: 10px 0; border-radius: 5px; background: #e8dace; position: relative;}
.sub7 .qna .qna_img .sub7_img_p::before {content:"";  position: absolute; top:0; left: 50%; transform: translate(50%,-50%) rotate(45deg); width: 15px; height: 15px; background: #e8dace;}
.sub7 .sub7_box1 {padding: 40px; border:1px solid #cdcdcd;}
.sub7 .sub7_box1 .top {text-align: center;}
.sub7 .sub7_box1 .top h3 {font-size: 28px; font-weight: 500; color: #003777;}
.sub7 .sub7_box1 .top h4 {font-size: 20x; margin: 15px 0; display: block; font-weight: 700;}
.sub7 .sub7_box1 .top h5 {font-size: 20px; display: inline-block; line-height: 26px; padding-left: 30px; background: url(../images/ico/arr_right2.png) no-repeat top left / 26px;}
.sub7 .sub7_box1 .box {padding-top: 25px; margin-top: 25px; background: url(../images/ico/dashed_line.png) no-repeat top center / contain;}
.sub7 .sub7_box1 .box .img {justify-content: center; padding-bottom: 20px;}
.sub7 .sub7_box1 .box p {font-size: 18px; line-height: 1.8; letter-spacing: -0.02em; text-align: justify;}
.sub7 .sub7_box1 .box p b {font-weight: 700;}
@media (max-width:1080px) {
    .sub7 .qna .qna_img .sub7_img_p {margin-top: 25px;}
}
@media (max-width:800px) {
    .sub7 .qna .qna_img .sub7_img_p {margin-top: 5%; padding: 8px 0;}
    .sub7 .sub7_box1 {padding: max(20px,4.5%);}
    .sub7 .sub7_box1 .top h3 {font-size: 26px;}
    .sub7 .sub7_box1 .top h4 {font-size: 18px; margin: 12px 0;}
    .sub7 .sub7_box1 .top h5 {font-size: 18px;}
    .sub7 .sub7_box1 .box {padding-top: 20px; margin-top: 20px;}
    .sub7 .sub7_box1 .box p {text-align: left;}
}
@media (max-width:500px) {
    .sub7 .qna .qna_img div:last-child {margin-top: 5%;}
    .sub7 .sub7_box1 .top h5 {text-align: left; display: block; line-height: 22px; padding-left: 26px; background: url(../images/ico/arr_right2.png) no-repeat top left / 22px;}
}


/*sub8*/
.sub8 .sub_top {background: #4b002a;}
.sub8 .sub8_box1 h3 {padding: 15px 40px; background: #003777; color: #fff; display: inline-block; border-radius: 10px 10px 0 0; font-size: 26px; font-weight: 600;}
.sub8 .sub8_box1 .box_point {padding: 30px;}
.sub8 .sub8_box1 .box_point .bottom span {width: 32px; height: 32px; line-height: 32px;background: #003777; clip-path: none; border-radius: 50%; padding: 0;}
.sub8 .sub8_box1 .box_point .bottom ul {padding: 0 0 0 10px; width: calc(100% - 35px);}

.sub8 .sub8_box2 div {justify-content: center; align-items: center;}
.sub8 .sub8_box2 h3 {font-size: 36px; font-weight: 700; position: relative; margin: 0 10px;}
.sub8 .sub8_box2 h3 span{color: #efa300;}
.sub8 .sub8_box2 h3::before {content: "";  position: absolute; right: 0; bottom: -3px; width: 60%; height: 3px; background: #efa300; } 
.sub8 .sub8_box2 ul {margin-top: 50px; padding: 30px; background: #f5f5f5;}
.sub8 .sub8_box2 ul li {font-size: 20px; padding-left: 15px;}
.sub8 .sub8_box2 ul li b{font-weight:700;}
.sub8 .sub8_box2 ul li.list_dot::before {top: 13px;}
.sub8 a.link {margin-left: 22px;}
.sub8 .qna:not(:first-child) {margin-top: 120px;}

@media (max-width:1080px) {
    .sub8 .sub8_box1 h3 {font-size: 25px;}
    .sub8 .sub8_box2 h3 {font-size: 34px;}
    .sub8 .sub8_box2 ul {margin-top: 40px;}
    .sub8 .qna:not(:first-child) {margin-top: 100px;}
}

@media (max-width:800px) {
    .sub8 .sub8_box1 h3 {padding: 12px 30px; font-size: max(22px,3vw);}
    .sub8 .sub8_box1 .box_point {padding: max(15px,3.125vw);}
    .sub8 .sub8_box1 .box_point .bottom span {width: 30px; height: 30px; line-height: 30px;}
    .sub8 .sub8_box1 .box_point .bottom ul{width: calc(100% - 35px); }
    .sub8 .sub8_box1 .box_point .bottom ul li {font-size: 16px;}

    .sub8 .sub8_box2 h3 {font-size: max(22px,4vw); margin: 0;}
    .sub8 .sub8_box2 h3::before {height: 2px; } 
    .sub8 .sub8_box2 img {width: max(20px,7.5vw);}
    .sub8 .sub8_box2 ul {margin-top: max(25px,5vw); padding: max(15px,3.125vw); }
    .sub8 .sub8_box2 ul li {font-size: max(16px, 2.5vw); padding-left: 10px;}
    .sub8 .sub8_box2 ul li.list_dot::before {top: 13px;}
    .sub8 .qna:not(:first-child) {margin-top: 60px;}
}

@media (max-width:500px) {
    .sub8 .sub8_box1 h3 {padding: 12px 0; display: block; text-align: center;}
    .sub8 .sub8_box2 img {display: none;}
}