@charset "UTF-8";
/*
* 競馬共助会 ベースCSS
* Author: 株式会社メックコミュニケーションズ
* Author URI: https://www.mec-com.co.jp
* Organized: 2026-08
*
* サイト内で複数ページから再利用する汎用パーツを管理します。
* サイト固有のレイアウト・ページ別デザインは customize.css で管理します。
*/

/*=====================================================================================================
目次（Ctrl+F / Cmd+Fでセクション名を検索してください）
---------------------------------------------------------------------------------------------------
- ページ上部へ戻る
- parts（汎用パーツ）
- table
- faq
- sitemap
- 追加utility
- 下層ページ共通
- パンくず（下層ページ共通）
- 下層ページリンク（下層ページ共通）
- 汎用リンクカード / 汎用リンクカードグリッド
- 固定ページ本文見出し
- 親ページメニュー
- ページ遷移フェードイン（下層ページ共通）
=====================================================================================================*/

/* ページ上部へ戻る */
.pagetop{
	--pagetop-footer-offset:0px;
	position:fixed;
	right:0;
	bottom:var(--pagetop-footer-offset);
	z-index:1050;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:5px;
	width:90px;
	height:90px;
	padding:5px 0 0;
	border:0;
	border-radius:0;
	color:var(--color-main);
	background:rgba(230,230,230,.8);
	-webkit-backdrop-filter:none;
	backdrop-filter:none;
	box-shadow:none;
	font:inherit;
	line-height:1;
	cursor:pointer;
	opacity:0;
	visibility:hidden;
	transition:opacity .2s ease, visibility .2s ease, color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.pagetop_arrow{
	display:block;
	width:15px;
	height:15px;
	border-top:2px solid currentColor;
	border-left:2px solid currentColor;
	transform:rotate(45deg);
}
.pagetop_label{
	display:block;
	font-size:18px;
	font-weight:700;
	letter-spacing:0;
}
.pagetop.is_visible{
	opacity:1;
	visibility:visible;
}
@media (hover:hover) and (pointer:fine){
	.pagetop:hover{
		color:#fff;
		background:var(--color-main);
	}
}
.pagetop:active{
	color:#fff;
	background:var(--color-main);
}
.pagetop:focus-visible{
	outline:2px solid var(--color-main);
	outline-offset:4px;
}
@media screen and (min-width:768px) and (max-width:1199px){
	.pagetop{
		gap:10px;
		width:80px;
		height:80px;
		padding-top:4px;
	}
	.pagetop_arrow{
		width:12px;
		height:12px;
	}
	.pagetop_label{
		font-size:16px;
	}
}
@media screen and (max-width:767px){
	.pagetop{
		gap:8px;
		width:60px;
		height:60px;
		padding-top:3px;
	}
	.pagetop_arrow{
		width:6px;
		height:6px;
	}
	.pagetop_label{
		font-size:13px;
	}
}


/*-------------------------------------------------------------------------------------------------parts*/
/*-------------------------linkfile*/
.linkfile a::before,
a .list_title::after{
	width:1em;
	height:1em;
	display:inline-block;
	vertical-align:middle;
	margin:-0.2em 0.2em 0 0.2em;
	background-size:cover !important;
}
.linkfile a[target]:before,
a[target] .list_title:after{
	content:"";
	background:url(images/icon_blank.svg);
}
.linkfile a[href$='.pdf']::before,
a[href$='.pdf'] .list_title::after{
	content:"";
	background:url(images/icon_pdf.svg);
}
.linkfile a[href$='.xls']::before,
.linkfile a[href$='.xlsx']::before,
a[href$='.xls'] .list_title::after,
a[href$='.xlsx'] .list_title::after{
	content:"";
	background:url(images/icon_excel.svg);
}
.linkfile a[href$='.docx']::before,
.linkfile a[href$='.doc']::before,
a[href$='.docx'] .list_title::after,
a[href$='.doc'] .list_title::after{
	content:"";
	background:url(images/icon_word.svg);
}
.linkfile a[href$='.pptx']::before,
.linkfile a[href$='.ppt']::before,
a[href$='.pptx'] .list_title::after,
a[href$='.ppt'] .list_title::after{
	content:"";
	background:url(images/icon_ppt.svg);
}
body .noicon::before{
	display:none;
}
/*-------------------------clickimg*/
.clickimg{
	position:relative;
	padding-bottom:1.7em;
	font-size:1.4rem;
	color:#666;
}
.clickimg::after{
	content:"クリックすると画像拡大します";
	position:absolute;
	left:0;
	bottom:0;
}
@media screen and (max-width: 767px) {
	.clickimg::after{content:"タップすると画像拡大します";}
}
/*-------------------------tx*/
.tx a,
.tx .a{
	text-decoration:underline;
	color:var(--color_link);
	cursor:pointer;
}
.tx a:hover,
.tx .a:hover{
	text-decoration:none;
}
/*-------------------------tx_belt*/
.tx_belt{
	background:var(--color-pale);
	color:var(--color-text) !important;
	padding:0.3em 0.6em;
	font-weight:bold;
	margin-bottom:0.5em;
}
/*-------------------------tx_line*/
.tx_line{
	border-bottom:1px solid var(--color-main);
	padding-bottom:0.1em;
	margin-bottom:0.5em;
}
/*-------------------------tx_line_orange / tx_bar*/
.tx_line_orange,
.tx_bar{
	box-sizing:border-box;
	font-weight:600;
	line-height:1.5;
	letter-spacing:.04em;
}
.tx_line_orange{
	position:relative;
	padding-bottom:.4em;
	border-bottom:.18em solid #eee9df;
}
.tx_line_orange::after{
	content:"";
	position:absolute;
	left:0;
	bottom:-.18em;
	width:min(34%, 7.7em);
	height:.18em;
	background:var(--color-main);
}
.tx_bar{
	padding:.2em 0 .2em .8em;
	border-left:.24em solid var(--color-main);
}
/*-------------------------tx_min*/
.tx_min{
	font-family: "Noto Serif JP", serif;
	font-weight:bold;
	margin-bottom:0.5em;
}
/*-------------------------mark*/
.mark{
	margin-left:1em;
	text-indent: -1em;
}
.mark span{margin-left:0;text-indent:0;}
/*-------------------------ya*/
body .ya{
	display:inline-block;
}
body .ya::before{
	content: "";
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0.3em 0 0.3em 0.5em;
	border-color: transparent transparent transparent var(--color_link);
	margin-right: 0.3em;
	transition:all 0.3s;
}
.ya:hover::before{
	transform:translateX(0.3em);
}
/*-------------------------btn*/
.btn{
	text-decoration:none;
	display:inline-flex;
	justify-content:center;
	align-items:center;
	position:relative;
	width:360px;
	max-width: 100%;
	max-height:100%;
	line-height:1.25;
	text-align:center;
	padding:0.7em;
	gap:0.5em;
	text-align:center;
	background:var(--color-main);
	transition:all 0.3s;
	font-size:2rem;
	color:#FFF !important;
	text-decoration:none !important;
}
.btn:hover{
	background:#000;
}
/* 白背景・オレンジ枠 */
.btn.btn_white{
	/*width:min(var(--action-button-width), 100%);*/
	min-width:0;
	min-height:58px;
	padding:12px 30px;
	border:1px solid var(--color-main);
	border-radius:999px;
	color:var(--color-main) !important;
	background:#FFF;
	font-size:18px;
	font-weight:700;
	transition:color .25s ease, background-color .25s ease;
}
.btn.btn_white:hover,
.btn.btn_white:focus-visible{
	color:#FFF !important;
	background:var(--color-main);
	filter:none;
}

/* オレンジ塗り */
.btn.btn_orange{
	/*width:min(var(--action-button-width), 100%);*/
	min-width:0;
	min-height:58px;
	padding:12px 30px;
	border:1px solid var(--color-main);
	border-radius:999px;
	color:#FFF !important;
	background:var(--color-main);
	font-size:18px;
	font-weight:700;
	transition:color .25s ease, background-color .25s ease;
}
.btn.btn_orange:hover,
.btn.btn_orange:focus-visible{
	color:var(--color-main) !important;
	background:#FFF;
	filter:none;
}
@media screen and (max-width:767px){
	.btn.btn_white,
	.btn.btn_orange{
		min-width:0;
	}
}

@media screen and (max-width:400px){
	.btn{
		width:100%;
	}
}
/*-------------------------kage_k*/
.kage_k{
	position:relative;
	outline:1px solid rgba(255,255,255,0.3);
	box-shadow: 1px 1px 7px rgba(0,0,0,0.3);
}
.kage_k:hover,
a:hover .kage_k{
	top:1px;
	outline:1px solid rgba(0,0,0,0.05);
	box-shadow:0px 1px 3px rgba(0,0,0,0.3);
}

/*-------------------------fade*/
.fade{
	opacity:1;
	transform:none;
}
.js .fade{
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.8s, transform 0.8s;
	transition-delay: var(--delay, 0s);
}
.js .fade.fedein {
	opacity: 1;
	transform: translateY(0);
}
@media screen and (min-width:768px){
	.pc_fade_delay1{--delay:.15s;}
	.pc_fade_delay2{--delay:.3s;}
}
/*-------------------------photo*/
.photo{
	width:100%;
	height:400px;
	overflow:hidden;
	position:relative;
}
.photo a{
	display:block;
	width:100%;
	height:100%;
	position:relative;
}
.photo a img{
	filter:brightness(80%);
	transition:all 0.3s;
}
.photo a:hover img{
	filter:brightness(100%);
}
.photo_title{
	position:absolute;
	top: 0;
	left: 50%;
	z-index:1;
	transform: translate(-50%, 0);
	background:rgba(255,255,255,0.9);
	font-family: "Noto Serif JP", serif;
	font-weight:bold;
	line-height:1.25;
	padding:0.5em 0.25em;
}
.photo img{
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
}
@media screen and (max-width: 767px) {
	.photo{height:200px;}
}
/*-------------------------slider*/
.slider{
	position:relative;
	width:100%;
	height:100%;
}
.slider li{
	opacity:0;
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	animation:anime 18s 0s infinite;
}
.slider li:nth-of-type(2) {
	animation-delay:6s;
}
.slider li:nth-of-type(3) {
	animation-delay:12s;
}
@keyframes anime {
	0% {opacity:0;}
	16% {opacity:1;}
	34% {opacity:1;}
	66.6% {opacity:0;transform:scale(1.1) ;}
	100% {opacity:0;}
}
/*-------------------------googlemap*/
.googlemap iframe{
	vertical-align:bottom;
	width:100%;
	min-width:100%;
}
@media print, screen and (min-width: 768px) {
	.googlemap iframe{height:600px;}
}
@media screen and (max-width: 767px) {
	.googlemap iframe{height:400px;}
}
/*-------------------------max_bg*/
.max_bg{
	position:absolute;
	top:0;
	left:50%;
	margin-left:-50vw;
	width:100vw;
	height:100%;
	z-index:-1;
}
/*-------------------------hensyu (parts)*/
.hensyu{
	position:absolute;
	top:0;
	right:0;
	z-index:5;
}
#wrapper .hensyu a{
	display:block;
	min-width:52px;
	padding:8px 14px;
	border:none;
	border-radius:5px;
	background:#d60000;
	color:#FFF;
	font-size:14px;
	font-weight:700;
	line-height:1;
	text-align:center;
	text-decoration:none;
	/*box-shadow:0 2px 5px rgba(0,0,0,.16);*/
	/*transition:background-color .2s ease, transform .2s ease;*/
}
#wrapper .hensyu a:hover,
#wrapper .hensyu a:focus-visible{
	background:#FF0000;
	/*transform:translateY(-1px);*/
}
#wrapper .hensyu a:focus-visible{
	outline:2px solid #d60000;
	outline-offset:3px;
}
/*-------------------------list_link*/
.list_link{
	display:flex;
	flex-direction:column;
}
.list_link li{
	position:relative;
}
.list_link li > a{
	display:block;
	position:relative;
	line-height:1.3;
	padding:1.5em 0 1.5em 1em;
	text-decoration:none;
	transition:all 0.3s;
	border-bottom:1px solid rgba(0, 0, 0, 0.3);
}
.list_link li strong{
	margin-left:-0.8em;
}
.list_link a span{
	display:block;
	font-size:80%;
	font-weight:normal;
	margin-top:0.2em;
}
.list_link li > a:hover{
	background-color:#F1F1F1;
}
.list_link li > a:hover .ya::before{
	transform:translateX(0.3em);
}
/*-------------------------tx_sen*/
.tx_sen{
	display:flex;
	justify-content:center;
	align-items:center;
	gap:0.2em;
}
.tx_sen::before,
.tx_sen::after{
	content:"";
	display:block;
	width:5vw;
	height:1px;
	background:var(--color_k);
}
.tx_aka.tx_sen::before,.tx_aka.tx_sen::after{background:var(--color_aka);}
.tx_ao.tx_sen::before,.tx_ao.tx_sen::after{background:var(--color_ao);}
.tx_kon.tx_sen::before,.tx_kon.tx_sen::after{background:var(--color_kon);}
/*-------------------------ban_sen_w*/
.ban_sen_w{border:4px solid #FFF;}

/*-------------------------row_img*/
.row_img{
	display:flex;
	align-items:center;
	gap:40px;
}
.row_img figure{
	flex-shrink:0;
}
/*-------------------------img_right*/
.img_right{
	display:flex;
	justify-content:space-between;
	gap:50px;
}

/* SP：画像を上 */
@media screen and (max-width:767px){
	.img_right{
		flex-direction:column-reverse;
		align-items:flex-start;
		gap:20px;
	}
}

/* タブレット：画像を上・中央寄せ */
@media screen and (min-width:768px) and (max-width:1199px){
	.img_right{
		flex-direction:column-reverse;
		align-items:center;
		gap:20px;
	}
	.img_right > figure{
		width:100%;
		margin:0 auto;
		text-align:center;
	}
	.img_right > figure img{
		display:block;
		width:min(450px, 100%);
		height:auto;
		margin:0 auto;
	}
}

/*-------------------------youtube */
.video-thumbnail {
	position: relative;
	cursor: pointer;
	line-height: 0;
}
.video-thumbnail img {
	width: 100%;
	height: auto;
	transition: opacity 0.3s;
}
.video-thumbnail:hover img {
	opacity: 0.8;
}
.play-button {
	position: absolute;
	top: 50%; left: 50%;
	transform: translate(-50%, -50%);
	width: 60px; height: 60px;
	background-color: rgba(0, 0, 0, 0.6);
	border-radius: 50%;
	border: 3px solid #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s;
}
.play-button::before {
	content: "";
	border-style: solid;
	border-width: 12px 0 12px 20px;
	border-color: transparent transparent transparent #ffffff;
	margin-left: 5px;
}
.video-thumbnail:hover .play-button {
	background-color: rgba(255, 0, 0, 0.9);
	border-color: transparent;
	transform: translate(-50%, -50%) scale(1.1);
}
.modal {
	display: none; 
	position: fixed;
	z-index: 9999;
	left: 0; top: 0;
	width: 100%; height: 100%;
	background-color: rgba(0, 0, 0, 0.9);
	align-items: center; 
	justify-content: center;
}
.modal-content {
	position: relative;
	width: 90%;
	max-width: 900px;
}
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
}
.video-container iframe {
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
}
.close-btn {
	position: absolute;
	top: -45px; right: 0;
	color: white;
	font-size: 35px;
	cursor: pointer;
}
/*-------------------------dtbox + dt文字数(dl)*/
.dtbox{
	display:grid;
	grid-template-columns:6em 1fr;
	gap:0.5em;
}
.dtbox dt{
	color:#fff;
	background:var(--color-main);
	padding:0.2em 0;
	text-align:center;
	margin-bottom:auto;
}
.dtbox dd{
	/*margin:0.2em 0;*/
	text-align:left;
}
/*dt文字数*/
.dtbox.dt2{grid-template-columns:3em 1fr;}
.dtbox.dt3{grid-template-columns:4em 1fr;}
.dtbox.dt4{grid-template-columns:5em 1fr;}
.dtbox.dt5{grid-template-columns:6em 1fr;}
.dtbox.dt6{grid-template-columns:7em 1fr;}
.dtbox.dt7{grid-template-columns:8em 1fr;}
.dtbox.dt8{grid-template-columns:9em 1fr;}
.dtbox.dt9{grid-template-columns:10em 1fr;}
.dtbox.dt10{grid-template-columns:11em 1fr;}

