@charset "utf-8";
@supports (-webkit-touch-callout: none) {
	/* CSS specific to iOS devices */ 
}
/* base */
html.safari.desktop {font-size: 0.040083333vw;}
::selection{background: rgb(33 85 112 / 56%); color:#fff;}
body{font-size:16rem; word-break:keep-all;}
th[data-view="file"] + td ul li a{line-height:1em;}
ul li:last-child{margin-right:0;}

::-webkit-scrollbar{width:10rem;}
::-webkit-scrollbar-thumb{background-color:hsla(0, 0%, 42%, 0.3); border-radius:100rem;}

html,
body{height:100vh; height: var(--vh);}
body{overflow-y: overlay;} 

/* root */
:root{
    --vh: 100%;
	--color-basic:#666;
	--color-bold:#1c1b27;
    --color-bright:#bcbcbc;
	--color-point: #369fd5; 
    --color-point2: #0ba4de;
	--animation-basic:all 0.4s ease;
	--animation-lazy:all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
	--lang-point: 'Anton', sans-serif;;
	--lang-kor:"Pretendard", Sans-serif;
	--lang-mob:Sans-serif;
	--lang-num:consolas;
    --animation-basic:all 0.4s ease; 
    --animation-lazy:all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
}
/* 공통 --------------- */
.inner{  box-sizing: border-box; margin: 0 80rem;}
.inn{max-width: 1480rem; width: 100%; padding: 0 40rem; box-sizing: border-box; margin: 0 auto;}
.flex{display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: flex;}

/* 버튼 */
.area_button{display: flex;}
.area_button .btn{width: 184rem; height: 66rem; border-radius: 100rem; display: flex; border:3px solid transparent; background-color: transparent; align-items: center; justify-content: center; box-sizing: border-box;}
.area_button .btn span{font-size: 17rem;}
.area_button .btn.w_bd{border-color: #fff;}
.area_button .btn.w_bd span,.area_button .btn.color span{color: #fff;}
.area_button .btn.color{background-color: var(--color-point); border-color: var(--color-point);}

/* 체크 */
[data-check] label{padding-left: 34rem; box-sizing: border-box; cursor: pointer; position: relative; }
[data-check] label em{}
[type="checkbox"]:not(:checked), [type="checkbox"]:checked {position: absolute;left: 0;opacity: 0.01;}
[type="checkbox"]:not(:checked) + .mark,[type="checkbox"]:checked + .mark {position:absolute; cursor: pointer; width: 24rem;height: 24rem; left: 0;top: 0; background: transparent; border:1px solid transparent; -webkit-transition: all .275s;transition: all .275s;}
[type="checkbox"]:not(:checked) + .mark:after, [type="checkbox"]:checked + .mark:after {content: '';width: 7rem;height: 12rem;box-sizing: border-box;border-bottom: 2rem solid var(--color-point);border-right: 2rem solid var(--color-point);position: absolute;top: 4rem;left: 9rem;-webkit-transition: all .2s;transition: all .2s;}
[type="checkbox"]:not(:checked) + .mark:after {opacity: 0;-webkit-transform: scale(0) rotate(0);transform: scale(0) rotate(0);}
[type="checkbox"]:checked + .mark:after {opacity: 1;-webkit-transform: scale(1) rotate(37deg);transform: scale(1) rotate(37deg);}
[type="checkbox"]:disabled:not(:checked) + .mark:before,[type="checkbox"]:disabled:checked + .mark:before {box-shadow: none;border-color: #bbb;background-color: #e9e9e9;}
[type="checkbox"]:disabled:checked + .mark:after {color: #777;}
[type="checkbox"]:disabled + .mark {color: #aaa;}

/* Accessibility */
[type="checkbox"]:checked:focus + .mark:before, [type="checkbox"]:not(:checked):focus + .mark:before {
    box-shadow: inset 0 1rem 3rem rgba(0,0,0, .1), 0 0 0 6px rgba(100, 164, 247, 0.2);
}

#header{position: absolute; width: 100%; left: 0; top: 0; z-index: 90;}
#header .inner{position: relative;}
#header h1{position: absolute; left: 0; top: 40rem;}
#header h1 a{display: block; height: 42rem;}
#header h1 a img{height: 100%;}
#header .btn_menu{display:none;}
#header .btn_menu{position:absolute; top:0; right:0; z-index:9999; width:23rem; height:24rem; font-size:0rem; transition:all 0.3s ease 0s;}
#header .btn_menu > span{display:block; position:absolute; left:0rem; width:100%; height:2rem; background: #fff;}
#header .btn_menu > span:nth-of-type(1){top:3rem;}
#header .btn_menu > span:nth-of-type(2){top:50%; margin-top:-1rem; transition:background 0.3s ease 0s;}
#header .btn_menu > span:nth-of-type(3){top:18rem;}
#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_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 - -0px * 1); background:#000; font-size:0; transition:all 0.3s ease-out 0s;}
.active #header .btn_close{opacity:0.4; visibility:visible;}

#footer{background-color: #1c1b27; padding: 54rem 0; box-sizing: border-box;}
#footer .inner{position: relative;}
#footer .logo{display: block; height: 32rem;}
#footer .logo img{height: 100%; display: block;}
#footer address *{font-size: 16rem; color: #666;}
.footer-top__address{display: flex; justify-content: space-between; margin-top: 46rem;}
.footer-top__main{width: 50%;}
.footer-top__main address span{margin-bottom: 4rem; display: inline-block;}
.footer-top__main address span + span{margin-left: 32rem; position: relative;}
.footer-top__main address span + span::before{content: ""; width: 1px; height: 14px; background-color: #666; opacity: 0.28; position: absolute; left: -18rem; top: 5rem;}
.foot-tel{display: flex; align-items:center; margin-top: 38rem;}
.foot-tel dt{font-size: 18rem; color: #fff; margin-right: 16rem;}
.foot-tel dd{margin-right:30rem;}
.foot-tel dd a{font-size: 30rem; color: #0ca4df; font-family: 'Montserrat', sans-serif; font-weight: 600;}
.foot-tel dd:last-child{margin-right:0;}
.footer-top__sub{display: flex; }
.footer-top__sub strong{font-weight: 600; margin-bottom: 14rem; color: #d9d9d9; font-size: 17rem; position: relative; display: block; }
.footer-top__sub strong::before{content: ""; width: 3px; height: 3px; background-color: #d9d9d9; position: absolute; left:-14rem; top: 10rem;}
.footer-top__sub address span{display: flex; margin-bottom: 4rem;}
#footer .footer-top__sub address b{margin-right: 20rem; font-weight: 300; color: #d9d9d9}
.footer-top__sub > div:nth-child(2){padding-left: 63rem; max-width: 524rem; box-sizing: border-box;}
.foot-util{position: absolute; right: 0; top: 0;}
.foot-util a{font-size: 14rem; color: #fff;}
.foot-util a:nth-child(2){font-weight: 500; margin-left: 60rem; position: relative;}
.foot-util a:nth-child(2)::before{content: ""; width: 1px; height: 15rem; background-color: #333; position: absolute; left: -30rem; top: 4rem;}
.copyright{font-size: 14rem; color: #666; margin-top: 18rem; }

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

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

    .footer-top__main{width: 30%;}
    .footer-top__main address span{display: block;}
    .footer-top__main address span + span{margin-left: 0;}
    .footer-top__main address br{display: none;}
    .footer-top__main address span + span::before{display: none;}
}

@media all and (min-width:1025px){
    #header nav{position: absolute; left: 50%; transform: translateX(-50%); top: 45rem; }
    #header nav .gnb {display: flex; }
    #header nav .gnb > li{padding: 0 50rem; box-sizing: border-box; position: relative;}
    #header nav .gnb > li > a{font-size: 20rem; padding-bottom: 30rem;}
	#header nav .gnb > li ul{display:none; position:absolute; border-radius: 10rem; opacity:0; visibility:hidden; top:15rem; width:180rem; left: 50%; transform:translateX(-50%) ; padding:8rem 17rem; background:#fff; border:1rem solid #444; box-shadow:15rem 20rem 29rem 0rem rgba(0, 0, 0, 0.23);  box-sizing: border-box; transition:all 0.4s ease-out; transition-property:opacity, top, visibility; transition-delay:0s, 0s, 0s;}
	#header nav .gnb > li ul.active{display:block; transition-delay:0.1s;}
	#header nav .gnb > li.active ul{opacity:1; visibility:visible; top:35rem; z-index:10; transition-delay:0s, 0s, 0s;}
	#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:0px;}
    #header .pc_burger{width: 24rem; height: 20rem; position: absolute; right: 0; top: 48rem; cursor: pointer;}
    #header .pc_burger span{width: 100%; height: 2rem; background-color: #1c1b27; position: absolute;left: 0; transition: all .3s; }
    #header .pc_burger span:nth-child(1){top: 0;}
    #header .pc_burger span:nth-child(2){top: 50%; transform: translateY(-50%);}
    #header .pc_burger span:nth-child(3){bottom: 0;}

    .allMenu{position: fixed; width: 100%; opacity: 0; z-index: -111; visibility: hidden;  transition: all .3s; height: 100vh; left: 0; top: 0;  padding-top: 20%; background-color: #fff;}
    .allMenu .inner{padding-top: 6%;}
    .allMenu .gnb{display: grid; position: relative; z-index: 10; background: transparent; display: -ms-grid;grid-template-columns:repeat(4, 1fr); width: 85%; margin: 0 auto; }
    .allMenu .gnb li{text-align: center; }
    .allMenu .gnb > li > a{font-size: 26rem; font-weight: 800; color: var(--color-bold); transition: all .3s;}
    .allMenu .gnb > li:hover > a{color: var(--color-point2);}
    .allMenu .gnb > li ul{margin-top: 40rem;}
    .allMenu .gnb > li ul > li a{padding: 14rem 0; font-size: 18rem; display: block; box-sizing: border-box; color: var(--color-basic); transition: all .3s;}
    .allMenu .gnb > li ul > li a:hover{opacity: 0.5;}
    .allMenu strong{display: block; position: absolute; top: 100rem; z-index: 10; text-align: center; width: 100%; font-weight: 600; font-size: 65rem; font-family: var(--lang-point); letter-spacing: 5rem; color: #1c1b27;}
    .allMenu strong span{color: var(--color-point2);}
    .line_wrap{position: absolute; width: 85%; height: 100vh; top: 0; left:50%; transform: translateX(-50%); z-index: 1;}
    .line_wrap i{height: 100%; display: block; width: 1px; top: 0; border-right: 1px dashed #eee; position: absolute; }
    .line_wrap i:nth-child(1){}
    .line_wrap i:nth-child(2){left: 25%;}
    .line_wrap i:nth-child(3){left: 50%;}
    .line_wrap i:nth-child(4){left: 75%;}
    .line_wrap i:nth-child(5){right: 0;}

    #header.fx .allMenu{opacity: 1; visibility: visible; z-index: 900;}
    #header.fx .pc_burger{position: fixed; z-index: 999; right: 80rem; top: 48rem;}
    #header.fx .pc_burger span{background-color: #1c1b27 !important;}
    #header.fx .pc_burger span:nth-child(2){background-color: transparent !important;;}
    #header.fx .pc_burger span:nth-child(1){transform: rotate(45deg); top: 10rem;}
    #header.fx .pc_burger span:nth-child(3){transform: rotate(-45deg); bottom: 8rem;}
}

@media all and (max-width:1440px){
	.inner{margin:0 60rem}
    .area_button .btn{width: 177rem; height: 58rem;}
    
}
@media all and (max-width:1024px){
    html,html,html.safari.desktop{font-size:0.09775171065493645vw;}
	.inner{margin:0 40rem}
	#header .btn_menu,
	#header .btn_close{display:block;}
    #header .pc_burger{display: none;}
    #header h1{top: 30rem;}
    #header nav{display: none;  width: 100%; height: 100vh; position: fixed; top: 0; right: 0; background-color: #fff;}
    #header .btn_menu{right: 20rem; top: 40rem;}
    #header .btn_menu.active{position:fixed; top:40rem; right: 40rem; }
    #header .btn_menu.active > span{background-color: #1c1b27;}
    #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;}
    #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;}
    #header nav .gnb > li:nth-child(1) > a{border-top: 1px solid #eee;}
    #header nav .gnb > li > a{font-size: 20rem; position: relative; font-weight: 500; color: #1c1b27!important; display: block; box-sizing: border-box; padding: 20rem 0; border-bottom: 1px solid #eee;}
    #header nav .gnb > li > a i{width: 23rem; height: 18rem; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
    #header nav .gnb > li > a i::before, #header nav .gnb > li > a i::after{width: 18rem; height: 2rem; transition: all .3s; background-color: #1c1b27; content: ""; position: absolute; left:0; top: 50%; }
    #header nav .gnb > li > a i::before{transform: translateY(-50%);}
    #header nav .gnb > li > a i::after{ transform: rotate(90deg) translateX(-1rem); width: 17rem; }
    #header nav .gnb > li:nth-child(2) > a i::before,
    #header nav .gnb > li:nth-child(2) > a i::after{display: none;}
    #header nav .gnb > li ul{background-color: #f6f6f6; padding: 20rem 32rem; box-sizing: border-box;}
    #header nav .gnb > li ul a{display: block; padding: 12rem 0; font-size: 17rem;}
    #header nav .gnb > li > a.active + ul{border-top: 2px solid #0ca4df;}
    #header nav .gnb > li > a.active i::before{background-color: #0ba4de;}
    #header nav .gnb > li > a.active i::after{background-color: #0ba4de; transform: translateY(-50%);} 
    #header nav .gnb{padding:130rem 40rem 40rem ; box-sizing: border-box; ;}

    body.active{overflow-y: hidden !important;}
    body.active #header nav{display: block; z-index: 111;}
    body.active #header h1{ z-index: 999;}
    body.active #header h1 .origin{display: block !important;}
    body.active #header h1 .w_ver{display: none !important;}

    .allMenu{display: none;}

    .footer-top__address{flex-direction: column;}
    .footer-top__main{width: 100%;}
    .footer-top__main address span{display: inline-block;}
    .foot-tel{margin-top: 0;}
    .footer-top__sub strong::before{display: none;}
    .footer-top__sub{margin-top: 32rem;}
    .footer-top__sub > div:nth-child(2){max-width: inherit;}
}
@media (max-width:860px){
    .inner{margin:0 30rem}
    #header .btn_menu{right: 20rem;}
	html,html,html.safari.desktop{font-size:0.13020833333333335vw;}
}

@media (max-width: 540px){
    .inner{margin:0 16rem}
    .inn{padding: 0 16rem;}
	::-webkit-scrollbar{height:0rem;}
	::-webkit-scrollbar-thumb{background-color: hsla(0, 0%, 42%, 0.1);}

	html,html,html.safari.desktop{font-size:0.26666666666666665vw;}	
    #header h1{top: 28rem;}
    #header h1 a{height: 32rem;}
    #header .btn_menu{right: 0; top: 33rem;}
    #header .btn_menu.active{top: 33rem; right: 20rem;}
    #footer{padding: 28rem 0;}
    #footer address *{font-size: 14rem;}
    #header nav .gnb{padding: 120rem 23rem 23rem;}
    #header nav .gnb > li ul{padding: 16rem 20rem;}
    #header nav .gnb > li > a{font-size: 17rem; padding: 12rem 0;}
    #header nav .gnb > li ul a{font-size: 16rem; padding: 8rem 0;}
    #header nav .gnb > li > a i::before, #header nav .gnb > li > a i::after{width: 14rem;}
    #header nav .gnb > li > a.active i::after{width: 14rem; }
    .footer-top__address{margin-top: 22rem;}
    .foot-util,
    .footer-top__sub{display: none;}
	.foot-tel{flex-wrap:wrap;}
	.foot-tel dt{margin-top:5rem;}
	.foot-tel dd{flex:0 1 100%;}

    .area_button .btn{width: 150rem; height: 48rem;}
    .area_button .btn span{font-size: 15rem;}

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