@import url(main.css);
@import url(content.css);


.inner{width:100%; max-width:1700px; margin:0 auto;}



.mob_use{display:none;}
.pc_use{display:block;}


/* header */
#header{width:100%; position:absolute; top:0; left:0; z-index: 999; padding:40px 0 30px; transition: all 0.3s;}
#header .inner{display:flex; justify-content: space-between; align-items: center;}
#header h1{width:90px;}
#header .gnb{display:flex;}
#header .gnb > li{margin-right:100px; position: relative;}
#header .gnb > li:last-child{margin-right:0;}
#header .gnb > li > a{font-size:1.025em; font-weight:600; text-transform: uppercase;}
#header .gnb li a{color:var(--main-color-white);}
#header .gnb > li .depth-1 {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: var(--main-color-black);
    z-index: 1000;

    /* 슬라이드 효과 */
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    visibility: hidden;
    pointer-events: none;

    transition: max-height 0.4s ease, opacity 0.3s ease;
    margin-top:15px;
}

#header .gnb > li .depth-1 ul {
    display: flex;
    flex-direction: column;
    padding: 10px 25px; /* 여기에만 패딩 */
}

#header .gnb > li .depth-1 ul li {
    padding: 8px 0;
    margin-bottom: 5px;
}
#header .gnb > li .depth-1 ul li:last-child {
    margin-bottom: 0;
}
#header .gnb > li .depth-1 ul li a {
    transition: all 0.3s;
}
#header .gnb > li .depth-1 ul li:hover a {
    color: var(--main-color-lightgreen);
}

#header .gnb > li .depth-1.active {
    max-height: 500px; /* 충분한 높이 */
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

#header .gnb > li .depth-1 ul li{padding:8px 0; margin-bottom:5px;}
#header .gnb > li .depth-1 ul li:last-child{margin-bottom:0;}
#header .gnb > li .depth-1 ul li a{transition:all 0.3s;}
#header .gnb > li .depth-1 ul li:hover a{color:var(--main-color-lightgreen);}


#header.fixed{position:fixed;}
#header.fixed .gnb li > a{color:var(--main-color-black);}
#header.fixed .gnb > li .depth-1 ul li:hover a{color:var(--main-color-lightgreen);}
#header.fixed .gnb > li .depth-1 ul li a{color:var(--main-color-white);}



.nav_toggleBtn {
    display: none;
    width: 30px;
    height: 25px;
    position: relative;
    cursor: pointer;
    z-index: 1001;
}

.nav_toggleBtn span {
    position: absolute;
    height: 2px;
    width: 100%;
    background: var(--main-color-white);
    left: 0;
    transition: 0.4s;
}

.nav_toggleBtn span:nth-child(1) {
    top: 0;
}
.nav_toggleBtn span:nth-child(2) {
    top: 50%;
    transform: translateY(-50%);
}
.nav_toggleBtn span:nth-child(3) {
    bottom: 0;
}

.sub .nav_toggleBtn span {
    background: var(--main-color-black);
}

.nav_toggleBtn.active span:nth-child(1) {
    transform: rotate(45deg);
    top: 50%;
}
.nav_toggleBtn.active span:nth-child(2) {
    opacity: 0;
}
.nav_toggleBtn.active span:nth-child(3) {
    transform: rotate(-45deg);
    bottom: auto;
    top: 50%;
}
/* sub_header : 검은색 */
.sub #header .gnb li > a{color:var(--main-color-black);}
/*.sub #header .gnb > li .depth-1 {background: var(--main-color-white); border:1px solid var(--main-color-black);}*/
.sub #header .gnb > li .depth-1 ul li:hover a{color:var(--main-color-lightgreen);}
.sub #header .gnb > li .depth-1 ul li a{color:var(--main-color-white);}

