/* --- 基本リセット --- */
* { margin: 0; padding: 0; box-sizing: border-box; }
html {
    height: 100%;
}
body {
	display: flex;
	overflow-x: hidden;
	flex-direction: column;
	width: 100%;
	min-height: 100vh; /* 画面の高さいっぱいを最低値にする */
	margin: 0;
	font-family: "Helvetica Neue", Arial, sans-serif;
}
li { list-style-type: none; }
a { color: #333; text-decoration: none; }


/* PC/SP表示非表示 */
@media (max-width: 767px){
	.pcOnly{
		display: none !important;
	}
	.pctabOnly{
		display: none;
	}
}
@media (min-width: 768px){
	.smOnly,
	.smtubOnly{
		display: none !important;
	}
}


/* ボタン本体 */
#backToTop {
	position: fixed;
	bottom: 30px;
	right: 30px;
	width: 50px;
	height: 50px;
	background-color: #fff;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	opacity: 0;
	visibility: hidden;
	box-shadow: 0 4px 12px rgba(0,0,0,0.15);
	z-index: 1000;
}
#backToTop:hover {
	opacity: 0.5;
	transform: translateY(-5px); /* ホバー時に少し浮く演出 */
}
#backToTop.show {
	opacity: 1;
	visibility: visible;
}
/* CSSで作る矢印マーク */
.arrow-up {
	width: 12px;
	height: 12px;
	border-top: 3px solid #888;
	border-left: 3px solid #888;
	margin: 6px 0 0; /* 位置の微調整 */
	display: inline-block;
	transform: rotate(45deg); /* 45度回転させて「^」の形にする */
}


/* 最初はローディング画面を非表示にしておく（JSで制御するため） */
#loading-screen {
	display: none; 
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	justify-content: center;
	align-items: center;
	z-index: 9999;
}
/* ローディングを表示する時用のクラス */
#loading-screen.is-active {
	display: flex;
	animation: screenFadeOut 1s ease-in-out 4s forwards;
}
.telop-text {
	color: #ffffff;
	font-size: 2rem;
	opacity: 0;
}
/* クラスがついている時だけ文字をフェードイン */
.is-active .telop-text {
	animation: textFadeIn 0.8s ease-out 0.5s forwards;
}
@keyframes textFadeIn {
	to { opacity: 1; transform: translateY(0); }
	0% { opacity: 0; transform: translateY(10px); }
}
@keyframes screenFadeOut {
	to { opacity: 0; visibility: hidden; }
}


