@charset "utf-8";
/* 文字化け防止 */
/* CSS Document */

/* =========================
   Suifeel salon (PC) 
========================= */

.SlonTitleBack{
	height: 500px;
	background:url(../commonImages/h1_img_Salon.jpg) center/cover no-repeat;
	margin:0 auto;
	width:100%;
	box-sizing: border-box;
	position: relative;
	margin: 0 auto 200px;
}

/* ===== IASO Salon Page: scalable CSS ===== */
.SalonPage{ 
	color:#0D0B2B; 
}

.SalonContainer{ 
	max-width:1080px; 
	margin:0 auto; 
	padding:0 22px; 
	box-sizing:border-box; 
}

.SalonH1{ 
	font-size:40px; 
	line-height:1.2; 
	letter-spacing:.04em; 
	margin:10px 0;
	color:#0D0B2B;
}

.SalonH2{ 
	font-size:30px; 
	line-height:1.25; 
	letter-spacing:.04em; 
	margin:0 0 18px; 
}

.SalonH3{
	font-size:16px; 
	line-height:1.5; 
	margin:0 0 8px;
}

.SalonKicker{ 
	font-size: 12px;
	letter-spacing: .06em;
	margin: 0 0 25px;
	opacity: .9;
}

.SalonLead{
	font-size: 16px;
	line-height: 2;
	margin: 5% 0; 
}

.SalonText{ 
	font-size:14px; 
	line-height:1.85; 
	margin:0; color:#333;
}

.SalonSmall{ 
	font-size: 12px;
	line-height: 1.7;
	margin: 12px 0 0;
	color: #555;
	text-align:left;
}

.SalonSection{
	padding:70px 0; 
}

