@charset "utf-8";


*{margin: 0; padding: 0; box-sizing: border-box;}


/*헤더*/
.hd{position: fixed; z-index: 15; width: 100%; top: 0; left: 0; pointer-events: none;}
.hd .hd-fixed-wrap{padding-top: 25px;position: relative;z-index: 20;max-width: 90%;margin: auto;}
.hd .hd-fixed-wrap .inner-con{display: flex; justify-content: space-between; align-items: center;}
.hd .hd-fixed-wrap .logo{display: inline-flex;width: 150px;pointer-events: all;position: relative;left: 25px;/* right: 0; *//* margin: auto; */}
.hd .hd-fixed-wrap .logo img{display: block;width: 100%;transition: 0.8s;/* left: 25px; */}
.hd .hd-fixed-wrap .logo img.logo_white{opacity: 0;position: absolute;top: 0;}
.hd .hd-fixed-wrap .menu-btn {/* font-family: "Caudex",sans-serif; */font-size: 13px;font-weight: 400;color: #000000;pointer-events: all;position: relative;overflow: hidden;}
/* .hd .hd-fixed-wrap .menu-btn::after{content: ""; display: block; width: 100%; height: 1px; background-color: #000; transition: 0.8s;} */

.hd .hd-fixed-wrap .menu-btn {display: flex;flex-flow: column;align-items: center;justify-content: center;pointer-events: all;overflow: hidden;width: 50px;}
.hd .hd-fixed-wrap .menu-btn .btn{width: 30px;height: 30px;position: relative;display: block;cursor: pointer;}
.hd .hd-fixed-wrap .menu-btn .btn .line{width: 100%; height: 1px; background-color: white; display: block; transition: 0.4s; position: absolute; top: 50%;}
.hd .hd-fixed-wrap .menu-btn .btn .line1{transform: translateY(-6px);}
.hd .hd-fixed-wrap .menu-btn .btn .line3{transform: translateY(6px);}
.hd .hd-fixed-wrap .menu-btn .txt {color: #fff;font-size: 12px;}
.hd .hd-fixed-wrap .logo img.logo_white{opacity: 1;}
.hd .hd-fixed-wrap .logo img.logo_black{opacity: 0;}
.hd .hd-fixed-wrap .menu-btn .txt .txt1{display: block;}
.hd .hd-fixed-wrap .menu-btn .txt .txt2{display: none;;}
	

.hd .main-menu-wrap{width: 100vw;height: 100vh; opacity: 0;pointer-events: none;transition: 1.2s;position: absolute;top: 0;left: 0;}

.hd.on .main-menu-wrap{opacity: 1; pointer-events: all;}
.hd .main-menu-wrap .menu-wrap{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); text-align: center; z-index: 15;}
.hd .main-menu-wrap .menu-wrap li {margin-bottom: 15px;}
.hd .main-menu-wrap .menu-wrap li.sub_me{background: rgba(255,255,255,0.85);margin: 0;color: #000;font-weight: 500;line-height: normal;letter-spacing: -0.5px;width: -webkit-fill-available;padding: 3px 0;}
.hd .main-menu-wrap .menu-wrap > li > a{font-size: 40px;font-family: "Athena";line-height: 1.6;color: #fff;letter-spacing: 0px;font-weight: 400;}
.hd .main-menu-wrap .menu-wrap .sub-menu{display: flex;justify-content: center;height: 0;overflow: hidden;transition: 0.6s;font-size: 15px;color: #fff;text-align: center;}
.hd .main-menu-wrap .menu-wrap li.on .sub-menu{height: 2em;}
.hd .main-menu-wrap .menu-wrap li.on .sub-room-menu{border-bottom: 1px solid #fff;}

.hd .main-menu-wrap .menu-wrap .sub-menu a{font-size: 15px;color: #fff;cursor: pointer;margin-right: 24px;}
.hd .main-menu-wrap .menu-background-wrap{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #1c1c1c;}
.hd .main-menu-wrap .menu-background-wrap li{position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: 1.6s; opacity: 0; background-size: cover; background-repeat: no-repeat; background-position: center;}
.hd .main-menu-wrap .menu-background-wrap li.on{opacity: 0.5;}
.hd .main-menu-wrap .menu-wrap .sub-menu a:hover {border-bottom: 1px solid;}

.hd .hd-fixed-wrap .menu-revss-btn{display: flex;}
.hd .hd-fixed-wrap .menu_rev_btn{pointer-events: all;font-size: 12px;color: #fff;cursor: pointer; padding-left: 8px;}


.hd .hd-fixed-wrap .menu-btn{transition: 0.8s;}
.hd.on .hd-fixed-wrap .menu-btn{color: white;}
.hd.on .hd-fixed-wrap .logo img.logo_white{opacity: 1;}
.hd.on .hd-fixed-wrap .logo img.logo_black{opacity: 0;}
.hd.on .hd-fixed-wrap .menu-btn .line-wrap .line{background: white;}

.hd.on .hd-fixed-wrap .menu-btn .btn .line1{transform: rotate(45deg);}
.hd.on .hd-fixed-wrap .menu-btn .btn .line2{opacity: 0;}
.hd.on .hd-fixed-wrap .menu-btn .btn .line3{transform: rotate(-45deg);}
.hd.on .hd-fixed-wrap .menu-btn .txt1{display: none;}
.hd.on .hd-fixed-wrap .menu-btn .txt2{display: block;}
.hd.on .hd-logo{opacity: 0;}


.hd.down .hd-fixed-wrap .menu-btn .btn .line{background: black;}
.hd.down .hd-fixed-wrap .menu-btn .txt{color: black;}
.hd.down .hd-fixed-wrap .logo img.logo_white{opacity: 0;}
.hd.down .hd-fixed-wrap .logo img.logo_black{opacity: 1;}
.hd.down .hd-fixed-wrap .menu_rev_btn{color: #2B2B2B;}
.hd.down.on .hd-fixed-wrap .menu_rev_btn{color: #fff;}
.hd.down.on .hd-fixed-wrap .menu-btn .btn .line{background: white;}
.hd.down.on .hd-fixed-wrap .menu-btn .txt{color: white;}
.hd.down.on .hd-fixed-wrap .logo img.logo_white{opacity: 1;}
.hd.down.on .hd-fixed-wrap .logo img.logo_black{opacity: 0;}

.hd.nev_nd .hd-fixed-wrap .menu-btn .btn .line{background-color: #000;}
.hd.nev_nd .hd-fixed-wrap .menu-btn .txt .txt1 {color: #000;}
.hd.nev_nd .hd-fixed-wrap .logo img.logo_black{opacity: 1;}
.hd.nev_nd .hd-fixed-wrap .logo img.logo_white{opacity: 0;}
.hd.nev_nd .hd-fixed-wrap .menu_rev_btn{color: #000;}

.hd.nev_nd.on .hd-fixed-wrap .menu-btn .btn .line{background-color: #fff;}
.hd.nev_nd.on .hd-fixed-wrap .menu-btn .txt .txt1 {background-color: #fff;}
.hd.nev_nd.on .hd-fixed-wrap .logo img.logo_black{opacity: 0;}
.hd.nev_nd.on .hd-fixed-wrap .logo img.logo_white{opacity: 1;}
.hd.nev_nd.on .hd-fixed-wrap .menu_rev_btn{color: #fff;}

/*헤더*/



/* footer */

footer {position:relative;width: 100%;overflow:hidden;padding-top: 40px;border-top: 1px solid #bfbfbf;margin: auto;max-width: 95%;}
footer .inner {}
footer .f_top {float:left;width: 100%;position:relative;TEXT-ALIGN: center;}
footer .f_top p {font-size:14px;margin:10px 0 20px;font-family: 'Pretendard-Light';}
footer .f_top .mo_br{display: none;}
footer .f_top span {}
footer .f_bottom {width: 100%;font-size: 12px;padding: 15px 0 50px;margin: auto;TEXT-ALIGN: center;}
footer .f_bottom  .sub {display: block;}
footer .f_bottom  .sub:before { content: "";display: inline-block;background-image: url("http://hi-web.co.kr/web/img/hi_web_s.png");vertical-align: middle;width: 20px;height: 20px;background-size: cover;background-position: center;margin: 0 1px 4px 4px;}


footer .f_bottom .sub_02 {color: #14295b;display:inline-block;font-size: 14px;font-weight: bold;}
footer .f_bottom .sub_02 a {color: #14295b;}


.top-btn{/*height: -2px;*/position: absolute;right: 0%;bottom: 15px;font-size: 17px;z-index: 10;cursor:pointer;color: #fff;background: #000;width: 40px;height: 40px;text-align: center;line-height: 2.2;}


/* media */

@media all and (max-width : 1650px){
	.hd .main-menu-wrap .menu-wrap li.sub_me{font-size: 12px; line-height: 1.8;}
	.hd .main-menu-wrap .menu-wrap .sub-menu{margin-top: 5px;}


	.hd .main-menu-wrap .menu-wrap li.sub_me {width: 90px;}
	.hd .main-menu-wrap .menu-wrap > li > a{font-size: 33px;}
	.hd .main-menu-wrap .menu-wrap .sub-menu a{font-size: 13px;}
}


@media all and (max-width : 1480px){
	
	.hd .hd-fixed-wrap{padding-top: 7px;}
	
	.hd .hd-fixed-wrap .logo img{width: 95%;}
	
	.hd .hd-fixed-wrap .logo{left: 45px;}
}

@media all and (max-width : 1025px){
	
	.hd .hd-fixed-wrap .logo img{left: 25px;}
	
	.hd .hd-fixed-wrap{max-width: 95%;}
	
	.hd .hd-fixed-wrap .logo{left: 20px;}
	
	
	.hd .main-menu-wrap .menu-wrap{width: 100%;}
    .hd .main-menu-wrap .menu-wrap .sub-menu{height: auto;flex-wrap: wrap;margin-bottom: 15px;}
	.hd .main-menu-wrap .menu-wrap li.on .sub-menu{height: auto;}
	.hd .main-menu-wrap .menu-wrap .sub-menu{display: block;}
    .hd .main-menu-wrap .menu-wrap .sub-menu li{margin-bottom: 8px; display: inline-block;}

}


@media all and (max-width : 950px){
	
	.hd .hd-fixed-wrap{max-width: 95%;padding-top: 10px;}
	.hd .hd-fixed-wrap .logo{width: 100px;}
	.hd .hd-fixed-wrap .menu_rev_btn{font-size: 11px; letter-spacing: -0.5px;}
	.hd .main-menu-wrap .menu-wrap .sub-menu a{font-size: 13px; margin: 0 10px;}
	.hd .main-menu-wrap .menu-wrap > li > a{font-size: 25px;}
	
	
	footer .f_top p{font-size: 12px;}
	footer .f_top .mo_br{display: block;}
	footer .f_top span { display: none;}
	.top-btn{display: none !important;}

	
	
}


@media all and (max-width : 455px){
	
	.hd .main-menu-wrap .menu-wrap .sub-menu a{margin: 0 5px;}
	.hd .main-menu-wrap .menu-wrap li{margin-bottom: 20px;}
}



/* 해상도 */