/* ヘッダー */
.header {
	width: 100%;
	height: 100px;
	padding: 0 20px;
	position: fixed;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	z-index: 1000;
	background-color: transparent;
	transition: background-color 0.5s ease;
}
.header-inner img {
	filter: brightness(0) invert(1);
}
/* スクロール後の背景色：半透明の白 */
.header.scrolled {
	background-color: rgba(255, 255, 255, 0.8) !important;
}
.header.scrolled img {
	filter: brightness(0);
}
.header-inner {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.logo {
	font-size: 24px;
	font-weight: bold;
	color: #FFF;
	transition: color 0.5s;
}
.header.scrolled .logo { color: #333; }


/* PC用リンク */
.pc-nav ul { display: flex; list-style: none; }
.pc-nav li { margin-left: 30px; }
.pc-nav a {
	text-decoration: none;
	color: #FFF;
	xfont-weight: bold;
	transition: color 0.5s;
}
.header.scrolled .pc-nav a { color: #333; }

/* メインビジュアル(A-D) */
.main-visual {
	position: relative;
	width: 100%;
	height: 100vh;
	max-height: 1200px;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #ccc;
}

/* スライドショー (8秒サイクル) */
.slider { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
.slide {
	position: absolute;
	width: 100%; height: 100%;
	background-size: cover;
	background-position: center;
	opacity: 0;
	animation: slideAnime 24s infinite;
}
.slide1 { background-image: url('../images/top/bg_img01.jpg'); animation-delay: 0s; }
.slide2 { background-image: url('../images/top/bg_img02.jpg'); animation-delay: 8s; }
.slide3 { background-image: url('../images/top/bg_img03.jpg'); animation-delay: 16s; }

@keyframes slideAnime {
	0% { opacity: 0; transform: scale(1.0); }
	10% { opacity: 1; }
	33% { opacity: 1; }
	43% { opacity: 0; transform: scale(1.1); }
	100% { opacity: 0; }
}


/* 中央コンテンツ配置 */
.visual-content {
	position: absolute;
	z-index: 10;
	text-align: center;
	color: #FFF;
	/* 3秒でフェードイン */
	opacity: 0;
	animation: FadeIn 3s forwards;
}
@keyframes FadeIn {
	0% { opacity: 0; transform: scale(1.1); }
	100% { opacity: 1; transform: scale(1); }
}
.visual-content h1 {
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
	font-size: clamp(44px, 5vw, 60px);
	margin-bottom: 30px;
	text-shadow: 0 0 20px rgba(0,0,0,0.5);
}


/* リンクボタン */
.btn-about {
	display: inline-block;
	padding: 15px 40px;
	border: 2px solid #FFF;
	color: #FFF;
	text-decoration: none;
	font-weight: bold;
	letter-spacing: 0.1em;
	transition: all 0.3s ease;
}
.btn-about:hover {
	background-color: #FFF;
	color: #333;
}


/* ハンバーガーボタン */
.hamburger {
	display: none;
	position: fixed;
	top: 35px;
	right: 30px;
	width: 30px;
	height: 30px;
	cursor: pointer;
	z-index: 3000;
}
.hamburger span {
	position: absolute;
	left: 0; width: 100%; height: 2px;
	background: #FFF;
	transition: all 0.4s;
}

/* スクロール領域を超えた時、またはメニューが開いている時は黒に変更 */
.hamburger.scrolled span,
.hamburger.active span {
	background-color: #333 !important;
}
.hamburger span:nth-child(1) { top: 6px; }
.hamburger span:nth-child(2) { top: 14px; }
.hamburger span:nth-child(3) { top: 22px; }

/* バツ印の変化 */
.hamburger.active span:nth-child(1) { transform: translateY(8px) rotate(-45deg); }
.hamburger.active span:nth-child(2) { opacity: 0; }
.hamburger.active span:nth-child(3) { transform: translateY(-8px) rotate(45deg); }

/* スマホメニュー */
.sp-nav {
	position: fixed;
	left: 0;
	bottom: -100%;
	width: 100%;
	height: 100%;
	background-color: #ededed;
	z-index: 2000;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: bottom 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.sp-nav.active {
	bottom: 0;
}
.sp-nav ul {
	width: 90%;
	list-style: none;
	text-align: left;
	opacity: 0;
	transition: opacity 0.4s ease;
}
.sp-nav.active ul { 
	opacity: 1; 
	transition: opacity 0.5s 0.6s;
}
.sp-nav li { margin: 30px 0; padding: 0 0 30px; border-bottom: 1px solid #888; }
.sp-nav li:last-child { border-bottom: 0px }
.sp-nav li img {
	filter: invert(47%) sepia(24%) saturate(0%) hue-rotate(240deg) brightness(95%) contrast(91%);
}
.sp-nav a { text-decoration: none; color: #333; font-size: 1em; }

@media screen and (max-width: 960px) {
	.pc-nav { display: none; }
	.hamburger { display: block; }
}


/* メインコンテンツ領域 */
.content {
	padding: 50px 20px;
	background: #eee;
	flex: 1; /* コンテンツが少ない時、このエリアが伸びてfooterを押し下げる */
}
.content .topMenu {
	max-width: 1300px;
	margin: 0 auto;
	display: flex;
}
.content .topMenu ul li {
	max-width: 49%;
	margin: 0;
	background: #aaa;
}
.main-content {
	max-width: 1200px;
	margin: 0 auto;
	padding: 20px 0 0;
}
.main-content li {
	border-radius: 10px;
}


/* 左右を並べる親 */
.container01 {
	display: flex;
	gap: 20px;
	align-items: stretch; /* 左右のカラム(ul)の長さを強制的に揃える */
}
.container02 {
	padding: 70px 0 0;
}
.column {
    flex: 1;
    display: grid;
    gap: 20px;
    list-style: none;
}

/* 左：1枚目は全幅、2・3枚目は横並び */
.left-col {
	grid-template-columns: 1fr 1fr;
}
.left-col li:first-child {
	grid-column: 1 / 3;
}

/* 右：2番目が「余った全高さ」を埋める */
.right-col {
	grid-template-rows: auto 1fr; 
}
.grow-item {
	height: 100%; /* これで親のul(右カラム)の底まで伸びる */
}

/* 比率と装飾 */
.ratio-square { aspect-ratio: 1 / 1; }
.ratio-half-height { aspect-ratio: 2 / 0.97; }

.banner-item {
	position: relative;
	overflow: hidden;
	background-color: #eee;
}

.img-box { width: 100%; height: 100%; }
.img-box img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.banner-item:hover img { transform: scale(1.1); transition: transform 0.5s ease; }



/* 親要素：画像を重ねるための基準にする */
.slideshow-container {
	position: relative;
	width: 100%; /* 必要に応じて調整 */
	aspect-ratio: 1 / 1; /* 正方形を維持する場合 */
	overflow: hidden;
}

/* スライド画像：すべて同じ場所に絶対配置で重ねる */
.slideBanner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* 初期状態は透明にしておく */
	opacity: 0;
	/* 1秒かけてふわっと変化させる */
	transition: opacity 2.0s ease-in-out;
}
/* activeクラスがついた時だけ不透明にする */
.slideBanner.active {
	opacity: 1;
	z-index: 1; /* 前面に出す */
}
/* キャプション */
.container01 .caption {
	position: absolute;
	width: 100%;
	padding: 20px 0 15px 20px;
	bottom: 0;
	left: 0;
	background: linear-gradient(transparent, rgba(0,0,5,0.5));
	color: #fff;
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
	font-size: 20px;
	line-height: 1.2em;
	z-index: 10;
	pointer-events: none;
}
@media (max-width: 768px) {
	.container01 { flex-direction: column; gap: 10px; }
	.container02 { padding: 50px 0 0; }
	.left-col { grid-template-columns: 1fr; }
	.left-col li:first-child { grid-column: auto; }
	.column { gap: 10px; }
	.ratio-half-height { aspect-ratio: 1 / 1; }
	.grow-item { height: auto; aspect-ratio: 1 / 1; }
	.container01 .caption { padding: 20px 0 20px 20px; }
}


/* ボタンの基本設定 */
.rounded-button01 {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 28px;
	background-color: rgba( 117, 180, 183, 0.85 );
	color: #75b4b7;
	background-color: transparent;
	border: 1px solid #75b4b7;
	text-decoration: none;
	font-family: sans-serif;
	font-size: 16px;
	font-weight: 500;
	border-radius: 50px;
	transition: all 0.3s ease;
	box-sizing: border-box;
}
.rounded-button01:hover {
	background-color: #75b4b7;
	color: #fff;
}
/* 矢印アイコン */
.arrow-icon {
	position: relative;
	width: 20px;
	height: 12px;
	transition: transform 0.3s ease;
}
.arrow-icon::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: currentColor;
	transform: translateY(-50%);
}
.arrow-icon::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	width: 6px;
	height: 6px;
	border-top: 1px solid currentColor;
	border-right: 1px solid currentColor;
	transform: translateY(-50%) rotate(45deg);
}
/* ホバー時の矢印アニメーション */
.rounded-button:hover .arrow-icon {
	transform: translateX(8px);
}


/*Top：お知らせ*/
.news_box {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}
.news_box .body {
	background: #f5f5f5;
	border-radius: 10px;
}
.news_box .body .title {
	padding: 20px 0 0;
	font-size: 160%;
	font-weight: 900;
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
	text-align: center;
}
.news_box .body .title h3 {
	position: relative;
	padding: 0.5rem 0 0.8rem;
	margin: 0 0 1em;
	font-weight: bold;
	background-image: linear-gradient(90deg, #f1f1f1 0% 48%, black 48% 52%, #f1f1f1 52%);
	background-repeat: no-repeat;
	background-size: 100% 0.1rem;
	background-position: bottom;
}
.news_box .body .list {
	padding: 0 50px 40px;
}
.news_box .body .list ul li {
	padding: 10px 0;
	border-bottom: 1px #aaa dotted;
}
.news_box .body .list a {
	text-decoration: none;
}
.news_box .body .list a:hover {
	text-decoration: none;
	opacity: 0.6;
}
.news_box .body .btn {
	padding: 20px 0 0;
	text-align: center;
}
.news_box span.data {
	color: #888;
}
.Notice,
.PR {
	margin: 0 0.8em;
	padding: 0 1em;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	font-size: 0.6em;
	font-weight: 700;
	font-family: 'Noto Sans JP', sans-serif;
	color: #FFF;
	text-align: center;
	display: inline-block;
}
.Notice {
	background: #2d99f5;
}
.Notice:after { content:"お　知　ら　せ"; }
.PR {
	background: #71ce64;
}
.PR:after { content:"プレスリリース"; }
@media only screen and (max-width: 767px) {
	.news_box {
		width: 100%;
	}
	.news_box .body .list {
		padding: 0 20px 40px;
	}
}

/* お知らせ一覧 */
#entryArea .entry_list01 {
	margin: 0 0 20px;
	border-radius: 10px;
	background: #fff;
}
#entryArea .entry_list01 .body {
	padding: 30px 80px 40px;
}
#entryArea .entry_list01 .body .title {
	padding: 0 0 5px;
	font-size: 1.2rem;
	line-height: 1.8em;
	font-weight: 700;
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
}
#entryArea a {
	color: #333;
}
#entryArea a:hover {
	color: #333;
	text-decoration: none;
	opacity: 0.6;
}
@media only screen and (max-width: 767px) {
	#entryArea .entry_list01 .body {
		padding: 2em 3em;
	}
}

