#wrap {overflow: hidden;}
.inr{ position: relative; margin: 0 auto; max-width: calc(var(--inner) * 1rem); width: calc(var(--inner_width) * 100%); height: 100%; box-sizing: border-box; z-index: 2; }
.inr.wide{ max-width: 1820rem; }
.inr.narrow{ max-width: 1400rem; }
.wrapper{ margin: 0 auto; max-width: calc(var(--inner) * 1rem); width: calc(var(--inner_width) * 100%); }

/* header */
:root{
    --header_height:112rem;
}
#header{z-index:99; position:fixed; top:0; left:0; width:100%; height:var(--header_height); transition:0.3s; box-sizing:border-box; background:#fff; border-bottom:1px solid #d9d9d9;}
#header .inr{display:flex; justify-content:space-between; align-items:center; position:relative; max-width:100%; width:100%; height:100%;}
#header h1{padding-left:100rem;}
#header h1 a {display:block; width:200rem;}
#header h1 img {display:block; max-width: 100%; width: 100%; object-fit: contain;}
#header .gnb {text-align:center; height:100%; font-size:0; pointer-events:none;}
#header .gnb > li{position: relative; display:inline-block; height:100%; pointer-events:auto;}
#header .gnb > li > a{display:block; line-height:112rem; height:100%; padding:0 40rem; color:#000; font-size:20rem; font-weight:600;}
#header .gnb > li > .sub_menu{display:none; position:absolute; left:50%; top:80rem; transform: translateX(-50%); min-width:140rem; width:100% !important; background:#fff; border:1px solid #ddd; z-index:99;}
#header .gnb li:hover .sub_menu{display:block; background:#fff; top:90rem; width:100%; animation: submenu 0.3s 1 linear;}
#header .gnb .sub_menu{animation: submenu 0.3s 1 linear; transition: ease all .2s;}
#header .gnb .sub_menu li a{display: block; padding:14rem 0; color:#333; border-top:1px solid #ddd; font-size:18rem; text-align:center; transition:0.4s; font-weight:600;}
#header .gnb .sub_menu li a:hover{color: #2e79eb;}
#header .gnb .sub_menu li:first-child a{border-top:0;}
#header .btn_inquiry{display:flex; flex-direction:column; justify-content:center; align-items:center; width:180rem; height:100%; background:#f19b0e; text-align:center;}
#header .btn_inquiry img{display:block; margin:0 auto 5rem; width:42rem;}
#header .btn_inquiry p{font-size:18rem; color:#fff; font-weight:500;}

