@charset "utf-8";

/* =======================================================================================
	COMMON
======================================================================================= */
/* ------------------------------------------------------------------------
 commonPhWrap
------------------------------------------------------------------------ */
	.commonPhWrap .ttl {
		margin:0.7em 0.5em 0;
		--M-fluidFontSize-max-fontsize: 15;
		--M-fluidFontSize-min-fontsize: 13;
		--M-fluidFontSize-max-viewport: 1600;
		--M-fluidFontSize-min-viewport: 1200;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */

		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
		font-family: var(--site-font_family-serif);
		line-height: 1.4;
	}
	.commonPhWrap .ttl .distance {
		display: inline-block;
		font-size: 11px;
		font-family: var(--site-font_family-sans);
		letter-spacing: 0.02em;	
	}
	
@media print, screen and (min-width: 1050.02px) { /*{overTBl}*/
	.commonPhWrap {
		display: flex;
		flex-wrap: wrap;
	}
	.commonPhWrap li {
		width: calc(33.33% - 2px);
		margin-right:2px;
	}
	.commonPhWrap > li:nth-child(n+4)  {
		margin-top:clamp(50px, (50 / 1200 * 100vw), 60px);
	}
}
@media print, screen and (min-width: 1050.02px) { /*{overTBl}*/
	.commonSW .swiper-pagination,
	.commonSW .swiper-button-prev,
	.commonSW .swiper-button-next {
		display: none;
	}
}


/*3枚だけの場合*/
@media print, screen and (min-width: 736.02px) { /*{overTB}*/
	.photo_little .commonPhWrap li {
		width: calc(33.33% - 2px);
		margin-right:2px;
	}
	.photo_little .commonPhWrap > li:nth-child(n+4)  {
		margin-top:clamp(50px, (50 / 1200 * 100vw), 60px);
	}
	.photo_little .commonSW .swiper-pagination,
	.photo_little .commonSW .swiper-button-prev,
	.photo_little .commonSW .swiper-button-next {
		display: none;
	}
}

/*2枚だけの場合*/
	.photo_less.contbox {
		max-width:666px!important;
	}
	.photo_less .commonPhWrap li {
		width: calc(50% - 2px);
		margin-right:2px;
	}

@media print, screen and (min-width: 480.02px) {
	.photo_less .commonSW .swiper-pagination,
	.photo_less .commonSW .swiper-button-prev,
	.photo_less .commonSW .swiper-button-next {
		display: none;
	}
}

/*swiper-pagination*/
	.soshigayaPhotoWrap,
	.otherParkWrap,
	.parentingWrap {
		position: relative;
	}	

/* 矢印カスタマイズ */
	.commonSW .swiper-button-prev,
	.commonSW .swiper-button-next {
		width: 22px;
		height:22px;
		border-radius: 50%;
		/*background: rgba(var(--site-variationColor-gold_1), 1);*/
		border:1px solid #988656;
		z-index:1;
		transition: all 0.2s ease;
	}
	.commonSW .swiper-button-prev {left: -30px;}
	.commonSW .swiper-button-next {right:-30px;}

	.commonSW .swiper-button-prev::after,
	.commonSW .swiper-button-next::after {
		position: absolute;
		content: "";
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		margin: auto;
		text-align: center;		
		width: 9px;
		background: url("../images/share/ico_arr_gold.svg") 50% 50% no-repeat;
		background-size: 100% auto;
	}
	.commonSW .swiper-button-prev::after {right:8%; transform: rotate(-180deg); }
	.commonSW .swiper-button-next::after {left:8%;}
	
	.commonSW .swiper-slide img {
	  height: auto;
	  width: 100%;
	}
	/*hover*/
	.commonSW .swiper-button-prev:hover,
	.commonSW .swiper-button-next:hover {
		opacity: 0.8;
	}

/* ドットカスタマイズ */
	.commonSW .swiper-pagination-bullets.swiper-pagination-horizontal {
		bottom:-30px;
	}
	
	.commonSW .swiper-pagination-bullet-active {
		background: rgba(var(--site-variationColor-gold_1), 1);
	}





/* =======================================================================================
	PAGE 
======================================================================================= */

/* ------------------------------------------------------------------------
pt-location_01
------------------------------------------------------------------------ */
	.pt-location_01 {
		border-bottom:1px solid rgba(var(--site-lineColor-basic), 1);
	}


/* ------------------------------------------------------------------------
introSection
------------------------------------------------------------------------ */
/* positionWrap
-------------------------------------------------------------*/
	.introSection .positionWrap {
		padding: clamp(60px, (60 / 1200 * 100vw), 100px);
		border:1px solid rgba(var(--site-lineColor-basic), 1);
	}