/* フッター */
footer {
	width: 100%;
	background: #eee;
	margin-top: auto;
	padding: 30px 0 20px;
	text-align: center;
}
footer section {
	margin: 0 0 10px 0;
}
footer section img.logo {
	height: 30px;
	margin: 0 0 10px;
}
footer section h4 {
	font-weight:bold;
	margin: 10px 0;
}
footer section p {
	xfont-size: 1.5rem;
}
footer .linkList {
	margin: 1em 0;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
}
footer .linkList li {
	padding: 0 1em;
	font-size: 0.8rem;
}
footer .linkList li+ li {
	border-left: 1px solid #333;
}
footer section a { margin:20px 0; color: #333; text-decoration: none; }
footer section a:hover{ text-decoration: none; opacity: 0.6; }
footer .copy {
	margin: 1em;
	font-family: 'Hind Siliguri', sans-serif;
	font-size: 0.7rem;
	color: #333;
}

/* アイコン付きリンク */
.icon-link {
	display: inline-flex;
	align-items: center; /* 垂直方向の中央揃え */
	text-decoration: none;
	color: #333;
	line-height: 1; /* 行の高さを1にすると計算が楽になります */
}
.link-icon {
	width: 15px;
	height: auto;
	margin-right: 6px; /* 文字との間隔 */
	display: block; 
}
.link-text {
	display: inline-block;
	line-height: 1;
}



/* ヘッダー全体のコンテナ */
.header-container {
	max-width: 1300px;
	min-height: 500px; /* PCでの高さ */
	margin: 100px auto 0;
	position: relative; /* 子要素の基準点 */
	overflow: hidden;
	display: flex;
	align-items: center; /* 垂直中央 */
	justify-content: center; /* 水平中央 */
}
.header-container02 {
	padding: 80px 0 0;
}
.header-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 10px;
	object-fit: cover; /* 画像のアスペクト比を保ちつつ領域を埋める */
	z-index: 1;
}
.header-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 10px;
	background: rgba(0, 0, 0, 0.4); /* 黒の40%透明 */
	z-index: 2;
}
.header-title {
	position: relative;
	z-index: 3;
	color: #ffffff;
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
	text-shadow: 0 0 20px rgba(0,0,0,0.5);
	text-align: center;
	padding: 0 20px;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}
