@charset "utf-8";
/* sub css */

.a .sub_banner {background: url(../images/sub/a1_banner.jpg) no-repeat center / cover;}
.b .sub_banner {background: url(../images/sub/b1_banner.jpg) no-repeat center / cover;}
.c .sub_banner {background: url(../images/sub/c1_banner.jpg) no-repeat center / cover;}
.f .sub_banner {background: url(../images/sub/f1_banner.jpg) no-repeat center / cover;}

.sub_banner {position: relative; height: max(200px,44rem); border-radius: 3rem; overflow: hidden; max-width: 1720px; margin: 0 auto;}
/* .sub_banner[data-aos^=fade][data-aos^=fade] {opacity: 1;}
.sub_banner:not(.sub_banner2) {clip-path: polygon(5% 5%, 95% 5%, 95% 95%, 5% 95%); transition: all 0.4s;}
.sub_banner:not(.sub_banner2).aos-animate {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);} */
.sub_banner .banner-img img {width: 100%; height: 100%; object-fit: cover;}
.sub_banner .banner-txt {height: 100%; justify-content: space-between; color: #fff; padding: 4rem 12rem 6rem;} 
.sub_banner .sub-navi {justify-content: flex-end; align-items: center;}
.sub_banner .sub-navi li {font-size: max(13px,1.6rem);}
.sub_banner .sub-navi li span {font-weight: 700;}
.sub_banner .sub-navi li img {height:  1.2rem; filter: invert(100%) sepia(0%) saturate(12%) hue-rotate(192deg) brightness(104%) contrast(103%); margin: 0 .6rem;}
.sub_banner .banner-txt h2 {font-size: 5rem; font-weight: 500; }
.sub_banner .banner-txt h2 span {font-weight: 600;}

.sub_banner2 {height: auto; padding-top: 4rem; border-radius: 0;}
.sub_banner2 .sub-navi {position: absolute; top:4rem; right:0;}
.sub_banner2 .sub-navi li:first-child {color: #999;}
.sub_banner2 .sub-navi li img {filter: invert(67%) sepia(5%) saturate(13%) hue-rotate(31deg) brightness(90%) contrast(91%);}
.sub_banner2 .sub-navi li b {color: var(--point);}
.sub_banner2 h3 {font-size: 6rem; font-weight: 800; font-family: "Pretendard"; line-height: 1.15; }
.sub_banner2 h3 span {color: #0160ee;}
@media (max-width:1720px) {
    .sub_banner {margin: 0 4%;}
    .sub_banner .banner-txt {padding: 4rem 10rem 6rem;} 
    .sub_banner2 {margin: 0; padding: 4% 4% 0;}
    .sub_banner2 .sub-navi {right: 4%;}
}
@media (max-width:1400px) {
    .sub_banner .banner-txt {padding: 3rem 8rem 5rem;} 
}
@media (max-width:768px) {
    .sub_banner .banner-txt {padding: 3rem 5rem 4rem;} 
}

.sub-tab {margin-bottom: 6rem; gap: 2rem 6rem;}
.sub-tab li {font-size: 2.6rem; font-weight: 600; color: #999; font-family: 'Pretendard'; padding-bottom: 0.5rem; position: relative; text-align: center;}
.sub-tab li.active {color: var(--point);}
.sub-tab li.active::before {content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: var(--point);}
@media (max-width:1080px) {
    .sub-tab {gap: 2rem 4rem;}
}

/* 서브 footer */
.sub-footer {display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; font-family:'Pretendard'; margin-top: 11rem; color: #fff;}
.sub-footer a {position: relative;}
.sub-footer .img {height: min(168px,17rem); border-radius: 2.3rem; overflow: hidden;}
.sub-footer .img img {height: 100%; object-fit: cover;}
.sub-footer .txt {position: absolute;  z-index: 2; top:0; margin: 4rem 4rem 0;}
.sub-footer .txt p {font-size: 1.6rem;}
.sub-footer .txt h3 {font-size: 2.8rem; font-weight: 700; line-height: 1.3;}
.sub-footer .txt .arr {width: 1.5rem; filter: invert(100%) sepia(0%) saturate(12%) hue-rotate(192deg) brightness(104%) contrast(103%); position: absolute; bottom:1.5rem;}
.sub-footer .prev .txt {left: 0; padding-left: 3rem;}
.sub-footer .prev .txt .arr {left: 0; transform: rotate(180deg);}
.sub-footer .next .txt {right: 0; padding-right: 3rem; text-align: right;}
.sub-footer .next .txt .arr {right:0;}
@media (max-width:1080px) {
    .sub-footer .img {height: 15rem;}
    .sub-footer .txt {margin: 3rem 3rem 0;}
}
@media (max-width:768px) {
    .sub-footer {gap: 2rem;}
    .sub-footer .img {height: 13rem;}
    .sub-footer .txt {margin: 2rem 2rem 0;}
    .sub-footer .txt h3 {font-size: 2.4rem;}
}


/* 서브 content 공통 */
.sub-container {max-width: 1460px; margin: 0 auto; padding: 7rem 0 8.5rem;}
.sub-container .sub-content {position: relative;}
.sub-container .progress-bar {position: absolute; left:0; top:0; width: 3px; height: 100%; background: #ccc;}
.sub-container .progress {position: absolute; top:0; left:0; width: 100%; background: var(--point);}
@media (max-width:1600px) {
    .sub-container { padding: 7rem 4% 8.5rem;}
}

/* 서브페이지 sub_type1 */
.sub-type1 {padding-left: 19rem;}
.sub-type1 .box-wrap {display: grid; gap: 1.6rem;}
.sub-type1 .box {display: grid; grid-template-columns: 200px 1fr; gap: 1.6rem; }
.sub-type1 .box .img {border-radius: 2rem; overflow: hidden;}
.sub-type1 .box .txt {background: #f6f6f6; border-radius: 2rem; padding: 4rem 5rem; justify-content: space-between; align-content: flex-start; font-family: 'Pretendard'; transition: all 0.3s;}
.sub-type1 .box .txt p {font-size: 1.8rem; font-weight: 500; color: #666;}
.sub-type1 .box .txt p b {color: #0160ee;}
.sub-type1 .box .txt h4 {font-size: 2.7rem; font-weight: 600; width: 100%; margin-top: 1.5rem; line-height: 1.4;}
.sub-type1 .box:hover .txt {background: #e9edf4;}
@media (max-width:1600px) {
    .sub-type1 {padding-left: 14rem;}
}
@media (max-width:1080px) {
    .sub-type1 {padding-left: 10rem;}
    .sub-type1 .box {grid-template-columns: 1fr 4fr; gap: 1.6rem; }
    .sub-type1 .box img {height: 100%; object-fit: cover;} 
    .sub-type1 .box .txt {padding: 3rem 4rem;}
    .sub-type1 .box .txt h4 {font-size: 2.4rem; margin-top: 1rem;}
}
@media (max-width:768px) {
    .sub-type1 {padding-left: 6rem;}
    .sub-type1 .box {grid-template-columns: 1fr; gap: 1.6rem; }
    .sub-type1 .box .img {display: none;}
}

 /* sub_type2 style */
.sub-type2 {padding-left: 19rem;}
.sub-type2 .cont:not(:first-child) {margin-top: 8rem;}
.sub-type2 .cont-title1 {font-size: 4.3rem; font-weight: 700; color: var(--point); margin-bottom: 6rem;}
.sub-type2 .cont-title1 span {font-weight: 600;}
.sub-type2 .cont-title2 {justify-content: space-between; align-items: flex-end; margin-bottom: 3rem;}
.sub-type2 .cont-title2 h3 {font-size: 2.8rem; font-weight: 600; font-family: 'Pretendard'; padding-left: 3.6rem; position: relative;}
.sub-type2 .cont-title2 h3::before {content:""; position: absolute; top:1.2rem; left: 0; width: 2rem; height: 2rem; background: var(--point);}
.sub-type2 .cont-title2 h3 span {font-weight: 500; font-family: 'Poppins';}
.sub-type2 .cont-title2 p {font-size: max(13px,1.6rem); color: #666; font-weight: 500; font-family: 'Pretendard';}
.sub-type2 .box-type1 {display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem 2rem; }
.sub-type2 .box-type1 .box {background: #f5f6f7; padding: 2.5rem 4rem; border-radius: 1rem; height: max(125px,18rem); display: flex; flex-flow: column wrap; justify-content: space-between;}
.sub-type2 .box-type1 .box h4 {font-size: 2.4rem; font-weight: 700;}
.sub-type2 .box-type1 .box p {font-size: 5.5rem; font-weight: 600; font-family: 'Pretendard'; text-align: right;}
.sub-type2 .box-type1 .box:last-child {background: #0160ee; color: #fff;}
.sub-type2 table { width: 100%; border-collapse: collapse; border-top: 1px solid var(--point);}
.sub-type2 table th {font-size: 1.8rem; font-weight: 600; color: var(--point); text-align: center; padding: 1.8rem 1rem;border-bottom: 1px solid var(--point);}
.sub-type2 table tbody tr {border-bottom: 1px solid #dbe0ed;}
.sub-type2 table td {font-size: 1.8rem; letter-spacing: -0.03rem; text-align: center; padding: 1.5rem 0.5rem;}
.sub-type2 table .bg {background: #f7fbff;}
.sub-type2 .table-type1 table {position: relative;}
.sub-type2 .table-type1 table::before {content:""; position: absolute; bottom:0; left:0; width: 100%; height: 1px; background: var(--point);}
.sub-type2 .table-type1 th:nth-of-type(3),
.sub-type2 .table-type1 td:nth-of-type(3) {background: #f7fbff;}
.sub-type2 .table-type1 tr.hidden { display: none !important;}
.sub-type2 .table-type1 .show {display: block !important;}
.sub-type2 .table-type1 .dropdown { position: relative; display: inline-block;}
.sub-type2 .table-type1 .dropdown-btn {position: relative;}
.sub-type2 .table-type1 .dropdown-btn::before {content:""; position: absolute; top:50%; transform: translateY(-50%); right:-2.5rem; width: 0; height: 0; border-style: solid; border-width: 6px 4px 0px 4px; border-color: var(--point) transparent transparent transparent;} 
.sub-type2 .table-type1 .dropdown-content {display: none; position: absolute; background: #fff; border: 1px solid #ddd; left: 50%; transform:translateX(-50%); min-width: 14rem; z-index: 1; padding: 1rem;}
.sub-type2 .table-type1 .dropdown-content a {font-size: max(12px,1.5rem); font-weight: 300; display: block; cursor: pointer; color: #666; padding: .5rem 0; margin: .25rem;}
.sub-type2 .table-type1 .dropdown-content a:hover {color: #000;font-weight: 400;}
.sub-type2 .table-type1 .pagination { display: flex; flex-flow: row wrap; justify-content: center; margin-top: 4rem; gap: 1rem;}
.sub-type2 .table-type1 .pagination button { width: 3rem; height: 3rem; line-height: 3rem;  cursor: pointer; font-size: max(13px,1.6rem); color: 999;}
.sub-type2 .table-type1 .pagination button.active { background: #0160ee; color: white; border-color: #0160ee;}
.sub-type2 .table-type2 td a {display: flex; justify-content: center; align-items: center;}
.sub-type2 .table-type2 td img {transform: rotate(180deg); width: 2.1rem;}
.sub-type2 .table-type2 td a:hover img {filter: invert(13%) sepia(60%) saturate(3446%) hue-rotate(216deg) brightness(89%) contrast(104%);}
.sub-type2 .table-type2 th:nth-of-type(1),
.sub-type2 .table-type2 td:nth-of-type(1) {background: #f7fbff;}
.sub-type2 .table-type2 td:nth-of-type(3) {text-align: left; font-size: 1.9rem;}
.sub-type2 .bg-box {padding: 2.5rem 3rem; background: #f5f6f7; border-radius: 2rem; margin-top: 4rem;}
.sub-type2 .bg-box p {font-size: 1.8rem; font-family: 'Pretendard'; color: #666; text-indent: -1.4rem; padding-left: 1.4rem;}
.sub-type2 .table-wrap::-webkit-scrollbar { background: #ccc;  height: 1em;}
.sub-type2 .table-wrap::-webkit-scrollbar-thumb {background: var(--point); }
@media (max-width:1600px) {
    .sub-type2 {padding-left: 14rem;}
}
@media (max-width:1080px) {
    .sub-type2 {padding-left: 10rem;}
    .sub-type2 .box-type1 {grid-template-columns: repeat(2,1fr);}
    .sub-type2 .table-type2 .table-wrap {overflow-x: scroll; padding-bottom: 2rem;}
    .sub-type2 .table-type2 .table-wrap table {min-width: 890px;}
}
@media (max-width:768px) {
    .sub-type2 {padding-left: 6rem;}
    .sub-type2 .cont-title2 p {width: 100%; text-align: right; margin-top: 1rem;}
    .sub-type2 .table-type1 .table-wrap {overflow-x: scroll;padding-bottom: 2rem;}
    .sub-type2 .table-type1 .table-wrap table {min-width: 650px;}
}

.sub-type3 {padding-left: 19rem;}
.sub-type3 .box-head p { font-size: 2rem; font-weight: 600; margin-bottom: 4rem;}
.sub-type3 .box-head p span {color: #0160ee;}
.sub-type3 .box-head h4 {font-size: 2rem; font-weight: 500; padding: 0 3rem; height: 9rem; line-height: 9rem; background: #fbfbfc; border-top: 1px solid #000;}
.sub-type3 .box {padding: 5.5rem 3rem; position: relative; border-bottom: 1px solid #eee;}
.sub-type3 .box .arr {position: absolute; top:50%; right:5rem; transform: translateY(-50%); width: 6rem; height: 6rem; border-radius: 50%; background: #cecece; align-items: center; justify-content: center; visibility: hidden; opacity: 0; transition: all 0.3s;}
.sub-type3 .box .arr img {width: min(25px,50%); transform: scale(-1,1); filter: invert(100%) sepia(0%) saturate(12%) hue-rotate(192deg) brightness(104%) contrast(103%);} 
.sub-type3 .box h4 {font-size: 2.6rem; font-weight: 500;transition: all 0.3s;}
.sub-type3 .box p {font-size: 1.8rem; color: #999; margin-top: 2rem;} 
.sub-type3 .box:hover .arr {right: 3rem; visibility: visible; opacity: 1;} 
.sub-type3 .box:hover h4 {color: #0160ee; font-weight: 600;}
@media (max-width:1600px) {
    .sub-type3 {padding-left: 14rem;}
}
@media (max-width:1080px) {
    .sub-type3 {padding-left: 10rem;}
    .sub-type3 .box-head h4 {height: 7rem; line-height: 7rem;}
    .sub-type3 .box {padding: 5.5rem 8rem 5.5rem 3rem;}
    .sub-type3 .box h4 {font-size: 2.4rem; }
    .sub-type3 .box .arr {width: 5rem; height: 5rem;}
}
@media (max-width:768px) {
    .sub-type3 {padding-left: 6rem;}
}

/* e */
.e .sub_banner {justify-content: space-around; position: relative; max-width: 100%;}
.e .sub_banner .wrap {width: min(1460px,100%); margin: 0 auto; justify-content: space-between; position: relative;}
.e .sub_banner .sub-navi {top:0;}
.e .sub_banner .txt {width: min(79rem, 55%); padding:4rem 0 9rem;}
.e .sub_banner .txt img {height: 6rem;}
.e .sub_banner .txt img:nth-of-type(2) {margin: 2rem 0 0 auto;}
.e .sub_banner .txt h3 {margin: 7rem 0 5rem;}
.e .sub_banner .txt h4 {font-size: 4.4rem; font-weight: 800;}
.e .sub_banner .txt p {font-size: 2.2rem; margin-bottom: 1rem;}

.e .sub_banner .img {position: absolute; bottom: 0; left: 68%; transform: translateX(-50%); z-index: -1;}
.e .sub_banner .img .people { width: min(54rem,100%);}
.e .sub_banner .img-animation img {position: absolute; left: 40%; bottom:0; transform: translate(-50%, 46%); z-index: -1; max-width: none; width: 192%;}
.e .sub_banner .img-animation img:nth-of-type(2) {animation: sub_rotate-ani 20s linear infinite; width: 140%;}
.e .sub_banner .img-animation img:nth-of-type(3) {animation: sub_rotate-ani 20s linear infinite; width: 115%;}

.e .sub-container {max-width: 100%; background: #edf1f6; padding: 11rem 0 9rem;}
.e .sub-content {padding-left: 26rem; max-width: 1460px; margin: 0 auto;}
.e .sub-content p {font-size: max(16px,2rem); line-height: 1.6; letter-spacing: -0.04rem;} 
.e .sub-content p.indent {padding-left: 1.6rem; text-indent: -1.6rem;} 

.e .sub-footer {max-width: 1460px; margin: 11rem auto 0;}

@media (max-width:1720px) {
    .e .sub_banner {justify-content: space-between;}
    .e .sub-content {padding-left: 20rem;}
}
@media (max-width:1600px) {
    .e .sub-container {padding: 11rem 4% 9rem;}
}
@media (max-width:1280px) {
    .e .sub_banner .txt {padding-bottom: 5rem;}
    .e .sub_banner .txt h3 {margin: 6rem 0 3rem;}
    .e .sub_banner .img {left: 65%; transform: translateX(-37%);}
    .e .sub-content {padding-left: 14rem;}
}
@media (max-width:1080px) {
    .e .sub_banner .txt {width: max-content; position: relative; z-index: 2;}
    .e .sub_banner .txt h3 {margin: 5rem 0 4rem;}
    .e .sub_banner .img {left: 60%; transform: translateX(-25%);}
    .e .sub-content {padding-left: 10rem;}
}
@media (max-width:768px) {
    .e .sub_banner .txt {width: 100%; position: relative; z-index: 2; padding:4rem 0;}
    .e .sub_banner .txt {max-width: 72rem;}
    .e .sub_banner .img {position: relative; width: 100%; left: 0; display: flex; justify-content: center; padding-top: 0; transform: none;}
    .e .sub_banner .img .people {max-width: 90%;}
    .e .sub_banner .img-animation img:nth-of-type(1)  {width: clamp(550px,185%, 830px);  left: 50%;}
    .e .sub_banner .img-animation img:nth-of-type(2)  {width: clamp(400px,135%,630px);  left: 50%;} 
    .e .sub_banner .img-animation img:nth-of-type(3)  {width: clamp(300px,120%,480px); left: 50%;}
    .e .sub-content {padding-left: 6rem;}
}
@media (max-width:500px) {
    .e .sub_banner .txt img {height: 8vw;}
}
@keyframes sub_rotate-ani {
    0% {
        transform: translate(-50%, 46%) rotate(0)
    }

    to {
        transform: translate(-50%, 46%) rotate(1turn)
    }
}

/* f */
.f .sub-tab li {min-width: 15rem;}
.f .sub-footer .img  {transform: scale(-1, 1);}
.f_sub .sub-container {max-width: 1280px;}
.f_sub .title {text-align: center;}
.f_sub .title h4 {font-size: 2.2rem; font-weight: 600; color: var(--point); margin-bottom: 2rem;}
.f_sub .title h3 {font-size: 3.6rem; font-weight: 600;}

.f_sub .cont-wrap {border-top: 1px solid #ddd; width: 100%; margin-top: 6.5rem;}
.f_sub .cont-wrap .cont-title {padding: 2.5rem 0; font-size: 2.2rem; font-weight: 500; background: #fbfbfc; text-align: center; margin-bottom: 5rem;}
.f_sub .cont-wrap .box {padding: 0 3rem; justify-content: space-between; margin-top: 3rem;}
.f_sub .cont-wrap .box p {font-size: max(15px,1.8rem); width: calc(100% - 11rem); padding: 1rem 0; line-height: 1.8;}
.f_sub .cont-wrap .box p:first-child {font-weight: 700; width: 7rem; border-top: 1.5px solid #000;}
.f_sub .cont-wrap .box p span.gray {display: inline-block; padding-left: 1.6rem; text-indent: -1.6rem; margin-top: 1rem; color: #848484;}
.f_sub .cont-wrap:not(:has(.cont-title)) .box:first-of-type {margin-top: 8rem;}
.f_sub .cont-wrap .box-img {display: flex; flex-flow: row wrap; gap: 5px; justify-content: center; padding-bottom: 2rem;}
.f_sub .cont-wrap .box-img2 img {max-width: 48%;}
.f_sub .cont-wrap .box-img3 img {max-width: 32%;}
.f_sub .cont-wrap .box-img4 img {max-width: 24%;}

.f_sub .f-navi {justify-content: space-between; align-items: center; padding-top: 3rem; margin-top: 7rem; border-top: 1px solid #ddd;}
.f_sub .f-navi-center {justify-content: center;}
.f_sub .f-navi a:not(.list-btn) {font-size: max(15px,1.8rem); width: calc(50% - 12rem); max-width: 9rem; align-items: center; justify-content: space-between; color: #b7b7b7;}
.f_sub .f-navi a.list-btn {width: 24rem; font-size: max(15px,1.8rem); background: #797979; justify-content: center; color: #fff; padding: 2.5rem 0; border-radius: 5rem;} 
.f_sub .f-navi a img {width: 2.4rem; filter: invert(76%) sepia(3%) saturate(5%) hue-rotate(338deg) brightness(97%) contrast(90%);}
.f_sub .f-navi a.next img {transform: scale(-1, 1);}

@media (max-width:1280px) {
    .f_sub .sub_container {padding: 7rem 4% 0;} 
}
@media (max-width:768px) {
    .f_sub .f-navi a.list-btn {width: 18rem; padding: 2rem 0;}
    .f_sub .cont-wrap .box-img2 img, 
    .f_sub .cont-wrap .box-img3 img, 
    .f_sub .cont-wrap .box-img4 img {max-width: 100%; width: 100%;}
    .f_sub .cont-wrap .box p:first-child  {width: 10rem;}
    .f_sub .cont-wrap .box p {width: 100%;}
}

/* g */
.g {background: #f1f3f8;}
.g .sub_banner2 {align-items: center; max-width: 1420px;}
.g .sub_banner2 .img {padding-top: 2rem; width: calc(100% - 45rem); max-width: 440px;}
.g .sub_banner2 .txt {margin-left: 9.5rem;width: 40rem; }
.g .sub-content {display: grid; gap: 2rem;}
.g .box {padding:0 6rem; border-radius: 3rem; border:2px solid #fff; background: #fff; cursor: pointer;transition: all 0.2s;}
.g .box-head {align-items: center; justify-content: space-between; padding: 2rem 0 ;}
.g .box-head .icon {width: 9rem; height: 9rem; border-radius: 50%; background: #e5ecf7; align-items: center; justify-content: center; transition: all 0.2s;}
.g .box-head .icon img {width: 55%;}
.g .box-head h4 {font-size: 2.6rem; font-weight: 800; font-family: 'Pretendard'; width: calc(100% - 11rem);padding: 0 4rem;}
.g .box-head .arr {width: 2rem; transform: rotate(90deg);}
.g .box-content {padding: 0 6rem 4rem 13rem; display: none;}
.g .box-content h5 {font-size: max(16px,2rem); line-height: 1.6; letter-spacing: -.03rem;}
.g .box-content p {font-size: max(13px,1.8rem); color: #999; margin-top: 2rem;}
.g .box.on {border-color: #0160ee;}
.g .box.on .icon {background: #0160ee;}
@media (max-width:1400px) {
    .g .box {padding: 0 4rem;}
}
@media (max-width:1080px) {
    .g .sub_banner2 .txt {margin-left: 5rem;}
    .g .box-head h4 {padding: 0 2rem;}
    .g .box-content {padding: 0 4rem 4rem 11rem; display: none;}
    .g .box-head .icon {width: 8rem; height:8rem;}
}
@media (max-width:768px) {
    .g .sub_banner2 {justify-content: center;}
    .g .sub_banner2 .img {padding-top: 4rem; width: 80%; margin-right: 10%; max-width: 100%; order:2; justify-content: center;}
    .g .sub_banner2 .txt {margin-left: 0; width: 100%; order:1; margin-top: 10rem; text-align: center;}
    .g .box {padding: 0 2rem;}
    .g .box-head .icon {width: 7rem; height:7rem;}
    .g .box-head h4 {width: calc(100% - 9rem);}
    .g .box-content {padding: 0 2rem 4rem 9rem; display: none;}
}