@charset "utf-8";
/* CSS Document */

.fukusima_map{
	position: relative;
}
.fukusima_map .ph{
	position: relative;
	float: right;
	padding-top: 60px;
}
.fukusima_map .ph li{
	margin-bottom: 30px;
	display: table;
	position: relative;
}
.fukusima_map .ph li:nth-child(1){
	margin-right: 80px;
}
.fukusima_map .ph li:nth-child(2){
	right: -80px;
}
.fukusima_map .ph li:nth-child(3){
	right: -40px;
}
.fukusima_map .ph li:nth-child(4){
    right: 50px;
    top: -30px;
}
.fukusima_map .ph li:last-child{
    margin-bottom: 0;
}

.fukusima_map .map_on{
	display: none;
}

.fukusima_pre .card{
	margin: 60px auto 60px;
}




@media screen and (max-width:1279px){
	#sightseeing .conte_top {
	    background: url(../img/fukushima_map.png)no-repeat;
	    background-position: 80px 180px;
	    background-size: contain;
	}
}
@media screen and (max-width:1023px){
	.fukusima_map .ph {
	    float: none;
	    padding-top: 500px;
	}
	.fukusima_map .ph li:nth-child(1){
		margin-right: 1%;
	}
	.fukusima_map .ph li{
	    float: left;
	    position: relative;
	    width: 21%;
	    margin: 0 1%;
	    top:0 !important;
	    left: auto !important;
	    right: auto !important;
	}
	.card #aqua li:nth-child(2) img,
	.card #skyline li:nth-child(2) img{
		width: 100%;
	}
}
@media screen and (max-width:767px){
	#sightseeing .conte_top {
	    background: url(../img/fukushima_map.png)no-repeat;
	    background-position: 30px 180px;
	    background-size: contain;
	}
	.fukusima_map .ph {
	    float: none;
	    padding-top: 250px;
	}
	.fukusima_map .ph li{
		width: 46%;
		margin: 0 2% 10px;
	}
	.fukusima_map .ph li:nth-child(1){
		margin-right: 2%;
	}
	.fukusima_map .ph li img{
		width: 100%;
	}
	.card .col01 {
	    width: 100%;
	    float: none;
	}
	.card .col01 li:nth-child(2) img{
			width: auto;
		}
	.fukusima_pre h2 img{
		width: 100%;
	}
	#sightseeing .each .title img{
		/*max-width: 130px;*/
		padding: 0;
	}
	#sightseeing .each .title {
	    padding: 10px 0 0;
	}

}
@media screen and (max-width:480px){
	.card #aqua li:nth-child(2) img, .card #skyline li:nth-child(2) img {
	    width: auto;
	}

}
@media screen and (max-width:320px){
	#sightseeing .each .title img{
		max-width: 100px;
	}


}