.visual-content h1 {
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
	font-size: clamp(44px, 5vw, 60px);
	margin-bottom: 30px;
	text-shadow: 0 0 20px rgba(0,0,0,0.5);
}
@media screen and (max-width: 768px) {
	.header-container {
		height: 100vw;
		min-height: auto;
	}
	.header-title {
		font-size: 1.8rem; /* スマホ用に文字を少し小さく */
	}
}


/* ページタイトル */
.page-title {
	padding: 80px 0 0;
	text-align: center;
}
.page-title h1 {
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
	font-size: clamp(40px, 4vw, 56px);
	color: #75b4b7;
}
@media screen and (max-width: 768px) {
	.page-title {
		padding: 80px 0 0;
		text-align: center;
	}
}


/* サブページ用 */
.introText {
	width: 30em;
	margin: 0 auto;
	padding: 50px 0 65px;
	text-align: justify;
	font-family: "Yu Gothic Pr6N M", "Hiragino Kaku Gothic ProN", "Yu Gothic Medium", YuGothic, Meiryo, sans-serif;
	font-size: 20px;
	line-height: 2;
}
@media screen and (max-width: 768px) {
	.introText {
		width:90%;
		padding: 30px 0 40px;
		font-size: 16px;
	}
}
/* セクションレイアウト（ノーマル） */
.norm-section {
	margin: 0 0 30px;
	padding: 70px 100px;
	background: #fff;
	border-radius: 10px;
}
/* セクションレイアウト（画像と文章の横並び） */
.row-section {
	display: flex;
	gap: 60px;
	margin: 0 0 30px;
	padding: 70px 100px;
	background: #fff;
	border-radius: 10px;
}
.row-section:nth-child(even) {
	flex-direction: row-reverse;
}
.row-section:last-child {
	margin: 0;
}
.section-image {
	flex: 1;
	background-color: #f7f7f7;
	border-radius: 10px;
	height: 450px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #999;
	position: relative;
}
.section-image img {
	width: 100%;
	height: 100%;
	border-radius: 10px;
	object-fit: cover;
}
.section-image02 {
	border-radius: 10px;
	color: #999;
}
.section-image02 img {
	width: 100%;
	height: 100%;
	border-radius: 10px;
	object-fit: cover;
}
.section-text {
	text-align: justify;
	flex: 1;
}
.section-text p {
	font-size: 1.2rem;
	line-height: 1.8em;
}
.section-text .btn {
	text-align: left;
}
.section-label {
	display: block;
	font-size: 0.85rem;
	letter-spacing: 0.2em;
	color: #888;
	margin-bottom: 15px;
	text-transform: uppercase;
}
.section-h2 {
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
	font-size: 1.9rem;
	font-weight: 500;
	margin-bottom: 30px;
	color: #75b4b7;
	line-height: 1.4;
}
.section-h3 {
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
	font-size: 1.6rem;
	font-weight: 500;
	margin-bottom: 15px;
	color: #75b4b7;
	line-height: 1.2;
}
.support-list {
	padding: 0;
	margin: 25px 0;
	font-size: 0.95rem;
	list-style: none; /* デフォルトの数字を非表示に */
	counter-reset: li;
}
.support-list li {
	padding: 0 0 10px 0;
	border-bottom: 1px solid #eee;
	position: relative;
	padding-left: 1.5em;
	line-height: 1.5;
}
.support-list li:not(:first-child) {
	margin-top: 0.4em;
}
.support-list li::before {
	counter-increment: li;
	content: counter(li);
	position: absolute;
	left: 0;
	top: 1px; /* 数字のY軸線上の位置を調整 */
	display: block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #75b4b7;
	font-size: 1rem;
	color: #fff;
	line-height: 20px;
	text-align: center;
	font-weight: bold;
}

/* olのスタイル */
.norm-section ol {
	margin: 0;
	padding: 0;
	list-style: none; /* デフォルトの数字を非表示に */
	counter-reset: li;
}
/* ol内のliのスタイル */
.norm-section ol li {
	position: relative;
	font-size: 16px;
	padding-left: 1.5em;
	line-height: 1.5;
}