/*-------------------------pulldown */
.pulldown {
	width: 240px;
	padding: 10px 40px 10px 1em;
	font-size: 1.8rem;
	color: #333;
	background-color: #fff;
	border: 1px solid #ccc;
	border-radius: 6px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	/* 右側矢印 */
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23666' stroke-width='2' fill='none' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1em center;
}
.pulldown:hover {
	border-color: #999;
}
.pulldown:focus {
	outline: none;
	border-color: #4a90e2;
	box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.2);
}
.pulldown:disabled {
	background-color: #f5f5f5;
	color: #aaa;
	cursor: not-allowed;
}
.pulldown option {
	padding: 8px;
}

/*-------------------------tab */
.tab {
	display: grid;
	grid-template-columns: repeat(var(--tab-count, 3), 1fr);
	border-bottom: 3px solid #f4512c;
}
.tab_btn {
	position: relative;
	padding: 18px 20px;
	border: 1px solid #ddd;
	border-bottom: 0;
	background: #f7f7f7;
	color: #444;
	font: inherit;
	font-weight: bold;
	cursor: pointer;
}
.tab_btn + .tab_btn {
	border-left: 0;
}
.tab_btn.is-active {
	background: #f4512c;
	color: #fff;
	border-color: #f4512c;
}
.tab_btn.is-active::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -10px;
	transform: translateX(-50%);
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #f4512c;
}
.tab_panel[hidden] {
	display: none;
}

