﻿@charset utf-8;


body	{background-color: #fff;
	background-image: radial-gradient(circle, #f9aadb 1px, transparent 1px);
	background-position: 0 0;
	background-size: 8px 8px;
	}



main	{max-width:1076px;
	width:100%;
	margin-inline:auto;
	font-family:"BIZ UDPGothic", serif!important;
	font-style:normal;
	background-color:#fff;
	}


/* アンカー */
hr 	{visibility:hidden;}


/* 改行指定  */
.cssbr::after	{content:"\A";
		white-space:pre;}



	/* ================================================================

			　	●　ぱんくず　　 z-index:1

	================================================================   */

div.pan	{max-width:1076px;
	color:#222;
	line-height:1.6rem;
	font-size:1.1rem;
	margin:0 auto;
	position:relative;
	}

	.pan ol		{display:flex;
			position:absolute;
			margin-top:0.5rem;
			padding:0.2rem 0.2rem 0 0.2rem;
			background-color:transparent;
			z-index:1;
			}

		.pan ol	li {letter-spacing:0;}

		.pan ol li::after	{content:"＞";
					padding-left:0.5rem;}

		.pan ol	li:first-of-type	{color:#000;}

		.pan ol li:last-child::after	{content:none;}

		.pan ol li a {color:#222;}
		

	/*  -----------------------------------
		     W768px以下非表示   
	--------------------------------------  */

	@media (max-width: 768px) {

		div.pan {display:none;}
}



	/* ================================================================

		●　ＴＯＰ　3種動画　　 z-index：100/9999/10000  

	====================================================================   */


	h1	{color:#fff;
		font-size:2.8rem;
		font-weight:bold;
		text-align:center;
		letter-spacing:2px;
		padding-bottom:1.5rem;
		text-shadow:	0 0 2px #d41256,
				0 0 2px #d41256,
				0 0 2px #d41256,
				0 0 2px #d41256,
				0 0 2px #d41256,
				0 0 3px #d41256,
				0px 0 5px #df4a8d,
				0 0 5px #df4a8d,
				0 0 5px #df4a8d,
				0 0 10px #df4a8d;
		}
		



	article.room-tour-section div.h2_positionbox	{max-width:800px;
							width:100%;
							margin-bottom:1rem;
							margin-inline:auto;
							position:relative;
							}



	article.room-tour-section h2	{width:fit-content;
					font-size:1.8rem;
					font-weight:bold;
					letter-spacing:1px;
					padding:0 2.5rem;
					background-color:#fff;
					border:3px solid #ff3399;
					border-radius:100vh;		
					}




	/*  ------------------------------------------------------
		     タイトル W768px以下  TAB    z-index:no
	------------------------------------------------------  */

	@media (max-width: 768px) {


		h1	{font-size: 3rem;}

		article.room-tour-section div.h2_positionbox	{max-width:650px;
								width:100%;
								padding-left:0.5rem;
								}

		article.room-tour-section h2	{font-size:2.2rem;}

}
	/*  ------------------------------------------------------
		   タイトル  W320px以下  TAB    z-index:no
	------------------------------------------------------  */
	@media (max-width: 320px) {

		h1	{font-size: 2.5rem;
			padding-bottom: 2rem;}
}
	/*  ------------------------------------------------------
		３動画枠   　PC/tab    z-index:100/
	------------------------------------------------------  */


.room-tour-section	{max-width: 1076px;
			margin: 0 auto;
			padding: 3.2rem 0;
			background-color:#fff;
			background-image:url(../imgs/bg/bg_top_main_pink.png);
			background-position:top center;
			background-repeat:no-repeat;
			background-size:contain;
			}

	.video-swiper	{display: flex;
			justify-content: center;
			gap: 3rem;
			padding-bottom: 1.5rem;
			}


			.video-card	{flex: 0 1 100%;
					max-width: 250px;
					cursor: pointer;
					}

			.video-wrapper {position: relative;
					width: 100%;
					aspect-ratio: 9 / 16;
					border-radius: 16px;
					overflow: hidden;
					background: #000;
					border: 5px solid #000;
					box-shadow: 5px 5px 10px 0 #444;
					box-sizing: border-box;
					}

				.video-wrapper img	{width: 100% !important;
							height: 100% !important;
							object-fit: cover;
							}

	span.image_movebutton	{display:block;
				max-width:7rem;
				max-height:7rem;
				width:100%;
				height:100%;
				border:1.6px solid #fff;
				border-radius:100vh;
				background:rgb(255 255 255/0.3);
				position:absolute;
				top:50%;
				left:50%;
				transform:translate(-50%,-50%);
				z-index:100;
				}


			span.image_movebutton::before	{content:"\25B6";
							color:#fff;
							font-size:6rem;
							position: absolute;
							top: 50%;
							left: 30%;
							transform: translate(0, -50%);
							}
							
	/* 動画枠下の小テキスト */
	.video-info h3	{margin: 12px 0 0;
			font-size: 16px;
			text-align: center;
			}

	/* タップ拡大テキスト　*/	
	.tap-hint	{position: absolute;
			bottom: 16px;
			left: 50%;
			transform: translateX(-50%);
			background: rgba(0,0,0,0.6);
			color: #fff;
			padding: 6px 12px;
			border-radius: 20px;
			font-size: 12px;
			white-space: nowrap;
			}



	/* カルーセル関連　*/	
	.carousel-controls	{display: none;
				justify-content: center;
				align-items: center;
				gap: 20px;
				margin-top: 16px;
				}
	
	.carousel-btn	{background: #fff;
			border: 1px solid #ccc;
			border-radius: 50%;
			width: 40px;
			height: 40px;
			font-size: 18px;
			cursor: pointer;
			display: flex;
			align-items: center;
			justify-content: center;
			box-shadow: 0 2px 4px rgba(0,0,0,0.1);
			}

			.carousel-btn:active {background: #f0f0f0;}

	.carousel-indicator	{font-size: 14px;
				color: #333;
				font-weight: bold;
				}


	/*  ------------------------------------------------------
		     ３動画枠  W390px  SP    z-index:no
	------------------------------------------------------  */

	@media (max-width: 390px) {
		.room-tour-section	{padding: 2.5rem 0;}
	
}

	/*  ------------------------------------------------------
		カルーセル　W768px  TAB    z-index:no
	------------------------------------------------------  */

@media (max-width: 768px) {

	.video-swiper	{justify-content: flex-start;
			overflow-x: auto;
			scroll-snap-type: x mandatory;
			scroll-behavior: smooth;
			-ms-overflow-style: none;
			scrollbar-width: none;
			padding-left: calc(50% - 150px);
			padding-right: calc(50% - 150px);
			}
	
		.video-swiper::-webkit-scrollbar {display: none;}


	.video-card	{flex: 0 0 300px;
			scroll-snap-align: center;}

	.carousel-controls {display: flex;}

	.video-swiper	{padding-left: 12.5%;
			padding-right: 12.5%;
			gap: 20px;
			}


	/* -------------------------------------------
	       w768以下時  SP  スマホ画面の大きさ指定
	----------------------------------------------- */
	.video-card	{flex: 0 0 67%;
			max-width: none;
			scroll-snap-align: center;
			}

		.video-info {text-align: center;}


}
	/*  ------------------------------------------------------
		動画モーダル　　 PC/TAB    z-index:999/1000
	------------------------------------------------------  */

.video-modal	{display: none;
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.8);
		align-items: center;
		justify-content: center;
		z-index: 999;
		}


	.modal-content	{position: relative;
			width: 90%;
			max-width: 400px;
			aspect-ratio: 9 / 16;
			}


	/* --- 変更・追記：モーダル内のiframeを縦長にフィットさせる設定 --- */
	.modal-content iframe	{width: 100%;
				height: 100%;
				border-radius: 12px;
				background: #000;
				}


	span.close-btn		{position: absolute;
				top: 20px;
				right: 20px;
				color: #fff;
				font-size: 40px;
				cursor: pointer;
				line-height: 1;
				z-index: 1000;
				}



	iframe+p.modal-caption	{color: #fff;
				text-align: center;
				margin-top: 12px;
				font-size: 16px;
				}



	/*  ------------------------------------------------------
		動画モーダル　W768以下　 TAB    z-index:no
	------------------------------------------------------  */

@media (max-width: 768px) {

	span.close-btn	{top: 16px;
    			right: 16px;
    			background: rgba(0, 0, 0, 0.5);
    			width: 44px;
    			height: 44px;
    			border-radius: 50%;
    			display: flex;
    			align-items: center;
    			justify-content: center;
    			font-size: 32px;
    			border: 3px solid #fff
  			}


	article+div#videoModal .modal-content	{position: relative;
						width: 90%;
						max-width: 400px;
						aspect-ratio: 9 / 16;
						}
}

	/*  ------------------------------------------------------
		動画モーダル　W430以下　 TAB    z-index:no
	------------------------------------------------------  */

	@media (max-width: 430px) {
	
		span.close-btn	{top: 40px;}

}
	/* ================================================================

		●ＡＦＷインフォメーションテキスト　PC　　 z-index：no 

	====================================================================   */


section.afw_info	{max-width:800px;
			width:100%;
			margin:5rem 0 8rem;
			margin-inline:auto;
			position:relative;
			}


	.afw_info h2	{color:#f39;
			font-size:2.4rem;
			font-weight:bold;
			line-height:3.5rem;
			margin-bottom:1.5rem;
			border-bottom:dotted 5px #777;
			}


		.afw_info h2 img	{display:inline;
					margin-right:1rem;}
	.afw_info p	{max-width:90%;
			width:100%;
			font-size:1.8rem;
			line-height:2.7rem;
			margin-inline:auto;
			}

		.afw_info p>strong {color:#f39;}


				
	/*  ------------------------------------------------------
		インフォ　W768以下　 TAB    z-index:no
	------------------------------------------------------  */

@media (max-width: 768px) {

	section.afw_info	{max-width: 90%;}

		.afw_info h2	{font-size: 3rem;}

		.afw_info p	{max-width:100%;
				font-size: 2.2rem;
				line-height: 3rem;
				}


}	
	/*  ------------------------------------------------------
		インフォ    W430以下　 ＳＰ    z-index:no
	----------------------------------------------------------  */
	@media (max-width: 430px) {

	section.afw_info	{margin-bottom: 12rem;}

}
	/* ================================================================

		● AFW 市区名リスト　PC-SP　　 z-index：no 

	====================================================================   */


	section.afw_mainlist	{width:100%;
				padding-bottom: 30rem;
				margin-bottom:8rem;
				background: url(../imgs/bg/bg_middle_whitehome.png) no-repeat;
				background-size: 100%;
				background-position: bottom;
				}

	.container	{width: 100%;
			margin-inline: auto;
			box-sizing: border-box;
			}



	.ward-list	{max-width: 780px;
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			gap: 1.1rem 0.8rem;
			justify-content: center;
			padding: 1rem;
			margin-inline: auto;
			}


	/* アコーディオン制御用のチェックボックス（常時非表示） */
	#menu-toggle {display: none;}



	/*  ------------------------------------------------------
			リスト　W430以上　 PC    z-index:no
	------------------------------------------------------  */
	@media (min-width: 430px) {

	.container {max-width: 800px;}


	/* 23区題名 */
	.list-title	{display: block;
			width:fit-content;
			margin-inline:auto;
			text-align: center;
        		pointer-events: none; /* PCではクリックに反応させない */
			}

		label.list-title h2	{font-size: 2rem;
					font-weight:bold;
					padding:0.5rem 2rem;
					border:3px solid #EE89B5;
					border-radius:100vh;
					}

	.afw_mainlist p	{font-size:1.5rem;
			text-align:center;
			margin-bottom:1.1rem;
			}


		.ward-list	{padding:0;}


			.ward-list li	{color:#111;
					background-color: #FFC0CB;
					border-radius: 4px;
					}

			.ward-list li:hover	{color:#444;
						font-weight:bold;
						text-decoration:underline;
						background-color:#FFE0E6;
						}

	    			.ward-list li a	{display:block;
						width:100%;
						line-height: 5rem;
						padding: 0 2rem;
						}


}
	/*  ------------------------------------------------------
		リスト　W430以下　 ＳＰ    z-index:no
	------------------------------------------------------  */

	@media (max-width: 430px) {

	section.afw_mainlist	{padding-bottom: 18rem;
				background-size: 120%;}

	.container	{max-width: 85%;
			margin: 0 auto;}


	/* 市区名ボタン*/
	.list-title	{display: block;
			width: 100%;
			text-align:center;
			font-size: 2.5rem;
			font-weight:bold;
			padding:1rem 2rem;
			border:3px solid #EE89B5;
			border-radius:5px;
			cursor: pointer;
			box-sizing: border-box;
			}
	

			label.list-title h2	{font-weight:bold;
						position:relative;}

	.list-title h2::after	{content:"\25BC";
				color:#FF3399;
				font-size: 1.5rem;
				position: absolute;
				top:1rem;
				left:97%;
				}


	.afw_mainlist p	{font-size:2rem;
			text-align:right;
			letter-spacing:0;
			margin-bottom:1rem;
			}


	.ward-list	{display:grid; /* 初期は消すならnone */
			grid-template-columns: repeat(3, 1fr);
			gap: 3px;
			padding-top: 15px;
			}

		.ward-list li	{font-size: 2.4rem;
				font-weight: bold;
				border-bottom: 2px solid pink;
				text-align: center;
				border-right: 2px solid pink;
				border-radius: 0;
				}

			.ward-list li a	{display: block;
					line-height:8.5rem;}

	

		.ward-list li:nth-child(even) {background-color:#fff;}
		.ward-list li:nth-child(odd) {background-color:#ffD0D9;}


	/* ボタンタップ  下方向へ展開 */
	#menu-toggle:checked ~ .ward-list	{display: none;/*  元grid */}

}
	/* ================================================================

		● AFW 市区別　カード　PC　　 z-index：no 

	==================================================================== */

	
	/* ----- リスト題 ----- */
	.afw_cardlist hgroup 	{max-width:800px;
				width:100%;
				text-align:center;
				margin-inline:auto;
				}

			hgroup h2	{width: fit-content;
					font-size: 3rem;
					font-weight: bold;
					padding: 0.8rem 7rem;
					margin-inline: auto;
					background-color: #ffdddd;
					border: 3px solid #ff3399;
					border-radius: 100vh;
					}
		

				hgroup p	{color: #67003F;
						font-size: 1.1rem;
						line-height: 1.6rem;
						text-align: center;
						padding-top:1.5rem;
						}


				hgroup p em	{font-size:1.4rem;
						font-weight:normal;
						font-style: normal;
						text-decoration: underline;
						text-decoration-style: dotted;
						text-decoration-color: #67003F;
						text-decoration-thickness: 2px;
						text-underline-offset: 6px;
						}


	/*  ------------------------------------------------------
		リスト収納題 　W430以下　 ＳＰ    z-index:no
	------------------------------------------------------  */

	@media (max-width: 430px) {
	.cssbr::after	{content:"\A";
			white-space:pre;}
}

	@media (max-width: 390px)	{

	.list-title	{font-size: 2.1rem;}
	
	.list-title h2::after	{top: 0.5rem;}

}	
/* -----------------------------------------------------
		住宅個別上半分のレイアウト PC/TAB  z-index:no
	------------------------------------------------------- */


h3.card_blocktitle	{max-width:750px;
			width:100%;
			font-size:2.5rem;
			font-weight:bold;
			line-height:3rem;
			margin-inline:auto;
			margin-top:5rem;
			position:relative;
			}

	h3.card_blocktitle::after	{content:"";
					display:block;
					max-width:100%;
					height:8px;
					border-bottom:8px solid #ff3399;
					border-radius:100vh;
					}


section.afw_cardlist	{display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
			gap: 3rem; /* カード同士の隙間 */
			}


	/* コンテナ（幅700px程度） */
	.card-container {max-width: 700px;
			width: 100%;
			margin: 3rem 0;
			background: #ffffff;
			border-top:#ddd 2px solid;
			border-left:#ddd 2px solid;
			border-radius: 3%;
			box-shadow: 5px 5px 0 rgb(238 137 181 /1);
			padding: 2rem;
			}


	/* 上半分のレイアウト */
	.card-top	{display: flex;
			gap: 1.5rem;
			margin-bottom: 1.5rem;
			}


	/* 写真（左側：4:3比率） */
	.card-image-wrapper	{flex: 1;
				aspect-ratio: 4 / 3;
				overflow: hidden;
				border-radius: 3%;
				background-color:#eee;
				}

		.card-image-wrapper img {width: 100%;
					height: 100%;
					object-fit: cover;
					}


		.card-title-wrapper	{flex: 1;
					display: flex;
					flex-wrap: wrap;
					align-items: center;
					}


		.card-title	{font-size: 2.2rem;
				color: #333;
				line-height: 2.8rem;
				margin: auto;        /*  住宅名中央表示1  */
				text-align: center;  /*  住宅名中央表示2  */
				}


			.room_info_text	{font-size:1.6rem;}


	/* -- 閉じるボタンを非表示  -- */
	.toggle-btn	{display:none;}


	/* -----------------------------------------------------
		住宅個別下半分のレイアウト PC/TAB  z-index:no
	------------------------------------------------------- */

.card-bottom	{display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		padding-top: 2rem;
		border-top: 1px solid #eee;
		}

	/* 詳細テキスト ※交通下　普段記載なし */
	.card-text	{font-size: 1.1rem;
			color: red;
			line-height: 1.6rem;
			max-width: 90%;
			}


	/* --   住宅情報テーブル  --*/
	.card-bottom table	{width: 90%;
				font-size:1.8rem;
				line-height: 3.6rem;
				margin-bottom:1rem;
				}

	.card-bottom table caption {display: none;}

	.card-bottom table tr {border-bottom: 3px solid #ff3399;}

	.card-bottom table th	{color: #d30081;
				width: 32%;
				padding: 0;
				font-weight: bold;
				}

	table td {text-align: right;}

	.card-bottom table tr:nth-of-type(5), 	
	.card-bottom table tr:nth-of-type(6) {border: none;}

	.card-bottom table tr:nth-of-type(6) td {text-align: left;
						line-height: 2.8rem;}




	/* リンクボタン */

	div.link_buttonbox	{max-width: 100%;
				width:100%;
				margin:1rem 0;
				display:flex;
				align-items:center;
				justify-content:center;
				gap:1rem;
				}


	.card-btn 	{display: inline-block;
			max-width:40%;
			width:100%;
			color:#333;
			padding: 0.8rem 3rem;
			font-weight: bold;
			text-align: center;
			text-decoration: none;
			line-height: 3.5rem;
			border: 3px solid #fff;
			border-radius: 100vh;
			background-color:#fdd000;
			box-shadow: 2px 3px 0 #ff3399;
			box-sizing: border-box;
			}



	.card-btn:nth-of-type(2)	{color: #fff;
					background-color: #e20090;}
 
   
	.card-btn:hover {opacity:0.8;}



	/* -----------------------------------------------------
		 個住宅個別レイアウト W430以下 SP z-index:no
	------------------------------------------------------- */

@media (max-width: 430px) {

	hgroup h2 {font-size: 3.5rem;}

		hgroup p em 	{font-size: 2rem;
				line-height: 3.6rem;
				letter-spacing: 0;
				}


		.cssbr_w430::after	{content:"\A";
 					white-space:pre;}


	h3.card_blocktitle	{max-width: 100%;
				width: 90%;
				font-size: 4rem;
				line-height: 4.5rem;
				}


	.card-container {max-width: 100%;
			width: 90%;
			margin: 3rem auto;
			}

	.card-title	{padding-left: 1rem;
			font-size: 2.8rem;
			line-height: 3.5rem;
			text-align: left;
			margin:0;
			}



	/* SP 開閉ボタン */
	.toggle-btn	{font-size: 2rem;
			width: 100%;
			line-height: 3.5rem;
			cursor: pointer;
			border: none;
			border-radius: 4px;
			background: #FDD000;
				}


	.card-title-wrapper	{flex: revert;
				max-width: 55%;
				align-items: flex-end;
				}



	/* ------ 下半分のレイアウト　 W430 SP z-index:no --------- */

	/* テーブルの体裁 */
	.card-bottom table	{width: 100%;
				font-size:2rem;
				line-height: 3rem;
				}

	.card-bottom table th,
	.card-bottom table td	{width: 100%;
				display:block;
				font-size: 2.1rem;
	       			text-align: center;
				line-height: 3.5rem;
				}

		.card-bottom table th	{line-height: 4rem;}

		.card-bottom table tr:nth-of-type(6) td {text-align: left;
    							line-height: 3rem;
							}


	div.link_buttonbox	{display:block;
				margin: 2rem 0 0;}
	

		.card-btn	{width:100%;
				font-size: 2.2rem;
				padding: 2.5rem 0;
        			margin: 0;
				white-space: nowrap;
				border: none;
       				border-radius: 5px;
				box-shadow: none;
				}

	/* --- ----------------------------------
	        ボタンテキストの切り替え 
	------------------------------------- */

	/* 通常時（閉じているとき） */
		.card-container .toggle-btn::after {content: "開く";}

	/* ボタンの展開時（.is-open がついたとき） */
		.card-container.is-open .toggle-btn	{color:#fff;
							background-color: #666;}
	/* 展開時（.is-open がついたとき） */
		.card-container.is-open .toggle-btn::after {content: "閉じる";}

}


@media (max-width: 390px) {
	.card-title {padding-left: 0;
			line-height:2.8rem;
			font-size: 2.2rem;}

}
	/* ------詳細ボタンレイアウト W369以下 SP z-index:no --------- */

	@media (max-width: 369px) {

	    .card-btn	{font-size: 2.1rem;
			white-space: nowrap;
			padding: 3.2rem 1.5rem;}
	

}
	/* ==========================================

         	図面モーダル　PC/TAB  zindex:1000/

  	 ========================================== */


	.modal-focus-start	{outline: none;
  				position: absolute;
				}



	body.is-modal-active	{position: fixed !important;
				left: 0 !important;
				width: 100% !important;
				overflow: hidden !important;
				}

	.modal-overlay	{position: fixed;
    			top: 0;
    			left: 0;
    			width: 100vw;
			height: 100vh;
			display: flex;
			justify-content: center;
			align-items: center;
			opacity: 0;
			pointer-events: none;
			transition: opacity 0.3s;
			z-index: 1000;
			}


	/* :target の代わりに .is-open で表示させる */
	.modal-overlay.is-open	{opacity: 1;
				pointer-events: auto;
				}


	.modal-close-bg {position: absolute;
    			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: rgba(0, 0, 0, 0.5);
			cursor: default;
			}


.modal-content02	{position: relative;
			max-width: 700px;
			width:100%;
			height: fit-content;
			aspect-ratio: 1 / 1;
			background:#fff;
			border-radius: 12px;
			padding: 15px;
			margin:0.5rem;
			box-shadow: 0 10px 30px rgba(0,0,0,0.7);
			display: flex;
			flex-direction: column;
			gap: 0;
			border: 5px solid pink;
			z-index: 1001;
			}


div.modal-content02 .modal-close-btn	 {position: absolute;
					color: #fff;
					top: -10px;
					right: -10px;
					width: 55px;
					height: 55px;
					font-size: 3rem;
					text-align: center;
					line-height: 5rem;
					background: #ff3399;
					border: #fff 2px solid;
					border-radius: 50%;
					}


	div.modal-content .modal-image-wrapper	{flex: 1;
						width: 100%;
						overflow: hidden;
						border: 5px solid pink;
						border-radius: 2%;
						}

		div.modal-content02 .modal-image-wrapper img	{width: 100%;
								height: 100%;
								object-fit: cover;
								}



	/* ★Tabキーでフォーカスが当たったときのスタイル */
	.modal-close-btn:focus-visible {outline: 3px solid #FF00FF;
					outline-offset: 3px;
					}



	/*  --------------------------------------------------------------
		スマートフォン用スタイル　W430以下　 SP   z-index:no
	-------------------------------------------------------------------  */

@media (max-width: 430px) {


	/* -- 閉じるボタンを表示  -- */
	.toggle-btn	{display:block;}


	.card-top	{cursor: pointer;
			margin-bottom: 0;}

	/* 初期状態：下半分を隠す */
	.card-bottom	{max-height: 0;
			overflow: hidden;
			padding-top: 0;
			border-top: none;
			transition: max-height 0.3s ease-out, padding 0.3s ease-out;
			}

	/* JavaScriptで「.is-open」クラスが付与されたカードだけを展開する */
	.card-container.is-open .card-bottom	{max-height: 650px;
						padding-top: 20px;
						border-top: 1px solid #eee;
						}



	div.card-container	{max-width: 100%;
				width: 90%;
				margin: 3rem auto;
				}


	.modal-content02	{padding: 5px;
				position: relative;
				width: 100%;
				max-width: 94%;
				aspect-ratio: 1 / 1;
				}



div.modal-content02 .modal-close-btn	{position: absolute;
					color: #fff;
					top: -10px;
					right: -10px;
					width: 45px;
					height: 45px;
					font-size: 25px;
					background: #ff3399;
					border: #fff 2px solid;
					border-radius: 50%;
					overflow: hidden;
					appearance: none;
					-webkit-appearance: none;/* iOS Safari用の解除設定 */
					padding: 0;
					display: inline-flex;
					align-items: center;
					justify-content: center;
					}
} 
	/* ================================================================

			 その他リンク集　PC/TAB　　 z-index：no

	====================================================================   */


article.other_link 	{max-width:1076px;
			width:100%;
			padding-bottom:6rem;
			margin-inline:auto;
			background-color:#fff;
			position:relative;
			}


	.other_link h2 {text-align:center;
			font-size:2.5rem;
			font-weight:bold;
			margin-bottom:2rem;
			}
	

	.other_link ul {max-width:700px;
			width:100%;
			text-align: center;
			margin-inline:auto;
			}

		.other_link ul li	{display:inline-block;
					max-width: 45%;
					width:100%;
					margin:0.2rem;
					}

		.other_link ul li img	{display:block;
					width:100%;
					height: auto;
					}


	.other_link figure figcaption {display:none;}


	/*  -------------------------------------------------
		　その他リンク集 w500 SP  z-index:no
	----------------------------------------------------  */

	@media (max-width: 500px) {

		.other_link ul li	{display: block;
					max-width: 70%;
					width: 100%;
					margin:0.5rem auto;
					}
}
	/*  -------------------------------------------------
		　 　　　上に戻るボタン z-index:995/
	-------------------------------------------------  */

.scroll-top-btn .cssbr_btn::after	{content:"\A";
					 white-space:pre;}

/* ボタンの基本スタイル  */
.scroll-top-btn {color: #fff;
		position: fixed;
		right: 40px;
		bottom: 20px;
		padding: 15px 20px;
		max-width: fit-content;
		height: auto;
		border: none;
		border-radius: 100vh;
		font-size: 1.5rem;
		font-weight: bold;
		text-align: center;
		line-height: 1.8rem;
		text-shadow:	0 0 2px #B7386C,
				0 0 2px #B7386C,
				0 0 2px #B7386C,
				0 0 3px #B7386C,
				0 0 2px #BF2E67,
				0 0 2px #BF2E67,
				0 0 2px #BF2E67,
				0 0 3px #BF2E67;
		background-color: pink;
		background-image: linear-gradient(360deg, #ff3399, #EE89B9);
		cursor: pointer;
		box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.3s, visibility 0.3s, background-color 0.2s;
		z-index: 995;
		}


	/* ボタンを表示 */
	.scroll-top-btn.is-show {opacity: 1;
  				visibility: visible;
				}

	.scroll-top-btn:hover {opacity: 0.8;}

	/*  ----------------------------------------------------
			上に戻る　w768　非表示 
	-------------------------------------------------------*/

	@media (max-width:768px){

		.scroll-top-btn {display:none;}

	}













