@charset "utf-8";

/* root */
:root{
	--color-basic:#666;
	--color-bold:#222;
	--color-point: #f7ac1b; 
	--animation-basic:all 0.4s ease;
	--animation-lazy:all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
	--lang-kor:
	"Pretendard", Sans-serif;
	--lang-mob:Sans-serif;
	--lang-point:
	'NanumBarunGothic';
}

/* base */
*,
*::before,
*::after{box-sizing:border-box;}
::selection{background: rgb(254 178 7 / 61%);color:#fff;}
::-webkit-scrollbar{width:10rem;}
::-webkit-scrollbar-thumb{background-color:hsla(0, 0%, 42%, 0.3); border-radius:100rem;}

[data-site="main"]::-webkit-scrollbar{width:0rem;}

html.safari.desktop {font-size: 0.040083333vw;}
body{font-size:16rem;overflow-y:overlay;color: #000;overflow-x: hidden !important;}
body.non_scroll{overflow:hidden;}
body.active{overflow: hidden !important;}
th[data-view="file"] + td ul li a{line-height:1em;}

/* fullpage custom */
#fp-nav.fp-right{display:none !important;}

 /* 
 * animation
 * discription: 애니메이션 셋
 */

/* scroll animation with item */
[data-ani]{opacity:0; transition:transform 1.6s ease, opacity 1.3s ease; transform-style:preserve-3d; will-change:transform;}
[data-ani].is_moved{opacity:1; transform:none;}
[data-ani="img"]{transform:translate(0%, 40%) matrix3d(1, 0, 0, 0, 0, 0.997564, 0.0697565, -0.00028, 0, -0.0697565, 0.997564, -0.00249391, 0, 0, 40, 0.9);}
[data-ani="top"]{transform:translateY(140rem); transition-delay:0.1s;}
[data-ani="right"]{transform:translateX(140rem); transition-delay:0.1s;}
[data-ani="left"]{transform:translateX(-140rem); transition-delay:0.1s;}
[data-ani="scale"]{transform:scale(1.15); transition-delay:0.1s; opacity:1 !important;}
[data-ani="rotate"]{transform:scale(1.15); transition-delay:0.1s; opacity:1 !important;}

/* start motion  for All contents */
.motion-on [data-motion]{transition:transform 1.4s ease, opacity 1.3s ease; transform: none; opacity:1;}
[data-motion]{opacity:0;}
[data-motion="preserveTop"]{transform:translateY(100%) rotateX(-80deg); transform-style:preserve-3d; transform-origin:center bottom;}
[data-motion="slideBtm"]{transform:translateY(-50rem);}
[data-motion="slideTop"]{transform:translateY(100%);}
[data-motion="slideLeft"]{transform:translateX(-100rem);}
[data-motion="slideRight"]{transform:translateX(100rem);}
[data-motion="scale"]{animation: motion-scale 1.6s forwards cubic-bezier(0.12, 0.4, 0.41, 0.86);}

/*  keyframe */
@keyframes motion-scale{
	0%{transform: scale(1.1);}
	100%{ransform: scale(1);}
}

/* delay set */
[data-delay="100"]{transition-delay:100ms !important;}
[data-delay="150"]{transition-delay:150ms !important;}
[data-delay="200"]{transition-delay:200ms !important;}
[data-delay="250"]{transition-delay:250ms !important;}
[data-delay="300"]{transition-delay:300ms !important;}
[data-delay="350"]{transition-delay:350ms !important;}
[data-delay="400"]{transition-delay:400ms !important;}
[data-delay="450"]{transition-delay:450ms !important;}
[data-delay="500"]{transition-delay:500ms !important;}
[data-delay="550"]{transition-delay:550ms !important;}
[data-delay="600"]{transition-delay:600ms !important;}
[data-delay="650"]{transition-delay:650ms !important;}

/* layerPop set */
.layerPop{overflow:hidden; border:1rem solid #353535; border-radius:14rem;}
.layerPop .btn button{font-size:13rem;}
.layerPop .btn{padding:13rem 10rem; background:#353535; text-align:left;}
.layerPop .btn button:last-child{float:right; margin:0 12rem 0 0;}

/* grid set */
[data-grid]{display:grid;}
[data-grid] img{width:100%;}
[data-grid="2"]{grid-template-columns:1fr 1fr; gap:40rem;}
[data-grid="3"]{grid-template-columns:1fr 1fr 1fr;gap: 34rem;}
[data-grid="4"]{grid-template-columns:1fr 1fr 1fr 1fr;gap: 47rem;}
[data-grid="5"]{grid-template-columns:1fr 1fr 1fr 1fr 1fr;gap: 37rem;}

@media (max-width: 1023px){
	[data-grid="3"]{gap:26rem;}
	[data-grid="4"]{gap:20rem;}
	[data-grid="5"]{grid-template-columns:1fr 1fr 1fr; gap:28rem;}
}

@media (max-width:860px){
	[data-grid="4"]{grid-template-columns:1fr 1fr 1fr; gap:20rem 28rem;}
}

@media (max-width: 540px){
	[data-grid="3"]{grid-template-columns:1fr; gap:18rem;}
	[data-grid="5"]{grid-template-columns:1fr 1fr; gap:30rem 18rem;}
	[data-grid="4"]{gap:25rem 15rem; grid-template-columns:1fr 1fr;}
}

/* wrapper */
.wrap{margin:0 80rem;}

@media (max-width:1200px){
	.wrap{margin:0 50rem;}
}

@media all and (max-width:1023px){
	.wrap{margin:0 45rem;}
}

@media all and (max-width:860px){
	.wrap{margin:0 35rem;}
}

@media all and (max-width:540px){
	.wrap{margin:0 25rem;}
}

/* header */
#header{position: absolute;z-index:51;transition:0.7s cubic-bezier(0.25, 0.47, 0.12, 0.99);width: 100%;padding-top: 42rem;box-sizing: border-box;}
#header.hide{transform: translateY(-100rem);}
#header h1{width:182rem;height:31rem;transition:all 0.5s ease;transform:translateY(0);z-index: 999;}
#header h1 a{display:block;background-image: url(../../images/common/logo_b.svg);background-position:50%50%;background-repeat:no-repeat;background-size:cover;width: 100%;height: 100%;}

#header .btn_menu{display:none;}
#header .btn_menu{position:absolute; top:0; right:0; z-index:9999; width:23rem; height:13rem; font-size:0rem; transition:all 0.3s ease 0s;}
#header .btn_menu > span{display:block; position:absolute; left:0rem; width:100%; height:2rem; background:#000;}
#header .btn_menu > span:nth-of-type(1){top:0;}
#header .btn_menu > span:nth-of-type(2){top:50%;margin-top: 0;transition:background 0.3s ease 0s;}
#header .btn_menu > span:nth-of-type(3){top:100%;}
#header .btn_menu > span:nth-of-type(1),
#header .btn_menu > span:nth-of-type(3){transition:all 0.3s ease; transition-property:top, transform; transition-delay:0.3s, 0s;}
#header .btn_menu.active{position:fixed;}
#header .btn_menu.active > span:nth-of-type(1){top:10rem; transform:rotate(-45deg);}
#header .btn_menu.active > span:nth-of-type(2){background: transparent !important;}
#header .btn_menu.active > span:nth-of-type(3){top:10rem; transform:rotate(45deg);}
#header .btn_menu.active > span:nth-of-type(1),
#header .btn_menu.active > span:nth-of-type(3){transition-delay:0s, 0.3s;background: #fff !important;}
#header .btn_close{position:fixed; opacity:0; visibility:hidden; top:0rem; left:0rem; z-index:99; width:-webkit-calc(100% - 320rem); width:100%; height:-webkit-calc(100vh - -0rem * 1); height:calc(100vh - -0rem * 1); background:#000; font-size:0; transition:all 0.3s ease-out 0s;}
.active #header .btn_close{opacity:0.4; visibility:visible;}
body:has(#fullpage) #header .btn_menu > span{background-color: #fff;}
#header nav{display:inline-block;}
#header nav .gnb{text-align:center;}
#header nav .gnb > li{display:inline-block;position:relative;padding: 0 33rem;}
#header nav .gnb > li:last-child:after{background:none;}
#header nav .gnb > li > a{display:inline-block;padding-bottom: 0;font-size: 16rem;color:#fff;transition: all 0.3s ease 0.3s;}
#header .wrap{display:flex; justify-content:space-between; align-items:center;}

.btn-contact{padding:13rem 31rem !important; background:#000; border-radius:40rem;}

body:has(#fullpage):not(.fp-viewing-1Page) #header h1{transform:translateY(-100rem);}
body:has(#fullpage) #header h1 a{background-image:url(../../images/common/logo.svg);}

/* footer */
#footer{position:relative;z-index:1;background: #f7f7f7;padding: 70rem 0rem 90rem;margin-top: 140rem;}
#footer .list_menu{display:flex;}
#footer .list_menu li{margin-right:46rem;}
#footer .list_menu li a {color: #fff;transition: all 0.3s ease 0s; opacity: 1;}
#footer .list_menu li a:hover{opacity: 0.6;}

#footer address p{margin:9rem 0;}
#footer address p span{position:relative;padding:0 19rem;color: #333;font-weight: 300;text-align: left;}
#footer address p span:first-child{padding-left:0;}
#footer address p span::after{content:"";position:absolute;opacity:0.22;top:50%;right:0;width:1rem;height:16rem;margin-top:-8rem;background: #6b6b6b;}
#footer address p span:last-child::after{opacity:0;}
#footer address p span strong{margin-right:8rem;}

#footer .btn_top{position:fixed;opacity:0;right:50rem;bottom:70rem;z-index:99;width: 22rem;height: 35rem;background-size: cover;background-position:50% 50%;font-size:0;transition:all 0.4s ease-out 0s;background-repeat:no-repeat;visibility: hidden;border-radius: 100%;}
#footer .btn_top.fiexd.active{position:fixed;opacity:1;top:auto;bottom:50rem;visibility: visible;}
#footer .btn_top.fiexd{position:absolute;opacity:1;top: 50rem;visibility: visible;bottom:auto;}

#footer .cpright{display:block;margin-top: 20rem;font-size: 16rem;text-transform:uppercase;color: #ccc;font-weight: 300;}
.footer-contact__map img{display:block; height:189rem; margin-right:50rem;}
.footer-contact{display:flex; justify-content:space-between;}

.footer-contact__text strong{font-weight:700; font-size:35rem;}
.footer-contact__text p{margin-top:8rem;font-weight:300;font-size:16rem;color:#333;text-align: left !important;}
.footer-contact__text-list{display:flex; margin-top:50rem; font-family:'Barlow Condensed', sans-serif;}
.footer-contact__text-list a{display:block; line-height:1; padding:0rem 15rem; font-weight:600; font-size:40rem; color:#000; letter-spacing:-0.3rem; transition:var(--animation-basic);}
.footer-contact__text-list li:first-child::after{content:""; position:absolute; right:0; width:3px; height:32rem; margin-top:4rem; padding-top:0rem; border-right:3px solid #000;}
.footer-contact__text-list li:first-child a{padding-left:0;}
.footer-contact__text-list li{display:flex; align-items:center; position:relative;}
.footer-contact__text-list a:hover{color:var(--color-point);}
.footer_info{margin-top:40rem; padding-top:35rem; border-top:1px solid #e4e4e4;}
.footer-contact__map{display:flex; margin-right:70rem;}
.footer-contact__list li:first-child{display:flex; align-items:center; position:relative;}
.footer-contact__list li:first-child:before{content:""; display:none; position:absolute; left:-14rem; width:0; height:0; border-top:5px solid transparent; border-right:6px solid #111; border-bottom:5px solid transparent;}
.footer-contact__list li a{display:block; margin-top:10rem; font-weight:300;}
.footer-contact__list li a{font-size:15rem;}

body:has(#fullpage) #footer{margin-top:0;}

[data-site] #footer .btn_top{position:absolute;opacity:1;visibility:visible;top: 36rem;bottom:auto;background-size:auto;}


@media (min-width:2000px){
	html{font-size:0.05254860746190225vw;}
}

@media (max-width:1480px){
	html,
	html.safari.desktop {font-size:0.06756756756756757vw;}
}

/* or */

@media all and (min-width:861px){
	#header nav .gnb > li ul{display:none;position:absolute;opacity:0;visibility:hidden;top: 35rem;right:0;width:100%;padding:8rem 17rem;background:#fff;border:1rem solid #444;box-shadow:15rem 20rem 29rem 0rem rgba(0, 0, 0, 0.23);transition:all 0.4s ease-out;transition-property: opacity, transform, visibility;transition-delay:0s, 0s, 0s;transform: translateY(-20rem);display: none !important;}

	#header nav .gnb > li ul.active{display:block; transition-delay:0.1s;}
	#header nav .gnb > li.active ul{opacity:1;visibility:visible;z-index:10;transition-delay:0s, 0s, 0s;transform: translateY(0);}
	#header nav .gnb > li ul > li > a{display:block; position:relative; padding:10rem 0rem; background:#fff; border-top:1rem solid #e1e1e1; font-size:15rem; color:#404040; text-align:left; transition:all 0.3s ease 0s;}
	#header nav .gnb > li ul > li > a:hover{opacity:0.5;}
	#header nav .gnb > li ul > li:first-child > a{border-top-width:0rem;}
	
	a[data-link="call"]{cursor:auto; pointer-events:none;}
}

@media all and (max-width:1023px){


}

@media (max-width:860px){
	*::-webkit-scrollbar{display:none !important; width:0; height:0;}

	html{font-size:0.13020833333333335vw;}	
	body,
	p,
	li,
	a{font-family:'', -apple-system, BlinkMacSystemFont, Sans-serif;  letter-spacing: -0.2rem;}

    #header {
        padding-top: 30px;
    }
    
    #header .btn_menu,
	#header .btn_close{display:block;}

	#header nav{width:100%;}
	#header nav .gnb > li > a{padding:14rem 0; font-size:16rem;}
	#header nav .gnb > li > a.on{font-weight:700;}  
	#header nav{position:fixed;top:0rem;right:-100%;z-index:998;width: 100%;height:100%;margin:0;background: #000;}
	#header nav.active{right:0rem; box-shadow:-5rem 0rem 15rem rgba(0,0,0,0.1); transition:all 0.5s ease-out 0s;}
	#header nav .gnb > li{display:block;}
	#header nav .gnb{position:absolute;top: 110rem;right:0rem;width:100%;overflow-y:auto;}
	#header nav .gnb > li{padding:0;}
	#header nav .gnb > li > a{display:block;padding: 13rem 0;font-size: 20rem;color: #fff;transition:all 0.3s ease 0s;font-weight: 700;}
	#header nav .gnb > li ul{display:none; padding:0rem 0 20rem;}
	#header nav .gnb > li ul > li > a{display:block;padding: 8rem 0rem;color: #fff;}
	#header nav .gnb > li ul li.active a{color:#eeaf5e;}

    #header h1 {
        width: 152px;
        height: 25px;
    }
    #header {
        padding-top: 25px;
    }

    .fp-section.fp-table,
    .fp-slide.fp-table,
    .fp-tableCell{height:auto !important;}

    #header .btn_menu {
        width: 23px;
        height: 13px;
    }
    #header .btn_menu > span {
        height: 2px;
    }
    #header .btn_menu {
        top: 29px;
        right: 44rem;
    }

    .footer-contact {
        justify-content: space-between;
        flex-direction: column;
        align-items: flex-start;
    }
    .footer-contact__map {
        display: flex;
        margin-right: 70rem;
        margin-top: 40rem;
    }

    .footer-contact__text-list a {
        font-size: 27rem;
    }
    .footer-contact__text strong {
        font-size: 29rem;
    }

    .footer_info {
        padding-top: 20rem;
    }

}

@media (max-width: 540px){
	html,
	html.safari.desktop {font-size:0.26666666666666665vw;}

	#footer .btn_top{right:20rem; bottom:20rem; width:45rem; height:45rem; background-size:6rem;}
	#footer .btn_top.fiexd.active{bottom:20rem;}

    #header .btn_menu {
        right: 25rem;
    }
    .btn-contact {
        background: var(--color-point);
        margin: 0 25rem;
        padding: 8rem 6% !important;
        position: fixed !important;
        bottom: 40rem;
        box-sizing: border-box;
        width: 88%;
    }
    
    .btn-contact a {
        font-size: 16rem !important;
        padding: 9rem 0  !important;
    }
    #footer {
        padding: 70rem 0rem 40rem;
        margin-top: 70rem;
    }
    .footer-contact__text strong {
        font-size: 24rem;
    }
    .footer-contact__text p {
        font-size: 15rem;
    }
    .footer-contact__text-list a {
        font-size: 17rem;
    }
    .footer-contact__text-list li:first-child::after {
        width: 3px;
        height: 18rem;
        border-right: 2px solid #000;
    }
    .footer-contact__text-list a {
        padding: 0rem 11rem;
    }
    #footer .btn_top {
        top: 0;
        width: 35rem;
        height: 35rem;
    }
    .footer-contact__map {
        margin-right: 0;
        margin-top: 40rem;
        flex-direction: column;
        width: 100%;
        box-sizing: border-box;
    }
    .footer-contact__list li:first-child {
        font-weight: 700;
        display: inline-block;
    }
    .footer-contact__list li:first-child::before {
        left: auto;
        right: -14rem;
        transform: rotate(90deg);
        top: 6rem;
    }
    .footer-contact__text-list {
        margin-top: 30rem;
    }
    #footer address p span {
        padding: 2rem 0rem;
        display: block;
    }
    #footer .cpright {
        margin-top: 14rem;
        font-size: 14rem;
    }
    #footer address p span::after{display: none;}
    .footer-contact__map img {
        margin-right: 0;
    }
}