*{margin : 0;padding : 0;box-sizing: border-box;font-family: Noto Sans KR;}
li{list-style: none;}
a{color : inherit;text-decoration: none;}
img{display: block;max-width: 100%}

.pcView{display: block;}
.moView{display: none !important;}
/**/
.header{display: flex;justify-content: center;width : 100%; height : 100px;position : fixed;z-index: 1000;left : 0;top : 0;border-bottom : 1px solid rgba(0,0,0,0);transition : background .5s, border-bottom .5s;white-space :nowrap;}
.header.sub{background : #fff;border-bottom : 1px solid rgba(0,0,0,0.1)}
.header.white-bg {background: #fff;}
.header.on{background : #324a42;border-bottom : 1px solid rgba(255,255,255,0.1)}
.header::after{position : absolute;content : '';width : 100%;height : 0;background : #324a42;top : calc(100% + 1px);left : 0;transition : height .5s;z-index : -1;}
.header.on::after{height : 250px;}
.header-inner{display: flex;justify-content: space-between; align-items: center;width :100%;max-width: 1760px;}
.main-logo{width : 174px;height : 23px;background : url(../images/common/main-logo.png)no-repeat center / contain;transition : background .5s;}
.white .main-logo{background : url(../images/common/main-logo-white.png)no-repeat center / contain;}
.header.on .main-logo{background : url(../images/common/main-logo-white.png)no-repeat center / contain;}
.main-logo > a{display: block;width : 100%;height : 100%;color : transparent;font-size: 0;line-height: 0;}
.header-nav{height : 100%;white-space : nowrap;}
.header-nav > ul{display: flex;height : 100%;}
.header-nav > ul > li{display : flex;justify-content : center;}
.header-nav > ul > li > a{display: flex;justify-content: center; align-items : center; padding : 0 35px;font-size: 18px;font-weight: 500;transition : color .5s;position : relative;}
.header-nav > ul > li > a::after{position : absolute;content : '';width : 8px;height : 8px;background : #203A31;border-radius: 50%;transform:translateY(-25px) scale(0);transition : transform .5s}
.white .header-nav > ul > li > a::after{background : #fff;}
.header.on .header-nav > ul > li > a::after{background : #fff;}
.header-nav > ul > li:hover > a::after{transform:translateY(-25px) scale(1);}
.white .header-nav > ul > li > a{color : #fff;}
.header.on .header-nav > ul > li > a{color : #fff;}
.header-nav > ul > li > ul{position : absolute;top : 100%;text-align : center;padding : 20px 0;opacity : 0;pointer-events : none;transition : opacity .5s;color : #fff;}
.header.on .header-nav > ul > li > ul{opacity : 1; pointer-events : all;}
.header-nav > ul > li > ul > li > a{display : block;padding : 5px 0;letter-spacing : -0.033em;}
.header-nav > ul > li > ul > li > a:hover{font-weight : 700;color : #fff}
.header-right{display: flex;}
.customer-box{display: flex;align-items: center;; margin-right: 40px;font-size: 18px;}
.customer-box > li{position :relative;transition : color .5s;color : #6C6C6C}
.white .customer-box > li{color : #fff;}
.header.on .customer-box > li{color : #6C6C6C;}
.customer-box > li.on{color : #203A31;font-weight: 700;}
.white .customer-box > li.on{color : #CAB177;}
.header.on .customer-box > li.on{color : #fff;}
.customer-box > li:first-child::after{position : absolute;content: ''; right : 0;top : 50%;transform: translateY(-50%) translateX(50%);width : 1px;height : 12px;background : #525252;transition : background .5s;}
.white .customer-box > li:first-child::after{background : #fff;}
.header.on .customer-box > li:first-child::after{background : #fff;}
.customer-box > li > a{display: block;padding : 0 40px;}
.customer-box > li > a.reservation-btn{display : flex;align-items : center;gap : 10px; }
.header-tel{display: flex;align-items: center;gap : 9px; font-family: ofelia-text;font-size: 18px;font-weight: 500;color : #121212;transition : color .5s;margin-right: 33px;}
.white .header-tel{color : #fff;}
.header.on .header-tel{color : #fff;}
.header-tel-icon{width : 48px;height : 48px;background : url(../images/common/header-tel-icon.png)no-repeat center / contain;transition : background .5s}
.white .header-tel-icon{background : url(../images/common/header-tel-icon-white.png)no-repeat center / contain;}
.header.on .header-tel-icon{background : url(../images/common/header-tel-icon-white.png)no-repeat center / contain;}

.hamburger{display: none;flex-direction: column;justify-content: center;align-items: center;width: 30px;height: 30px;cursor: pointer;position: relative;}
.hamburger span{display: block;width: 24px;height: 2px;background: #203A31;position: relative;transition: all 0.3s ease;}
.white .hamburger span,.white .header-menu-icon span::before,.white .header-menu-icon span::after{background: #fff;}
.hamburger.active span{background: transparent;}

.footer{display: flex;flex-direction: column;align-items: center;justify-content: center; background : #535252;height : 408px;text-align: center;letter-spacing: -0.04em;font-size: 15px;}
.footer-logo{margin-bottom: 28px;max-width : 200px;}
.footer-ul-01{display: flex;align-items: center;gap : 36px;margin-bottom: 33px;}
.footer-ul-01 > li{display: flex;align-items: center;position : relative;font-weight: 700;}
.footer-ul-01 > li a{color: #fff;}
.footer-ul-01 > li:first-child{color : #ffffff;}
.footer-ul-01 > li:not(:last-child)::after{position :absolute;content : '';width : 1px;height : 12px;background : #000;right : -18px;}
.footer-ul-02{display: flex;align-items: center;gap : 36px;margin-bottom: 39px; color : #a8a8a8}
.footer-ul-02 > li{display: flex;align-items: center;position : relative;font-weight: 400;}
.footer-ul-02 > li > span{font-weight: 500;}
.footer-ul-02 > li:not(:last-child)::after{position :absolute;content : '';width : 1px;height : 12px;background : #a8a8a8;right : -18px;}
/* .footer-ul-03 > li{ color : #fff;} */
.footer-info{margin-bottom: 12px;color : #ffffff;font-weight: 300;}
.footer-copy{margin-bottom: 12px;color : #ffffff;font-weight: 300;}

.hamburger-nav{display : none;}
@media(max-width : 1600px){
	.header{height : 60px;}
	.header-inner{display: flex;justify-content: space-between; align-items: center;width :100%;max-width: 100%;padding : 0 30px;}
	.header-nav > ul > li > a{padding : 0 30px;font-size: 16px;}
	.header-nav > ul > li > a::after{width : 6px;height : 6px;}
	.customer-box{font-size: 16px;}
	.customer-box > li:first-child::after{height : 10px;}
	.customer-box > li > a{display: block;padding : 0 30px;}
	.reservation-btn > img{width : 35px;}
	.header-tel{font-size: 16px;;margin-right: 20px;}
	.header-tel-icon{width : 40px;height : 40px;}

	.footer{height : auto;font-size: 14px;padding : 50px 0;}
}

.blog-icon {
	position : fixed;
	bottom: 100px;
	right: 20px;
	z-index: 99;
}
@media(max-width : 749px){
	.blog-icon {
		width: 70px;
		bottom: 60px;
	}
}

/* 모바일 */
@media(max-width : 749px){
	.pcView{display: none !important;}
	.moView{display: block !important;}
    /* 헤더 */
    body.menu-open{touch-action: none;overflow: hidden;}
    .header{padding: 4vw 2.67vw 3vw 5vw;height : auto;}
	.header-inner{padding : 0;}
	.header.on{background : transparent;border-color : transparent;}
	.header.on::after{display : none;}
	.header.sub{background : #fff;border-color : rgba(0,0,0,0.1)}
    .header-right {align-items: center;}
    .header-inner{max-width: 100%;position: relative;}
    .main-logo{width: 30vw;height: 4vw;}
	.header.on .main-logo{background : url(../images/common/main-logo.png)no-repeat center / contain;}
    .header-tel{gap: 2vw;padding : 0 1.5vw;margin-right: 0;}
    .header-tel-icon{width: 10vw;height: 10vw;}
	.header.on .header-tel-icon{background : url(../images/common/header-tel-icon.png)no-repeat center / contain;}
	.header-tel > span{display : none;}
	.reservation-btn > img{width : 10vw;}
	.header.on .customer-box > li:first-child::after{background : #525252;}
	.header.on .customer-box > li.on{color : #203A31;}

	.hamburger{display: flex;align-items: center;justify-content: center; width : 10vw;height : 10vw;position : relative;border-radius: 50%;}
	.hamburger::after{position : absolute;content : ''; background : rgba(32, 58, 49,.7);border-radius: 50%;width : 100%;height : 100%;transform: scale(0);transition : transform .5s;z-index: -1;}
	.header.active .hamburger::after{transform: scale(1);}
	.hamburger > span{position :absolute;width : 50%;height : 1px;background : #000;transition : top .5s, width .5s, bottom .5s,transform .5s,background .5s;z-index: 1;}
	.header.dark .hamburger > span{background : #121212}
	.header.fill .hamburger > span{background : #121212}
    .hamburger > span:nth-child(1){top : 32%;}
	.hamburger > span:nth-child(2){width : 30%;transform: translateX(25%);}
	.hamburger > span:nth-child(3){bottom : 32%;}
	.header.active .hamburger > span:nth-child(1){top : 50%;transform: rotate(-45deg);background : #fff;}
	.header.active .hamburger > span:nth-child(2){width : 0}
	.header.active .hamburger > span:nth-child(3){top : 50%;transform: rotate(45deg);background : #fff;}

	.header-nav{display : none;}

	.header.white-bg {
		background: #fff;
	}
    
    .hamburger-nav{position: fixed;top: 0;left: -100%;width: 100%;height: 100vh;background: #fff;z-index: 999;transition: left 0.4s ease;display: flex;flex-direction: column;justify-content: center;align-items: center;padding: 8vw;}
    .header.active + .hamburger-nav{left: 0;}
    .hamburger-nav > ul{display: flex;flex-direction: column;width: 100%;text-align: center;height : auto;}
    .hamburger-nav > ul > li{display : block; margin-bottom: 4vw;position: relative;}
    .hamburger-nav > ul > li::before{content: attr(data-en);position: absolute;top: -4vw;left: 50%;transform: translateX(-50%);font-size: 2.4vw;color: #8D99AE;letter-spacing: 0.1em;font-weight: 300;}
    .hamburger-nav > ul > li > a{color: #203A31;font-size: 5.33vw;font-weight: 700;padding: 2.67vw 0;width: 100%;letter-spacing: -0.02em;}
    .hamburger-nav > ul > li > a:hover{color: #CAB177;}
    .hamburger-nav > ul > li > a::after{display: none;}
	.hamburger-nav > ul > li > ul{position : static;display : none;padding : 10px 0;}
	.hamburger-nav > ul > li > ul > li > a{display : block;padding : 5px 0;}

    .white .hamburger-nav.active > ul > li > a {color: #203A31;}
    
    .customer-box{gap: 2vw;margin-right: 2vw;}
    .customer-box > li{padding: 0 1.6vw;}
    .customer-box > li > a{font-size: 3.5vw;padding: 0;}
	.customer-box > li > a.reservation-btn{gap : 1.5vw;}
    .customer-box > li:first-child::after {right: -1vw;}

    /* 푸터 */
    .footer{height: auto;padding: 8vw 4vw;font-size: 3.2vw;line-height: 1.4;}
    .footer-logo{margin-bottom: 3.73vw;width: 26.67vw;}
    .footer-ul-01{gap: 4.8vw;margin-bottom: 4.4vw;}
    .footer-ul-01 > li{font-weight: 700;font-size: 3.47vw;}
    .footer-ul-01 > li:not(:last-child)::after {right: -2.4vw;}
    .footer-ul-02{flex-direction: column;gap: 1.6vw;margin-bottom: 5.2vw;text-align: center;}
    .footer-ul-02 > li{font-weight: 400;font-size: 3.2vw;line-height: 1.5;}
    .footer-ul-02 > li > span{font-weight: 500;}
    .footer-ul-02 > li:not(:last-child)::after{display: none;}
    .footer-info{margin-bottom: 1.6vw;font-size: 2.93vw;line-height: 1.5;}
    .footer-copy{margin-bottom: 1.6vw;font-size: 2.93vw;line-height: 1.5;}
}