/*==============================

2021.3.1 事業紹介 改修

===============================*/

/*
* 広域地図のスタイル
_____________*/
.wide-map {
	width: 100%;
}
.wide-map img {
	max-width: 100%;
	width: 100%;
	height: auto;
}

/*
* クリッカブルマップ
_____________*/
.clickable-map__wrapper {
	position: relative;
	margin-bottom: 50px;
}

.clickable-map {
	width: 100%;
}

.clickable-map img {
	max-width: 100%;
	width: 100%;
}

area {
	outline: none;
}

/*
* マップの吹き出し付き画像
_____________*/

/*========== 画像を入れる枠 ==========*/
.map-item{
	background:#FFFFFF;
	border:2px solid #000000;
	color:#FFFFFF;
	font-size:15px;
	position:relative;
	padding:10px;
	text-align:left;
}

.map-item__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.map-item__inner a + a {
	margin-top: 10px;
}

.map-item__txt {
	color: #000;
	font-size: 14px;
}

/*========== 吹き出しの三角の部分 ==========*/

/* 上向き */
.map-item--top::after
,.map-item--top::before{
	border: solid transparent;
	content:'';
	height:0;
	width:0;
	pointer-events:none;
	position:absolute;
	bottom:100%;
	left:50%;
}
.map-item--top::after{
	border-color: rgba(255, 255, 255, 0);
	border-width: 10px;
	margin-left: -10px;
	border-bottom-color:#FFFFFF;
}
.map-item--top::before{
	border-color: rgba(0, 0, 0, 0);
	border-width: 12px;
	margin-left: -12px;
	margin-bottom: 2px;
	border-bottom-color:#000000;
}

/* 下向き */
.map-item--bottom::after
,.map-item--bottom::before{
	border: solid transparent;
	content:'';
	height:0;
	width:0;
	pointer-events:none;
	position:absolute;
	top:100%;
	left:50%;
}
.map-item--bottom::after{
	border-color: rgba(255, 255, 255, 0);
	border-width: 10px;
	margin-left: -10px;
	border-top-color:#FFFFFF;
}
.map-item--bottom::before{
	border-color: rgba(0, 0, 0, 0);
	border-width: 12px;
	margin-left: -12px;
	margin-top: 2px;
	border-top-color:#000000;
}

/* 左向き */
.map-item--left::after
,.map-item--left::before{
	border: solid transparent;
	content:'';
	height:0;
	width:0;
	pointer-events:none;
	position:absolute;
	right:100%;
	top:50%;
}
.map-item--left::after{
	border-color: rgba(255, 255, 255, 0);
	border-width: 10px;
	margin-top: -10px;
	border-right-color:#FFFFFF;
}
.map-item--left::before{
	border-color: rgba(0, 0, 0, 0);
	border-width: 12px;
	margin-top: -12px;
	margin-right: 2px;
	border-right-color:#000000;
}

/* 右向き */
.map-item--right::after
,.map-item--right::before{
	border: solid transparent;
	content:'';
	height:0;
	width:0;
	pointer-events:none;
	position:absolute;
	left:100%;
	top:50%;
}
.map-item--right::after{
	border-color: rgba(255, 255, 255, 0);
	border-width:10px;
	margin-top: -10px;
	border-left-color:#FFFFFF;
}
.map-item--right::before{
	border-color: rgba(0, 0, 0, 0);
	border-width:12px;
	margin-top: -12px;
	margin-left: 2px;
	border-left-color:#000000;
}

.map-item img {
	max-width: 400px;
	height: auto;
}

/*========== 各画像の位置 ==========*/

/*
* 木津川東
_____________*/
.map-item01 {
	display: none;
	position: absolute;
	top: 41%;
	left: 23%;
}
.map-item02 {
	display: none;
	position: absolute;
	bottom: 18%;
	right: 5%;
}
.map-item03
,.map-item05 {
	display: none;
	position: absolute;
	bottom: 30%;
	left: 22%;
}
.map-item04 {
	display: none;
	position: absolute;
	bottom: 4%;
	right: 3%;
}
.map-item06 {
	display: none;
	position: absolute;
	bottom: 25%;
	left: 17%;
}
.map-item07.map-item--bottom::after
,.map-item07.map-item--bottom::before {
	left: 11%;
}
.map-item07 {
	display: none;
	position: absolute;
	bottom: 19%;
	right: 4%;
}
.map-item08 {
	display: none;
	position: absolute;
	bottom: 15%;
	left: 41%;
}

/*
* 寺田
_____________*/
div[class*="terada-img"] {
	display: none;
	position: absolute;
}

.terada-img01 {
	top: 10%;
	left: 14%;
}
.terada-img02 {
	top: 12%;
	left: 50%;
}
.terada-img03 {
	top: 18%;
	left: 40%;
}
.terada-img04 {
	top: 17%;
	left: 23%;
}
.terada-img05 {
	top: 60%;
	left: 41%;
}

.terada-video {
	width: 80%;
	margin: 0 auto;
}
.terada-video > video {
	width: 100%;
}

/*
* 精華
_____________*/
div[class*="seika-img"] {
	display: none;
	position: absolute;
}

.seika-img01 {
	top: 13%;
	left: 30%;
}
.seika-img02 {
	top: 29%;
	left: 13%;
}
.seika-img03 {
	top: 13%;
	left: 30%;
}
.seika-img04 {
	top: 35%;
	left: 7%;
}
.seika-img05 {
	top: 17%;
	left: 20%;
}
.seika-img06 {
	top: 25%;
	left: 21%;
}



/*
* マップの吹き出し付き画像：SP
_____________*/
@media screen and (max-width: 768px) {
	.map-item {
		padding: 3px;
		width: 30%;
	}
	.map-item img {
		width: 100%;
		max-height: auto;
	}
	.map-item__txt {
		font-size: 10px;
	}
	.map-item02 {
		bottom: 19%;
		right: 8%;
	}
	.map-item03
	,.map-item05 {
    bottom: 32%;
    left: 27%;
	}
	.map-item04 {
    bottom: 4%;
	}
	.map-item06 {
    left: 20%;
	}

	/* 寺田:sp */
	.terada-img01 {
		left: 16%;
    top: -4%;
	}
	.terada-img02 {
		top: -3%;
    left: 53%;
	}
	.terada-img03 {
    top: -3%;
    left: 43%;
	}
	.terada-img04 {
    top: 15%;
    left: 26%;
	}
	.terada-img05 {
		top: 1%;
    left: 31%;
	}

	/* 精華:sp */
	.seika-img01 {
    top: -6%;
    left: 30%;
	}
	.seika-img02 {
		top: 29%;
		left: 13%;
	}
	.seika-img03 {
		top: 0%;
	}
	.seika-img04 {
    top: 30%;
	}
	.seika-img05 {
		top: -15%;
	}
	.seika-img06 {
    top: 18%;
	}
}


/*
* 各マップの詳細ページ
_____________*/
.mapArea {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.mapArea + .mapArea {
	margin-top: 50px;
}

.mapArea img {
	max-width: 100%;
	height: auto;
}

.mapArea__txt {
	margin-top: 1em;
}