/* footer */
#footer{width:100%; padding:50px 0; overflow:hidden;}
#footer .inner{display:flex; flex-direction: column;}
#footer .inner .ft_top,
#footer .inner .ft_top .ft_left{display:flex; align-items: center;}
#footer .inner .ft_top .ft_left .ft_logo{width:110px; margin-right:60px; opacity: 0.8;}
#footer .inner .ft_top{justify-content: space-between; }
#footer .inner .ft_top .ft_left .address{width:100%;}
#footer .inner .ft_top .ft_left .address ul{display:grid; grid-gap:10px 50px; grid-template-columns: 1fr 1fr;}
#footer .inner .ft_top .ft_left .address ul li{font-style: normal;}
#footer .inner .ft_top .ft_left .address ul li strong{color:var(--main-color-gray07); margin-right:30px;}
#footer .inner .ft_top .ft_left .address ul li .add_cont{font-weight:600;}
#footer .inner .ft_bot{opacity:0.3; font-size:8.1em; line-height:1em; margin:20px 0;font-weight:900; text-transform: uppercase; white-space: nowrap;}
#footer .inner .copyright{text-align: right;}
.footer-letter {
    display: inline-block;
    color: black;
    opacity: 1;
    animation: footerFlash 5s infinite;
    animation-delay: var(--delay);
    -webkit-text-stroke: 1px black;
}

/* 반복 애니메이션 */
@keyframes footerFlash {
    0% {
        color: black;
    }
    60% {
        color: black;
    }
    80% {
        color: white;
    }
    100% {
        color: black;
    }
}

.sub #footer{background:var(--main-color-black);}
.sub #footer .inner .ft_top .ft_left .address ul li .add_cont{color:var(--main-color-white);}
.sub #footer .inner .copyright{color:#a7a7a7;}
.sub #footer .inner .ft_bot{color:var(--main-color-gray02);}
.sub .footer-letter {
    color: white;
    animation: subFooterFlash 5s infinite;
     animation-delay: var(--delay);
    -webkit-text-stroke: 1px white;
}

@keyframes subFooterFlash {
    0% {
        color: white;
    }
    60% {
        color: white;
    }
    80% {
        color: black;
    }
    100% {
        color: white;
    }

}

/*quick menu*/
.quick_menu{position: fixed; top:50%; right:20px; z-index: 999; transform: translateY(-50%); opacity:0; pointer-events: none; transition: opacity 0.3s;}
.quick_menu.visible{opacity:1;  pointer-events: auto; }
.quick_menu a{border-radius: 15px; width: 62px; height: 62px; margin-bottom:8px; display:flex; align-items: center; justify-content: center;}
.quick_menu a img{transition:all 0.3s; }
.quick_menu a:hover img{transform: rotateY(360deg);}
.quick_menu a:nth-of-type(1){background:var(--main-color-blue);}
.quick_menu a:nth-of-type(2){background:var(--main-color-mint);}
.quick_menu a:nth-of-type(3){background:var(--main-color-green);}
.quick_menu .topBtn{flex-direction:column; border:1px solid rgba(255,255,255,0.3); background: rgba(255,255,255,0.1); }
.quick_menu .topBtn span{color:var(--main-color-white); }
.quick_menu .topBtn span:nth-of-type(1){transform: rotate(90deg); }
.quick_menu .topBtn.bk,
.sub .quick_menu .topBtn{border:1px solid rgba(0,0,0,0.3); background:var(--main-color-white);}
.quick_menu .topBtn.bk span,
.sub .quick_menu .topBtn span{color:var(--main-color-gray02);}
#main, .sub_wrap{padding-top:150px;}
.main_wrap, .sub_wrap{ position:absolute;top:0; width:100%}

.sub_cont{min-height:700px; padding-bottom:150px;}




/*************** sub common *****************/
.conTit2{font-size:7.2em; line-height:1em; margin-bottom:60px;}

/* 상담폼 */
.inquery_cont{display:flex; flex-direction: column;}
.inquery_cont ul{display:flex; justify-content: space-between; flex-wrap: wrap;}
.inquery_cont ul li{display:flex; flex-direction: column; width:calc(50% - 20px); margin-bottom:50px;}
.inquery_cont ul li:last-child{margin-bottom:0;}
.inquery_cont ul li.w100{width:100%;}
.inquery_cont ul li label{margin-bottom:15px;}
.inquery_cont .inq_bot{display:flex; justify-content: space-between; align-items: center; margin:30px 0;}
.inquery_cont .inq_bot .privacyBx{display:flex; align-items: center;}
.inquery_cont .inq_bot .privacyBx label,
.inquery_cont .inq_bot p{font-size:0.9em;}