/* 2つ目以降のliにmargin-topを指定 */
.norm-section ol li:not(:first-child) {
	margin-top: 0.5em;
}
/* 数字のスタイル */
.norm-section ol li::before {
	counter-increment: li;
	content: counter(li);
	position: absolute;
	left: 0;
	top: 2px; /* 数字のY軸線上の位置を調整 */
	display: block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #75b4b7;
	font-size: 12px;
	color: #fff;
	line-height: 20px;
	text-align: center;
	font-weight: bold;
}
@media (max-width: 768px) {
	.norm-section {
		flex-direction: column;
		margin: 0 0 20px;
		padding: 12% 10%;
		text-align: left;
	}
	.row-section,
	.row-section:nth-child(even) {
		flex-direction: column;
		margin: 0 0 20px;
		padding: 12% 10%;
		text-align:center;
		gap: 30px;
	}
	.section-image {
		width: 100%;
		height: 300px;
	}
	.section-h2 {
		font-size: 1.5rem;
	}
	.section-text p {
		font-size: 0.9rem;
	}
	.section-text .btn {
		text-align: center;
	}
	.hero-title {
		font-size: 1.4rem;
	}
}


/*リスト01*/
/* 基本の高さ揃え設定 */
.list-section .list01 {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	padding: 0;
	margin: 0;
}
.list-section .list01 li {
	display: flex;
	width: 33.333%;
	box-sizing: border-box;
	padding: 10px; /* アイテム間の余白 */
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
}
.list-section .list01 li div {
	width: 100%;
	text-align: center;
}
/* リンクエリアを親要素いっぱいまで広げる */
.list-section .list01 li a {
	display: block;
	width: 100%;
	height: 100%;
	text-decoration: none;
	color: inherit;
	background-color: #ffffff; /* 通常時の背景色 */
	border: 1px solid #ddd;    /* 枠線（任意） */
	padding: 20px;
	box-sizing: border-box;
	border-radius: 10px;
	/* 色の変化を滑らかにするアニメーション */
	transition: background-color 0.3s ease, opacity 0.3s ease;
}
.list-section .list01 li a:hover {
	background-color: #f5f5f5;
	opacity: 0.8;
}
/* 画像の微調整（リンク内いっぱいにする場合） */
.list-section .list01 li a img {
	max-width: 100%;
	height: auto;
}
/* --- スマホ表示の切り替え（ブレイクポイント 767px） --- */
@media screen and (max-width: 767px) {
	.list-section {
		width: 100%;
		margin: 0;
		padding: 12% 0 0;
		text-align: left;

	}
	.list-section .list01 li {
		width: 100%; /* スマホでは1カラム（1枚ずつ縦並び） */
		padding: 10px 0; /* 左右の余白を詰める調整 */
	}
	.list-section .list01 li a {
		border-radius: 8px;
	}
}


/* 商品リストスタイル */
.itemList01 {
	display: flex;
	flex-wrap: wrap;
	gap: 20px; /* アイテム間の隙間 */
	width: 100%;
	padding: 0;
	list-style: none;
}
.itemList01 li {
	width: calc((100% - 40px) / 3); /* 3カラム計算 */
	border-radius: 15px; /* 角を丸くする */
	overflow: hidden; /* 角丸からはみ出る画像をカット */
	box-sizing: border-box;
}
.itemList01 li a {
	display: block;
	position: relative;
	text-decoration: none;
	width: 100%;
}
.itemList01 .img-box {
	width: 100%;
	aspect-ratio: 1 / 1; /* 正方形に固定 */
	overflow: hidden;
	background-color: #eee;
}
.itemList01 .img-box img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease; /* スムーズな拡大アニメーション */
}
.itemList01 li a:hover .img-box img {
	transform: scale(1.1);
}
/* 下部のグラデーション（視認性向上） */
.itemList01 .img-box::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 20%; /* 下から半分にかけてグラデーション */
	background: linear-gradient(to top, rgba(0, 0, 50, 0.4) 0%, transparent 100%);
	pointer-events: none; /* クリック操作を邪魔しない */
}
.itemList01 .text-box {
	position: absolute;
	bottom: 15px;
	left: 15px;
	right: 15px;
	display: flex;
	align-items: center;
	z-index: 2;
}
.itemList01 .text {
	color: #fff;
	font-size: 1.2rem;
	font-weight: bold;
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
	line-height: 1.2em;
}
.arrow-circle {
	display: inline-block;
	width: 24px;
	height: 24px;
	background-color: #fff;
	border-radius: 50%;
	margin-right: 10px;
	position: relative;
	flex-shrink: 0;
}
.arrow-circle::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 45%;
	width: 6px;
	height: 6px;
	border-top: 2px solid #75b4b7;
	border-right: 2px solid #75b4b7;
	transform: translate(-50%, -50%) rotate(45deg);
}
@media only screen and (max-width: 767px) {
	.itemList01 li {
		width: 100%; /* 1カラム */
	}
	.itemList01 {
		gap: 15px;
	}
	.itemList01 .text {
		font-size: 1rem;
	}
}


