@charset "utf-8";

/* ==========================
   Page Hero
========================== */
.page-hero{
	position:relative;
	height:clamp(260px,42vh,440px);
	display:flex;
	align-items:center;
	justify-content:center;
	overflow:hidden;
	background:#f0e4d4;
}

.page-hero::before{
	content:"";
	position:absolute;
	inset:0;
	background-image:var(--bg);
	background-size:cover;
	background-position:center;
	transform:scale(1.06);
}

.page-hero::after{
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(
		180deg,
		rgba(255,248,233,.62) 0%,
		rgba(255,248,233,.78) 100%
	);
}

.page-hero-copy{
	position:relative;
	z-index:2;
	text-align:center;
	color:var(--brown);
	padding-top:78px;
}

.page-hero-en{
	display:block;
	font-size:clamp(54px,8vw,108px);
	font-weight:700;
	font-style:italic;
	letter-spacing:.06em;
	line-height:1;
	color:var(--brown);
	opacity:.16;
}

.page-hero h1{
	margin-top:clamp(-30px,-3.2vw,-14px);
	font-size:clamp(13px,1.3vw,17px);
	font-weight:500;
	letter-spacing:.28em;
	color:var(--brown);
}

.page-hero-line{
	display:block;
	width:36px;
	height:1px;
	background:var(--gold);
	margin:18px auto 0;
}

/* ==========================
   Breadcrumb
========================== */
.breadcrumb{
	padding:13px 0;
	background:#faf5ec;
	border-bottom:1px solid #ede3d5;
}

.breadcrumb ol{
	display:flex;
	align-items:center;
	gap:6px;
	font-size:11px;
	color:#a08a72;
	letter-spacing:.06em;
	list-style:none;
	padding:0;
}

.breadcrumb li:not(:last-child)::after{
	content:"/";
	margin-left:6px;
	opacity:.5;
}

.breadcrumb a{
	color:#a08a72;
	transition:color .2s;
}

.breadcrumb a:hover{
	color:var(--brown);
}

/* ==========================
   共通見出し
========================== */
.sub-heading{
	text-align:center;
	margin-bottom:clamp(38px,5.5vw,70px);
}

.sub-heading .section-en{
	display:block;
	margin-bottom:10px;
}

.sub-heading h2{
	font-size:clamp(26px,3vw,42px);
}

.deco-line{
	display:flex;
	align-items:center;
	gap:18px;
	justify-content:center;
	margin-top:16px;
}

.deco-line::before,
.deco-line::after{
	content:"";
	width:50px;
	height:1px;
	background:#d8c8b4;
}

.deco-line span{
	font-size:12px;
	color:#c9a46e;
	letter-spacing:.1em;
}

/* ==========================
   current nav
========================== */
.g-nav a.current{
	color:var(--brown);
}

.g-nav a.current::after{
	width:26px;
}

/* ==========================================
   PRODUCTS PAGE
========================================== */

/* --- ぼうちーず --- */
.boucheese-section{
	background:#fffaf0;
}

.boucheese-inner{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:clamp(40px,6vw,90px);
	align-items:center;
}

.boucheese-img{
	position:relative;
}

.boucheese-img img{
	width:100%;
	border-radius:28px;
	box-shadow:var(--shadow);
}

.boucheese-img::before{
	content:"";
	position:absolute;
	inset:-18px -18px 18px 18px;
	border:1px solid #d8c5a7;
	border-radius:28px;
	z-index:-1;
}

.boucheese-text .section-en{
	margin-bottom:8px;
}

.boucheese-text h2{
	font-size:clamp(38px,4.8vw,70px);
	line-height:1.1;
	margin:0 0 22px;
	color:#5d3f27;
}

.boucheese-text p{
	line-height:2.1;
	color:#6f5a48;
	margin-bottom:14px;
	font-weight:500;
}

.boucheese-tag{
	display:inline-block;
	margin:18px 0 30px;
	padding:8px 24px;
	background:linear-gradient(135deg,#d8b083,#c79a67);
	color:#fff;
	border-radius:999px;
	font-size:12px;
	letter-spacing:.12em;
}

/* --- ぼうちーずシリーズ --- */
.series-section{
	background:var(--paper);
}

.series-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:28px;
}