/* ~ 1700px */
@media screen and (max-width:1700px){
    /* header */
    #header{padding:30px 0;}

    .inner,
    .sub_contact .sub_cont{ max-width:calc(100% - 140px);}


    /* footer */
    #footer{padding:40px 0 50px;}
    #footer .inner .ft_bot{font-size:7.2em;  display: flex;  justify-content: center;}

}
/* ~ 1650px */
@media screen and (max-width:1650px){
    /* footer */
    #footer .inner .ft_bot{font-size:6.4em;}

}
/* ~ 1440px */
@media screen and (max-width:1440px){
    /* header */
    #header{padding:20px 0;}
    #header h1{width:75px;}
    #footer .inner .ft_top .ft_left .ft_logo{width:80px;}

    .conTit2{font-size:6.2em;}	
    .quick_menu{right:10px;}
    .inquery_cont ul li{margin-bottom:30px;}
    .inquery_cont ul li label{margin-bottom:10px;}
    .inquery_cont .inq_bot{margin:20px 0;}

    .inner,
    .sub_contact .sub_cont{ max-width:calc(100% - 100px);}


    /* footer */
    #footer .inner .ft_bot{font-size:5.2em;}

}

/* ~ 1024px */
@media screen and (max-width:1024px){
    #header h1{width:65px;}

    #footer .inner .ft_top .ft_left .ft_logo{margin-right:40px;}
    .inner,
    .sub_contact .sub_cont{ max-width:calc(100% - 70px);}
    .conTit2{font-size:5em; margin-bottom:40px;}  
    .port_tab li{font-size:1.3em;}

    /* footer */
    #footer .inner .ft_top .ft_left .ft_logo{margin:0 0 20px 0;}
    #footer .inner .ft_bot{font-size:4.1em; margin:30px 0;}
    #footer .inner .ft_top{flex-direction: column;} 
    #footer .inner .ft_top .ft_left{width:100%; flex-direction: column; margin-bottom:20px;} 
    #footer .inner .copyright{font-size:0.9em; text-align: center;}
}   

/* ~ 767px */
@media screen and (max-width:768px){
    #header h1{width:50px;}
    #footer .inner .ft_top .ft_left .ft_logo{width:60px;}
    .inner,
    .sub_contact .sub_cont{ max-width:calc(100% - 40px);}

    .nav_toggleBtn {
        display: block;
    }

    #header .gnb {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: var(--main-color-black);
        padding: 20px 0;
    }

    #header .gnb.mobile-open {
        display: flex;
        height:calc(100vh - 80px);
    }
    #header .gnb{padding:25px;}
    #header .gnb > li{ margin-right:0; border-bottom:1px solid rgba(255,255,255,0.2);}
    #header .gnb > li:last-child{border-bottom:0;}
    #header .gnb > li > a{position:relative; font-size:1.4em; width:100%; display:flex; padding:25px 0;}
    .sub #header .gnb li > a{color:var(--main-color-white);}
    #header .gnb > li > a:after{position:absolute; top:50%; right:10px; content:''; transform: translateY(-50%); content:'>'; color:var(--main-color-gray); font-weight:normal; }
    #header .gnb > li > a.dep_top:after{transform:translateY(-50%) rotate(90deg); right:15px; transition: all 0.3s;}
    #header .gnb > li.on > a.dep_top:after{transform:translateY(-50%) rotate(270deg);}
    #header .gnb > li .depth-1 {
    display: none; /* slideToggle 대상 */
    position: static;
    transform: none;
    background: var(--main-color-black);
    max-height: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    margin-top:0;
    border-top:1px solid rgba(255,255,255,0.2);
  }

  #header .gnb > li .depth-1 ul {
    padding: 10px 15px;
  }
  #header .gnb > li .depth-1 ul li a{
    font-size:1.125em;
  }
    .quick_menu{display:none;}
    .conTit2{margin-bottom:30px; font-size:4em;}
    .inquery_cont ul li{margin-bottom:20px; width:calc(50% - 10px);}


    /* footer */
    #footer .inner .ft_bot{font-size:2.8em;}
    #footer .inner .ft_top .ft_left .address ul li{display:flex;}
    #footer .inner .ft_top .ft_left .address ul li strong{width:calc(30% - 15px); line-height: 1.5em; white-space: nowrap;}
    #footer .inner .ft_top .ft_left .address ul li .add_cont{width:70%; word-break:keep-all; line-height: 1.5em;}
}

/* ~ 425px */
@media screen and (max-width:425px){
	.inner,
    .sub_contact .sub_cont{ max-width:calc(100% - 30px);}
      /* footer */
    #footer .inner .ft_bot{font-size:2.2em;}
    #footer .inner .ft_top .ft_left .address ul{grid-template-columns: 1fr;}
}

/* ~ 320px */
@media screen and (max-width:320px){
		
}