/*====================================
↓全体共通変数定義↓
====================================*/
:root {
	/* フォント関連 */
	--font-color-base: #333;
	--font-color-secondary: rgba(51, 51, 51, 0.7);
	--font-color-disabled: #999;
	/* 色関連 */
	--back-color-Off-white: #fefefd;
	--back-color-Sand: #FAF8F2;
	--back-color-Pale: #e6e2dc;
	/* デザインサイズ（デザインサイズに合わせて以下値を変更） */
	--design-size-pc: 1456;
	--design-size-sp: 390;
	/* ヘッダーの高さ（アンカースクロール、ローカルナビで使用） */
	--header-height: 48rem;
	/* SPヘッダーの高さ（アンカースクロール、ローカルナビで使用） */
	--header-height-sp: 48rem;
}

/*====================================
↓デフォルトCSS↓
====================================*/
html {
	overflow-y: scroll;
	/* font-size: calc(1 / var(--design-size-pc) * 100vw); */
	font-size: 1px;
	height: -webkit-fill-available;
}
@media screen and (max-width: 1456px) {
	/* ←max-widthの値は[var(--design-size-pc)]と同一にする*/
	html {
		/* font-size: calc(1 / var(--design-size-pc) * 100vw); */
	}
	html.is_other {
		/* font-size: calc(1 / var(--design-size-pc) * (100vw - 15px)); */
	}
}
@media screen and (max-width: 1200px) {
	/* ←ここはママで良い*/
	html {
		/* font-size: calc(1 / var(--design-size-sp) * 100vw); */
	}
	html.is_other {
		/* font-size: calc(1 / var(--design-size-sp) * (100vw - 15px)); */
	}
}
body {
	font-size: 16rem;
	 
	color: var(--font-color-base);
	font-weight: 400;
	background-color: var(--back-color-Off-white);
	line-height: 1.25;
	letter-spacing: 0.08rem;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
/* SP
----------------------------------*/
@media screen and (max-width: 1200px) {
	body {
		font-size: 16rem;
	}
}
a {
	color: var(--font-color-base);
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
p a:hover {
	opacity: 0.7;
}
a:hover img {
	opacity: 1;
}
img.nofade {
	opacity: 1 !important;
}
img {
	width: 100%;
	height: auto;
}

strong {
	font-weight: bold;
}

sup {
	font-size: 0.7em !important;
	vertical-align: super;
}



.c-skipLink {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.small {
	font-size: 0.8em;
}

/*====================================
↓判定用CSS↓
====================================*/
#responseFlagTab {
	display: none !important;
}
@media screen and (min-width: 1201px) {
	#responseFlagPc {
		display: block !important;
	}
	#responseFlagSp {
		display: none !important;
	}
}
@media screen and (max-width: 1200px) {
	#responseFlagPc {
		display: none !important;
	}
	#responseFlagSp {
		display: block !important;
	}
}

/*====================================
↓表示切り替え用CSS↓
====================================*/
@media screen and (min-width: 1201px) {
	.sp {
		display: none !important;
	}
}
@media screen and (max-width: 1200px) {
	.pc {
		display: none !important;
	}
}
@media screen and (min-width: 1201px) {
	.--sp-wide {
		display: none !important;
	}
}
@media screen and (max-width: 1200px) {
	.--sp-wide {
		display: none !important;
	}
}



/*====================================
ファンデーション
====================================*/
/*====================================
見出し関連
====================================*/
.f-h1 {
   
	font-size: 88rem;
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: -1.32rem;
}
.f-h2 {
   
	font-size: 48rem;
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: normal;
  letter-spacing: -1.32rem;
}
.f-h3 {
	font-size: 28rem;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: normal;
}
.f-ul {
	   
	font-size: 13rem;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: 0.26rem;
}
.f-enSerif {
	 
	font-weight: 400;
}
/* 以下のクラスを追加すると英文が小文字から大文字に自動変換 */
.f-uppercase {
	text-transform: uppercase;
}
.f-lowercase {
	text-transform: none;
}
.f-note {
  font-size: 11rem;
}
em {
  font-style: italic;
}
/* SP
----------------------------------*/
@media screen and (max-width: 1200px) {
	.f-h1 {
		font-size: 36rem;
		line-height: 1.1;
		letter-spacing: normal;
	}
	.f-h2 {
		font-size: 36rem;
	}
}