@media screen and (max-width: 767px) {
	.tab {
		/* 1列にせず、PCと同じ列数を維持 */
		grid-template-columns: repeat(var(--tab-count, 3), 1fr);
		border-bottom: 3px solid #f4512c;
	}
	.tab_btn {
		display: flex;
		align-items: center;
		justify-content: center;
		min-width: 0;
		min-height: 70px;
		padding: 10px 5px;
		border: 1px solid #ddd;
		border-bottom: 0;
		font-size: 14px;
		line-height: 1.5;
		text-align: center;
		white-space: normal;
	}
	.tab_btn + .tab_btn {
		border-left: 0;
	}
	.tab_btn.is-active::after {
		display: block;
	}
}

/*-------------------------タブ下部切り替え */
.tab_switch_bottom{
	margin-top:50px;
	padding-top:30px;
	border-top:1px solid #ddd;
	text-align:center;
}
.tab_switch_title{
	margin-bottom:15px;
	font-size:16px;
	font-weight:600;
}
.tab_switch_links{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	gap:12px 30px;
}
.tab_switch_link{
	position:relative;
	padding:5px 18px 5px 0;
	border:0;
	color:var(--color-main);
	background:none;
	font:inherit;
	font-size:16px;
	font-weight:600;
	cursor:pointer;
}
.tab_switch_link::after{
	content:"→";
	position:absolute;
	top:50%;
	right:0;
	transform:translateY(-50%);
	transition:transform .2s ease;
}
.tab_switch_link:hover::after,
.tab_switch_link:focus-visible::after{
	transform:translate(4px, -50%);
}
.tab_switch_link:hover,
.tab_switch_link:focus-visible{
	text-decoration:underline;
	text-underline-offset:.2em;
}
@media screen and (max-width:767px){
	.tab_switch_bottom{
		margin-top:40px;
		padding-top:25px;
	}
	.tab_switch_links{
		flex-direction:column;
		align-items:center;
		gap:10px;
	}
}

