﻿@import url('https://font.elice.io/css?family=Elice+DX+Neolli');

.contents_wrap{width:1230px; margin:0px auto; position:relative; display:flow-root;}

h2{text-align:center; font-size:45px; color:#313131; font-family:"Elice DX Neolli", sans-serif; margin-top:90px; font-weight:400; overflow:hidden; padding-top:30px;}
h2::before{content:''; width:40px; height:3px; background:#2f4a91; display:block; margin:0px auto 10px;}
h2 span{color:#2f4a91; font-weight:600;}
h2 .sub_t{font-size:18px; color:#666666; text-align:center; font-weight:300;}

gnb{width:100%; height:70px; display:flex; position:fixed; top:0px; left:0px; z-index:999999;}
gnb .back_bg{width:100%; height:70px; background:#2f4a91; opacity:0.8; position:absolute;}
gnb .logo{width:240px; float:left; justify-items:center; margin-top:5px; position:absolute;}

gnb .nav{float:right; margin-top:25px;}
gnb .nav a{margin-right:50px; font-size:16px; font-weight:600; float:left; color:#fff; justify-items:center; cursor:pointer; display:block;}
gnb .nav a:hover{color:#a8e94f;}
gnb .nav a.contact_btn{width:160px; height:40px; background:#313131; display:flex; justify-content:center; align-items:center; margin-top:-10px; border-radius:10px; box-shadow:0px 3px 0px 0px #555;}
gnb .nav a.contact_btn p{color:#fff; font-size:16px; font-weight:600;}
gnb .nav a.contact_btn p::before{content:'\e762'; font-family:'Material Symbols Rounded'; display:inline-block; color:#fff; font-weight:500; margin-right:5px; font-size:17px; vertical-align:bottom;}
gnb .nav a.contact_btn:hover p{color:#a8e94f;}
#overlay{display:none;}

header{width:100%; height:100dvh; position:relative; touch-action:pan-y !important; font-family:"Elice DX Neolli", sans-serif; display:flex; flex-direction:column; justify-content:center;}
header .stick_video_bg{width:100%; height:100dvh; position:absolute; left:0; top:0; z-index:1;}
header .stick_video_bg .video_black_bg{width:100%; height:100dvh; background:#000; opacity:0.2; position:absolute; top:0px; left:0px; z-index:10; pointer-events:none;}
header .stick_video_bg video{width:100%; height:100%; object-fit:cover;}
header .parallax-content {position:relative; z-index:10; width:100%; height:100%;}
header .text-group {position:absolute; top:0; left:0; width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; opacity:0; visibility:hidden;}

/* 첫 번째 그룹은 시작할 때 보이도록 설정 */
header .group1{opacity:1; visibility:visible;}

header .group1 .sub_arrow_box{width:400px; height:45px; line-height:45px; font-weight:300; border-radius:10px; background:#2f4a91; position:relative; text-align:center; color:#fff; font-size:20px; margin:0px auto;}
header .group1 .sub_arrow_box::after{content:''; width:0px; height:0px; display:block; bottom:-20px; left:50%; margin-left:-5px; position:absolute; z-index:5;
    border-bottom:10px solid transparent;
    border-top:10px solid #2f4a91;
    border-left:10px solid transparent;
    border-right:10px solid transparent;
}
@keyframes loopColor {
    0% {color:#ffffff; }    /* 흰색 */
    66% {color:#a8e94f; }   /* 초록색 */
    100% {color:#ffffff; }  /* 다시 흰색 */
}
header .group1 .title1{font-size:110px; letter-spacing:-2px; position:relative; z-index:20; margin-top:10px; text-align:center; font-weight:300; color:#fff; transform: translateY(0); animation:loopColor 8s infinite ease-in-out;}
header .group1 .title1 span{font-weight:600; display:inline-block;}
header .group2 .title2{font-size:70px; color:#fff; letter-spacing:-4px; font-weight:300; z-index:20; text-align:center; margin-top:10px;}
header .group2 .title2 span{font-weight:600; font-size:120px;}
header .group2 .title2 span.green{color:#98ed24; font-size:70px;}
header .group2 .title2_sub{width:30%; color:#ffffff; font-size:22px; line-height:34px; text-align:center; font-weight:300;}
header .group2 .title2_sub span{color:#fff568; font-weight:400; display:inline-block; background:#1f3134; padding:2px 3px; font-size:21px;}
header .h_btn_box{width:500px; height:60px; position:absolute; left:50%; bottom:150px; margin-left:-250px; z-index:100; pointer-events:auto;}
header .h_btn_box > a{width:240px; height:55px; line-height:55px; float:left; margin-right:20px; background:#2f4a91; color:#fff; font-size:22px; text-align:center; box-shadow:0px 3px 0px 0px #555; border-radius:10px; display:block;}
header .h_btn_box > a:last-child{margin-right:0px; background:#313131;}
header .h_btn_box > a:hover{color:#a8e94f;}

/* 3. 숫자 롤링 섹션 */
.stats-section{margin:70px 0px 0px; display:flex; justify-content:center; gap:100px;}
.stat-item{width:33.3%; text-align:center; position:relative; float:left;}
.stat-item::after{content:''; position:absolute; top:55px; right:0px; width:1px; height:60px; background:#b5b5b6; display:block;}
.stat-item:last-child::after{display:none;}
.stat-item p{color:#313131; font-size:18px; font-weight:500; font-family:"Elice DX Neolli", sans-serif;}
.stat-item > div{display:flex; align-items:baseline; justify-content:center;}
.stat-item > div .number{font-size:120px; line-height:120px; color:#2f4a91; float:left; font-weight:600;}
.stat-item > div span{font-size:48px; color:#313131; margin-left:10px; float:left; font-weight:500;}

.why_partners .why_con_box{margin-top:50px;}
.why_partners .why_con_box > div{width:390px; height:230px; float:left; padding:30px 0px 0px 30px; box-sizing:border-box; background:#fff; box-shadow:0px 1px 10px #e5e5e5; border-radius:30px; margin-left:30px; font-family:"Elice DX Neolli", sans-serif; transition:margin-top 0.5s;}
.why_partners .why_con_box > div:hover{margin-top:-10px;}
.why_partners .why_con_box > div:first-child{margin-left:0px;}
.why_partners .why_con_box > div:nth-child(even){background:#f8f8f8;}
.why_partners .why_con_box > div .icon_box{width:40px; height:40px; border-radius:10px; background:#eaedf4; display:flex; align-items:center; justify-content:center;}
.why_partners .why_con_box > div .icon_box i{color:#2f4a91; font-weight:500;}
.why_partners .why_con_box > div:first-child .icon_box i{font-weight:600;}
.why_partners .why_con_box > div .sub_title{color:#666666; font-size:10px; font-weight:300; margin-top:10px;}
.why_partners .why_con_box > div .title{color:#2f4a91; font-size:20px; font-weight:400; margin-top:0px;}
.why_partners .why_con_box > div .descrip{width:75%; color:#666666; font-size:14px; font-weight:300; margin-top:5px; letter-spacing:-0.2px; word-break:keep-all;}

.who_needs{width:100%; height:616px; margin-top:80px; overflow:hidden; background:url('/partners/images/who_bg.png') no-repeat top center; font-family:"Elice DX Neolli", sans-serif;}
.who_needs img{float:left; margin-top:90px;}
.who_needs .who_container{float:left; margin-left:70px;}
.who_needs .who_container h2{text-align:left; padding-top:0px; margin-top:110px;}
.who_needs .who_container h2::before{margin-left:0px;}
.who_needs .who_container h2 .sub_t{text-align:left;}
.who_needs .who_container li{font-size:23px; color:#313131; font-weight:300; margin-top:20px; letter-spacing:-0.5px;}
.who_needs .who_container li::before{content:'\e86c'; font-family:'Material Symbols Rounded'; color:#313131; display:inline-block; font-size:24px; vertical-align:-6px; margin-right:5px;}
.who_needs .who_container li span{color:#2f4a91; font-weight:600;}


@keyframes borderFlash {
    0%{border-color:#555555;}
    5%{border-color:#a8e94f;}    /* 서서히 켜짐 */
    15%{border-color:#a8e94f;}   /* 색상 유지 (약 2~3초) */
    20%{border-color:#555555;}   /* 서서히 꺼짐 */
    100%{border-color:#555555;}    /* 남은 3초 동안 서서히 복구 */
}
@keyframes backgroundFlash {
    0%{background:#efefef;}
    5%{background:#a8e94f;}
    15%{background:#a8e94f;}
    20%{background:#efefef;}
    100%{background:#efefef;}
}

.service_process{width:100%; overflow:hidden; background:url('/partners/images/service_bg.png') no-repeat top center #212121; font-family:"Elice DX Neolli", sans-serif; padding-bottom:140px;}
.service_process h2{color:#ffffff;}
.service_process h2::before{background:#fff;}
.service_process h2 span{color:#a8e94f;}
.service_process h2 .sub_t{color:#efefef;}
.service_process .service_container{margin-top:60px; padding:0px 145px 0px 195px;}
.service_process .service_container dl{position:relative; margin-top:80px;}
.service_process .service_container dl::before{content:''; position:absolute; display:block; top:-65px; right:115px; width:2px; height:65px;
    background:linear-gradient(to top, #555555 50%, transparent 0%);
    background-size:1px 10px;
    animation:lineFlow 15s ease-in-out infinite;
}
.service_process .service_container dl:first-child::before{display:none;}
.service_process .service_container dl dt .step{width:70px; height:25px; line-height:23px; border:2px solid #555555; box-sizing:border-box; color:#ffffff; font-size:14px; font-weight:400; text-align:center; border-radius:15px; font-family:"Noto Sans KR", sans-serif; animation:borderFlash 15s ease-in-out infinite;}
.service_process .service_container dl dt h3{color:#fff; font-size:35px; font-weight:500; margin-top:5px;}
.service_process .service_container dl dt h3 > span{font-size:25px;}
.service_process .service_container dl dt p.sub_t{font-size:20px; line-height:20px; color:#212121; background:#efefef; padding:2px 4px; font-family:"Noto Sans KR", sans-serif; display:inline-block; letter-spacing:-1px; animation:backgroundFlash 15s ease-in-out infinite;}
.service_process .service_container dl dt p.sub_t > span{font-weight:500;}
.service_process .service_container dl dd{margin-top:15px;}
.service_process .service_container dl dd li{font-size:20px; font-family:"Noto Sans KR", sans-serif; letter-spacing:-0.5px; margin-top:7px; color:#fff; list-style:none;}
.service_process .service_container dl .icon_box{width:230px; height:230px; border:2px solid #555555; border-radius:50%; position:absolute; right:0px; top:0px; display:flex; align-items:center; justify-content:center; animation:borderFlash 15s ease-in-out infinite;}

.service_process .service_container dl:nth-child(1) .icon_box,
.service_process .service_container dl:nth-child(1) dt .step,
.service_process .service_container dl:nth-child(1) dt p.sub_t{animation-delay:0s;}
.service_process .service_container dl:nth-child(2) .icon_box,
.service_process .service_container dl:nth-child(2) dt .step,
.service_process .service_container dl:nth-child(2) dt p.sub_t{animation-delay:3s;}
.service_process .service_container dl:nth-child(3) .icon_box,
.service_process .service_container dl:nth-child(3) dt .step,
.service_process .service_container dl:nth-child(3) dt p.sub_t{animation-delay:6s;}
.service_process .service_container dl:nth-child(4) .icon_box,
.service_process .service_container dl:nth-child(4) dt .step,
.service_process .service_container dl:nth-child(4) dt p.sub_t{animation-delay:9s;}
.service_process .service_container dl:nth-child(5) .icon_box,
.service_process .service_container dl:nth-child(5) dt .step,
.service_process .service_container dl:nth-child(5) dt p.sub_t {animation-delay:12s;}
 
.with_con{height:895px; background:url('/partners/images/with_bg.jpg') 50% 0 no-repeat fixed; position:relative; display:flex; justify-content:center; align-items:center; font-family:"Elice DX Neolli", sans-serif;}
.with_con article{width:auto; position:relative;; z-index:4; text-align:center;}
.with_con article .title{font-size:70px; color:#313131; font-weight:300; line-height:85px;}
.with_con article .title span{font-weight:600; color:#2f4a91;}
.with_con article .sub_t{width:54%; font-size:18px; color:#313131; font-weight:400; line-height:30px; margin:20px auto 0px; word-break:keep-all;}
.with_con article .free_gift_box{width:615px; height:auto; padding:20px 30px; box-sizing:border-box; border:2px solid #fff; overflow:hidden; background:rgba(255, 255, 255, 0.5); margin:30px auto 0px; border-radius:20px;}
.with_con article .free_gift_box .gift_title{font-size:18px; color:#212121; font-weight:600; font-family:"Noto Sans KR", sans-serif; text-align:left; letter-spacing:-0.5px; display:flex; align-items:center;}
.with_con article .free_gift_box .gift_title:before{content:''; width:28px; height:31px; display:inline-block; background:url('/partners/images/with_gift_icon.png') no-repeat left 0px; background-size:100% auto; margin-right:5px;}
.with_con article .free_gift_box .gift_sub_t{font-size:14px; color:#313131; font-weight:600; font-family:"Noto Sans KR", sans-serif; text-align:left; letter-spacing:-0.5px; margin-top:5px;}
.with_con article .free_gift_box .gift_sub_t span{color:#2f4a91;}
.with_con article .consult_btn{width:615px; height:85px; line-height:85px; color:#fff; background:#2f4a91; border-radius:20px; text-align:center; margin:60px auto 0px; font-size:30px; font-weight:600; font-family:'Roboto', sans-serif; box-shadow:0px 3px 0px 0px #555; display:block;}
.with_con article .consult_btn:hover{color:#a8e94f;}

footer{width:100%; height:500px; padding-top:70px; box-sizing:border-box; display:flex; justify-content:center; background:#212121;
    background-image:url('/partners/images/footer_big_text.png'), url('/partners/images/footer_bg.png');
    background-repeat:no-repeat, no-repeat;
    background-position:bottom center, top center;
}
footer .foot_logo{width:120px; float:left; filter: grayscale(100%);}
footer .foot_con{float:left; margin-left:110px; font-family:"Elice DX Neolli", sans-serif;}
footer .foot_con > div:nth-child(1){font-size:16px; font-weight:300; color:#ffffff; line-height:30px;}
footer .foot_con > div:nth-child(2){font-size:11px; font-weight:400; color:#e3e3e3; margin-top:30px;}


section.stats-section {scroll-margin-top:140px;}
section.who_needs, section.service_process {scroll-margin-top:70px;}