/* フォーム */
input[type="text"], input[type="email"], textarea {
	vertical-align: middle;
	width:100%;
	height: 30px;
	padding: 1px 5px;
	border: 1px solid #d4d4d7;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	line-height: 30px;
	font-size: 110%;
	color: #555;
	background:#f4f0ec;
	font-family: 'Noto Sans JP', sans-serif;
}
input[type="checkbox"] {
	-webkit-appearance :checkbox;
}
textarea {
	height: auto;
	line-height: 1.5;
	font-size: 120%;
	height: 180px;
}
select {
	font-family: 'Noto Sans JP', sans-serif;
	background: rgba(255,255,255,0.5);
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	width: 90%;
	height: 30px;
	line-height: 30px;
	color: #555;
}
input[type="submit"], input[type="reset"], input[type="button"] {
	width:180px;
	margin:15px 10px 0;
	padding:0.8em;
	border:2px solid #e74857;
	border-radius:3px;
	background:#FFF;
	font-size:110%;
	font-weight:bold;
	text-align:center;
	text-decoration:none;
	color:#e74857;
	font-family: 'Noto Sans JP', sans-serif;
}
input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover {
	background:#e74857;
	color:#FFF;
	transition: all 0.5s;
}
*:first-child+html input[type="submit"] {
	padding: 3px;
}
.error_message {
	color:#cc0000;
}
.error_message::before {
	content:">>";
}
.soy_inquiry_message h2 {
	margin: 0 0 50px 0;
	font-size: 3rem;
	font-weight: 600;
	line-height: 1.4em;
	letter-spacing: 2px;
	color: #4ac7c0;
	text-align: center;
	position: relative;
}
.soy_inquiry_message h2::after {
	content: '';
	position: absolute;
	top:100px;
	left: 0;
	right: 0;
	bottom: 0;
	width: 2px;
	height: 40px;
	margin: auto;
	background-color: #bbb;
}
.soy_iqnuiry_responsive dd {
	margin: 0 0 1em 0;
	padding: 0.5em;
	border-radius: 5px;
}

*
/*フォーム*/
.soy_iqnuiry_responsive input::-webkit-input-placeholder {
    color: #ccc;
    font-size: 14px;
}
.soy_iqnuiry_responsive input:-moz-placeholder {
    color: #ccc;
    font-size: 14px;
}

.soy_inquiry_message {
	margin: 0 0 25px;
	font-size: 160%;
	font-weight: bold;
	font-family: 'Noto Sans JP', sans-serif;
}
@media only screen and (max-width: 767px) {
	.soy_inquiry_message {
		font-size: 120%;
	}
}

/* アイコン付き電話番号 */
.icon-tel {
	margin: 1em 0 0;
	display: inline-flex;
	align-items: center; /* 垂直方向の中央揃え */
	text-decoration: none;
	color: #333;
	line-height: 1;
}
.tel-icon {
	width: 60px;
	height: auto;
	margin-right: 6px; /* 文字との間隔 */
	display: block; 
}
.tel-number {
	display: inline-block;
	line-height: 1;
	font-size: 1.8em;
	color: #75b4b7;
}
.tel-txt {
	font-size: 0.9em;
}


/* テーブル01 */
.table01 {
	width: 100%;
	border-collapse: collapse;
	font-size: 1.2rem;
}
.table01 th {
	width: 30%;
	padding: 24px 0 24px 1em;
	border-bottom: 1px solid #fff;
	background: #efefef;
	font-weight: bold;
}
.table01 th:last-child {
	border-bottom: 1px solid #efefef;
}
.table01 td {
	padding: 24px 0 24px 1em;
	border-top: 1px solid #dedede;
}
.table01 td:last-child {
	border-bottom: 1px solid #dedede;
}
@media only screen and (max-width: 767px) {
	.table01 {
		font-size: 1rem;
	}
	.table01 th {
		width: 100%;
		padding: 12px 0 12px 1em;
		border: none;
		display: block;
	}
	.table01 td {
		width: 100%;
		padding: 2em 0 2em 1em;
		border: none;
		display: block;
	}
	.table01 th:last-child,
	.table01 td:last-child {
		border-bottom: none;
	}
}

/*table02*/
.table02 {
	width: 100%;
	border: #2D0F09 1px solid;
	border-collapse: collapse;
	font-family: 'Noto Sans JP', sans-serif;
	text-align: left;
}
.table02 th {
	width: 20%;
	padding: 15px;
	border: 1px solid #888;
	background: #777;
	font-weight: 700;
	color: #fff;	
} 
.table02 td {
	padding: 15px;
	border: 1px solid #888;
	background-color: #efefef;
	vertical-align: top;
}
@media only screen and (max-width: 767px) {
	.table02 {
		border: 0px;
	}
	.table02 th,
	.table02 td {
		width: 100%;
		border: 0px;
		display: block;
	}
	.table02 th {
		padding-left: 10px;
	}
	.table02 td {
		padding-bottom: 2em;
	}
}