/* mobile-menu */
.mobile_header{background:#008790; color:#333; text-align:center; padding:35px 0 10px 0;}
.btn_menu{display:flex; justify-content:center; align-items:center; flex-direction:column; position:absolute; z-index:90; width:var(--header_height); height:100%; right:0; top:0; background:#1e1e1e;}
.btn_menu{display:none;}
.btn_menu span{display:block; width:25rem; height:2px; background:#fff; text-align:center;}
/*.btn_menu span:nth-child(1){margin-top:14px;}*/
.btn_menu span:nth-child(2){margin-top:7px;}
.btn_menu span:nth-child(3){margin-top:7px;}

.menu_top p{margin-top:10px; color:#949494;}
#header .m_gnb_top h1{float:none; padding:20px; }
.m_gnb{overflow-y:auto; position:fixed; top:0px; right:-100%; width:280rem; height:100%; background:#fff; transition:all 0.5s ease-out 0s;z-index:999;}
.m_gnb > ul > li > a{display:block; position:relative; padding:15rem 25rem; border-bottom: 1px solid #eaeaea; color:#1e1e1e; transition:all 0.3s ease 0s; font-size:20rem; font-weight:600;}
.m_gnb > ul > li > a.open:before{content:''; display:block; position:absolute; top:25rem; right:10rem; width:11rem; height:7rem; background:url(../images/common/menu_button.svg) no-repeat 50% 0; transition:all 0.4s ease 0s; background-size:100%;}
.m_gnb > ul > li > a.active{}
.m_gnb > ul > li > a.active:before{transform:rotate(180deg);}
.m_gnb > ul > li > ul{display:none; background:#efefef; }
.m_gnb > ul > li > ul > li{border-bottom:1px solid #dedede;}
.m_gnb > ul > li > ul > li > a{position:relative; display:block; padding:16rem 25rem; font-size:18rem; color:#333; font-weight:500;}
.cover{position:fixed; top:0; left:0; background:rgba(0,0,0,0.5); width:100%; height:100%; visibility:hidden; opacity:0; transition:0.3s ease;}
.cover.active{visibility:visible; opacity:1;}

.m_gnb .btn_close{opacity: 0; display: block; position:absolute; top:30rem; right:-100%; width:24rem; height:23rem; font-size:0; transition:0.8s;}
.m_gnb.active{right:0;}
.m_gnb.active .btn_close{opacity:1; right:15rem;}
.m_gnb_top{box-sizing:border-box; background:#00469b;}
.m_gnb_top p{background:#ddd;}
.m_gnb > ul{margin-top:60rem;}
.m_gnb .btn_close:before{content: ''; display:block; position:absolute; top:9rem; left:0rem;  width:100%; height:2px; background:#333; transform:rotate(45deg);}
.m_gnb .btn_close:after{content: ''; display:block; position:absolute; top:9rem; left:0rem; width:100%; height:2px; background:#333; bottom: 9px; transform:rotate(-45deg);}


/* footer */
#footer{display:flex; position:relative; background-color:#f6f6f6; padding:60rem 50rem; width:100%;}
#footer .symbol{display:block; margin-right:50rem; width:80rem;}
#footer .symbol img{display:block; width:100%;}
#footer .info address span{color:#7d7d7d; font-size:15rem; font-weight:300; margin:0 20rem 4rem 0;}
#footer .info p{margin-top:25rem; color:#7d7d7d; font-size:15rem; font-weight:300; }
#footer .top{position:absolute; top:60rem; right:50rem; pointer-events:}
#footer .top span{display:flex; margin:0 auto 15rem; align-items:center; justify-content:center; width:56rem; height:56rem; border-radius:50%; border:1px solid #1e1e1e;}
#footer .top span img{display:block; width:15rem; transform:rotate(-90deg);}
#footer .top p{font-size:16rem; font-weight:500; color:#1e1e1e;}


/*animation*/
.fadein,
.fadeinLeft,
.fadeinRight,
.animate-in{transition:all 0.6s ease-out 0s;}
.fadein{opacity:0; top:70px;}
.fadeinLeft{opacity:0; left:70px;}
.fadeinRight{opacity:0; right:70px;}
.animate-in{opacity:1; top:0;}
.animate-in-left{opacity:1; left:0;}
.animate-in-right{opacity:1; right:0;}

.scrollup.active{opacity:1;transition:all 2s cubic-bezier(0, 0.48, 0.44, 1) 0s !important;transform:translateY(0);}
.scrollup{position:relative; opacity:0; transition:all 2s cubic-bezier(0, 0.48, 0.44, 1) 0s; transform:translateY(150px);}


/* Scroll Animation */
@media (prefers-reduced-motion: no-preference){
	:is(section, main):has(:where([data-scroll_effect="slide_left"], [data-scroll_effect="slide_right"])){ overflow: hidden; }
	span[data-scroll_effect]{ display: inline-block; }
	[data-scroll_effect="clip_right"]{ clip-path: inset(0 100% 0 0); transition: .8s; }
	[data-scroll_effect="clip_left"]{ clip-path: inset(0 0 0 100%); transition: .8s; }
	[data-scroll_effect="slide_up"]{ transform: translateY(40rem); opacity: 0; transition: .6s; }
	[data-scroll_effect="slide_left"]{ transform: translateX(40rem); opacity: 0; transition: .6s; }
	[data-scroll_effect="slide_right"]{ transform: translateX(-40rem); opacity: 0; transition: .6s; }
	[data-scroll_effect*="flip_"]{ backface-visibility: hidden; }
	[data-scroll_effect="flip_up"]{ transform: perspective(2500rem) rotateX(-100deg); transition: .6s; }
	[data-scroll_effect="clip_right"].effect_active{ clip-path: inset(0); }
	[data-scroll_effect*="slide_"].effect_active{ transform: translate(0); opacity: 1; }
	[data-scroll_effect*="flip_"].effect_active{ transform: perspective(2500rem) rotateX(0deg); }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="50"]{ transition-delay: .05s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="100"]{ transition-delay: .1s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="150"]{ transition-delay: .15s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="200"]{ transition-delay: .2s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="250"]{ transition-delay: .25s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="300"]{ transition-delay: .3s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="350"]{ transition-delay: .35s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="400"]{ transition-delay: .4s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="450"]{ transition-delay: .45s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="500"]{ transition-delay: .5s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="600"]{ transition-delay: .6s; }
	:where([data-scroll_effect].effect_active) [data-scroll_effect_delay="700"]{ transition-delay: .7s; }
	[data-scroll_effect_delay="50"].effect_active{ transition-delay: .05s; }
	[data-scroll_effect_delay="100"].effect_active{ transition-delay: .1s; }
	[data-scroll_effect_delay="150"].effect_active{ transition-delay: .15s; }
	[data-scroll_effect_delay="200"].effect_active{ transition-delay: .2s; }
	[data-scroll_effect_delay="250"].effect_active{ transition-delay: .25s; }
	[data-scroll_effect_delay="300"].effect_active{ transition-delay: .3s; }
	[data-scroll_effect_delay="350"].effect_active{ transition-delay: .35s; }
	[data-scroll_effect_delay="400"].effect_active{ transition-delay: .4s; }
	[data-scroll_effect_delay="450"].effect_active{ transition-delay: .45s; }
	[data-scroll_effect_delay="500"].effect_active{ transition-delay: .5s; }
	[data-scroll_effect_delay="600"].effect_active{ transition-delay: .6s; }
	[data-scroll_effect_delay="700"].effect_active{ transition-delay: .7s; }
	[data-scroll_effect_column] [data-scroll_effect].effect_active{ transition-delay: calc(var(--index) * calc(var(--delay) * 1ms)); }

	/* data-scroll_effect_delay */
	@media (min-width: 768px){
		[data-scroll_effect].effect_active [data-scroll_effect]{ transform: translate(0); opacity: 1; }
	}
	@media (max-width: 1279px){
		[data-scroll_effect="clip_right"]{ transition-duration: .6s; }
		[data-scroll_effect="clip_left"]{ transition-duration: .6s; }
		[data-scroll_effect_column] [data-scroll_effect*="slide_"]{ transform: translateY(40rem); }
		[data-scroll_effect_column] [data-scroll_effect*="slide_"].effect_active{ transform: translate(0); }
	}
	@media (max-width: 1279px) and (min-width: 768px){
		:is([data-scroll_effect_column="3"], [data-scroll_effect_column="4"]) > *:nth-child(odd){ transition-delay: 0s; }
		:is([data-scroll_effect_column="3"], [data-scroll_effect_column="4"]) > *:nth-child(even){ transition-delay: calc(var(--delay) * 1ms); }
		:is([data-scroll_effect_column="5"], [data-scroll_effect_column="6"]) > *:nth-child(4){ transition-delay: calc((var(--index) - 1 ) * calc(var(--delay) * 1ms)); }
		:is([data-scroll_effect_column="5"], [data-scroll_effect_column="6"]) > *:nth-child(5){ transition-delay: calc((var(--index) - 2 ) * calc(var(--delay) * 1ms)); }
		:is([data-scroll_effect_column="5"], [data-scroll_effect_column="6"]) > *:nth-child(6){ transition-delay: calc((var(--index) - 3 ) * calc(var(--delay) * 1ms)); }
	}
	@media (max-width: 767px){
		#wrap [data-scroll_effect_delay]{ transition-delay: 0s; }
		[data-scroll_effect="clip_right"]{ transition-duration: .4s; }
		[data-scroll_effect="clip_left"]{ transition-duration: .4s; }
		[data-scroll_effect_column] > *:nth-child(odd){ transition-delay: 0s; }
		[data-scroll_effect_column] > *:nth-child(even){ transition-delay: calc(var(--delay) * 1ms); }
	}
}


@media all and (max-width:1279px){
    :root{
        --header_height:86rem;
    }
	.wrapper{width:94%;}
    #header .inr{padding:0 0 0 4%;}
    #header h1{padding-left:0;}
    #header h1 a{width:170rem;}
    #header .btn_inquiry{flex-direction:row; width:160rem; margin-right:var(--header_height);}
    #header .btn_inquiry img{margin:0 10rem 0 0; width:25rem;}
	#header .gnb{display:none;}
	.btn_menu{display:flex;}
    
    #footer{padding:50rem 4%;}
    #footer .top span{margin-bottom:10rem; width:46rem; height:46rem;}
    #footer .top span img{width:14rem;}
    #footer .top p{font-size:15rem;}
}

@media all and (max-width:767px){
    :root{
        --header_height:72rem;
    }
    #header h1 a{width:150rem;}
    
    #footer{display:block;}
    #footer .symbol{margin-right:0;}
    #footer .info{padding-top:30rem; margin-top:30rem; border-top:1px solid #ddd;}
    #footer .info p{margin-top:18rem;}
}


/*
@media all and (max-width:525px){
	address span {display: block}
	address {font-size: 15px}
	#footer p {font-size: 14px}
}
*/