@charset "UTF-8";
/*
【補足】 CSS設計について
PRECSSに準じて設計
https://precss.io/ja/
*/
/* ==========================================================================
  Base ベース
========================================================================== */
/* 変数*/
:root{
	--gapY-Standard:clamp(50px, 46.48px + 0.94vw, 60px);/* 垂直方向基準余白 */
	--gapX-Standard:clamp(20px, -29.296px + 13.15vw, 160px);/* 水平直方向基準余白 */
	--colorBg:#ffffff;
	--colorMain:#f8b500;
	--colorMain-rgb:248, 181, 0;
	--colorAccent:#734D07;
	--colorAccent-rgb:115, 77, 7;
	--colorTxt:#333333;
	--fontFamJP: "Noto Sans JP", sans-serif;
}
	@media (min-width: 1440px) {
		:root{
			--gapX-Standard:11.11%;
		}
	}
/* 要素*/
html{
	scroll-behavior: smooth;
}
body{
	position: relative;
	background-color: var(--colorBg);
	color:var(--colorTxt);
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp(1rem, 0.956rem + 0.19vw, 1.125rem);/* min 16px -> max 18px */
	letter-spacing: .1em;
	line-height: 1.72;
	font-weight: 400;
	font-style: normal;
}
a { transition:.3s; color: inherit; text-decoration: none;}
picture{display: block;}
figure img{ width: 100%;}
@media (hover: hover) and (pointer: fine){
	a:hover{
		opacity: .7;
		transition:.3s;
	}
}
/*icon-tinyHP-v2.5*/
@font-face {
  font-family: 'icon-tinyHP';
  src:  url('fonts/icon-tinyHP.eot?qfk5wo');
  src:  url('fonts/icon-tinyHP.eot?qfk5wo#iefix') format('embedded-opentype'),
    url('fonts/icon-tinyHP.woff2?qfk5wo') format('woff2'),
    url('fonts/icon-tinyHP.ttf?qfk5wo') format('truetype'),
    url('fonts/icon-tinyHP.woff?qfk5wo') format('woff'),
    url('fonts/icon-tinyHP.svg?qfk5wo#icon-tinyHP') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
/* ==========================================================================
  Layout　レイアウト
========================================================================== */
/* ly_header
========================================================================== */
.ly_header{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: clamp(112px, 86.64px + 6.76vw, 184px);
	background-color: var(--colorAccent);
	background-color: #fff;
}
.ly_header_inner{
	text-align: center;
}
/*ly_underTtl
========================================================================== */
.ly_underPageTtl{
	padding: var(--gapY-Standard) var(--gapX-Standard);
	margin-bottom: calc(var(--gapY-Standard)  / 2);
	background-color:rgba(var(--colorMain-rgb), .3);
}
/*ly_secMv,
========================================================================== */
.ly_secMv{
	width: 100%;
	aspect-ratio: 35 / 17;
	margin-bottom: calc(var(--gapY-Standard) / 2);
}
.ly_secMv img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
	@media (min-width: 768px) {
		.ly_secMv{
			aspect-ratio: initial;
		}
		.ly_secMv img{
			height: auto;
			object-fit: initial;
		}
	}
/*ly_sec, 
========================================================================== */
.ly_sec{
	width: 100%;
	padding: calc(var(--gapY-Standard) / 2) var(--gapX-Standard);
}
.ly_sec.ly_sec__ptLarge{
	padding-top: var(--gapY-Standard);
}
.ly_sec.ly_sec__pbLarge{
	padding-bottom: var(--gapY-Standard);
}
.ly_sec_inner{
	width: 100%;
	margin-inline: auto;
}
.ly_sec_inner.ly_sec_inner__wSm{
	max-width: 680px;
}
.ly_sec_inner > *:last-child{
	margin-bottom: 0;
}
.ly_sec_inner p{
	margin-bottom: 1em;
}
/*ly_footer
========================================================================== */
.ly_footer{
	margin-top: calc(var(--gapY-Standard) * 1.5);
	padding:var(--gapY-Standard) 0;
	background-color: var(--colorMain);
}
.ly_footer_inner{
	padding: calc(var(--gapY-Standard) * .5) var(--gapX-Standard);
}
/* ==========================================================================
  Javascript Modules jsモジュyール
========================================================================== */
/* js_accordion
========================================================================== */
.js_accordion_ttl{
	cursor: pointer;
}
.js_accordion_box{
	display: none;/*はじめは非表示*/
}
/* ==========================================================================
  Element Modules エレメントモジュール
========================================================================== */
/* ページを開いた時のアニメーション
========================================================================== */
.el_animeFade{
	position: relative;
}
.el_animeFade_bg{
	background: var(--colorMain);
	background: #fff;
	content: "";
	position: fixed;
	z-index: 99999;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	animation-name: PageAnime-fade;
	animation-duration: 3s;
	animation-fill-mode: forwards;
	pointer-events: none;
  }
   
  @keyframes PageAnime-fade {
	0% {
	  opacity: 1;
	}
	100% {
	  opacity: 0;
	  display: none;
	}
  }
/* スクリーンリーダーのみ表示
========================================================================== */
.el_srOnly{
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
/* el_font
========================================================================== */
.el_fontJP-txtNormal{
	font-size: clamp(0.875rem, 0.787rem + 0.38vw, 1.125rem);/* min 14px -> max 18px */
	letter-spacing: .1em;
	line-height: 1.72;
}
.el_fontJP-txtSizeXs{
	font-size: clamp(0.75rem, 0.706rem + 0.19vw, 0.875rem);/* min 12px -> max 14px */
	letter-spacing: .1em;
	line-height: 1.72;
}
.el_fontJP-txtSizeSm{
	font-size: clamp(0.813rem, 0.746rem + 0.28vw, 1rem);/* min 13px -> max 16px */
	letter-spacing: .1em;
	line-height: 1.72;
}
.el_fontJP-txtSizeMd{
	font-size: clamp(0.938rem, 0.871rem + 0.28vw, 1.125rem);/* min 15px -> max 18px */
	letter-spacing: .1em;
	line-height: 1.72;
}
.el_font-footerCopy{
	display: block;
	color: var(--colorAccent);
	font-size: .9em;
	letter-spacing: .1em;
	line-height: 1.267;
	text-align: center;
}
.el_font-footerInfo{
	color: var(--colorAccent);
	text-align: center;
	font-size: .9em;
}
.el_font-demosDate{
	font-size: .9em;
}
/* 見出し el_heading
========================================================================== */
/*
el_headingLv1
*/
.el_headingLv1{
	width: clamp(218px, 148.992px + 18.4vw, 414px);
}
/*
el_headingLv2
*/
.el_headingLv2{
	color: var(--colorAccent);
	font-size: 18px;
	font-size: 28px;
	font-size: clamp(1.125rem, 0.905rem + 0.94vw, 1.75rem);/* min18px max28px */
	font-weight: 600;
	letter-spacing: .1em;
	line-height: 1.7;
	text-align: center;
}
/*
el_headingLv3
*/
.el_headingLv3{
	margin-bottom: .5em;
	color: var(--colorAccent);
	font-size: 1.063em;
	line-height: 1.7;
	font-weight: 600;
}
/* el_link
========================================================================== */
a.el_linkTxt{
	text-decoration: underline;
}
a.el_linkTxt.el_linkTxt__fontSizeSm{
	font-size: 0.889em;
}
a.el_linkTxt.el_linkTxt__arrowRight{
	position: relative;
	padding-right: 1.3em;
}
a.el_linkTxt.el_linkTxt__arrowRight::after{
	content: "\e90d";
	position: absolute;
	right: .3em;
	top:calc(50% + .2em);
	transform: translateY(-50%);
	font-family: 'icon-tinyHP' !important;
	font-size: .6em;
	speak: never;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
}
	@media (hover: hover) and (pointer: fine){
		
	}
/*
el_linkBtn
*/
a.el_linkBtn{
	display: inline-block;
	padding: 0 clamp(30px, 22.96px + 1.88vw, 50px);
	border: 1px solid var(--colorTxt);
	border-radius: 11px;
	font-size: clamp(1rem, 0.956rem + 0.19vw, 1.125rem);
}
a.el_linkBtn > span{
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: clamp(60px, 57.888px + 0.56vw, 66px);
	padding: 10px 0;
}
a.el_linkBtn > span.el_linkBtn_beforeIcon-line:before{
	content: "";
	display: block;
	width: 30px;
	height: 30px;
	margin-right: 10px;
	background-image: url(../img/com_icon-line.svg);
	background-repeat: no-repeat;
	background-size: cover;
}
	@media (hover: hover) and (pointer: fine){
		a.el_linkBtn:hover{
			opacity: 1;
		}
	}


/* el_googleMap
========================================================================== */
.el_googleMap{
	width: 100%;
	aspect-ratio: 163 / 63;
	margin-bottom: var(--gapY-Standard);
}
.el_googleMap iframe{
	width: 100%;
	height: 100%;
}
	@media (min-width: 768px){
		.el_googleMap{
			aspect-ratio: 671 / 212;
		}
	}
/* ==========================================================================
  Block Modules　ブロックモジュール
========================================================================== */
/* bl_list
========================================================================== */
/*
bl_listBullet
*/
ul.bl_listBullet li{
	position: relative;
	padding-left: 1em;
	margin-bottom: .2em;
}
ul.bl_listBullet__fontSizeSm li{
	font-size: .9em;
}
ul.bl_listBullet li:before{
	content: "";
	position: absolute;
	top:.74em;
	left: .2em;
	width: .3em;
	height: .3em;
	background-color: var(--colorAccent);
	border-radius: 50%;
}
/*
bl_listNumber
*/
ol.bl_listNumber {
  counter-reset: item;    /* 疑似要素で数字を使うときに指定 */
}
ol.bl_listNumber li {
  list-style-type: none;  /* デフォルトのリストマークを非表示にする */
  position: relative;     /* 基準位置とする */
  padding-left: 1.5em;
}
ol.bl_listNumber li::before {
  counter-increment: item;    /* 疑似要素で数字を使うときに指定 */
  content: counter(item)'.';  /* 疑似要素で数字を使うときに指定 */
  color: var(--colorAccent);            /* 文字を赤色に指定 */
  position: absolute;     /* 相対位置に指定 */
  left: 0;             /* 左に1文字分ずらした位置に配置 */
  top: 0;                 /* 上から0pxのいちに指定 */
}
/*
bl_listLink
*/
ul.bl_listLink li{
	position: relative;
	padding-left: 1.2em;
}
ul.bl_listLink li::before{
	content: "→";
	position: absolute;
	top: 0;
	left: 0;
}
/*
bl_listPoint
*/
ol.bl_listPoint{
	counter-reset: item;    /* 疑似要素で数字を使うときに指定 */
}
ol.bl_listPoint > li {
  list-style-type: none;  /* デフォルトのリストマークを非表示にする */
  position: relative;     /* 基準位置とする */
  padding-left: 1.5em;
  margin-bottom: 1em;
}
ol.bl_listPoint > li::before {
  counter-increment: item;    /* 疑似要素で数字を使うときに指定 */
  content: counter(item)'.';  /* 疑似要素で数字を使うときに指定 */
  color: var(--colorAccent);            /* 文字を赤色に指定 */
  position: absolute;     /* 相対位置に指定 */
  left: 0;             /* 左に1文字分ずらした位置に配置 */
  top: 0;                 /* 上から0pxのいちに指定 */
}
ol.bl_listPoint > li > strong{
	color: var(--colorAccent);
	font-weight: 600;
}
/* bl_footerNav_list
========================================================================== */
ul.bl_footerNav_list{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: -.5em;
	font-size: .9em;
}
ul.bl_footerNav_list li{
	position: relative;
	padding: 0;
	margin-top: .5em;
}
ul.bl_footerNav_list li::before,
ul.bl_footerNav_list li::after{
	content: "";
	position: absolute;
	top:calc(50% + .1em);
	transform: translateY(-50%);
	width: 1px;
	height: .9em;
	background-color: var(--colorAccent);
}
ul.bl_footerNav_list li::before{
	right: 0;
}
ul.bl_footerNav_list li::before{
	left: 0;
}
ul.bl_footerNav_list li a{
	padding:.5em 1em;
	color: var(--colorAccent);
	font-weight: 500;
}
/* bl_demoList
========================================================================== */
.bl_demoList{ list-style:none; margin:0; padding:0; }
.bl_demoList_item{ padding: .3em 0; border-top:1px solid #e5e7eb; }
.bl_demoList_item:first-child{ border-top:0; }

/* 全体リンク */
.bl_demoList_link{
  display:block;
  padding:.8em .5em;
  text-decoration:none;
  color:inherit;
  outline: none;
}
.bl_demoList_link:hover,
.bl_demoList_link:focus{
	opacity: 1;
	background:rgba(var(--colorMain-rgb), .2);              /* ホバー背景 */
}
.bl_demoList_link:focus-visible{
  box-shadow:0 0 0 3px rgba(59,130,246,.35); /* 視認できるフォーカス */
}

.bl_demoList_item h3{
	margin:0 0 .25em;
	color: var(--colorAccent);
	font-size:1.05em;
	line-height: 1.7;
	font-weight: 600;
}

.bl_demoList_item .el_lead{ margin:0; font-size:.95em; color:#555; }
/* 
========================================================================== */

/* ==========================================================================
  Unique　ユニーク
========================================================================== */
/* un_
========================================================================== */

/* ==========================================================================
  Helpers　ヘルパー
========================================================================== */
.hp_db{ display: block;}
.hp_dib { display: inline-block !important; }
.hp_blockCenter{ display: table; margin-inline: auto;}
.hp_blockRight{ display: table; margin-left: auto; margin-right: 0;}
	@media (min-width: 768px){
		.hp_dib-mdUp{
			display: inline-block !important;
		}
	}
/*
margin-bottom
*/
.hp_mb0{margin-bottom: 0 !important;}
.hp_mb05em{ margin-bottom: .5em !important;}
.hp_mb1em{ margin-bottom: 1em !important;}
.hp_mb15em{ margin-bottom: 1.5em !important;}

/*
色系
*/
.hp_colorAccent{color: var(--colorAccent) !important;}

/*
テキスト系
*/
.hp_fontW600{ font-weight: 600;}
.hp_txtCenter{
	text-align: center;
}
	@media (min-width: 768px){
		.hp_txtCenter-mdUp{
			text-align: center;
		}
	}