/* table03 */
.table03 {
	width: 100%;
	font-size: 90%;
}
.table03 tr {
	border-bottom: 2px solid #dedede;
}
.table03 tr:first-child {
	border-top: 2px solid #dedede;
}
.table03 th,
.table03 td {
	padding: 24px 0 24px 1em;
	border: none;
}
.table03 th {
	width: 30%;
	background: #efefef;
	font-weight: bold;
}

/* 会社沿革 */
.timeline {
	width: 100%;
	margin: 0 auto 2em;
	font-size: 1.2em;
	list-style: none;
}
.timeline > li {
	overflow: hidden;
	margin: 0;
	position: relative;
}
.timeline-date {
	width: 110px;
	padding: 14px 0 0 0;
	font-weight: bold;
	float: left;
}
.timeline-content {
	width: 80%;
	padding: 14px 0 0 40px;
	border-left: 3px #efefef solid;
	float: left;
}
.timeline-content h3 {
	font-size: 1em;
	font-weight: bold;
}
.timeline-content p {
	margin:0 0 1em 0;
}
.timeline-content:before {
	content: '';
	width: 12px;
	height: 12px;
	background: #75b4b7;
	position: absolute;
	left: 106px;
	top: 24px;
	border-radius: 100%;
}
@media screen and (max-width:767px) {
	.timeline {
		font-size: 1em;
	}
	.timeline > li {
		margin-bottom: 60px;
	}
	.timeline-date {
		width: 100%;
		padding: 6px 0 5px 1rem;
		border-radius: 10px;
		background:  #75b4b7;
		color: #fff;
		font-weight: bold;
	}
	.timeline-content {
		width: 100%;
		padding: 14px 5% 0 5%;
		border: 0;
	}
	.timeline-content h3 {
		font-weight: bold;
	}
	.timeline-content p {
		margin: 0;
	}
	.timeline-content:before {
		content: '';
		width: 0;
		height: 0;
		background: #fff;
		position: absolute;
		left: 0;
		top: 0;
		border-radius: 100%;
	}
}


/*消臭＆除菌効果について*/
.effect_box01 {
	margin-bottom: 35px;
	padding: 25px 50px 35px;
	border-radius: 8px;
	background: #f1f1f1;
}
.effect_box01 h3 {
	padding: 4px 15px 5px;
	border-radius: 5px;
	background: #5cb146;
	display: inline-block;
	font-weight: 400;
	font-family: 'Noto Sans JP', sans-serif;
	color: #fff;
	line-height: 1;
}
.effect_box01 h4 {
	font-size: 150%;
	font-weight: 700;
	font-family: 'Noto Sans JP', sans-serif;
	color: #333;
	line-height: 2;
}
.effect_box01 .image {
	text-align: center;
}
.effect_box01 ul,
.effect_box01 ol {
	margin: 0;
}
.effect_box01 ul li {
	margin: 0 0 0 30px;
	list-style-type: disc;
}
.effect_box01 ol li {
	margin: 0 0 0 30px;
	list-style-type: decimal;
}
@media only screen and (max-width: 767px) {
	.effect_box01 {
		padding: 20px 30px 30px;
	}
	.effect_box01 h4 {
		font-size: 130%;
	}
}


/*Q&A*/
.qa01 .qa01_actab {
	position: relative;
	width: 100%;
	margin: 0 0 1em 0;
	color: #1b2538;
}
.qa01 .qa01_actab input {
	display: none;
}
/* Q&A：タイトル */
.qa01_title {
	position: relative;
	margin: 0 0 1em 0;
	padding: .5em .7em .4em;
	border-bottom: 3px solid #75b4b7;
	font-size: 1.5em;
	font-weight: bold;
	color: #333333;
}
.qa01_title:nth-child(n+2) {
	margin: 1em 0;
}
.qa01_title::before,
.qa01_title::after {
	position: absolute;
	left: 30px;
	bottom: -15px;
	width: 30px;
	height: 15px;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	content: '';
}
.qa01_title::before {
	background-color: #49b6ba;
}
.qa01_title::after {
	bottom: -11px;
	background-color: #fff;
}
/* 質問 */
.qa01 .qa01_actab label {
	font-weight: bold;
	line-height: 1.6em;
	position: relative;
	display: block;
	margin: 0 0 0 0;
	padding: 1em 2em 1em 3em;
	cursor: pointer;
	text-indent: 1em;
	border-radius: 0.5em;
	background: rgba(27,37,56,0.1);
}
.qa01 .qa01_actab label::before {
	content: 'Q';
	font-family: serif;
	font-size: 1.5em;
	margin-left: -2em;
	padding-right: 0.5em;
}
.qa01 .qa01_actab label:hover {
	color: #00838f;
	transition: all 0.3s;
}
/* --質問の＋アイコン */
.qa01 .qa01_actab label::after {
	position: absolute;
	top: 0;
	right: 0;
	content: '+';
	font-size: 1.7em;
	font-weight: bold;
	line-height: 2em;
	display: inline-block;
	width: 2em;
	height: 2em;
	transition: transform 0.3s;
}
/* 答え */
.qa01 .qa01_actab .qa01_actab-content {
	position: relative;
	overflow: hidden;
	max-height: 0;
	padding: 0 0 0 2.5em;
	border-radius: 0 0 0.5em 0.5em;
	transition: max-height 0.2s;
}
.qa01 .qa01_actab .qa01_actab-content::before {
	position: absolute;
	content: 'A';
	font-family: serif;
	font-size: 1.5em;
	margin: 0.4em 0 0 -1em;
	padding: 0;
}
.qa01 .qa01_actab .qa01_actab-content p {
	margin: 1em 1em 1em 0;
}
/* 質問を開いた時の仕様 */
/* --答えの高さ */
.qa01 .qa01_actab input:checked ~ .qa01_actab-content {
	max-height: 40em;
	border: 10px solid rgba(27,37,56,0.1);
}
/* 質問をクリックした時のアイコンの動き */
.qa01 .qa01_actab input:checked ~ label {
	color: #00838f;
	border-radius: 0.5em 0.5em 0 0;
}
/* 質問をクリックした時の+の動き */
.qa01 .qa01_actab input[type=checkbox]:checked + label::after {
	transform: rotateZ(45deg);
	transform-origin: 50% 50%;
}


