@charset "UTF-8";

/*=============================================================
  variables
=============================================================*/
:root {
	/* color */
	--color-navy: #131d3d;
	--color-gold: #af8445;
	--color-beige: #b79478;
	--color-slate: #6c7584;
	--color-gray: #d1d1d1;
	--color-bg-blue: #edf2fd;

	/* font */
	--font-mincho: shippori-mincho, 'Shippori Mincho', 'Noto Serif JP', serif;
	--font-gothic: 'Noto Sans JP', sans-serif;
	--font-en: proxima-sera, var(--font-mincho);

	/* font-size */
	--fs-title-en: clamp(4.4rem, 1.4rem + 4.65vw, 7rem);
	--fs-title-ja: clamp(2.4rem, 1.7rem + 1.05vw, 3.2rem);
	--fs-accent: clamp(1.8rem, 0.618rem + 1.845vw, 3.2rem);

	/* space */
	--space-section: clamp(5.4rem, 7vw, 9.8rem);

	/*
	  font-size（SP：640px以下）は下記8段階から選ぶ（375px幅での目安）
	  3.2vw（12px）  注釈・キャプション・コピーライト
	  3.7vw（14px）  本文ベース
	  4.2vw（16px）  リード文・やや大きい本文・ボタン
	  4.8vw（18px）  小見出し・キャッチ
	  5.4vw（20px）  中見出し・サブコピー
	  6.4vw（24px）  大見出し
	  7.2vw（28px）  強調数字・特大見出し
	  9.0vw（34px）  セクション英字見出し
	*/
}

/* ------------
  common Style
--------------- */
.pc {
	display: block !important;
}
.pc-inline {
	display: inline-block !important;
}
.sp {
	display: none !important;
}
.sp-inline {
	display: none !important;
}
@media (max-width: 640px) {
	.pc {
		display: none !important;
	}
	.pc-inline {
		display: none !important;
	}
	.sp {
		display: block !important;
	}
	.sp-inline {
		display: inline-block !important;
	}
}

.tac {
	text-align: center !important;
}
.tal {
	text-align: left!important;
}
.tar {
	text-align: right!important;
}

/* ヘッダーの高さ分、ページ内リンクの着地位置をずらす */
.anchor-target {
	scroll-margin-top: 100px;
}
@media (max-width: 640px) {
	.anchor-target {
		scroll-margin-top: 18.67vw;
	}
}

/*--- PCで電話リンク無効 ---*/
@media (min-width: 641px) {
	a[href^='tel:'] {
		pointer-events: none;
	}
}


/*=============================================================
  container（セクション内側の幅）
=============================================================*/
.cont-inner {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
}


/*=============================================================
  fade（画面に入るとフェードアップ：js/common.js）
=============================================================*/
.js-fade {
	opacity: 0;
	transform: translateY(30px);
	transition:
		opacity 1s ease,
		transform 1s ease;
}
.js-fade.is-in {
	opacity: 1;
	transform: none;
}
/* リストは左から順に */
li.js-fade:nth-child(4n + 2) {
	transition-delay: 0.2s;
}
li.js-fade:nth-child(4n + 3) {
	transition-delay: 0.4s;
}
li.js-fade:nth-child(4n) {
	transition-delay: 0.6s;
}

.js-delay-01  {
	transition-delay: 0.2s;
}
.js-delay-02  {
	transition-delay: 0.4s;
}
.js-delay-03  {
	transition-delay: 0.6s;
}


@media (max-width: 640px) {
	.js-fade {
		transform: translateY(6.4vw);
	}
}
@media (prefers-reduced-motion: reduce) {
	.js-fade {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/*=============================================================
  photo slider（js/photo-slider.js）
=============================================================*/
.photo-slider .slider-nav {
	display: none;
}
.photo-slider--pc .slider-nav {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 2rem;
	margin-top: 2.5rem;
}
.photo-slider .swiper-pagination {
	position: static;
	width: auto;
	line-height: 0;
}
.photo-slider .swiper-pagination-bullet-active {
	background: var(--color-gold);
}
.slider-prev,
.slider-next {
	position: relative;
	width: 4rem;
	height: 4rem;
	padding: 0;
	border: none;
	background: none;
	cursor: pointer;
}
.slider-prev::before,
.slider-next::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 1.2rem;
	height: 1.2rem;
	border-top: 1px solid var(--color-navy);
	border-left: 1px solid var(--color-navy);
}
.slider-prev::before {
	transform: translate(-30%, -50%) rotate(-45deg);
}
.slider-next::before {
	transform: translate(-70%, -50%) rotate(135deg);
}
.slider-prev.swiper-button-disabled,
.slider-next.swiper-button-disabled {
	opacity: 0.3;
	cursor: default;
}
.plan-photo li {
	line-height: 0;
}
.plan-photo li.swiper-slide-active {
	opacity: 1;
}
.plan-photo li img {
	width: 100% !important;
}
.plan-photo li p {
	padding-top: 0.5em;
	font-size: clamp(1.2rem, 1vw, 1.4rem);
	line-height: 1.5em;
	text-align: center;
}
@media (min-width: 641px) {
	.photo-slider:not(.photo-slider--pc) {
		overflow: visible;
	}
	.photo-slider:not(.photo-slider--pc) .swiper-wrapper {
		height: auto;
		transform: none;
	}
	.photo-slider:not(.photo-slider--pc) .swiper-slide {
		height: auto;
	}
}
@media (max-width: 640px) {
	.photo-slider {
		width: 94%;
		margin: 0 auto;
	}
	.photo-slider .swiper-wrapper {
		flex-wrap: nowrap;
		gap: 0;
	}
	.photo-slider .swiper-wrapper > .swiper-slide {
		width: auto;
	}
	.photo-slider .slider-nav {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 4vw;
		margin-top: 4vw;
	}
	.slider-prev,
	.slider-next {
		width: 8vw;
		height: 8vw;
	}
	.slider-prev::before,
	.slider-next::before {
		width: 2.4vw;
		height: 2.4vw;
	}
	.plan-photo li p {
		font-size: 3.4vw;
	}
}


/*======================================================================
common
======================================================================*/
* {	
background-repeat: no-repeat;
background-position: 0px 0px;
}
body {
margin-right: auto;
margin-left: auto;
margin-top: 0px;
margin-bottom: 0px;
}
body, div {  
margin: 0;
padding: 0;
}
p,ul,ul li,ol,ol li,dl,dt,dd { 
margin: 0px;
padding: 0px;
list-style-type: none;
}
h1,h2,h3,h4,h5,h6,p,dl,dt,dd,ul,li,em,strong { 
font-weight: normal;
margin: 0px;
padding: 0px;
}
img,a img {	
border-width: 0px;
border-style: none;
}
.clear {
clear: both;
font-size: 0px;
line-height: 0px;
margin: 0px;
padding: 0px;
height: 0px;
}
.clearfix { 
zoom:1;
}
.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
a {
cursor:pointer;
cursor:hand
}
form {
margin: 0px;
padding: 0px;
}
label {
cursor: pointer;
}
@media screen and (min-width: 0px) and (max-width: 640px) {
img {
width:100%;
max-width: 100%;
height: auto;
}
}