@charset "utf-8";
/* *************************************
// スタイル
************************************* */

/* ハンバーガーメニュー */
.hamburger-btn {
	display: none;
	position: relative;
	width: 30px;
	height: 30px;
	background: transparent;
	border: none;
	cursor: pointer;
	padding: 0;
	z-index: 1001;
	flex-direction: column;
	justify-content: space-around;
	align-items: center;
}

.hamburger-line {
	display: block;
	width: 25px;
	height: 2px;
	background-color: var(--sub-color);
	transition: all 0.3s ease;
	border-radius: 2px;
}

.hamburger-btn.active .hamburger-line:nth-child(1) {
	transform: rotate(45deg) translate(8px, 8px);
}

.hamburger-btn.active .hamburger-line:nth-child(2) {
	opacity: 0;
}

.hamburger-btn.active .hamburger-line:nth-child(3) {
	transform: rotate(-45deg) translate(7px, -7px);
}

@media (max-width: 767px) {
	.hamburger-btn {
		display: flex;
		margin-left: auto;
	}

	.h001.header .main-nav {
		position: fixed;
		top: 0;
		right: -100%;
		width: 80%;
		max-width: 300px;
		height: 100vh;
		background-color: #fff;
		box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
		transition: right 0.3s ease;
		z-index: 1000;
		padding: 80px 20px 20px;
		overflow-y: auto;
	}

	.h001.header .main-nav.active {
		right: 0;
	}

	.h001.header .main-nav ul {
		flex-direction: column;
		gap: 0;
		align-items: stretch;
	}

	.h001.header .main-nav li {
		border-bottom: 1px solid #eee;
	}

	.h001.header .main-nav li a {
		display: block;
		padding: 15px 10px;
		font-size: 16px;
		color: var(--sub-color);
		text-decoration: none;
		transition: background-color 0.3s ease;
	}

	.h001.header .main-nav li a:hover {
		background-color: #f5f5f5;
		color: var(--sub-color);
	}

	.h001.header .header_box {
		position: relative;
	}

	body.menu-open {
		overflow: hidden;
	}

	body.menu-open::before {
		content: '';
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		z-index: 999;
	}
}
section.gallery, section.product, section.access, section.shop_info, section.faq, .footer {
	content-visibility: auto;
}
section.gallery {contain-intrinsic-size: 600px;}
section.product {contain-intrinsic-size: 4000px;}
section.access {contain-intrinsic-size: 1350px;}
section.shop_info {contain-intrinsic-size: 1070px;}
section.faq {contain-intrinsic-size: 1270px;}
.footer {contain-intrinsic-size: 460px;}
@media (width >= 1280px) {
	section.gallery {contain-intrinsic-size: 550px;}
	section.product {contain-intrinsic-size: 2570px;}
	section.access {contain-intrinsic-size: 1080px;}
	section.shop_info {contain-intrinsic-size: 75px;}
	section.faq {contain-intrinsic-size: 1030px;}
	.footer {contain-intrinsic-size: 430px;}
}
.mv001_text_side .mv__scroll {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: center;
}
.scroll-down {
	position: relative;
}

.scroll-down-mobile {
	display: none;
}
.scroll-down p {
	color: var(--sub-color);
	font-size: 16px;
	writing-mode: vertical-rl;
	margin: 0;
	padding: 0;
	letter-spacing: 0.1em;
	white-space: nowrap;
	line-height: 1.2;
	letter-spacing: 0.2rem;
}
.scroll-down::before {
	content: '';
	position: absolute;
	bottom: -150px;
	left: calc(10 * var(--rem));
	width: calc(13 * var(--rem));
	aspect-ratio: 1;
	background-color: #ADA250;
	animation: diamondFall 2.6s ease-in-out infinite;
	z-index: 1;
	transform: translateX(-50%) rotate(45deg);
}
@keyframes diamondFall {
	0% {
		transform: translateX(-50%) translateY(calc(-140 * var(--rem))) rotate(45deg);
		opacity: 1;
	}
	100% {
		transform: translateX(-50%) translateY(0) rotate(45deg);
		opacity: 0.3;
	}
}
.scroll-down::after {
	content: '';
	position: absolute;
	bottom: -150px;
	left: calc(9 * var(--rem));
	width: 1px;
	height: calc(140 * var(--rem));
	background-color: #ADA250;
}



/* 新店舗のCSS */
.new-store-mv {
	position: relative;
	aspect-ratio: unset;
	height: 70vh;
	min-height: 400px;
}
.new-store-date {
	position: absolute;
	bottom: 0;
	right: 0;
	transform: translate(-15%, -10%);
	z-index: 10;
	text-align: center;
}
.new-store-date .date-text {
	font-family: serif;
	font-size: clamp(32px, 5vw, 56px);
	color: #fff;
	margin: 0;
	padding: 0;
	line-height: 1.2;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}
