/* simple-yamaboushi : 複数ページ共通: access+en+lp+syokuji */
/* 旧テーマ onepress（OnePress 2.3.5 を直接改造 / Bootstrap 4 / テンプレート内 style）から、使用中のルールのみを元の順序で移植。Bootstrap: MIT, OnePress: GPLv2+ */
#preview-map span{display: inline-block;}
#preview-map{
	width:100%;
	margin-top: 5%;
	margin-bottom: 5%;
	aspect-ratio:1920 / 1080;
	background-color:gray;
	position:relative;
}
.centered-image {
/*	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(7);
	z-index: 10;
	transition: transform 0.3s ease-in-out;
	right: unset !important;
	bottom: unset !important;*/
}
#root1-img,#root2-img,#root3-img,#root4-img{
	display: none;
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 42%;
	z-index: 10;
	transition: transform 0.3s ease-in-out;
}
#root1-txt,#root2-txt,#root3-txt,#root4-txt{
	font-weight: normal;
	display: none;
    position: absolute;
    top: 82.2%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(255, 255, 255, 1);
    padding: 1%;
    z-index: 11;
    width: 42.1%;
    text-align: center;
    border: solid 1px darkgray;
}
#root1-click img,#root2-click img,#root3-click img,#root4-click img{
	vertical-align:top;
}
#root1 img,#root2 img,#root3 img,#root4 img{
/*image-rendering: -webkit-optimize-contrast;*/
}
#root1:hover,#root2:hover,#root3:hover,#root4:hover{
	/*opacity: 0.8;*/
	cursor: pointer;
}
#root1{
	position:absolute;
	width:6%;
	bottom: 1%;
	right: 41%;
}
#root2{
	position:absolute;
	width:6%;
	bottom: 18%;
	right: 44%;
}
#root3{
	position:absolute;
	width:6%;
	bottom: 22%;
	right: 57%;
}
#root4{
	position:absolute;
	width:6%;
	bottom: 65%;
	right: 62%;
}
.red-bold{
	font-weight:bold;
	color:red!important;
}
@supports (-webkit-touch-callout: none){
.red-bold{
	font-weight:bold;
	color:red!important;
}
}
@media(max-width:750px){
#preview-map{
		width:100%;
		margin-top: 5%;
		margin-bottom: 10%;
		aspect-ratio:1457 / 1665;
		background-color:gray;
		position:relative;
	}
#root1-img,#root2-img,#root3-img,#root4-img{
		display: none;
		position:absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 70%;
		z-index: 10;
		transition: transform 0.3s ease-in-out;
	}
#root1-txt,#root2-txt,#root3-txt,#root4-txt{
		display: none;
		position: absolute;
		top: 74.6%;
		left: 50%;
		transform: translate(-50%, -50%);
		background-color: rgba(255, 255, 255, 1);
		padding: 1%;
		z-index: 11;
		width: 70%;
		text-align: center;
		border: solid 1px darkgray;
	}
#root1{
		position:absolute;
		width:10%;
		bottom: 6%;
		right: 41%;
	}
#root2{
		position:absolute;
		width:10%;
		bottom: 21%;
		right: 48%;
	}
#root3{
		position:absolute;
		width:10%;
		bottom: 25%;
		right: 71%;
	}
#root4{
		position:absolute;
		width:10%;
		bottom: 64%;
		right: 81%;
	}
}
.access-block {
    margin-bottom: 60px;
}
.access-subtitle {
    font-size: 28px;
    font-weight: 500;
    margin-bottom: 50px;
    border-bottom: 1px solid #ccc;
    display: inline-block;
    padding-bottom: 5px;
}
.access-block img {
    max-width: 100%;
    height: auto;
}
@media(max-width:750px){
.access-subtitle {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 50px;
    border-bottom: 1px solid #ccc;
    display: inline-block;
    padding-bottom: 5px;
}
}