.series-card{
	background:#fff;
	border-radius:20px;
	overflow:hidden;
	box-shadow:0 8px 30px rgba(103,70,39,.08);
	border:1px solid #ede3d6;
	transition:transform .3s ease, box-shadow .3s ease;
}

.series-card:hover{
	transform:translateY(-6px);
	box-shadow:0 20px 48px rgba(103,70,39,.14);
}

.series-card img{
	width:100%;
	aspect-ratio:4/3;
	object-fit:cover;
	transition:transform .5s ease;
}

.series-card:hover img{
	transform:scale(1.04);
}

.series-card-body{
	padding:22px 24px 28px;
}

.series-card-body h3{
	font-size:18px;
	margin-bottom:8px;
	color:var(--brown);
}

.series-card-body p{
	font-size:13px;
	line-height:1.9;
	color:#7a6350;
}
#series02,#series03{
	scroll-margin-top:100px;
}

/* --- カットケーキ --- */
.cutcake-section{
	background:#fff;
}

.cutcake-inner{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:clamp(36px,5vw,80px);
	align-items:center;
}

.cutcake-text h2{
	font-size:clamp(26px,2.8vw,40px);
	margin-bottom:22px;
}

.cutcake-text p{
	line-height:2.1;
	color:#6f5a48;
	margin-bottom:12px;
	font-weight:500;
}

.cutcake-note{
	display:flex;
	align-items:center;
	gap:10px;
	margin-top:22px;
	padding:14px 20px;
	background:rgba(201,154,75,.1);
	border-left:3px solid var(--gold);
	border-radius:0 10px 10px 0;
	font-size:13px;
	color:var(--brown);
}

.cutcake-note i{
	color:var(--gold);
	font-size:15px;
}

.cutcake-imgs{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:12px;
}

.cutcake-imgs img{
	aspect-ratio:1;
	object-fit:cover;
	border-radius:16px;
	box-shadow:0 10px 28px rgba(89,57,28,.10);
	transition:transform .35s ease;
}

.cutcake-imgs img:hover{
	transform:translateY(-4px);
}

.cutcake-imgs img:first-child{
	grid-column:1 / -1;
	aspect-ratio:16/9;
}

/* --- ホールケーキ --- */
.wholecake-p-section{
	background:#fffaf0;
	text-align:center;
}

.wholecake-note{
	display:inline-flex;
	align-items:center;
	gap:10px;
	margin:0 auto 36px;
	padding:14px 28px;
	background:#fff;
	border:1px solid #d8c8b4;
	border-radius:12px;
	font-size:13px;
	letter-spacing:.06em;
	color:var(--brown);
	box-shadow:0 4px 16px rgba(103,70,39,.06);
}

.wholecake-note i{
	color:var(--gold);
	font-size:16px;
}

.whole-gallery{
	display:grid;
	grid-template-columns:repeat(5,1fr);
	gap:14px;
	margin-bottom:40px;
}

.whole-gallery img{
	aspect-ratio:1;
	object-fit:cover;
	border-radius:16px;
	box-shadow:0 8px 24px rgba(89,57,28,.10);
	transition:transform .35s ease;
}

.whole-gallery img:hover{
	transform:scale(1.04);
}

/* --- 誕生秘話 --- */
.birth-story{
	margin-top:clamp(48px,6vw,80px);
	padding:clamp(32px,4vw,54px) clamp(28px,5vw,72px);
	background:#fff;
	border-radius:20px;
	border:1px solid #ede3d6;
	position:relative;
	overflow:hidden;
}

.birth-story::before{
	content:"STORY";
	position:absolute;
	right:-10px;
	top:-14px;
	font-size:clamp(60px,8vw,100px);
	font-weight:700;
	font-style:italic;
	letter-spacing:.06em;
	color:var(--brown);
	opacity:.06;
	line-height:1;
	pointer-events:none;
}