/*-------------------------ol */
.page_body ol{
	margin:0;
	padding-left:1.4em;
	list-style-type:decimal;
}

.page_body ol > li{
	display:list-item;
	list-style-type:decimal;
}

/*.page_body ol > li + li{
	margin-top:10px;
}*/

/*-------------------------------------------------------------------------------------------------table*/
table{
	width:100%;
	empty-cells:show; 
	border-collapse:collapse; 
	border-spacing:0;
	background:#FFF;
	margin:0.5em 0;
	table-layout:fixed;
	font-size:16px;
	line-height:1.7;
}
table th,
table td{
	box-sizing:border-box;
	padding:18px 30px;
	border:1px solid #CCC;
	border-right:0;
	border-left:0;
	text-align:left;
	font-size:16px;
	line-height:1.7;
	vertical-align:top;
}
table th{
	background:#eee9df;
	font-weight:500;
}
@media screen and (max-width: 767px) {
	table{
		display:table;
		font-size:16px;
		line-height:1.7;
	}
	table th,
	table td{
		padding:12px 14px;
		font-size:16px;
	}
	table:not(.size):has(> tbody > tr > th[scope="row"]) tbody,
	table:not(.size):has(> tbody > tr > th[scope="row"]) tr,
	table:not(.size):has(> tbody > tr > th[scope="row"]) th,
	table:not(.size):has(> tbody > tr > th[scope="row"]) td{
		display:block;
		width:100%;
		font-size:16px;
	}
	table:not(.size):has(> tbody > tr > th[scope="row"]){
		display:block;
		width:100%;
		max-width:100%;
		table-layout:auto;
	}
	table:not(.size):has(> tbody > tr > th[scope="row"]) th{
		padding:10px;
		border-bottom:0;
	}
	table:not(.size):has(> tbody > tr > th[scope="row"]) td{
		padding:12px 10px 18px;
		border-top:0;
		border-bottom:0;
		overflow-wrap:anywhere;
	}
	table:not(.size):has(> tbody > tr > th[scope="row"]) tr:last-child td{
		border-bottom:1px solid #CCC;
	}
}
/*-------------------------zebra*/
table.zebra tr:nth-child(odd){
	background-color:rgba(0,0,0,0.05);
}
/*-------------------------line_x*/
table.line_x th,
table.line_x td{
	border-left:none;
	border-right:none;
}
/*-------------------------td_r/td_c/td_no */
.td_r td{text-align:right;}
.td_c td{text-align:center;}
.td_no td{white-space:nowrap;}
@media print, screen and (min-width: 768px) {
	.pc_td_r td{text-align:right;}
	.pc_td_c td{text-align:center;}
	.pc_td_no td{white-space:nowrap;}
}
@media screen and (max-width: 767px) {
	.sp_td_r td{text-align:right;}
	.sp_td_c td{text-align:center;}
	.sp_td_no td{white-space:nowrap;}
}
/*-------------------------th_r/th_c/th_no/th_bg_no */
.th_r th{text-align:right;}
.th_c th{text-align:center;}
.th_no th{white-space:nowrap;}
.th_bg_no th{background:none;}
@media print, screen and (min-width: 768px) {
	.pc_th_r th{text-align:right;}
	.pc_th_c th{text-align:center;}
	.pc_th_no th{white-space:nowrap;}
	.pc_th_bg_no th{background:none;}
}
@media screen and (max-width: 767px) {
	.sp_th_r th{text-align:right;}
	.sp_th_c th{text-align:center;}
	.sp_th_no th{white-space:nowrap;}
	.sp_th_bg_no th{background:none;}
}
/*-------------------------size((スマホ表示で幅100％以上を横スクロール) */
@media screen and (max-width: 767px) {
	table{font-size:1.6rem;}
	table.size{display:block; overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch;
		background:linear-gradient(to left, hsla(0,0%,100%,0), white 15px) 0 0 / 50px 100%,
			linear-gradient(to left, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.2)) 0 0/20px 100%,
			linear-gradient(to right, hsla(0,0%,100%,0), white 15px) right / 50px 100%,
			linear-gradient(to right, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.2)) right/20px 100%;
		background-repeat: no-repeat;
		background-attachment: local, scroll, local, scroll;
	}
	table.size td,table.size th{mix-blend-mode:multiply;}
}


