@charset "utf-8";

:root{
	--cl_orange: #f77a25;
	--cl_red: #DB0037;
	--cl_blue: #009fde;
	--cl_lightyellow: #fffeee;
	--cl_lightgreen: #95c62d;
	--cl_beige: #f5f2e9;
	--cl_green: #45b89f;
}

/* -------------------- reset -------------------- */
* {
  box-sizing: border-box;
  margin:0;
  padding:0;
}
body, div, h1, h2, h3, h4, h5, h6, p, ul, li, dl, dt, dd, form, input, textarea {
  color:#333;
  font-family: 'Noto Sans JP','Roboto',sans-serif;
}
li { list-style: none; }
.imgfit{ display:block; width:100%; height:auto; }
.cl_red{ color: var(--cl_red); }
.align_C{ text-align:center; }
.d_red{background-color: var(--cl_red);}
.d_grey{background-color:#efefef;}
.d_pink{background-color:#FFD9DA;}
.d_grid{background:url(../images/bg_grid.gif) repeat;}
.d_grid-grey{background:url(../images/bg_grid-grey.gif) repeat;}
.sr_only{
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  border:0;
  white-space: nowrap;
}
.clearfix::after {
  content: "";
  display: table;
  clear: both;
}


/* -------------------- structure -------------------- */

#page-overlay {
	position: fixed;
	inset: 0;
	background: #fff;
	z-index: 9999;
	opacity: 1;
	pointer-events: none;
	transition: opacity 1s ease-in-out;
}
body.loaded #page-overlay {
	opacity: 0;
	transition: opacity 1s ease-in-out;
}

body {
  background-color: var(--cl_orange);
  color: #000;
  font-size: clamp(14px, 1.8vw, 24px);
  line-height:1.7;
  font-weight:500;
  font-feature-settings: "palt";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
}
.container{
	position:relative;
	width:100%;
	overflow:hidden;
}

.inner{ width:min(96%,1024px); margin:0 auto; }


/* -------------------- font -------------------- */

/* font family */
.ff_min			{font-family: "A1明朝"; font-weight:normal}
.ff_meiryo		{font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W5', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS P Gothic', sans-serif}
.ff_gothic		{font-family: "Yu Gothic", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif; font-weight: 500}
.ff_marufork	{font-family: "丸フォーク M"; font-weight:normal}


/* font size */
.fs_LLL	{font-size:2.0rem}
.fs_LL	{font-size:1.75rem}
.fs_L	{font-size:1.5rem}
.fs_ML	{font-size:1.2rem}
.fs_MML	{font-size:1.15rem}
.fs_M	{font-size:1rem}
.fs_MMS	{font-size:.9rem}
.fs_MS	{font-size:.8rem}
.fs_S	{font-size:.75rem}


/* font weight */
.fw_bold	{font-weight:bold}
.fw_normal	{font-weight:normal}



/* -------------------- other -------------------- */