.SalonSectionAlt1{ background:#f3fcff; }
.SalonSectionAlt{ background:#f6f7f9; }

.SalonBtn{ display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 18px; border-radius:12px; text-decoration:none; font-weight:700; box-sizing:border-box; }
.SalonBtnPrimary{ 
	background:#0D0B2B; 
	color:#fff;
	font-size: 15px;
}
.SalonBtnGhost{ 
	background:transparent;
	color:#0D0B2B; 
	border:1px solid #d7dbe3;
	font-size: 15px;
}

.SalonBreadcrumb{ font-size:12px; padding:18px 0 0; color:#555; }
.SalonBreadcrumb a{ color:#555; text-decoration:none; }
.SalonBreadcrumb_sep{ margin:0 6px; opacity:.6; }

.SalonHero{ 
	padding:5% 0;
	margin: 0 auto;
}

.SalonHero_inner{ 
	display:grid; 
	grid-template-columns:1.1fr .9fr; 
	gap:22px; 
	align-items:start;
	margin:0 auto;
}

.SalonHeroCtas{ 
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin: 5% auto;
}

.SalonMeta{
	margin:12px 0 0; 
	padding-left:18px; 
	color:#333; 
}

.SalonHero_media{}

.SalonMediaPh{ 
	display:flex;
	align-items:center; 
	justify-content:center;
}

.SalonMediaPh img{
	width:100%;
	background:#e9edf3;
	display:flex;
	align-items:center;
	justify-content:center;
	color:#667;
}
.SalonMediaNote{
	font-size: 12px;
	margin: 10px auto;
	color: #fff;
	text-align: center;
}

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

.SalonCard{
	background:#fff;
	border:1px solid #e8eaee;
	border-radius:16px;
	padding:18px;
	box-sizing:border-box;
}

.SalonSplit{
	display:grid;
	grid-template-columns:1.1fr .9fr; 
	gap:18px;
	 align-items:start;
}

.SalonList{
	margin:0; 
	padding-left:18px; 
	line-height:1.9;
}

.SalonNote{
	margin-top:14px;
	background:#fff;
	border:1px solid #e8eaee;
	border-radius:16px;
	padding:14px;
}

.SalonNoteTitle{
	font-weight:700; 
	margin:0 0 6px;
}

.SalonNoteText{ margin:0; font-size:14px; line-height:1.85; color:#333; }

.SalonGallery{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.SalonGallery_item{ display:flex; align-items:center; justify-content:center; color:#667; }
.SalonGallery_item img{ width:100%; border-radius:14px; }

.SalonPrice{ background:#fff; border:1px solid #e8eaee; border-radius:16px; overflow:hidden; }
.SalonPriceRow{ display:grid; grid-template-columns:1.3fr .7fr .7fr; }
.SalonPriceRow > div{ padding:14px; border-top:1px solid #eef1f6; font-size:14px; }
.SalonPriceHead{
	background:#0D0B2B; 
	color:#fff; 
	font-weight:700;
}

.SalonPriceHead > div{
	border-top:none;
	color: #fff;
}


.SalonSteps{ list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.SalonStep{ background:#fff; border:1px solid #e8eaee; border-radius:16px; padding:16px; display:grid; grid-template-columns:44px 1fr; gap:12px; }
.SalonStepNum{ width:44px; height:44px; border-radius:14px; background:#0D0B2B; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; }

.SalonFaqItem{ background:#fff; border:1px solid #e8eaee; border-radius:16px; padding:14px 16px; margin-bottom:10px; }
.SalonFaqItem summary{ cursor:pointer; font-weight:700; }
.SalonFaqItem div{ margin-top:10px; font-size:14px; line-height:1.85; color:#333; }

.SalonAccess{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
.SalonAccessInfo{ background:#fff; border:1px solid #e8eaee; border-radius:16px; padding:16px; }
.SalonAccessTitle{ font-weight:700; margin:0 0 10px; }
.SalonInlineCtas{ display:flex; gap:12px; flex-wrap:wrap; margin-top:12px; }

.SalonReserve{ padding:80px 0; background:#0D0B2B; color:#fff; }
.SalonH2White{ color:#fff; }
.SalonLeadWhite{ color:#fff; opacity:.92; }
.SalonSmallWhite{ color:#fff; opacity:.75; }
.SalonReserveCtas{ display:flex; gap:12px; flex-wrap:wrap; margin-top:12px; }
.SalonReserve .SalonBtnGhost{ color:#fff; border-color:rgba(255,255,255,.35); }
.SalonReserve .SalonBtnPrimary{ background:#fff; color:#0D0B2B; }

.SalonFixedCta{
	position: fixed;
	right: 14px;
	bottom: 50%;
	z-index: 50;
	padding: 12px 16px;
	border-radius: 5px;
	background: rgb(60, 160, 220);
	color: #fff;
	text-decoration: none;
	width: 100px;
	text-align: center;
}

/* ===== Purpose emphasis (Purchase/Rental first) ===== */
.SalonHeroPills{ display:flex; gap:8px; flex-wrap:wrap; margin:10px 0 14px; }
.SalonPill{ 
	font-size:12px;
	padding:6px 10px;
	border-radius:999px; 
	background:#f6f7f9; 
	border:1px solid #e8eaee; 
	color:#0D0B2B; 
}

.SalonTarget{ 
	background:#fff;
	border:1px solid #e8eaee; 
	border-radius:16px; 
	padding:18px;
}

.SalonTarget ul{ 
	margin:0; 
	line-height:1.9; 
}

.SalonTarget li{ 
	margin: 0 auto 2%; 
}

.SalonTarget li p{ 
	font-size:15px;
}

/* ===== Responsive (TB/SP minimal) ===== */
@media (max-width: 1080px){
	.SalonHero_inner{ grid-template-columns:1fr; }
	.SalonSplit{ grid-template-columns:1fr; }
	.SalonCards3{ grid-template-columns:1fr; }
	.SalonSteps{ grid-template-columns:1fr; }
	.SalonAccess{ grid-template-columns:1fr; }
	.SalonH1{ font-size:32px; }
	.SalonH2{ font-size:26px; }
}

/* ===== Patch: image layout stabilize ===== */
.SalonHero_media,
.SalonGallery_item{
	border-radius: 16px;
	overflow: hidden;
	background: #7fcbea;
}

.SalonMediaPh{
	overflow:hidden;
}

/* ヒーロー画像の高さを固定して “崩れ” を止める */
.SalonMediaPh img{
	display: block;
	width: 100%;
	height: 400px;
	object-fit: cover;
	border: ;
	border-radius: 16px 16px 0 0;
}

/* ギャラリーも高さ固定で整列 */
.SalonGallery_item{
	border-radius:14px;
	overflow:hidden;
}

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

.SalonAccessMap{
	width:90%;
	text-align:center;
	margin:auto;
		border-radius:16px; 
}

.SalonMapPh{ 
	background:#e9edf3;
	display:flex;
	align-items:center; 
	justify-content:center;
}

.SalonMapPh iframe {
	width: 100%;
	height: 350px;
}

.br-sp {
  display: none;
}