@charset "utf-8";

/*header*/
.noneScroll .header { padding-right: 8px; }
.header { background: #fff; position: fixed; top:0px; width: 100%; z-index: 200; }
.header .h-inner { display: flex; align-items: center; justify-content: space-between; width: 98%; height:100%; max-width:1024px; margin:0px auto; padding-top:28px; padding-bottom: 16px; border-bottom:1px solid var(--bg-color); position: relative; }
.header .logo { width: 160px; }
.header .header-top-a { display: flex; gap:20px; padding-top: 2px; padding-right: 64px; font-size: 15px; font-weight: 500; }
.header .header-top-a a::before { content: ''; display: block; width:16px; height:16px; position: absolute; left:0px; top:50%; transform: translateY(-50%); }
.header .header-top-a .go-reserve { padding:6px 0 5px; padding-left:22px; position: relative; }
.header .header-top-a .go-reserve::before { background: url('/resources/img/common/ico_go_reserve.svg') no-repeat center/contain; }
.header .header-top-a .go-company { padding:6px 0 5px; padding-left:22px; position: relative; }
.header .header-top-a .go-company::before { background: url('/resources/img/common/ico_go_company.svg') no-repeat center/contain; }
.header .header-top-a .go-kakao { margin-left:10px; padding: 6px 14px 5px; padding-left:35px; position: relative; background: #FFE900; color:#3B1D1D; font-size: 14px; border-radius: 20px; }
.header .header-top-a .go-kakao::before { width:17px; background: url('/resources/img/common/ico_go_kakao.svg') no-repeat center/contain; left:14px; }
.header .ham-btn { width:40px; height:40px; position: absolute; right:0px; cursor: pointer; }
.header .ham-btn span { display: block; height:2px; width: 50%; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); background:var(--main-color); border-radius: 4px; }
.header .ham-btn span:first-child { transform: translate(-50%,calc(50% - 8px)); }
.header .ham-btn span:last-child { transform: translate(-50%,calc(50% + 4px)); }


/* 스크롤 */
.scroll { background-color: #fff; }

.mobile-menu-wrap { display: none; width: 100vw; height:100vh; position: fixed; top:0px; left:0px; z-index: 200; background:rgba(0,0,0,0.15); }
.mobile-menu-wrap.mobileOn { display: block; }
.mobile-menu-wrap .mobile-gnb { position: absolute; right:0px; top:0px; width:100%; height: 100%; max-width:360px; background:white; padding:40px 32px 0; right:-40%; }
.close-btn { width:48px; height: 48px; position: absolute; right:30px; top:35px; cursor: pointer; z-index: 1; }
.close-btn span { width: 50%; height: 2px; position: absolute; left:50%; top:50%; background: #1a1a1a; transform: translate(-50%,-50%) rotate(45deg); }
.close-btn span:last-child { transform: translate(-50%,-50%) rotate(-45deg); }

.mobile-menu-wrap .mobile-gnb .gnb-top-wrap { position: relative; padding-bottom: 32px; }
.mobile-menu-wrap .mobile-gnb .gnb-top-wrap::after { content: ''; width: 360px; height: 1px; background:#DDDDDD; position: absolute; bottom:0px; left:50%; transform: translateX(-50%); }
.mobile-menu-wrap .mobile-gnb .gnb-top-wrap p { font-size: 17px; line-height: 120%; }
.mobile-menu-wrap .mobile-gnb .gnb-top-wrap p:last-child { font-size: 20px; color:var(--main-color); font-weight: 700; }

.mobile-menu-wrap .mobile-gnb .gnb-wrap { margin: 40px 0 40px; padding-left:1px; }
.mobile-menu-wrap .mobile-gnb .gnb-wrap li:not(:last-child) { margin-bottom: 32px; }
.mobile-menu-wrap .mobile-gnb .gnb-wrap a { padding-left:30px; position: relative; position: relative; font-weight: 20px ; font-weight: 600; }
.mobile-menu-wrap .mobile-gnb .gnb-wrap a::before { content: ''; display: block; width:18px; height:18px; position: absolute; left:0px; top:50%; transform: translateY(-50%); }
.mobile-menu-wrap .mobile-gnb .gnb-wrap .go-reserve::before { background: url('/resources/img/common/ico_go_reserve.svg') no-repeat center/contain; }
.mobile-menu-wrap .mobile-gnb .gnb-wrap .go-company::before { background: url('/resources/img/common/ico_go_company.svg') no-repeat center/contain; }

.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap { padding:32px 0 40px; position: relative; z-index: 1; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap::after { content: ''; width: 360px; height: 100%; background:#FAFAFA; position: absolute; bottom:0px; left:50%; transform: translateX(-50%); z-index: -1; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap .prepare a { color:#888; filter: saturate(0) brightness(1.2); }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap p { padding-left: 1px; padding-bottom: 24px; font-size: 17px ; font-weight: 600; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap ul { display: grid; grid-template-columns: repeat(2, 1fr); gap:32px 0; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap span { display: inline-block; width: 20px; margin-right: 5px; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap span.okinawa::before { content: '🏖'; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap span.fukuoka::before {  content: '🍣'; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap span.hiroshima::before { content: '🎏'; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap span.osaka::before { content: '🌸'; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap span.nagoya::before { content: '🏯'; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap span.tokyo::before { content: '🗼'; }
.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap span.hokkaido::before { content: '⛄'; }

.mobile-menu-wrap .mobile-gnb .gnb-bot-wrap { display: flex; flex-direction: column; gap:24px; padding-top: 32px; font-size: 17px; font-weight: 500; }

@media screen and (max-width:768px){
	.header .h-inner { width: 100%; padding: 20px 20px 10px; }
	.header .logo { width: 130px; }
	.header .header-top-a { font-size: 13px; gap:16px; }
	.header .header-top-a a::before { width: 14px; height: 14px; }
	.header .header-top-a .go-reserve,
	.header .header-top-a .go-company { padding-left: 18px; }
	.header .header-top-a { padding-right: 30px; }
	.header .header-top-a .go-kakao { font-size: 12px; margin-left: 0; }
	.header .mob-hidden { display: none; }

	.close-btn { top:22px; right: 20px; }
	.mobile-menu-wrap .mobile-gnb .gnb-top-wrap { padding-bottom: 22px; }
	.mobile-menu-wrap .mobile-gnb .gnb-top-wrap p { font-size: 15px; }
	.mobile-menu-wrap .mobile-gnb .gnb-top-wrap p:last-child { margin-top: 3px; font-size: 17px; }
	.mobile-menu-wrap .mobile-gnb { padding:30px 32px 0; }
	.mobile-menu-wrap .mobile-gnb .gnb-wrap { margin:30px 0 30px; font-size: 15px; }
	.mobile-menu-wrap .mobile-gnb .gnb-wrap li:not(:last-child) { margin-bottom: 22px; }
	.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap { padding:22px 0 30px; }
	.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap p { font-size: 15px; }
	.mobile-menu-wrap .mobile-gnb .gnb-mid-wrap ul { font-size: 15px; gap:22px 0; }
	.mobile-menu-wrap .mobile-gnb .gnb-bot-wrap { font-size: 15px; }
}
@media screen and (max-width:500px){
	.header .header-top-a .go-reserve,
	.header .header-top-a .go-company { display: none; }
}