.birth-story-inner{
	/*max-width:860px;*/
	max-width: 80%;
	margin:0 auto;
	display:grid;
	grid-template-columns:6fr 4fr;
	gap:60px;
	align-items:start;	
}

.birth-story-label{
	font-size:11px;
	letter-spacing:.18em;
	color:var(--gold);
	font-weight:700;
	margin-bottom:10px;
}

.birth-story-inner h3{
	font-size:clamp(18px,2vw,26px);
	font-weight:500;
	letter-spacing:.08em;
	margin-bottom:20px;
	color:var(--brown);
}

.birth-story-inner p{
	font-size:14px;
	line-height:2.1;
	color:#6f5a48;
	font-weight:500;
	margin-bottom:12px;
}

.birth-story-inner p:last-child{
	margin-bottom:0;
}

.birth-story-inner strong{
	color:var(--brown);
	font-size:15px;
}
.birth-images{
	display:flex;
	flex-direction:column;
	gap:18px;
}

.birth-images img{
	width:100%;
	border-radius:14px;
	box-shadow:0 12px 30px rgba(0,0,0,.08);
}
@media(min-width:1600px){
.birth-images img:nth-child(2){
	display: none;
}
}

/* --- カットケーキ Swiper --- */
.cutcake-swiper{
	margin-top:clamp(28px,3.5vw,48px);
	border-radius:20px;
	overflow:hidden;
	box-shadow:0 14px 40px rgba(89,57,28,.13);
}

.cutcake-swiper .swiper-slide{
	border-radius:16px;
	overflow:hidden;
}

.cutcake-swiper .swiper-slide img{
	width:100%;
	aspect-ratio:4/3;
	object-fit:cover;
	display:block;
	transition:transform .4s ease;
}

.cutcake-swiper .swiper-slide:hover img{
	transform:scale(1.04);
}

.cutcake-swiper .swiper-button-next,
.cutcake-swiper .swiper-button-prev{
	color:#fff;
	background:rgba(111,74,45,.55);
	width:38px;
	height:38px;
	border-radius:50%;
	backdrop-filter:blur(4px);
	transition:background .25s;
}

.cutcake-swiper .swiper-button-next:hover,
.cutcake-swiper .swiper-button-prev:hover{
	background:rgba(111,74,45,.85);
}

.cutcake-swiper .swiper-button-next::after,
.cutcake-swiper .swiper-button-prev::after{
	font-size:13px;
	font-weight:700;
}

.cutcake-swiper .swiper-pagination-bullet{
	background:#fff;
	opacity:.6;
}

.cutcake-swiper .swiper-pagination-bullet-active{
	background:#fff;
	opacity:1;
	width:20px;
	border-radius:999px;
}

/* --- サイズガイド --- */
.cake-size-guide{
	margin-top:clamp(40px,5vw,64px);
	max-width:800px;
	margin-left:auto;
	margin-right:auto;
}

.cake-size-guide h3{
	font-size:clamp(15px,1.6vw,20px);
	font-weight:500;
	letter-spacing:.08em;
	margin-bottom:20px;
	color:var(--brown);
	text-align:center;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:10px;
}

.cake-size-guide h3 i{
	color:var(--gold);
	font-size:17px;
}

.size-guide-wrap{
	background:#fff;
	border-radius:16px;
	border:1px solid #ede3d6;
	overflow:hidden;
	box-shadow:0 6px 24px rgba(103,70,39,.06);
}

.size-table{
	width:100%;
	border-collapse:collapse;
	font-size:13px;
}

