@charset "utf-8";
/* ===================================================
	access CSS
====================================================== */
/* ---------------------------------------------------

------------------------------------------------------ */
#main_img { width: 100%; padding: 140px 0 120px; text-align: center; background: url(../../access/img/tit_bg.jpg)no-repeat center; background-size: cover;}
#main_img h2 { color: #fff; font-size: 38px; text-shadow: 0 0 10px #000, 0 0 7px #000, 0 0 3px #000;
	-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

@media screen and (max-width: 600px) {
	#main_img { padding: 60px 0;}
	#main_img h2 { font-size: 32px;}
}

/* ---------------------------------------------------
#lead
------------------------------------------------------ */
#lead { padding: 30px 0 60px; text-align: center;}
#lead h3 { padding-bottom: 20px; color: #a07612; font-size: 26px;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
#lead p { line-height: 2;}

@media screen and (max-width: 600px) {
	#lead { max-width: 92%; margin: 0 auto; padding: 30px 0 40px;}
	#lead h3 { font-size: 22px;}
	#lead p { text-align: left; line-height: 1.6;}
}


/* ---------------------------------------------------
#sec1
------------------------------------------------------ */
#sec1 { padding-bottom: 20px; box-shadow: -1px 4px 7px 0px #dcdad6; position: relative; z-index: 1;}
#sec1 #map_col dl { width: 49%; float: left;}
#sec1 #map_col dl+dl { float: right;}
#sec1 #map_col dl dt { display: block; padding: 2px 0; margin-bottom: 30px; background: #453326; color: #fff; font-size: 24px; text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#sec1 #map_col dl dt.arrow:before { right: calc(50% - 5px); top: inherit; bottom: -23px; width: 10px; height: 10px; border: 8px solid transparent; border-left: 8px solid transparent; border-top: 15px solid #453326;}
#sec1 #map_col dl dd a { position: relative;}
#sec1 #map_col dl dd a:after { content: "拡大する"; display: block; padding: 10px 40px 10px 60px; position: absolute; right: 0; bottom: 0; color: #fff;
background: url(../../access/img/icon_zoom.png)no-repeat left 25px center,rgba(0,0,0,0.5);}

#sec1 #gmap { width: 100%; height: 450px; margin: 60px auto;}
#sec1 #gmap iframe { width: 100%;}

@media screen and (max-width: 600px) {
	#sec1 #map_col dl { width: 100%; float: none!important;}
	#sec1 #map_col dl+dl { margin-top: 20px;}
	#sec1 #map_col dl dt { padding: 5px 0; font-size: 18px;}
	#sec1 #map_col dl dd a:after { padding: 7px 25px 7px 50px; font-size: 14px; background-position-x: 16px;}
	#sec1 #gmap { height: 300px; margin: 40px 0;}
	#sec1 #gmap iframe { height: 300px;}
}

/* ---------------------------------------------------
経路図
------------------------------------------------------ */
.route_wrap { padding: 60px 0 80px; background: #fbfbfb;}
.route_wrap+.route_wrap { border-top: 1px solid #ccc;}
.route_wrap h4 { padding-bottom: 50px; font-size: 30px; text-align: center; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.route_wrap h4 img { display: block; margin: 0 auto 10px;}

.route { width: 32%; float: left; text-align: center;}
.route+.route { margin-left: 2%;}
.route h5 { padding: 15px 2%; background: #453326; color: #fff; font-size: 18px;}
.route ul { position: relative;}
.route ul:before {
	content: ""; display: block; position: absolute; z-index: 1; top: 0; bottom: 0;
	left: 50%; margin-left: -2.5px; width: 5px; height: 100%; background: #f0e8d2;
}

.route li { padding: 15px 2%; position: relative; z-index: 2;}
.route .point { background: #e4d4be; font-size: 18px;}
.route .goal { background: #78572f; color: #fff; font-size: 18px;}
.route .time { padding: 20px 2%; font-size: 16px;}
.route .time span { display: block; padding: 10px 0; background: #fbfbfb;}

.link { margin-top: 50px; text-align: center; font-size: 0;}
.link li { width: 32%; display: inline-block; font-size: 14px;}
.link li+li {  margin-left: 2%;}
.link li a { display: block; padding: 13px 0; box-sizing: border-box; border: 1px solid #453326; color: #453326;}
.link li a:hover { text-decoration: none; background: #fff;}
.link li a span { margin-left: 1em;}


@media screen and (max-width: 600px) {
	.route_wrap { padding: 30px 0 50px;}
	.route_wrap h4 { padding-bottom: 30px; font-size: 25px;}

	.route { width: 100%; float: none;}
	.route+.route { margin: 30px 0 0;}
	.route ul { margin-bottom: 40px;}
	.route h5,
	.route li { padding: 10px 2%;}
	.route h5 { position: relative;}
	.route h5:after {
    content: ''; width: 0; height: 0; position: absolute;
    border-right: 6px solid transparent;
    border-top: 8px solid #fff; border-left: 6px solid transparent;
    top: 50%; right: 6%; margin-top: -4px;
	}
	.route h5.active:after {
	    -webkit-transform: rotate(180deg);
	    -ms-transform: rotate(180deg);
	    transform: rotate(180deg);
	}

	.link { margin-top: 40px;}
	.link li { width: 100%; display: block; font-size: 16px;}
	.link li+li { margin: 10px 0 0;}
	.link li a { padding: 10px 0;}
}


/* ---------------------------------------------------
#sec2
------------------------------------------------------ */
#sec2 #parking { padding: 25px 40px 28px; margin-top: 50px; border: 1px solid #e4d4be; background: url(../../access/img/sec2_bg2.jpg)no-repeat left bottom,#fff;display: flex; justify-content: space-around;}
#sec2 #parking dl { width: 51%;}
#sec2 #parking dl dt { padding-bottom: 10px; margin-bottom: 15px; color: #a07612; font-size: 26px; border-bottom: 1px solid #ccc;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
#sec2 #parking dl dd { line-height: 1.8;}

@media screen and (max-width: 600px) {
	#sec2 #parking { display: block; padding: 20px 4% 37%; background-position: right bottom; background-size: 120%;}
	#sec2 #parking img { margin-top: 20px;}
	#sec2 #parking dl { width: 100%;}
	#sec2 #parking dl dt { font-size: 22px;}
	#sec2 #parking dl dd { line-height: 1.6;}
}


/* ---------------------------------------------------
#sec3
------------------------------------------------------ */
#sec3 .route { width: 48.5%;}
#sec3 .route+.route { margin-left: 0; float: right;}
#sec3 .route:nth-of-type(1) .time:nth-of-type(1) { padding: 104px 0!important;}

@media screen and (max-width: 600px) {
	#sec3 .route { width: 100%; float: none!important;}
	#sec3 .route:nth-of-type(1) .time:nth-of-type(1) { padding: 20px 2%!important;}
}


/* ---------------------------------------------------
#sec4
------------------------------------------------------ */
#sec4 { padding-bottom: 80px;}
#sec4 .route { width: 48.5%;}
#sec4 .route+.route { margin-left: 0; float: right;}

@media screen and (max-width: 600px) {
	#sec4 { padding-bottom: 50px;}
	#sec4 .route { width: 100%; float: none!important;}
}

#sec1 #map_col:after,
.route_box:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0;}