@media screen and (max-width: 736px) { /*{SP}*/
	.introSection .positionWrap {
		width: 92%;
		padding: clamp(30px, (30 / 480 * 100vw), 60px);
	}


}





/* ------------------------------------------------------------------------
satagayaLifeSection
------------------------------------------------------------------------ */
/* headingTxtWrap
-------------------------------------------------------------*/
	.satagayaLifeSection .headingTxtWrap {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.satagayaLifeSection .headingTxtWrap .headingBox {
		white-space: nowrap;
	}
	.satagayaLifeSection .headingTxtWrap .leadTxtBox {
		padding-left:4em;
	}
	
@media screen and (max-width: 1050px) { /*{belowTBs}*/
	.satagayaLifeSection .headingTxtWrap {
		flex-wrap: wrap;
	}
	.satagayaLifeSection .headingTxtWrap > * {
		width: 100%;
	}
	.satagayaLifeSection .headingTxtWrap .leadTxtBox {
		padding-left:0;
		max-width:600px;
		margin-top:2em;
	}
}


/* rankingWrap
-------------------------------------------------------------*/
	.satagayaLifeSection .rankingWrap {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		max-width:1600px;
	}
	.satagayaLifeSection .rankingWrap .rankingBox {
		width: calc(25% - 1px);
		position: relative;
		background: #000;
	}
	.satagayaLifeSection .rankingWrap .rankingBox .txtUnit {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		text-align: center;
		width: 95%;
		color:#eee;
		z-index: 2;
	}
	
	.satagayaLifeSection .rankingWrap .rankingBox .txtUnit .ttl {
		--M-fluidFontSize-max-fontsize: 20;
		--M-fluidFontSize-min-fontsize: 18;
		--M-fluidFontSize-max-viewport: 1600;
		--M-fluidFontSize-min-viewport: 1200;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */
		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
		line-height: 1;
	}
	.satagayaLifeSection .rankingWrap .rankingBox .txtUnit .ttl .rank {
		--M-fluidFontSize-max-fontsize: 24;
		--M-fluidFontSize-min-fontsize: 20;
		--M-fluidFontSize-max-viewport: 1600;
		--M-fluidFontSize-min-viewport: 1200;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */
		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
	}
	.satagayaLifeSection .rankingWrap .rankingBox .txtUnit .ttl .rank em {
		font-size:2em;
		font-family: var(--site-font_family-en_2);
	}
	
	.satagayaLifeSection .rankingWrap .rankingBox .txtUnit .expansion {
	  display: inline-block;
	  margin-top:1.5em;
	}
	.satagayaLifeSection .rankingWrap .rankingBox .txtUnit .expansion .icon {
	  display: inline-block;
	  width: 30px;
	  margin-left:10px;
	}
	.satagayaLifeSection .rankingWrap .rankingBox .txtUnit .expansion .txt {
	 	margin-left:0.3em;
		margin-right:10px;
	}
	.satagayaLifeSection .rankingWrap .rankingBox .txtUnit .expansion::after {
		content: "";
		display: block;
		margin-left: auto;
		margin-right: auto;
		margin-top: 0.5em;
		width: 100%;
		height: 1px;
		background: rgba(255,255,255,.8);
	}
	.satagayaLifeSection .rankingWrap .rankingBox .picUnit::after {
		position: absolute;
		display: block;
		content:"";
		top:0;
		left:0;
		width: 100%;
		height:100%;
		background: #000;
		opacity: .3;
		z-index: 1;
		transition: opacity 0.3s ease-in-out 0s;
	}
	.satagayaLifeSection .rankingWrap .rankingBox:hover .picUnit::after {
		opacity: 0;
	}
	
@media screen and (max-width: 1200px) { /*{belowTB}*/	
	.satagayaLifeSection .rankingWrap {
		max-width:700px;
	}
	.satagayaLifeSection .rankingWrap .rankingBox {
		width: calc(50% - 1px);
		margin-bottom:2px;
		position: relative;
		background: #000;
	}
}	
	
@media screen and (max-width: 736px) { /*{SP}*/
	.satagayaLifeSection .rankingWrap .rankingBox {
		width: 100%;
	}
}	
	

/* graphWrap
-------------------------------------------------------------*/
	.satagayaLifeSection .graphWrap {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		padding: var(--contentsUsePadding);
		background: #fff;
	}

	.satagayaLifeSection .graphWrap .graphBox.tokyo23Area {width: 65%;}
	.satagayaLifeSection .graphWrap .graphBox.setagayaArea {width: 30%;}
	
	
	
	

@media screen and (max-width: 1050px) { /*{belowTBs}*/
	.satagayaLifeSection .graphWrap .graphBox p {
		text-align: center;
	}
	.satagayaLifeSection .graphWrap .graphBox.tokyo23Area {width: 100%;}
	.satagayaLifeSection .graphWrap .graphBox.setagayaArea {width: 100%;margin-top:3em;}
}

@media screen and (max-width: 736px) { /*{SP}*/
	.satagayaLifeSection .graphWrap {
		width: 92%;
	}
	.satagayaLifeSection .graphWrap .graphBox.setagayaArea {
		width: 80%;
		margin-left:auto;
		margin-right:auto;
	}

}


/* modalWrap モーダルレイアウト
-------------------------------------------------------------*/
	.modalWrap {
		width: 88%;
		margin:0 auto;
		padding:clamp(30px, (30 / 1200 * 100vw), 40px) 0;
	}
	.modalWrap .txtBox {
		font-family: var(--site-font_family-serif);
	}
	.modalWrap .txtBox .ttl {
		text-align: center;
		--M-fluidFontSize-max-fontsize: 28;
		--M-fluidFontSize-min-fontsize: 24;
		--M-fluidFontSize-max-viewport: 1600;
		--M-fluidFontSize-min-viewport: 1200;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */
		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
		line-height: 1.8;
		color: rgba(var(--site-variationColor-gold_1), 1); 
	}
	.modalWrap .txtBox .ttl .rank em {
		font-size:1.6em;
		font-family: var(--site-font_family-en_2);
	}
	.modalWrap .txtBox .txt {
		margin-left:auto;
		margin-right:auto;
		max-width:800px;
		--M-fluidFontSize-max-fontsize: 16;
		--M-fluidFontSize-min-fontsize: 14;
		--M-fluidFontSize-max-viewport: 1600;
		--M-fluidFontSize-min-viewport: 1200;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */
		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
		line-height: 1.8;
	}
	.modalWrap .txtBox .txt > span {
		display: block;
		margin-inline: auto;
		max-inline-size: max-content;
	}
	.modalWrap .picBox {
		text-align: center;
		margin-top:30px;
	}

@media screen and (max-width: 736px) { /*{SP}*/
	.modalWrap {
		width: 96%;
	}
}

/*個別*/
	.rank01.modalWrap .picBox {
		max-width:600px;
		margin-left:auto;
		margin-right:auto;
	}



/* ------------------------------------------------------------------------
natureSection
------------------------------------------------------------------------ */
/* soshigayaParkWrap
-------------------------------------------------------------*/
	.natureSection .soshigayaParkWrap {
		padding: clamp(60px, (60 / 1200 * 100vw), 100px);
		background: #f1f1f1;
		border:1px solid rgba(var(--site-lineColor-basic), 1);
	}

/* introBox------------------*/
	.natureSection .soshigayaParkWrap .introBox {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
	}
	.natureSection .soshigayaParkWrap .introBox > * {
		width: 47.61%;
	}
	.natureSection .soshigayaParkWrap .introBox .txtUnit .ttl {
		padding-bottom:0.5em;
		margin-bottom:0.8em;
		border:0 solid rgba(var(--site-lineColor-basic), 1);
		border-width:0 0 1px;
	}
	.natureSection .soshigayaParkWrap .introBox .txtUnit .ttl .name {
		font-size:1.3em;
	}
	
@media screen and (max-width: 1050px) { /*{belowTBs}*/
	.natureSection .soshigayaParkWrap .introBox {
		flex-direction: column-reverse;
	}
	.natureSection .soshigayaParkWrap .introBox > * {
		width: 100%;
	}
	.natureSection .soshigayaParkWrap .introBox .txtUnit {
		margin-top:2em;
	}
}	
	
@media screen and (max-width: 736px) { /*{SP}*/
	.natureSection .soshigayaParkWrap {
		width: 92%;
		padding: clamp(30px, (30 / 480 * 100vw), 60px);
  	}
}
	
/* shoshigayaMapWrap
-------------------------------------------------------------*/
	.natureSection .shoshigayaMapWrap .js_swipeMe_active .js_swipeMeInnerBoxOverlay,
	.natureSection .shoshigayaMapWrap  .js_swipeMe_active .js_swipeMeSwipeItem {width: 200%;}
@media screen and (max-width: 480px) { /*{SPs}*/
	.natureSection .shoshigayaMapWrap  .js_swipeMe_active .js_swipeMeInnerBoxOverlay,
	.natureSection .shoshigayaMapWrap  .js_swipeMe_active .js_swipeMeSwipeItem {width: 300%;}
}
	
	


/* ------------------------------------------------------------------------
shoppingSection
------------------------------------------------------------------------ */
	.shoppingSection {
		background: #efefef;
	}
	
/* mainPicWrap
-------------------------------------------------------------*/

@media screen and (max-width: 736px) { /*{SP}*/
	.shoppingSection .mainPicWrap img {
		width: 100%;
		object-fit: cover;
		aspect-ratio: 600 / 250;
	}
}
/* introWrap
-------------------------------------------------------------*/
	.shoppingSection .introWrap {
		margin-left:0;
		margin-right:auto;
		padding-bottom:2em;
		max-width:800px;
		display: flex;
		/*flex-wrap: wrap;*/
		justify-content: space-between;
		border-bottom:1px solid rgba(var(--site-lineColor-basic), 1);
	}
	
	.shoppingSection .introWrap .ttlBox {
		white-space: nowrap;
	}
	.shoppingSection .introWrap .ttlBox > * {
		display: block;
		line-height: 1;
	}
	.shoppingSection .introWrap .ttlBox .name {
		font-size:1.4em;
		margin-bottom:0.5em;

	}
	
	.shoppingSection .introWrap .txtBox {
		margin-left:clamp(40px, (40 / 1200 * 100vw), 60px);
	}


@media screen and (max-width: 736px) { /*{SP}*/
	.shoppingSection .introWrap {
		flex-wrap: wrap;
	}
	.shoppingSection .introWrap > *{
		width: 100%;
	}
	.shoppingSection .introWrap .txtBox {
		margin-left:0;
		margin-top:1.5em;
	}
}

/* areaMapWrap
-------------------------------------------------------------*/
	.shoppingSection .areaMapWrap {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.shoppingSection .areaMapWrap > * {
		width: 47.61%;
	}


	/*picBox*/
	.shoppingSection .areaMapWrap .picBox{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-content: flex-start;
	}
	.shoppingSection .areaMapWrap .picBox p {
		position: relative;
		width: 48.33%;
		margin-bottom:clamp(18px, (18 / 1200 * 100vw), 20px);
	}
	
@media screen and (max-width: 736px) { /*{SP}*/
	.shoppingSection .areaMapWrap {
		flex-direction: column-reverse;
	}
	.shoppingSection .areaMapWrap > * {
		width: 100%;
	}
	.shoppingSection .areaMapWrap .picBox{
		margin-top:30px;
	}
	.shoppingSection .areaMapWrap .picBox p {
		position: relative;
		width: 48.33%;
		margin-bottom:clamp(10px, (10 / 480 * 100vw), 48px);
	}
}
@media screen and (max-width: 480px) { /*{SPs}*/
	.shoppingSection .areaMapWrap .mapBox .mapBoxInner {
		display: block;
		padding:0 8px;
		margin-left:	calc(-50vw + 50%);
		margin-right:	calc(-50vw + 50%);
	}
}





/* ------------------------------------------------------------------------
pt- pt-access_01
------------------------------------------------------------------------ */
	.pt-access_01 {
		margin-top:var(--site-marpad-L);
	}

@media screen and (max-width: 736px) { /*{SP}*/
	.pt-access_01 {
		margin-top:0;
	}
}

/* routePhWrap
-----------------------------------------*/
	.trainRouteSection .routePhWrap {
		display: grid;
		grid-template-columns: repeat(2, 2fr);
		gap: 1px;
	}
	
/*routePhBox*/
	.trainRouteSection .routePhWrap .routePhBox {
		position: relative;
	}
	.trainRouteSection .routePhWrap .routePhBox .txtBox {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		text-align: center;
	}
	.trainRouteSection .routePhWrap .picBox {
		position: relative;
	}

	.routePhWrap .txtBox .nameElement {
		text-align: center;
		--M-fluidFontSize-max-fontsize: 30;
		--M-fluidFontSize-min-fontsize: 28;
		--M-fluidFontSize-max-viewport: 1600;
		--M-fluidFontSize-min-viewport: 1200;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */
		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
		font-family: var(--site-font_family-en_1);
		color: rgba(255,255,255,1);
		letter-spacing: 0.1em;
		line-height: 1;
	}
	.routePhWrap .txtBox .timeElement {
		margin-top:1em;
		text-align: center;
		font-family: var(--site-font_family-en_2);
		color: rgba(255,255,255,1);
		letter-spacing: 0;
	}
	.routePhWrap .txtBox .timeElement .minNum {
		margin-right: .05em;
		--M-fluidFontSize-max-fontsize: 60;
		--M-fluidFontSize-min-fontsize: 46;
		--M-fluidFontSize-max-viewport: 1600;
		--M-fluidFontSize-min-viewport: 1200;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */
		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
		line-height: 1;
	}
	.routePhWrap .txtBox .timeElement .min {
		margin-right: .1em;
		--M-fluidFontSize-max-fontsize: 24;
		--M-fluidFontSize-min-fontsize: 22;
		--M-fluidFontSize-max-viewport: 1600;
		--M-fluidFontSize-min-viewport: 1200;
		min-height: 0.001vw; /* for safari | font-sizeにclamp()使用時必須 */
		font-size: clamp(
			calc(var(--M-fluidFontSize-min-fontsize) * .1rem),
			calc(calc(var(--M-fluidFontSize-min-fontsize) * .1rem) + (1vw - calc(var(--M-fluidFontSize-min-viewport) / 100 * .1rem)) * (100 * (var(--M-fluidFontSize-max-fontsize) - var(--M-fluidFontSize-min-fontsize)) / (var(--M-fluidFontSize-max-viewport) - var(--M-fluidFontSize-min-viewport)))),
			calc(var(--M-fluidFontSize-max-fontsize) * .1rem)
		);
	}
	
@media screen and (max-width: 1200px) { /*{belowTB}*/
	.routePhWrap .txtBox .nameElement {
		--M-fluidFontSize-max-fontsize: 28;
		--M-fluidFontSize-min-fontsize: 22;
		--M-fluidFontSize-max-viewport: 1200;
		--M-fluidFontSize-min-viewport: 736;
	}
	.routePhWrap .txtBox .timeElement .minNum {
		--M-fluidFontSize-max-fontsize: 46;
		--M-fluidFontSize-min-fontsize: 36;
		--M-fluidFontSize-max-viewport: 1200;
		--M-fluidFontSize-min-viewport: 736;
	}
	.routePhWrap .txtBox .timeElement .min {
		margin-right: .1em;
		--M-fluidFontSize-max-fontsize: 22;
		--M-fluidFontSize-min-fontsize: 18;
		--M-fluidFontSize-max-viewport: 1200;
		--M-fluidFontSize-min-viewport: 736;
	}
}
	
@media screen and (max-width: 736px) { /*{SP}*/
	.routePhWrap .txtBox .nameElement {
		--M-fluidFontSize-max-fontsize: 28;
		--M-fluidFontSize-min-fontsize: 18;
		--M-fluidFontSize-max-viewport: 736;
		--M-fluidFontSize-min-viewport: 480;
	}
	.routePhWrap .txtBox .timeElement .minNum {
		--M-fluidFontSize-max-fontsize: 46;
		--M-fluidFontSize-min-fontsize: 32;
		--M-fluidFontSize-max-viewport: 736;
		--M-fluidFontSize-min-viewport: 480;
	}
	.routePhWrap .txtBox .timeElement .min {
		margin-right: .1em;
		--M-fluidFontSize-max-fontsize: 22;
		--M-fluidFontSize-min-fontsize: 16;
		--M-fluidFontSize-max-viewport: 736;
		--M-fluidFontSize-min-viewport: 480;
	}
}
@media screen and (max-width: 480px) { /*{SPs}*/
	.trainRouteSection .routePhWrap {
		grid-template-columns: repeat(1, 1fr);
	}
	
	.routePhWrap .txtBox .nameElement {
		--M-fluidFontSize-max-fontsize: 28;
		--M-fluidFontSize-min-fontsize: 20;
		--M-fluidFontSize-max-viewport: 480;
		--M-fluidFontSize-min-viewport: 320;
	}
	.routePhWrap .txtBox .timeElement .minNum {
		--M-fluidFontSize-max-fontsize: 46;
		--M-fluidFontSize-min-fontsize: 40;
		--M-fluidFontSize-max-viewport: 480;
		--M-fluidFontSize-min-viewport: 320;
	}
	.routePhWrap .txtBox .timeElement .min {
		margin-right: .1em;
		--M-fluidFontSize-max-fontsize: 22;
		--M-fluidFontSize-min-fontsize: 18;
		--M-fluidFontSize-max-viewport: 480;
		--M-fluidFontSize-min-viewport: 320;
	}
	
	
	
}


/* ------------------------------------------------------------------------
xxxxxxxxxxx
------------------------------------------------------------------------ */
/* xxxxxxxxxxxxxxxxxx
-------------------------------------------------------------*/