/*-------------------------------------------------------------------------------------------------faq*/
.faq{
	border-bottom:1px solid #ddd8cf;
}
.faq:first-of-type{
	border-top:1px solid #ddd8cf;
}
.faq + h3{
	margin-top:3em;
}

/* 質問・回答 共通
-------------------------------------------------- */
.faq > summary,
.faq > div{
	display:grid;
	grid-template-columns:34px minmax(0, 1fr) 24px;
	gap:14px;
	box-sizing:border-box;
}

/* 質問
-------------------------------------------------- */
.faq > summary{
	align-items:center;
	padding:24px 10px;
	cursor:pointer;
	list-style:none;
	transition:color .2s ease;
}
.faq > summary::-webkit-details-marker{
	display:none;
}

/* 回答
-------------------------------------------------- */
.faq > div{
	grid-template-columns:34px minmax(0, 1fr);
	align-items:start;
	padding:0 10px 26px;
}

/* Q・A
-------------------------------------------------- */
.faq_type{
	display:flex;
	align-items:center;
	justify-content:center;
	width:34px;
	height:34px;
	color:var(--color-main);
	background:transparent;
	font-family:"Inter", sans-serif;
	font-size:20px;
	font-weight:700;
	line-height:1;
}
.faq > div .faq_type{
	color:#b79a6a;
}

/* 質問・回答テキスト
-------------------------------------------------- */
.faq > summary > div,
.faq > div > div{
	min-width:0;
	font-size:18px;
	line-height:1.8;
}

/* 開閉アイコン
-------------------------------------------------- */
.faq .arrow{
	position:relative;
	display:block;
	width:16px;
	height:16px;
	justify-self:end;
}
/* ＋の横線・縦線 */
.faq .arrow::before,
.faq .arrow::after{
	content:"";
	position:absolute;
	top:50%;
	left:50%;
	width:14px;
	height:1.5px;
	background:var(--color-main);
	transform:translate(-50%, -50%);
	transition:transform .25s ease, opacity .25s ease;
}
/* ＋の縦線 */
.faq .arrow::after{
	transform:translate(-50%, -50%) rotate(90deg);
}
/* 開いたときは − */
.faq[open] .arrow::after{
	transform:translate(-50%, -50%) rotate(0);
	opacity:0;
}