/*記事*/
.post {
	margin: 0 0 20px;
	padding: 20px 80px 5em;
	border-radius: 10px;
	background: #fff;
}
.post .data {
	margin: 0 0 10px;
}
.post .data span {
	padding: 4px 10px 5px 10px;
	border-radius: 10px;
	background: #49b6ba;
	display: inline-block;
	font-weight: 400;
	color: #fff;
	line-height: 1;
}
.post .title {
	margin: 0 0 25px;
	padding: 20px 10px;
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	font-size: 160%;
	font-weight: 800;
	font-family: "A1 Mincho", "A-OTF A1明朝 Std", Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
}
.post .title a {
	color: #333;
	text-decoration: none;
}
.post figure {
	margin: 0 0 1em 0;
}
.post .entry h3 {
	margin: 30px 0 15px;
	font-size: 130%;
	font-weight: 800;
}
.post .entry .link-label {
	border: 1px solid #49b6ba;
	margin: 0 0 10px;
	padding: 10px;
	font-size: 100%;
	font-weight: 500;
	font-family: 'Noto Sans JP', sans-serif;
	text-align: center;
	display: block;
}
.post .entry .link-label i {
	color:#49b6ba;
}
.post .entry .link-content {
	padding: 0 10px;
}
.post .entry .link-content ul {
	display: flex;
	flex-wrap: wrap;
}
.post .entry .link-content ul li {
	width: 24%;
	margin: 0 1% 0 0!important;
	padding: 0;
	list-style-type: none!important;
}
.post .entry .link-content ul li img {
	border: 1px solid #aaa;
}
.post .entry .link-content .attn {
	margin: 0.5em 0 0 0;
	color: #555;
	font-size: 80%;
	text-align: center;
}
@media screen and (max-width:767px) {
	.post {
		margin: 0 0 10px;
		padding: 2em 2em 4em;
	}
	.post .entry .link-content {
		padding: 0 0 0 0;
	}
	.post .entry .link-content ul {
		display: block;
	}
	.post .entry .link-content ul li {
		margin: 0 0 10px 0!important;
		width: 100%;
	}
}
.post .entry ul,
.post .entry ol {
	margin: 0;
}
.post .entry ul li {
	margin: 0 0 0 30px;
	list-style-type: disc;
}
.post .entry ol li {
	margin: 0 0 0 30px;
	list-style-type: decimal;
}
@media only screen and (max-width: 767px) {
	.post .title {
		font-size: 1.2rem;
		line-height: 1.8em;
	}
}


/**/
.box01 {
	margin: 0 0 2em;
}


/* 特定商取引
------------------------------------------------------------*/
.li_sec01 {
	padding: 0 0 50px;
	background: #fff;
}
.li_sec01 .textArea {
	text-align: left;
}
.li_sec01 .textArea ul li {
	margin: 0 0 0.5em 2em;
	padding: 0 0 0 0.4em;
	list-style: disc;
}
.li_sec01 dl{
	width: 100%;
	margin: 0 auto;
	border-top: none;
	border-radius: 8px;
	background: #49b6ba;
}
.li_sec01 dl dt {
	width: 30%;
	padding:1em;
	border-top: 1px solid #fff;
	color: #fff;
	clear: left;
	float: left;
}
.li_sec01 dl dd {
	margin-left: 18%;
	padding:1em;
	border-top: 1px solid #fff;
	background: #f5f5f5;
}
.li_sec01 dl dt:first-child,
.li_sec01 dl dd:first-child {
	border: 0;
}
@media screen and (max-width:767px) {
	.li_sec01 dl,dt,dd {
		margin: 0;
		padding: 0;
	}
	.li_sec01 dl {
		width: 100%;
	}
	.li_sec01 dl dt {
		width: 100%;
		margin: 0 0 1em 0;
		padding: 0.5em 1em;
		background: #4ac7c0;
	}
	.li_sec01 dl dd {
		width: 100%;
		margin: 0;
		padding: 1em;
	}
}