.size-table thead{
	background:linear-gradient(135deg,#d8b083,#c79a67);
}

.size-table thead th{
	padding:13px 16px;
	color:#fff;
	font-weight:500;
	letter-spacing:.06em;
	text-align:center;
}

.size-table tbody tr{
	border-bottom:1px solid #ede3d6;
	transition:background .2s;
}

.size-table tbody tr:last-child{
	border-bottom:none;
}

.size-table tbody tr:hover{
	background:#fffaf0;
}

.size-table tbody td{
	padding:12px 16px;
	text-align:center;
	color:#4e3d2c;
	line-height:1.6;
}

.size-table tbody td:last-child{
	text-align:left;
	color:#7a6350;
	font-size:12px;
}

.size-badge{
	display:inline-block;
	padding:3px 12px;
	background:linear-gradient(135deg,#f0dcc0,#e8c898);
	border-radius:999px;
	font-size:12px;
	font-weight:700;
	color:#6b4a2e;
	letter-spacing:.06em;
}

.size-note{
	padding:12px 20px;
	background:#faf5ec;
	font-size:11px;
	color:#9b836a;
	letter-spacing:.04em;
	display:flex;
	align-items:center;
	gap:7px;
}

.size-note i{
	color:var(--gold);
	font-size:12px;
	flex-shrink:0;
}

/* ==========================================
   ABOUT PAGE
========================================== */

/* --- 店舗情報 --- */
.shopinfo-p-section{
	background:#fffaf0;
}

.shop-detail-cards{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:40px;
}

.shop-detail-card{
	background:#fff;
	border-radius:20px;
	overflow:hidden;
	box-shadow:0 8px 30px rgba(98,65,35,.07);
	border:1px solid #ece3d6;
}

.shop-detail-card-img img{
	width:100%;
	height:220px;
	object-fit:cover;
	display:block;
}

.shop-detail-body{
	padding:clamp(22px,2.5vw,36px) clamp(22px,3vw,40px);
}

.shop-label{
	display:inline-block;
	padding:4px 16px;
	background:linear-gradient(135deg,#d8b083,#c79a67);
	color:#fff;
	border-radius:999px;
	font-size:11px;
	letter-spacing:.12em;
	margin-bottom:14px;
}

.shop-detail-body h3{
	font-size:clamp(22px,2.2vw,30px);
	font-weight:500;
	margin-bottom:6px;
}

.shop-detail-body .address{
	font-size:13px;
	color:#7a6350;
	margin-bottom:20px;
	line-height:1.7;
}

.shop-info-table{
	width:100%;
	border-collapse:collapse;
	font-size:13px;
	margin-bottom:24px;
}

.shop-info-table tr{
	border-bottom:1px solid #ede3d7;
}

.shop-info-table th{
	padding:10px 0;
	width:86px;
	text-align:left;
	color:#9b836a;
	font-weight:500;
	vertical-align:top;
}

.shop-info-table td{
	padding:10px 0;
	color:#4e3d2c;
	line-height:1.8;
}

.shop-info-table td a{
	color:var(--brown);
	font-weight:500;
}

.shop-map{
	height:220px;
	overflow:hidden;
}

.shop-map iframe{
	width:100%;
	height:100%;
	border:0;
	filter:saturate(.75) opacity(.88);
	display:block;
}

/* --- 採用情報 --- */
.recruit-section{
	position:relative;
	overflow:hidden;
	background:#f5ead9;
}

.recruit-section::before{
	content:"";
	position:absolute;
	inset:0;
	background-image:url('../img/index/about01.jpg');
	background-size:cover;
	background-position:center;
	opacity:.1;
}

.recruit-inner{
	position:relative;
	z-index:1;
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:clamp(36px,5vw,80px);
	align-items:center;
}

.recruit-text h2{
	font-size:clamp(26px,2.8vw,40px);
	margin-bottom:20px;
}

.recruit-text > p{
	line-height:2.1;
	color:#6f5a48;
	font-weight:500;
	margin-bottom:28px;
}

.recruit-items{
	list-style:none;
	padding:0;
	margin:0;
}

.recruit-items li{
	display:flex;
	align-items:flex-start;
	gap:12px;
	padding:13px 0;
	border-bottom:1px solid rgba(216,197,167,.5);
	font-size:14px;
	color:#4e3d2c;
	line-height:1.8;
}

.recruit-items li i{
	color:var(--gold);
	margin-top:4px;
	flex-shrink:0;
	font-size:13px;
}

.recruit-img{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:12px;
}

.recruit-img img{
	aspect-ratio:1;
	object-fit:cover;
	border-radius:18px;
	box-shadow:0 10px 28px rgba(89,57,28,.1);
}

.recruit-img img:first-child{
	grid-column:1 / -1;
	aspect-ratio:16/9;
}

.recruit-apply{
	margin-top:28px;
	padding:22px 26px;
	background:#fff;
	border-radius:14px;
	border:1px solid #ede3d7;
	font-size:13px;
	color:#6f5a48;
	line-height:1.9;
}

.recruit-apply strong{
	display:block;
	margin-bottom:6px;
	font-size:14px;
	color:var(--brown);
}

/* --- お問い合わせ --- */
.contact-section{
	background:#fff;
}

.contact-wrap{
	max-width:780px;
	margin:0 auto;
}

.contact-intro{
	text-align:center;
	margin-bottom:44px;
	font-size:14px;
	line-height:2;
	color:#7a6350;
}

.contact-form{
	background:#fffaf0;
	border-radius:24px;
	padding:clamp(32px,5vw,60px) clamp(28px,5vw,64px);
	border:1px solid #ede3d7;
	box-shadow:0 12px 40px rgba(103,70,39,.06);
}

.form-row{
	margin-bottom:22px;
}

.form-label{
	display:flex;
	align-items:center;
	gap:8px;
	margin-bottom:9px;
	font-size:13px;
	font-weight:600;
	letter-spacing:.06em;
	color:var(--brown);
}

.form-required{
	display:inline-block;
	padding:2px 8px;
	background:#a0523c;
	color:#fff;
	border-radius:4px;
	font-size:9px;
	font-weight:700;
	letter-spacing:.1em;
}

.form-optional{
	display:inline-block;
	padding:2px 8px;
	background:#b0a090;
	color:#fff;
	border-radius:4px;
	font-size:9px;
	letter-spacing:.06em;
}

.form-input,
.form-select,
.form-textarea{
	width:100%;
	padding:13px 16px;
	border:1px solid #d8c9b4;
	border-radius:10px;
	background:#fff;
	font-size:15px;
	font-family:inherit;
	color:var(--brown);
	letter-spacing:.04em;
	transition:border-color .25s ease, box-shadow .25s ease;
	box-sizing:border-box;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus{
	outline:none;
	border-color:var(--gold);
	box-shadow:0 0 0 3px rgba(201,154,75,.15);
}

.form-textarea{
	min-height:160px;
	resize:vertical;
	line-height:1.8;
}

.form-select{
	appearance:none;
	-webkit-appearance:none;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238c633d' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 16px center;
	cursor:pointer;
}

.form-row-2col{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:18px;
}

/* プライバシーポリシー */
.privacy-wrap{
	margin:28px 0 20px;
	padding:20px 22px;
	background:#fff;
	border-radius:14px;
	border:1px solid #ede3d7;
}

.privacy-toggle{
	all:unset;
	display:flex;
	align-items:center;
	gap:8px;
	cursor:pointer;
	font-size:12px;
	letter-spacing:.08em;
	color:#9b836a;
}

.privacy-toggle-icon{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:18px;
	height:18px;
	border-radius:50%;
	background:rgba(201,154,75,.2);
	font-size:9px;
	color:var(--gold);
	transition:transform .3s ease, background .25s;
	flex-shrink:0;
}

.privacy-toggle[aria-expanded="true"] .privacy-toggle-icon{
	transform:rotate(180deg);
	background:rgba(201,154,75,.35);
}

.privacy-body{
	overflow:hidden;
	max-height:0;
	transition:max-height .4s ease;
}

.privacy-body.is-open{
	max-height:500px;
}

.privacy-content{
	margin-top:14px;
	font-size:12px;
	line-height:2;
	color:#7a6350;
	max-height:200px;
	overflow-y:auto;
	padding-right:4px;
}

.privacy-content h4{
	font-size:12px;
	font-weight:700;
	margin:12px 0 4px;
	color:var(--brown);
}

.privacy-content p,
.privacy-content ol{
	margin:0 0 8px;
}

.privacy-content ol{
	padding-left:18px;
}

.privacy-agree{
	margin-top:22px;
	display:flex;
	align-items:center;
	gap:10px;
	font-size:13px;
	color:var(--brown);
	cursor:pointer;
	user-select:none;
}

.privacy-agree input[type="checkbox"]{
	width:18px;
	height:18px;
	accent-color:var(--gold);
	cursor:pointer;
	flex-shrink:0;
}

.form-submit-wrap{
	margin-top:34px;
	text-align:center;
}

.form-submit{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	padding:16px 56px;
	background:var(--brown);
	color:#fff;
	border:none;
	border-radius:999px;
	font-size:15px;
	font-family:inherit;
	font-weight:600;
	letter-spacing:.14em;
	cursor:pointer;
	transition:background .3s ease, transform .3s ease;
}

.form-submit:hover{
	background:var(--brown-dark);
	transform:translateY(-2px);
}

.form-submit::after{
	content:"→";
	transition:transform .3s ease;
}

.form-submit:hover::after{
	transform:translateX(4px);
}

/* ==========================================
   THANKS PAGE
========================================== */
.thanks-section{
	min-height:72vh;
	display:flex;
	align-items:center;
	justify-content:center;
	background:linear-gradient(180deg,#fffaf0 0%,#f8edda 100%);
	padding:clamp(80px,10vw,140px) 0;
}

.thanks-inner{
	max-width:580px;
	margin:0 auto;
	text-align:center;
	padding:0 24px;
}

.thanks-icon{
	width:76px;
	height:76px;
	border-radius:50%;
	background:linear-gradient(135deg,#d8b083,#c79a67);
	display:flex;
	align-items:center;
	justify-content:center;
	margin:0 auto 32px;
}

.thanks-icon i{
	font-size:28px;
	color:#fff;
}

.thanks-inner h1{
	font-size:clamp(20px,2.4vw,30px);
	font-weight:500;
	letter-spacing:.1em;
	margin-bottom:22px;
	color:var(--brown);
}

.thanks-inner .thanks-lead{
	font-size:15px;
	line-height:2.2;
	color:#7a6350;
	font-weight:500;
	margin-bottom:0;
}

.thanks-divider{
	width:60px;
	height:1px;
	background:#d8c8b4;
	margin:32px auto;
}

.thanks-inner .thanks-info{
	font-size:16px;
	line-height:2;
	color:#7a6350;
}

/* ==========================================
   RESPONSIVE — sub pages
========================================== */
@media(max-width:1100px){
	.series-grid{
		grid-template-columns:repeat(2,1fr);
		gap:22px;
	}
	.whole-gallery{
		grid-template-columns:repeat(3,1fr);
	}
}

@media(max-width:900px){
	.boucheese-inner{
		grid-template-columns:1fr;
		gap:36px;
	}
	.boucheese-img::before{
		display:none;
	}
	.birth-story-inner{
		grid-template-columns:1fr;
		gap:40px;
	}
	.birth-images {
		display: flex;
		flex-direction: row;
		gap: 18px;
	}	
	.birth-images img{
		width: 48%;
	}
	.cutcake-inner{
		grid-template-columns:1fr;
		gap:32px;
	}
	.recruit-inner{
		grid-template-columns:1fr;
		gap:32px;
	}
	.recruit-img{
		display:none;
	}
	.shop-detail-cards{
		grid-template-columns:1fr;
		gap:30px;
	}	
}

@media(max-width:767px){
	.series-grid{
		grid-template-columns:1fr;
		gap:18px;
	}
	.whole-gallery{
		grid-template-columns:repeat(2,1fr);
		gap:10px;
	}
	.form-row-2col{
		grid-template-columns:1fr;
	}
	.contact-form{
		padding:28px 22px;
	}
	.cutcake-imgs{
		grid-template-columns:1fr 1fr;
	}
}

@media(max-width:550px){
	.page-hero-en{
		font-size:clamp(40px,12vw,70px);
	}
	.whole-gallery{
		grid-template-columns:repeat(2,1fr);
	}
}