/* hover
-------------------------------------------------- */
@media (hover:hover) and (pointer:fine){
	.faq > summary:hover{
		color:var(--color-main);
	}
}

/* キーボード操作
-------------------------------------------------- */
.faq > summary:focus-visible{
	outline:2px solid var(--color-main);
	outline-offset:3px;
}

/* スマホ
-------------------------------------------------- */
@media screen and (max-width:767px){
	.faq > summary,
	.faq > div{
		grid-template-columns:28px minmax(0, 1fr) 20px;
		gap:10px;
	}
	.faq > summary{
		padding:20px 5px;
	}
	.faq > div{
		grid-template-columns:28px minmax(0, 1fr);
		padding:0 5px 22px;
	}
	.faq_type{
		width:28px;
		height:28px;
		font-size:18px;
	}
	.faq > summary > div,
	.faq > div > div{
		font-size:16px;
		line-height:1.7;
	}
	.faq .arrow{
		width:15px;
		height:15px;
	}
	.faq .arrow::before,
	.faq .arrow::after{
		width:13px;
	}
}

/*-------------------------------------------------------------------------------------------------sitemap*/
#wrapper .sitemap li:before{ 
	display:none;
}
#wrapper .sitemap li{
	margin:0;
}
.sitemap a{
	display:flex;
	align-items:center;
	padding:1rem;
	text-decoration:none;
	border-bottom:1px solid #CCC;
	color:var(--color_k);
}
.sitemap a::after{
	content: "";
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0.3em 0 0.3em 0.5em;
	border-color: transparent transparent transparent var(--color_kon);
	margin-left:auto;
	transition:all 0.3s;
}
.sitemap a:hover::after{
	transform:translateX(0.3em);
}
.sitemap a:hover{
	background:#F1F1F1;
}
.sitemap > li > a{
	background:var(--color_kon);
	color:#FFF;
	font-weight:bold;
	border:none;
	padding:2rem 0.5em 2rem 1em;
}
.sitemap > li > a:after{
	border-color: transparent transparent transparent #FFF;
}
.sitemap > li > a:hover{
	background:var(--color_link);
}
.sitemap .current_page_ancestor { order: 100; }/*siteinfoの段を最後に*/




