@charset "utf-8";

/* @import url("common.css"); */

@import url("font.css");
@import url("reset.css");
@import url("common.css");
@import url("form.css");

/*********************************************
    브레드크럼 (Breadcrumbs) 네비게이션
    사용자의 현재위치 / 사이트 이동경로
*********************************************/
.page_location_nav {position:absolute; right:0; bottom:64px;}
.page_location_nav nav {font-size:15px; color:#888; display: flex; align-items: center; font-weight: 500;;}
.page_location_nav .home {padding-left: 20px;; position:relative;}
.page_location_nav .home a {color:#888;}
.page_location_nav .home::before {content:''; position:absolute; left:0; top:50%; width:17px; height:17px; background:url('/resources/img/sub/ico_home.svg') 0 0 no-repeat; transform: translateY(-50%);}
.page_location_nav .depth {position:relative; padding-left: 11px; margin-left: 10px;}
.page_location_nav .depth::before {content:''; position:absolute; left:0; top:50%; width:1px; height:13px; margin-top: -6px; background:#dfdfdf;}
.page_location_nav .depth:last-child {color:#333}
@media screen and (max-width: 1680px) {
    .page_location_nav {bottom:18px;}
}


/*********************************************
    헤더
*********************************************/
.temp_header_skin1 {position:fixed; left: 0; right:0; top:0; z-index:9999; transition: all 1s; height: 80px;}
.temp_header_skin1:hover{background: #FFF; height: 300px; border-bottom: 1px solid #CFCFCF;}
.temp_header_skin1 .rolling_logo{position: relative; max-width: 200px;}
.temp_header_skin1 .rolling_logo svg{width: 100%;}
.temp_header_skin1 .rolling_logo svg path{fill: #001241;}
.temp_header_skin1 .rolling_logo .logo{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: all 1s; opacity: 0; max-height: 36px;}
.temp_header_skin1 .rolling_logo .txt{transition: all 1s; opacity: 0;}
.temp_header_skin1 .rolling_logo .logo.on,
.temp_header_skin1 .rolling_logo .txt.on{opacity: 1;}
.temp_header_skin1 .header_con{display: flex; justify-content: space-between; align-items: center; padding: 20px 60px; position: relative;}
.temp_header_skin1 .header_con .gnb{position: absolute; left: 50%; transform: translateX(-50%);}
.temp_header_skin1 .header_con .gnb_depth_1{display: flex; align-items: center; gap: 0;}
.temp_header_skin1 .header_con .gnb_depth_1 > li{position: relative; transition: all 0.5s;}
.temp_header_skin1 .header_con .gnb_depth_1 > li > a{color: #001241; font-size: 17px; position: relative; padding: 20px 65px 45px; white-space: nowrap; transition: all 0.3s;}
.temp_header_skin1 .header_con .gnb_depth_1 > li > a > strong{font-weight: 400; position: relative;}
.temp_header_skin1 .header_con .gnb_depth_1 > li > a > strong::after{position: absolute; content: ""; width: 0%; height: 1px; background: #001241; transition: all 0.3s; left: 0; right: 0; bottom: -5px; margin: auto;}
.temp_header_skin1 .header_con .gnb_depth_1 > li:hover > a > strong::after{width: 100%;}
.temp_header_skin1 .header_util{display: flex; align-items: center; gap: 18px;}
.temp_header_skin1 .header_util .phone_num a{display: flex; align-items: center; gap: 8px; font-size: 20px; color: #001241; font-family: 'Paperlogy'; font-weight: 500;}
.temp_header_skin1 .header_util .phone_num a svg path{fill: #001241;}
.temp_header_skin1 .header_util .open_txt{padding: 10px 20px; border-radius: 100px; background: #001241; text-align: center; color: #FFF; font-family: 'SUIT'; font-size: 18px; font-weight: 500;}
.temp_header_skin1 .header_util .open_txt strong{font-weight: 800;}

.temp_header_skin1 .header_con .gnb_depth_2{position: absolute; display: block !important; top: 60px; left: 50%; transform: translateX(-50%); opacity: 0; visibility: hidden; transition: all 0.3s;}
.temp_header_skin1:hover .header_con .gnb_depth_2{opacity: 1; visibility: visible;}
.temp_header_skin1 .header_con .gnb_depth_2 > ul{display: flex; flex-direction: column; align-items: center; gap: 25px;}
.temp_header_skin1 .header_con .gnb_depth_2 > ul > li{text-align: center;}
.temp_header_skin1 .header_con .gnb_depth_2 > ul > li > a{font-size: 16px; color: #666; text-align: center; white-space: nowrap; position: relative; display: block;}
.temp_header_skin1 .header_con .gnb_depth_2 > ul > li > a:hover{color: #001241; font-weight: bold;}
.temp_header_skin1 .header_con .gnb_depth_2 > ul > li > a::after{position: absolute; content: ""; width: 0%; height: 1px; background: #fff; transition: all 0.3s; left: 0; right: 0; bottom: 0; margin: auto;}
.temp_header_skin1 .header_con .gnb_depth_2 > ul > li > a:hover::after{width: 100%;}
.temp_header_skin1 .header_con .gnb_depth_2 > ul > li > a i{font-style: normal; font-size: 12px; display: none;}

.temp_header_skin1.white .rolling_logo svg path{fill: #fff;}
.temp_header_skin1.white .header_con .gnb_depth_1 > li > a{color: #fff;}
.temp_header_skin1.white .header_util .phone_num a{color: #fff;}
.temp_header_skin1.white .header_util .phone_num a svg path{fill: #fff;}
.temp_header_skin1.white .header_util .open_txt{background: rgba(255, 255, 255, 0.30); backdrop-filter: blur(1px);}

.temp_header_skin1.shadow::after{content: ''; position: absolute; left: 0; right: 0; top: 0px; width: 100%; height: 180px; background: linear-gradient(180deg, rgba(0, 0, 0, 0.40) 0%, rgba(0, 0, 0, 0.00) 84.49%); z-index: -1; pointer-events: none;}
.temp_header_skin1.shadow:hover::after{display: none;}

.temp_header_skin1:hover .rolling_logo svg path{fill: #001241;}
.temp_header_skin1:hover .header_con .gnb_depth_1 > li > a{color: #001241;}
.temp_header_skin1:hover .header_util .phone_num a{color: #001241;}
.temp_header_skin1:hover .header_util .phone_num a svg path{fill: #001241;}
.temp_header_skin1:hover .header_util .open_txt{background: #001241; backdrop-filter: blur(0);}

.temp_header_skin1.scrollDown{transform: translateY(-130%);}
.temp_header_skin1.scrollTop{transform: translateY(0);}
.temp_header_skin1.on{background: rgba(0, 12, 66, 1) !important;}
.temp_header_skin1.on.scrollUp{box-shadow: 0px 10px 40px rgba(0,0,0,0.3);}

.sub_wrap .temp_header_skin1.on .rolling_logo svg path{fill: #fff;}
.sub_wrap .temp_header_skin1.on .header_con .gnb_depth_1 > li > a{color: #fff;}
.sub_wrap .temp_header_skin1.on .header_util .phone_num a{color: #fff;}
.sub_wrap .temp_header_skin1.on .header_util .phone_num a svg path{fill: #fff;}
.sub_wrap .temp_header_skin1.on .header_util .open_txt{background: rgba(255, 255, 255, 0.30); backdrop-filter: blur(1px);}

.sub_wrap .temp_header_skin1.on:hover{background: #FFF !important; border-bottom: 1px solid #CFCFCF;}
.sub_wrap .temp_header_skin1.on:hover .rolling_logo svg path{fill: #001241;}
.sub_wrap .temp_header_skin1.on:hover .header_con .gnb_depth_1 > li > a{color: #001241;}
.sub_wrap .temp_header_skin1.on:hover .header_util .phone_num a{color: #001241;}
.sub_wrap .temp_header_skin1.on:hover .header_util .phone_num a svg path{fill: #001241;}
.sub_wrap .temp_header_skin1.on:hover .header_util .open_txt{background: #001241; backdrop-filter: blur(0);}

.allmenu_con{display: none;}

.roll_bnr{position: fixed; top: 183px; right: 30px; z-index: 2; width: 100px; height: 150px;}
/* .roll_bnr .btn_box{width: 100%; height: 100%; background: #fff; border-radius: 100px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;}
.roll_bnr .btn_box span{color: #000; font-family: 'Pretendard'; font-size: 12px; font-weight: 300; line-height: normal;}
.roll_bnr .motion{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); animation: roll_bnr 15s infinite linear;}
.roll_bnr .motion svg{display: block;}
@keyframes roll_bnr {
    0%{transform: translate(-50%, -50%) rotate(0);}
    100%{transform: translate(-50%, -50%) rotate(360deg);}
}

.fp-viewing-1 .roll_bnr .btn_box,
.fp-viewing-3 .roll_bnr .btn_box,
.fp-viewing-4 .roll_bnr .btn_box{background: #001241;}
.fp-viewing-1 .roll_bnr .btn_box svg path,
.fp-viewing-3 .roll_bnr .btn_box svg path,
.fp-viewing-4 .roll_bnr .btn_box svg path{fill: #fff;}
.fp-viewing-1 .roll_bnr .btn_box span,
.fp-viewing-3 .roll_bnr .btn_box span,
.fp-viewing-4 .roll_bnr .btn_box span{color: #fff;}
.fp-viewing-1 .roll_bnr .motion svg path,
.fp-viewing-3 .roll_bnr .motion svg path,
.fp-viewing-4 .roll_bnr .motion svg path{fill: #001241;}
.fp-viewing-5 .roll_bnr{display: none;} */

@media screen and (max-width: 1680px) {
    .temp_header_skin1 .header_con .gnb_depth_1 > li > a{padding: 17px 34px 72px;}
}

@media screen and (max-width: 1430px) {
    .temp_header_skin1 .header_con{padding: 25px 20px;}
    .temp_header_skin1 .header_con .gnb_depth_1 > li > a{padding: 17px 15px 72px;}
}
@media screen and (max-width: 1200px) {
    .temp_header_skin1 .header_util .phone_num a{font-size: 14px;}
    .temp_header_skin1 .header_util .phone_num a svg{width: 20px;}
    .temp_header_skin1 .header_util .open_txt{font-size: 14px;}
}
@media screen and (max-width: 1024px) {
    .temp_header_skin1{height: unset;}
    .temp_header_skin1:hover{background: unset; height: unset; border-bottom: unset;}
    .temp_header_skin1 .header_con{padding: 15px 16px; z-index: 2;}
    .temp_header_skin1 .header_con::after{display: none;}
    .temp_header_skin1 .header_con .gnb{display: none;}
    .temp_header_skin1 .header_con .open_txt{display: none;}
    .temp_header_skin1 .header_util{display: flex; align-items: center; gap: 17px;}
    .temp_header_skin1 .rolling_logo{max-width: 160px;}
    .temp_header_skin1:hover .rolling_logo svg path{fill: #fff;}

    #mGnbBtn{width: 30px; height: 30px; display: block;}
    .hamburger_icon{width: 100%; height: 100%; position: relative;}
    .hamburger_icon i{display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 20px; height: 2px; background: #fff; transition: all 0.3s;}
    .hamburger_icon i:nth-child(1){transform: translateY(-4px);}
    .hamburger_icon i:nth-child(2){transform: translateY(0); display: none;}
    .hamburger_icon i:nth-child(3){transform: translateY(4px);}

    .mobile_gnb_open .hamburger_icon i:nth-child(1){transform: translateY(0px) rotate(45deg);}
    .mobile_gnb_open .hamburger_icon i:nth-child(2){opacity: 0;}
    .mobile_gnb_open .hamburger_icon i:nth-child(3){transform: translateY(0px) rotate(-45deg);}

    .allmenu_con{display: block !important; position: fixed; top: 0; right: 0; background: #000C42; width: 100vw; height: 100vh; transition: all 0.5s; transform: translateY(-100%);}
    .temp_header_skin1.active .allmenu_con{transform: translateY(0);}
    .allmenu_con .mobile_gnb{padding: 90px 16px 100px;}
    .allmenu_con .mobile_gnb .depth0{display: flex; flex-direction: column; gap: 26px; opacity: 0; transition: all 1s;}
    .temp_header_skin1.active .allmenu_con .mobile_gnb .depth0{opacity: 1;}
    .allmenu_con .mobile_gnb .depth0 > li > a{font-size: 24px; font-weight: 400; color: #fff; display: flex; align-items: center; justify-content: space-between; padding-right: 24px;}
    .allmenu_con .mobile_gnb .depth0 > li > a > svg{transform: rotate(-180deg); transition: all 0.3s;}
    .allmenu_con .mobile_gnb .depth0 > li.on > a > svg{transform: rotate(0deg);}
    .allmenu_con .mobile_gnb .depth0 > li > .depth1{display: none; margin-top: 18px; padding: 16px; border-radius: 0 0 8px 8px; background: rgba(255, 255, 255, 0.10); border-top: 1px solid rgba(255, 255, 255, 0.50);}
    .allmenu_con .mobile_gnb .depth0 > li > .depth1 > li > a{color: #fff; font-size: 18px; padding: 3px 10px; line-height: 34px; margin-bottom: 6px; display: block;}
    .allmenu_con .mobile_gnb .depth0 > li > .depth1 > li:last-child > a{margin-bottom: 0;}
    .allmenu_con .mobile_gnb .depth0 > li > .depth1 > li > a br{display: none;}
    .allmenu_con .mobile_gnb .depth0 > li > .depth1 > li > a i {font-style: normal; font-size:18px; display: none;}

    .temp_header_skin1 .header_util .phone_num a svg{display: block;}
    .temp_header_skin1 .header_util .phone_num a svg path{fill: unset;}
    .temp_header_skin1.white .header_util .phone_num a svg path{fill: unset;}

    .sub_wrap .hamburger_icon i{background: #001241;}
    .sub_wrap .temp_header_skin1 .header_util .phone_num a svg path{stroke: #001241;}

    .sub_wrap .temp_header_skin1.active .hamburger_icon i{background: #fff;}
    .sub_wrap .temp_header_skin1.active .header_util .phone_num a svg path{stroke: #fff;}
    .sub_wrap .temp_header_skin1.active:hover .rolling_logo svg path{fill: #fff;}

    .sub_wrap .temp_header_skin1.on .header_util .phone_num a svg path{stroke: #fff; fill: unset;}
    .sub_wrap .temp_header_skin1.on .hamburger_icon i{background: #fff;}
    
    .sub_wrap .temp_header_skin1.on:hover {background: #001241 !important; height: unset; border-bottom: 0;}
    .sub_wrap .temp_header_skin1.on:hover .rolling_logo svg path{fill: #fff;}
    .sub_wrap .temp_header_skin1:hover .header_util .phone_num a svg path{fill: unset;}
    .sub_wrap .temp_header_skin1:hover .rolling_logo svg path{fill: #001241;}

    .m-fixd_btn_wrap{width: 100%; position: fixed; bottom: 0; left: 0; z-index: 10; display: grid !important; grid-template-columns: repeat(2, 1fr);}
    .m-fixd_btn_wrap a{width: 100%; height: 60px; display: flex; align-items: center; justify-content: center; gap: 9px; text-align: center; background: #102B72;}
    .m-fixd_btn_wrap a.regist_btn{background: #3B528E;}
    .m-fixd_btn_wrap a span{color: #FFF; font-size: 16px; font-weight: 700;}

    .roll_bnr{right: 40px; bottom: 72px; width: 88px; height: 88px; display: none;}
    .roll_bnr .btn_box span{font-size: 10px;}
    .roll_bnr .motion svg{width: 130px;}

}
@media screen and (max-width: 550px){
    .temp_header_skin1 .header_con .open_txt{position: relative; left: 0; transform: unset;}
}

/*********************************************
    푸터
*********************************************/
.footer_container{background: #001241; position: relative; width: 100%;}
.footer_container .footer_inner{width: 100%; padding: 64px 100px; position: relative;}
.footer_inner .top_cont{display: flex; justify-content: space-between; align-items: center; padding-bottom: 24px; margin-bottom: 24px; border-bottom: 1px solid rgba(255,255,255,0.3);}
.footer_inner .top_cont .logo_box{display: flex; align-items: flex-end;}
.footer_inner .top_cont .logo_box .logo{margin-right: 34px;}
.footer_inner .top_cont .logo_box .txt_box{margin: 0; display: flex; align-items: center;}
.footer_inner .top_cont .logo_box .txt_box li{color: #FFF; font-size: 13px; font-weight: 500; line-height: normal;}
.footer_inner .top_cont .logo_box .txt_box li span{color: #AFAFAF;}
.footer_inner .top_cont .logo_box .txt_box li ~ li {margin-left: 10px;}
.footer_inner .top_cont .call_box{display: flex; align-items: flex-end; gap: 5px;}
.footer_inner .top_cont .call_box p{color: #AFAFAF; font-size: 13px; font-weight: 400; line-height: 140%;}
.footer_inner .top_cont .call_box a{color: #FFF; font-size: 22px; font-weight: 700; line-height: normal;}
.footer_inner .btm_cont .txt1{color: #AFAFAF; font-size: 13px; font-weight: 400; line-height: 140%; margin-bottom: 16px;}
.footer_inner .btm_cont .copy{color: #FFF; font-size: 13px; font-weight: 400; line-height: 140%; margin-bottom: 37px;}
.footer_inner .btm_cont a{color: #FFF; font-size: 14px; font-weight: 300; border: 1px solid rgba(255, 255, 255, 0.20); padding: 8px 16px;}
.footer_inner .top_up{width: 102px; height: 102px; border: 1px solid rgba(255, 255, 255, 0.20); border-radius: 102px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; position: absolute; right: 100px; bottom: 64px;}
.footer_inner .top_up span{color: #FFF; font-family: 'Paperlogy'; font-size: 13px; font-weight: 400; line-height: 150%; letter-spacing: 0.65px;}

@media screen and (max-width: 1024px) {
    .footer_container .footer_inner{padding: 164px 30px 110px;}
    .footer_inner .top_cont{flex-direction: column; gap: 21px; padding-bottom: 21px; margin-bottom: 21px;}
    .footer_inner .top_cont .logo_box{flex-direction: column; align-items: center; gap: 21px;}
    .footer_inner .top_cont .logo_box .logo{margin: 0;}
    .footer_inner .btm_cont{display: flex; flex-direction: column; align-items: center;}
    .footer_inner .btm_cont .txt1{text-align: center; word-break: keep-all; margin-bottom: 18px; font-size: 10px;}
    .footer_inner .btm_cont .copy{text-align: center; font-size: 11px; margin-bottom: 40px;}
    .footer_inner .btm_cont a{font-size: 11px;}
    .footer_inner .top_up{width: 84px; height: 84px; bottom: unset; top: 50px; left: 0; right: 0; margin: auto;}
    @media screen and (max-width: 640px) {
        .footer_inner .top_cont .logo_box .txt_box{flex-direction: column;}
        .footer_inner .top_cont .logo_box .txt_box li ~ li{margin: 10px 0 0 0;}
    }
}

/********************************************* 
    서브 비주얼
*********************************************/
.sub_top_visual {}
.sub_top_visual .visual_inner {height: 444px; position:relative; max-width:1430px; margin: 0 auto; border-bottom: 1px solid #111; padding-top: 178px;}
.sub_top_visual .page_tit_main {font-size:105px; font-family:"URWClassico"; font-weight: 400; letter-spacing: 0.1em;;}
.sub_top_visual .page_tit_sub {font-size:40px; font-weight: 400; margin-top: 12px;}
@media screen and (max-width: 1024px) {
    .sub_top_visual {}
    .sub_top_visual .visual_inner {height: 290px; margin:0 16px; padding-top: 130px;}
    .sub_top_visual .page_tit_main {font-size:50px;}
    .sub_top_visual .page_tit_sub {font-size:26px; margin-top:5px;}
}