:root {
	--rcs-vis-fig-size: 60%;
	--rcs-visual-height: 400px;
	--rcs-visual-height-sm: 200px;
}
/*
 * common class
 */
.rcs-s1-contents-wrapper {
		margin: 5px 10px 5px;
		max-width: 98vw;
		padding-right: 0px;
		padding-left: 0px;
  	background-color:var(--rcs-bgc-contents);
}

@media screen and (max-width: 480px) {
	.rcs-s1-contents-wrapper {
		margin: 0px 0px;
	}
}
/*
 * rcs-visual component
 */
rcs-visual.sample {
	--img-margin: 70px;
}
rcs-visual.sample::part(catch) {
	/* CATCHの表示(絶対座標) */
	top: 10vh;
	right: 10vw;
	color: purple; 
	text-align: right;
	font-size: var(--rcs-fsv-s3);
	--x-position:absolute;
}

@media screen and (min-width: 481px) and (max-width: 915px) {
	rcs-visual.sample::part(catch) {
		right: 12vw;
		/* 写真とキャッチを左右に分割 */
		/* キャッチの文字位置は top,leftで調整 */
		--x-width: calc(100 - var(--rcs-vis-fig-size, 0%));
		}
}
@media screen and (max-width: 480px) {
	rcs-visual.sample::part(catch) {
		right: 20vw;
		top: 150px; 
		font-size: var(--rcs-fsv-s0);
		--x-line-height: var(--rcs-fsv-s1);
	}
}

rcs-tile.item {	/* コンポーネント本体 */
  --background-color: var(--rcs-bgc-normal);
	--margin: 10px 2px;
	--x-border: 9px dotted gray;
	--font-size: var(--rcs-fsv-s4);
	--color:pink;
}
/*
rcs-tile.item::part(title) {
*/
rcs-tile.item::part(title) {
	margin: 0 0 0 40px;
	--x-background-color: lightblue;
}
rcs-tile::part(toprow) {
	--x-height: 50%;
}
rcs-tile.item::part(figure) {
	margin: 0 0 0 20px;
}
rcs-tile.item::part(contents) {
	margin: 10px 0 0 20px;
}
@media screen and (min-width: 481px) and (max-width: 915px) {
	rcs-tile.item {
		--flex-basis:100%;
		--flex-wrap: nowrap;
		--flex-direction: row;
	}
}
@media screen and (max-width: 480px) {
	rcs-tile.item {
		--flex-basis:80%;
		--flex-wrap: wrap;
		--flex-direction: row;
	}
}
/*
 * rcs-card component
 */
rcs-card.item {	/* コンポーネント本体 */
  --background-color: var(--rcs-bgc-normal);
	--margin: 10px 2px;
	--border: 9px dotted gray;
}
/*
rcs-card.item::part(title) {
*/
rcs-card.item::part(title) {
	margin: 0 0 0 40px;
	--x-background-color: lightblue;
}
rcs-card::part(toprow) {
	--x-height: 50%;
}
rcs-card.item::part(figure) {
	margin: 0 0 0 20px;
}
rcs-card.item::part(contents) {
	margin: 10px 0 0 20px;
}
@media screen and (min-width: 481px) and (max-width: 915px) {
	rcs-card.item {
		--flex-basis:100%;
		--flex-wrap: nowrap;
		--flex-direction: row;
	}
}
@media screen and (max-width: 480px) {
	rcs-card.item {
		--flex-basis:80%;
		--flex-wrap: wrap;
		--flex-direction: row;
	}
}
rcs-card div.rcs-s1-item-cnt {
  background-color: #bbded6;
	color: #ffb8b9;
	flex-basis: 60%;
	margin: 1px 1rem;
}
rcs-card .rcs-s1-item-image  {
	width: 80%;
}
@media screen and (max-width: 480px) {
	rcs-card .rcs-s1-item-image  {
		width:100%;
	}
	rcs-card div.rcs-s1-item-cnt {
		width:100%;
	}
}
.rcs-tile.tile {
    --border: solid 2px  hsl(4deg, 60%, 47%);
    --background-color: aliceblue;
    --color: darkmagenta;
  }
/*
 * rcs-card for Acces map 
 */
rcs-card.access-col1 {
	flex-basis: 50%;
	color: var(--rcs-fc-title);
  background-color:var(--rcs-bgc-normal);
}
.rcs-card.access-col1::part(contents) {
  background-color:var(--rcs-bgc-normal);
	color: var(--rcs-fc-body);
	width: 90%;	
	margin: 1px 1rem;
}
.rcs-card.access-col2::part(figure) {
	width: 90%;	
	margin: 0;
}
rcs-card.access-col2 {
	flex-basis: 50%;
	margin: 0 0.8rem;
	color: var(--rcs-fc-title);
  background-color:var(--rcs-bgc-normal);
}
	rcs-card.access-col2::part(title) ,
	rcs-card.access-col2::part(contents) {
		display: none;
	}
@media screen and (min-width: 481px) and (max-width: 915px) {
}
@media screen and (max-width: 480px) {
	rcs-card.access-col2::part(figure) {
		display:block;
		width: 100%;
	}
}