@charset "utf-8";

#dt_shittehoshii_section {
	background: #fefabd;
	padding: 81px 0 103px;
	margin: 80px 0;
}
#dt_shittehoshii_section[data-current="8"],
#dt_shittehoshii_section[data-current="9"] {
	margin: 0;
}
#dt_shittehoshii_section .dt_shittehoshii_inner {
	width: 100%;
	max-width: 934px;
	margin: 0 auto;
	box-sizing: border-box;
}
#dt_shittehoshii_section h2 {
	width: 424px;
	height: 0;
	margin: 0 auto 64px;
	padding-top: 43px;
	font-size: 0;
	line-height: 0;
	text-indent: -9999px;
	white-space: nowrap;
	background: url(../images/shittehoshiilink/dt_shittehoshii_ttl.png) no-repeat center top / 424px 34px;
}
#dt_shittehoshii_section h2::after {
	content: "";
	display: block;
	width: 94px;
    height: 14px;
	margin: 10px auto 0;
	background: url(../images/shittehoshiilink/line.png) no-repeat center / 100% 100%;
}
#dt_shittehoshii_section .dt_shittehoshii_list {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
#dt_shittehoshii_section .dt_shittehoshii_list li {
	flex: 1 1 0;
	min-width: 0;
	max-width: 300px;
}
/* 下層: 塗り + 枠線・ビュレット（clm_bg）／上層 span: タイトル画像 */
#dt_shittehoshii_section .dt_shittehoshii_list a {
	display: block;
	width: 100%;
	max-width: 300px;
	height: 252px;
	overflow: hidden;
	text-indent: -9999px;
	background-color: #fff;
	background-image: url(../images/shittehoshiilink/clm_bg.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
	border-radius: 10px;
}
#dt_shittehoshii_section .dt_shittehoshii_list a:hover {
	opacity: 0.7;
}
#dt_shittehoshii_section .dt_shittehoshii_list li.dt_current a {
	background-color: #fefbeb;
}
#dt_shittehoshii_section .dt_shittehoshii_list a span {
	display: block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
}
#dt_shittehoshii_section .dt_shittehoshii_list .dt_page08 a span {
	background-image: url(../images/shittehoshiilink/clm08.png);
}
#dt_shittehoshii_section .dt_shittehoshii_list .dt_page09 a span {
	background-image: url(../images/shittehoshiilink/clm09.png);
}
#dt_shittehoshii_section .dt_shittehoshii_list .dt_page01 a span {
	background-image: url(../images/shittehoshiilink/clm01.png);
}

@media screen and (max-width: 768px) {
	#dt_shittehoshii_section {
		padding: 10.417vw 0 15.417vw;
		margin: 10.417vw 0;
	}
	#dt_shittehoshii_section[data-current="8"],
	#dt_shittehoshii_section[data-current="9"] {
		margin: 0;
	}
	#dt_shittehoshii_section .dt_shittehoshii_inner {
		width: auto;
	}
	#dt_shittehoshii_section h2 {
		width: 64.714vw;
		height: 0;
		margin: 0 auto 17.417vw;
		padding-top: 16.667vw;
		background: url(../images/shittehoshiilink/dt_shittehoshii_ttl_sp.png) no-repeat center top / 100% 100%;
	}
	#dt_shittehoshii_section h2::after {
		width: 19.01vw;
		height: 2.604vw;
		margin: 3.906vw auto 0;
		background: url(../images/shittehoshiilink/line.png) no-repeat center / 100% 100%;
	}
	#dt_shittehoshii_section .dt_shittehoshii_list {
		flex-direction: column;
		align-items: center;
		gap: 2.083vw 0;
	}
	#dt_shittehoshii_section .dt_shittehoshii_list li {
		flex: none;
		max-width: none;
		width: auto;
	}
	#dt_shittehoshii_section .dt_shittehoshii_list a {
		width: 89.583vw;
		max-width: inherit;
		margin: 0 auto;
		height: auto;
		aspect-ratio: 688 / 252;
		background-image: url(../images/shittehoshiilink/clm_bg_sp.png);
		border-radius: 1.302vw;
	}
	#dt_shittehoshii_section .dt_shittehoshii_list .dt_page08 a span {
		background-image: url(../images/shittehoshiilink/clm08_sp.png);
	}
	#dt_shittehoshii_section .dt_shittehoshii_list .dt_page09 a span {
		background-image: url(../images/shittehoshiilink/clm09_sp.png);
	}
	#dt_shittehoshii_section .dt_shittehoshii_list .dt_page01 a span {
		background-image: url(../images/shittehoshiilink/clm01_sp.png);
	}
}