@charset "utf-8";

* {margin: 0; padding: 0;}
*, *::before, *::after {box-sizing: border-box;}

/*リセット*/
h1, h2, h3, h4, h5, h6 {
	margin: 0;
}
p {
	margin: 0;
}
ul {
	list-style: none;
	padding-left: 0;
	margin: 0;
}
button {
  padding: 0;
  border: none;
  outline: none;
  font: inherit;
  color: inherit;
  background: none;
  appearance: none;
}
:root {
  --font-en: "Inter", sans-serif;
  --width-lg: 1600px;
  --width-mid: 1280px;
  --width-sm: 800px;
  --space-xs: clamp(10px, 1.953125vw + 2px, 30px); /* 基準 w1024で20px */
  --space-sm: clamp(20px, 2.9296875vw + 2px, 40px); /* 基準 w1024で30px */
  --space-md: clamp(40px, 4.8828125vw + 2px, 60px); /* 基準 w1024で50px */

	
}
@media screen and (min-width: 768px) {
  :root {
    --row-max: 92%;
    --row-mid: 84%;
    --row-sm: 80%;
  }
	}	
	
	html {
	width: 100%;
    overflow-y: scroll;
	/*font-size: 62.5%;*/
}
/*html.no_move {
  overflow: hidden;
}*/
body {
	font-family: "helvetica-neue-lt-pro", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	background: #EFEFEF;
	color: #202020;
	line-height: 2;
}
/*font-family: YakuHanJP_Noto, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "helvetica-neue-lt-pro", sans-serif;*/

a:link  {
	color: inherit;
	text-decoration: none;
	transition: all 0.3s;
}
a:hover {
	color: #ccc;
}
a:visited {
	color: inherit;
	text-decoration: none;
}

/* br
==================================*/
.br-pc {
    display: none;
  }

@media (min-width: 768px) {
  .br-pc {
    display: block;
  }
}

/* ①　calc + vwの公式　レスポンシブフォントの求め方
			参照URL　https://web-dev.tech/front-end/css/responsive-font-size-calc-vw/
font-size: calc(A + B * (100vw - C)/D);
			
			A・・・最小文字サイズ
B・・・最大文字サイズ – 最小文字サイズ
C・・・最小画面幅
D・・・最大画面幅 – 最小画面幅
			*/

/*　②　CSS Clampを使用した柔軟なスペーシングとコンテナの構築

推奨値 = 最小サイズ + (最大サイズ - 最小サイズ) * ((現在のビューポート - 最小ビューポート) / (最大ビューポート - 最小ビューポート))

320pxのビューポートで16pxから1440pxのビューポートで48pxに拡縮するpaddingの場合:

傾き: (48 - 16) / (1440 - 320) = 0.0286
推奨値: 2.86vw + 6.85px  ※6.85pxは
最終形: clamp(16px, 2.86vw + 6.85px, 48px)
*/


/*clamp(14px, 0.28vw + 6.85px, 16px)*/