/* color */
.cl_grey	{color:rgb(35,35,35)}
.cl_white	{color:rgb(255,255,255)}
.cl_green	{color:rgb(42,156,128)}
.cl_blue	{color:rgb(81,143,198)}
.cl_pink	{color:#ff7b9c}
.cl_red		{color:rgb(218,49,52)}
.cl_orange	{color:rgb(255,119,48)}
.cl_tomato	{color:rgb(255,103,92)}
.cl_black	{color:rgb(0,0,0)}
.cl_grey	{color:rgb(68,68,68)}
.cl_brown	{color:rgb(160,119,40)}
.cl_purple	{color:rgb(155,90,179)}
.cl_syu	{color: #e84444}
.cl_lightblue{color:#51a8df}
.cl_yellowgreen{color: rgb(0, 160, 78)}


/* border */
.bd_green	{border-color:rgb(42,156,128)}
.bd_pink	{border-color:#ff7b9c}
.bd_beige	{border-color:rgb(189,223,255)}

/* display */
.sr_only{
	position: absolute;
	width: 1px; height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	border:0;
	white-space: nowrap;
}
.dp_hide		{display:none}
.dp_block		{display:block}
.dp_inline		{display:inline}
.dp_in-block	{display:inline-block}
.dp_flex{
	display:flex;
	flex-flow:row wrap;
	justify-content:space-between;
}

.dp_show1000,
.dp_show900,
.dp_show800,
.dp_show700,
.dp_show600,
.dp_show500,
.dp_show400{
	display:none;
}
@media(max-width: 1000px){.dp_show1000{display:block}}
@media(max-width: 900px){.dp_show900{display:block}}
@media(max-width: 800px){.dp_show800{display:block}}
@media(max-width: 700px){.dp_show700{display:block}}
@media(max-width: 600px){.dp_show600{display:block}}
@media(max-width: 500px){.dp_show500{display:block}}
@media(max-width: 400px){.dp_show400{display:block}}

.dp_hide1000,
.dp_hide900,
.dp_hide800,
.dp_hide700,
.dp_hide600,
.dp_hide500,
.dp_hide400{
	display:block;
}
@media(max-width: 1000px){.dp_hide1000{display:none}}
@media(max-width: 900px){.dp_hide900{display:none}}
@media(max-width: 800px){.dp_hide800{display:none}}
@media(max-width: 700px){.dp_hide700{display:none}}
@media(max-width: 600px){.dp_hide600{display:none}}
@media(max-width: 500px){.dp_hide500{display:none}}
@media(max-width: 400px){.dp_hide400{display:none}}

/* clear */
.clearfix::after{
	content: "";
	display: table;
	clear: both;
}


/* img */
.imgfit{
	display:block;
	width:100%;
	height:auto;
}
.img_bd_white{
	border:.5rem solid #fff;
	box-shadow:3px 3px 10px rgba(0,0,0,.3);
}

/* float */
.float_R{float:right}
.float_L{float:left}
.float_C{margin:0 auto 0}

/* align */
.align_R{text-align:right}
.align_L{text-align:left}
.align_C{text-align:center}

/* margin */
.mb_LLL	{margin-bottom: calc( 30px + 70 * ( 100vh - 460px ) / 408 ) !important}	/* 30-100 */
.mb_LL	{margin-bottom: calc( 26px + 44 * ( 100vh - 460px ) / 408 ) !important}	/* 26-70 */
.mb_L	{margin-bottom: calc( 24px + 30 * ( 100vh - 460px ) / 408 ) !important}	/* 24-54 */
.mb_MMM	{margin-bottom: calc( 20px + 25 * ( 100vh - 460px ) / 408 ) !important} 	/* 20-45 */
.mb_MM	{margin-bottom: calc( 18px + 20 * ( 100vh - 460px ) / 408 ) !important}	/* 18-38 */
.mb_M	{margin-bottom: calc( 15px + 10 * ( 100vh - 460px ) / 408 ) !important} 	/* 15-25 */
.mb_SSS	{margin-bottom: calc( 12px + 8 * ( 100vh - 460px ) / 408 ) !important}		/* 12-20 */
.mb_SS	{margin-bottom: calc( 10px + 5 * ( 100vh - 460px ) / 408 ) !important}		/* 10-15 */
.mb_S	{margin-bottom: calc( 5px + 5 * ( 100vh - 460px ) / 408 ) !important}		/* 5-10 */
.mb_Z	{margin-bottom:0 !important}

.ml_L	{margin-left:2rem}
.ml_M	{margin-left:1rem}
.ml_S	{margin-left:.5rem}
.mr_L	{margin-right:2rem}
.mr_M	{margin-right:1rem}
.mr_S	{margin-right:.5rem}

@media(min-height: 868px){
	.mb_LLL	{margin-bottom: 100px !important}
	.mb_LL	{margin-bottom: 70px !important}
	.mb_L	{margin-bottom: 54px !important}
	.mb_MMM	{margin-bottom: 45px !important}
	.mb_MM	{margin-bottom: 38px !important}
	.mb_M	{margin-bottom: 25px !important}
	.mb_SSS	{margin-bottom: 20px !important}
	.mb_SS	{margin-bottom: 15px !important}
	.mb_S	{margin-bottom: 10px !important}
}
@media(max-height: 460px){
	.mb_LLL	{margin-bottom: 30px !important}
	.mb_LL	{margin-bottom: 26px !important}
	.mb_L	{margin-bottom: 24px !important}
	.mb_MMM	{margin-bottom: 20px !important}
	.mb_MM	{margin-bottom: 18px !important}
	.mb_M	{margin-bottom: 15px !important}
	.mb_SSS	{margin-bottom: 12px !important}
	.mb_SS	{margin-bottom: 10px !important}
	.mb_S	{margin-bottom: 5px !important}
}

/* line-height */
.lh_100		{line-height:1}
.lh_110		{line-height:1.1}
.lh_120		{line-height:1.2}
.lh_130		{line-height:1.3}
.lh_140		{line-height:1.4}
.lh_150		{line-height:1.5}
.lh_170		{line-height:1.7}
.lh_200		{line-height:2}
.lh_240		{line-height:2.4}
.lh_300		{line-height:3}