.new-store-date .open-text {
	font-family: serif;
	font-size: clamp(36px, 5.5vw, 100px);
	color: #fff;
	margin: 10px 0 0 0;
	padding: 0;
	line-height: 1.2;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

/* スマホ表示時のメインビジュアル */
@media (max-width: 767px) {
	.mv001 {
		width: 100%;
		margin-left: 0;
		margin-top: 0;
	}

	.mv001_wrapper {
		grid-template-columns: 1fr;
		position: relative;
	}

	.mv001_text_side {
		display: none;
	}

	.mv001_image_side {
		width: 100%;
		height: 60vh;
		min-height: 300px;
		position: relative;
	}

	.new-store-mv {
		height: 60vh;
		min-height: 300px;
	}

	/* scroll-downを画像の左端に配置 */
	.scroll-down-mobile {
		display: block;
	}

	.mv001_text_side .scroll-down {
		display: none;
	}

	.mv001_image_side .scroll-down-mobile {
		position: absolute;
		right: 20px;
		top: 60%;
		transform: translateY(-50%);
		z-index: 20;
	}

	.mv001_image_side .scroll-down-mobile p {
		color: #fff;
		text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
	}

	.mv001_image_side .scroll-down-mobile::before {
		bottom: -150px;
		left: calc(10 * var(--rem));
		background-color: #fff;
	}

	.mv001_image_side .scroll-down-mobile::after {
		bottom: -100px;
		left: calc(9 * var(--rem));
		height: calc(100 * var(--rem));
		background-color: #fff;
	}

	/* New Openを下に配置 */
	.new-store-date {
		bottom: 20px;
		right: 50px;
		transform: none;
	}

	.new-store-date .date-text {
		font-size: clamp(20px, 4vw, 32px);
	}

	.new-store-date .open-text {
		font-size: clamp(24px, 5vw, 48px);
	}
}
/* 新店舗ページ代表商品 */
.rep {
	padding: 80px 0;
     background-color: rgba(183,186,107,0.3);
	 margin-top: 80px;
	 background-image: url(../img/top/bg_nois.png);
  }
  
  .rep__inner {
	margin: 0 auto;
  }
  
  .rep__head {
	text-align: center;
	margin-bottom: 40px;
  }
  
  .rep__title {
	font-size: clamp(22px, 2.4vw, 32px);
	letter-spacing: 0.08em;
	margin: 0;
	font-weight: bold;
  }
  
  .rep__subtitle {
	font-size: 15px;
	letter-spacing: 0.2em;
	color: #ADA250;
  }
  
  /* list */
  .rep__list {
	display: grid;
	gap: 0; 
  }
  
  /* 1商品 = 1行2カラム */
  .repItem {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
  }
  
  /* 偶数行だけ左右を反転（画像→文章 / 文章→画像の交互） */
  .repItem:nth-child(even) .repItem__media { order: 2; }
  .repItem:nth-child(even) .repItem__body  { order: 1; }
  
  .repItem__media {
	margin: 0;
	overflow: hidden;
  }
  
  .repItem__media img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	background: #fffff6;
	aspect-ratio: 4 / 3; 
  }
  
  .repItem__body {
	padding: clamp(18px, 3vw, 32px);
	display: grid;
	align-content: center;
	gap: 0px;
	text-align: center;
	background: rgba(251,251,251,0.3);
  }
  
  .repItem__title {
	margin: 0;
	font-size: 1.8rem;
	color: #333;
	font-weight: bold;
	letter-spacing: 0.08em;
	@media(max-width: 798px) {
		font-size: 1.4rem;
	}
  }
  
  .repItem__title-en {
	margin: 4px 0 0;
	font-size: 1rem;
	color: #ADA250;
	letter-spacing: 0.1em;
	
  }
  
  .repItem__text {
	margin: 0;
	line-height: 2.0;
	font-size: 1.2rem;
	@media(max-width: 798px) {
		font-size: 1rem;
	}
  }
  
  .repItem__link {
	justify-self: center;
	display: inline-block;
	padding: 10px 16px;
	border: 1px solid rgba(0,0,0,0.35);
	text-decoration: none;
	color: inherit;
	font-size: 13px;
	letter-spacing: 0.08em;
	transition: transform .15s ease, opacity .15s ease;
  }
  
  .repItem__link:hover {
	transform: translateY(-1px);
	opacity: 0.85;
  }
  
  /* SP：縦積みにして、画像→文章の順に統一 */
  @media (max-width: 768px) {
	.repItem {
	  grid-template-columns: 1fr;
	}
	.repItem__media, .repItem__body {
	  order: initial;
	}
	.repItem:nth-child(even) .repItem__media {
	  order: initial;
	}
	.repItem:nth-child(even) .repItem__body {
	  order: initial;
	}
	.repItem__media img {
	  aspect-ratio: 16 / 9;
	}
  }
  .fastidiousness_img{
	position: relative;
	overflow: hidden; 
  }
  
  .fastidiousness_img img{
	display: block;   
	width: 100%;
	height: auto;
  }
  
  /* 黒フィルター */
  .fastidiousness_img::after{
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.7);
	pointer-events: none;
  }
  .honcho-street-text {
	position: relative;
	z-index: 10;
	color: #fff;
	text-align: center;
  }
  .honcho-street .fastidiousness_description_wrap{
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: min(700px, 90%);
	max-width: none;        
	padding: 0;             
	z-index: 2;
	text-align: center;
  }
  .sp_none {
	display: block;
	@media(max-width: 798px) {
		display: none;
	}
  
  }
  .google-map {
	padding: 80px 0;
	background-color: #f9f9f9;
  }
  .google-map-inner {
	width: min(1200px, 92%);
	margin: 0 auto;
  }
  .google-map-inner iframe {
	width: 100%;
	height: 450px;
	border: 0;
	display: block;
  }
  @media (max-width: 768px) {
	.google-map-inner iframe {
		height: 300px;
	}
  }
  .shop_info_list {
	margin: 0 auto;
	padding: 0;
	display: grid;
	gap: 16px;
	grid-template-columns: 20% 1fr;
	text-align: left;
	max-width: 90%;
	@media(max-width: 798px) {
		max-width: 100%;
	}
  }
  .shop_info_term {
	font-size: 14px;
	font-weight: 600;
	color: var(--sub-color);
	margin: 0;
	padding: 0;
	line-height: 1.8;
  }
  .shop_info_desc {
	font-size: 14px;
	line-height: 1.8;
	color: var(--text-color);
	margin: 0;
	padding: 0;
  }
  .shop_info_desc span {
	color: var(--gold-color);
  }
  @media (width < 768px) {
	.shop_info_term,
	.shop_info_desc {
		font-size: 13px;
	}
  }
  @media (width >= 1024px) {
	.shop_info_term,
	.shop_info_desc {
		font-size: 1.2rem;
	}
  }
  /* イメージセクション */
  .img-selection {
    padding: 40px 0;
}