/*-------------------------------------------------------------------------------------------------utility*/
body .abs-1{position:absolute;z-index:-1;}
body .serif{font-family: "Noto Serif JP", serif;}
body .tx_zen{font-family: "Inter", "Zen Kaku Gothic New", sans-serif;}
body .tate{writing-mode: vertical-rl;text-orientation: upright;}
body .mb3{margin-bottom:3px;}
body .mt3{margin-top:3px;}
body .pa-mp{padding:var(--mp);}
body .pt-mp{padding-top:var(--mp);}
body .pb-mp{padding-bottom:var(--mp);}
body .pl-mp{padding-left:var(--mp);}
body .pr-mp{padding-right:var(--mp);}
body .px-mp{padding-left:var(--mp);padding-right:var(--mp);}
body .py-mp{padding-top:var(--mp);padding-bottom:var(--mp);}
body .ma-mp{margin:var(--mp);}
body .mt-mp{margin-top:var(--mp);}
body .mb-mp{margin-bottom:var(--mp);}
body .ml-mp{margin-left:var(--mp);}
body .mr-mp{margin-right:var(--mp);}
body .ml--mp{margin-left:calc(var(--mp) * -1);}
body .mr--mp{margin-right:calc(var(--mp) * -1);}
body .mx-mp{margin-left:var(--mp);margin-right:var(--mp);}
body .my-mp{margin-top:var(--mp);margin-bottom:var(--mp);}
body .maximg img{width:100%;height:100%;object-fit:cover;object-position:center;}
body .mw600{max-width:600px}
body .row240{display:grid;grid-template-columns: repeat( auto-fill, minmax(240px,1fr) ) ;}
body .hv_dark a{transition:all 0.3s;}
body .hv_dark a:hover{filter:brightness(80%);}
body .hv_sen a{text-decoration:none;}
body .hv_sen a:hover{text-decoration:underline;}
@media print, screen and (min-width: 768px) {
	body .pc_h610{height:610px;}
	body .pc_w48p{width:48%;}
}
@media screen and (min-width:768px) and (max-width:1199px){
	body .pc_w48p{width:100%;}
}
@media screen and (max-width: 767px) {
	body .sp_px0{padding-left:0;padding-right:0}
	body .sp_mx0{margin-left:0;margin-right:0}
}
.sen_w3{border:3px solid #FFF;}
#wrapper .li_m3 > li + li{margin-top:0.3em;}

/*-------------------------dot */
.dot{
	margin:0;
	padding:0;
	list-style:none;
}
.dot > li{
	position:relative;
	padding-left:1.2em;
}
.dot > li::before{
	content:"";
	position:absolute;
	top:.75em;
	left:.25em;
	width:.35em;
	height:.35em;
	border-radius:50%;
	background:var(--color-main);
	transform:translateY(-50%);
}

/*-------------------------------------------------------------------------------------------------下層ページ共通*/
main.page{
	padding:0;
}
@media screen and (min-width: 768px) {
	main.page{
		min-height:70vh;
	}
}
@media screen and (max-width: 767px) {
	main.page{
		padding-top:64px;
	}
}

/* 固定ページ本文の共通余白 */
.page_body--fixed{
	margin:50px auto 100px;
}
@media screen and (max-width:767px){
	.page_body--fixed{
		margin:30px auto 70px;
	}
}
.title_bg{
	position:relative;
	display:grid;
	place-items:center;
	height:230px;
	overflow:hidden;
	background:#555;
}
@media screen and (max-width: 767px) {
	.title_bg{
		height:130px;
	}
}
.title_bg::after{
	content:"";
	position:absolute;
	inset:0;
	background:rgba(0,0,0,0.42);
}
.title_bg_img{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
}
.title{
	position:relative;
	z-index:1;
	margin:0;
	color:#FFF;
	font-size:30px;
	font-weight:700;
	letter-spacing:0.18em;
}
@media screen and (max-width: 767px) {
	.title{
		font-size:21px;
		letter-spacing:0.14em;
	}
}

/*-------------------------------------------------------------------------------------------------パンくず（下層ページ共通）*/
.breadcrumbs{
	display:flex;
	align-items:center;
	height:50px;
	font-size:14px;
	font-weight:500;
}
.breadcrumbs ol{
	display:flex;
	align-items:center;
	width:100%;
	margin:0 auto;
	padding-top:0;
	padding-bottom:0;
	font-size:inherit;
	list-style:none;
}
.breadcrumbs li{
	flex:0 0 auto;
	white-space:nowrap;
}
.breadcrumbs li + li::before{
	content:"›";
	margin:0 0.45em;
	color:#9b9b9b;
}
.breadcrumbs a{
	color:inherit;
	text-decoration:none;
	text-decoration-thickness:1px;
	text-underline-offset:.2em;
	transition:color .2s ease;
}
.breadcrumbs a:hover,
.breadcrumbs a:focus-visible{
	color:var(--color-main);
	text-decoration:underline;
}
.breadcrumbs [aria-current="page"]{
	color:var(--color-main);
}
/* スマホ */
@media screen and (max-width:767px){
	.breadcrumbs{
		height:40px;
		font-size:10px;
	}
	.breadcrumbs ol{
		min-width:0;
		overflow:hidden;
	}
	.breadcrumbs li{
		flex-shrink:0;
	}
	/* 現在ページのみ残り幅に収める */
	.breadcrumbs li:last-child{
		flex:1 1 auto;
		min-width:0;
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
	}
}

/*-------------------------------------------------------------------------------------------------下層ページリンク（下層ページ共通）*/
.page_links{
	margin-top:50px;
	margin-bottom:100px;
}
@media screen and (max-width: 767px) {
	.page_links{
		margin-top:30px;
		margin-bottom:70px;
	}
}
.page_links ul{
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:20px;
	margin:0;
	padding:0;
	list-style:none;
}
@media screen and (max-width: 767px) {
	.page_links ul{
		grid-template-columns:1fr;
		gap:10px;
	}
}
.page_links a{
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:62px;
	padding:12px 18px;
	border:1px solid var(--color-main);
	border-radius:999px;
	color:var(--color-main);
	background:#FFF;
	font-size:17px;
	font-weight:700;
	line-height:1.4;
	text-align:center;
	text-decoration:none;
	transition:color 0.25s ease,background-color 0.25s ease;
}
@media screen and (max-width: 767px) {
	.page_links a{
		min-height:60px;
		padding:10px 16px;
		font-size:17px;
	}
}
.page_links a:hover,
.page_links a:focus-visible{
	color:#FFF;
	background:var(--color-main);
}

/*----- タブレット(768〜1199px)独自調整 -----*/
@media screen and (min-width:768px) and (max-width:1199px){
	.page_links ul{
		grid-template-columns:repeat(2, minmax(0, 1fr));
		gap:14px 20px;
		width:min(760px, 100%);
		margin-right:auto;
		margin-left:auto;
	}
	.page_links a{min-height:58px;}
}


/*-------------------------------------------------------------------------------------------------汎用リンクカード*/
.nav_card{
	position:relative;
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
	width:100%;
	min-height:132px;
	padding:22px 58px 22px 26px;
	border:1px solid #ddd8cf;
	border-radius:16px;
	color:var(--color-text);
	background:#fff;
	text-decoration:none;
	transition:border-color .2s ease;
}
.nav_card::after{
	content:"→";
	position:absolute;
	right:26px;
	top:50%;
	color:var(--color-main);
	font-size:18px;
	font-weight:500;
	line-height:1;
	transform:translateY(-50%);
	transition:transform .2s ease;
}
.nav_card > strong{
	display:block;
	font-size:20px;
	font-weight:700;
	line-height:1.5;
	transition:color .2s ease;
}
.nav_card > span{
	display:block;
	margin-top:10px;
	font-size:16px;
	font-weight:400;
	line-height:1.7;
}
@media (hover:hover) and (pointer:fine){
	.nav_card:hover{
		border-color:var(--color-main);
	}
	.nav_card:hover > strong{
		color:var(--color-main);
	}
	.nav_card:hover::after{
		transform:translate(4px, -50%);
	}
}
.nav_card:focus-visible{
	border-color:var(--color-main);
	outline:3px solid rgba(239,75,35,.3);
	outline-offset:3px;
}
.nav_card:focus-visible > strong{
	color:var(--color-main);
}
/* タイトル先頭1文字を大きくオレンジにするバリエーション */
.nav_card.nav_card--initial-title > strong{
	display:flex;
	align-items:baseline;
	gap:.08em;
}
.nav_card.nav_card--initial-title .nav_card_initial{
	display:inline-block;
	flex:0 0 auto;
	color:var(--color-main);
	font-size:1.55em;
	font-weight:700;
	line-height:1;
	letter-spacing:0;
}
.nav_card.nav_card--initial-title .nav_card_initial--kana {
	transform: translateY(.06em);
}
@media (hover:hover) and (pointer:fine){
	.nav_card.nav_card--initial-title:hover .nav_card_initial{
		color:var(--color-main);
	}
}
@media screen and (max-width:767px){
	.nav_card.nav_card--initial-title > strong{
		align-items:baseline;
		gap:.05em;
	}
	.nav_card.nav_card--initial-title .nav_card_initial{
		font-size:1.4em;
		line-height:1;
		transform:translateY(.04em);
	}
	.nav_card.nav_card--initial-title .nav_card_initial--kana{
		transform:translateY(.08em);
	}
}

/* タイトルをオレンジのピル型ラベルにするバリエーション */
.nav_card.nav_card--pill-title > strong{
	width:fit-content;
	padding:5px 16px;
	border-radius:999px;
	color:#fff;
	background:var(--color-main);
}
/* お知らせ詳細のh2を踏襲したライン付きタイトルのバリエーション */
.nav_card.nav_card--line-title > strong{
	position:relative;
	padding-bottom:8px;
	border-bottom:2px solid #eee9df;
}
.nav_card.nav_card--line-title > strong::after{
	content:"";
	position:absolute;
	left:0;
	bottom:-2px;
	width:34%;
	max-width:120px;
	height:2px;
	background:var(--color-main);
}
.nav_card.nav_card--line-title > span{
	margin-top:12px;
}
/* カード左端へ接続するオレンジ見出しのバリエーション */
.nav_card.nav_card--ribbon-title > strong{
	box-sizing:border-box;
	width:fit-content;
	max-width:calc(100% + 26px);
	margin-left:-26px;
	padding:5px 24px 5px 26px;
	border-radius:0 999px 999px 0;
	color:#fff;
	background:var(--color-main);
}
@media screen and (max-width:767px){
	.nav_card{
		min-height:112px;
		padding:18px 45px 18px 18px;
		border-radius:14px;
	}
	.nav_card::after{
		right:18px;
	}
	.nav_card > strong{
		font-size:18px;
	}
	.nav_card > span{
		margin-top:8px;
		font-size:16px;
	}
	.nav_card.nav_card--pill-title > strong{
		padding:4px 13px;
	}
	.nav_card.nav_card--line-title > strong::after{
		max-width:100px;
	}
	.nav_card.nav_card--ribbon-title > strong{
		box-sizing:border-box;
		width:calc(100% - 42px);
		max-width:none;
		margin-left:-18px;
		padding:4px 18px;
		white-space:nowrap;
	}
}
@media screen and (min-width:768px) and (max-width:1199px){
	.nav_card.nav_card--ribbon-title > strong{
		max-width:calc(100% + 44px);
		padding-right:18px;
		font-size:18px;
	}
}

/*-------------------------------------------------------------------------------------------------汎用リンクカードグリッド*/
.nav_card_grid{
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	grid-auto-rows:auto;
	gap:24px;
	margin:0;
	padding:0;
	list-style:none;
}
.nav_card_grid > li{
	display:flex;
	min-width:0;
}
@media screen and (max-width:767px){
	.nav_card{
		padding-top:20px;
		padding-bottom:20px;
	}
	.nav_card_grid{
		grid-template-columns:1fr;
		gap:14px;
	}
}

/*-------------------------------------------------------------------------------------------------固定ページ本文見出し*/
body.page .page_body h2:not(#topics-list-title):not(#topics-category-title):not(#topics-archive-title){
	margin-bottom:30px;
	font-size:26px;
}
body.page .page_body h3{
	margin-bottom:20px;
	font-size:24px;
}

@media screen and (max-width:767px){
	body.page .page_body h2:not(#topics-list-title):not(#topics-category-title):not(#topics-archive-title){
		margin-bottom:25px;
		font-size:24px;
	}
	body.page .page_body h3{
		margin-bottom:10px;
		font-size:20px;
	}
}

/*-------------------------------------------------------------------------------------------------親ページメニュー*/
.page_intro{
	margin:0 auto 40px;
	text-align:center;
}
.page_intro h2{
	margin:0;
	font-size:30px;
	font-weight:500;
	line-height:1.4;
	letter-spacing:.04em;
}
.page_intro p{
	margin:30px 0 0;
	font-size:18px;
	line-height:1.75;
}
@media screen and (max-width:767px){
	.page_intro{
		margin-bottom:20px;
		text-align:left;
	}
	.page_intro h2{
		font-size:24px;
		line-height:1.4;
		text-align:center;
	}
	.page_intro p{
		margin-top:14px;
		font-size:16px;
	}
}


/*-------------------------------------------------------------------------------------------------ページ遷移フェードイン（下層ページ共通）*/
main.page{
	animation:page-fade-in 0.5s ease-out both;
}

@keyframes page-fade-in {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}