.img-selection-wrap {
    margin: 0 auto;
    
}

.img-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
    width: 100%;
    height: 650px;
    gap: 5px;
}

.img-item {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.img-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

@media (max-width: 1029px) {
    .img-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(4, 1fr);
        height: 700px;
    }
}

@media (max-width: 767px) {
    .img-selection {
        padding: 20px 0;
    }
    
    .img-selection-wrap {
        padding: 0 10px 0px 10px;
    }
    
    .img-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(4, 1fr);
        height: 850px;
    }
}

/* フッター店舗情報横並びレイアウト */
.footer_company_title {
	margin-bottom: 40px;
	width: 100%;
}

.footer_company_title .logo {
	margin-bottom: 0;
}

.footer_shops_wrapper {
	display: flex;
	gap: 40px;
	width: 100%;
	justify-content: flex-start;
}

.company_info {
	width: 25%;
	min-width: 0;
}

.company_info .shop_address,
.company_info .shop_hours {
	font-size: 14px;
	line-height: 1.8;
	color: rgba(255, 255, 255, 0.9);
	margin-bottom: 15px;
}

.company_info .shop_hours {
	margin-bottom: 0;
}

.store_title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.store_title_text {
	font-size: 1.2rem;
	font-weight: bold;
	color: #fff;
	margin: 0;
}

.store_link {
	display: flex;
	align-items: center;
	gap: 5px;
	color: #fff;
	text-decoration: none;
	font-size: 0.9rem;
	transition: opacity 0.3s ease;
}

.store_link:hover {
	opacity: 0.8;
}

.link_arrow {
	font-size: 1.2rem;
}
.link_text {
	border: 1px solid;
	padding: 3px 10px;
	@media(max-width: 798px) {
		font-size: 0.8rem;
	}
}
.link_text:hover {
	opacity: 0.7;
}

.new_store_image {
	margin-bottom: 20px;
	border-radius: 8px;
	overflow: hidden;
	width: 200px;
	max-width: 100%;
}

.new_store_image img {
	width: 200px;
	max-width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
}

.footer_logo_img {
	width: 150px;
	height: auto;
	margin-bottom: 20px;
	display: block;
}

.shop_parking {
	margin-top: 15px;
	font-size: 0.9rem;
	color: rgba(255, 255, 255, 0.9);
	line-height: 1.8;
}

@media (max-width: 767px) {
	.footer_company_title {
		margin-bottom: 30px;
	}

	.footer_shops_wrapper {
		flex-direction: column;
		gap: 30px;
		align-items: flex-start;
	}

	.company_info {
		width: 100%;
	}

	.store_title {
		margin-bottom: 15px;
	}

	.store_title_text {
		font-size: 1.1rem;
	}

	.new_store_image {
		margin-bottom: 15px;
		width: 200px;
	}

	.new_store_image img {
		width: 200px;
	}
}