@charset "utf-8";
#area_map{z-index:100;
	color: #4A4A4A;
}
#area_map > h2,
#area_map > h3{
	font-size: 24px;
	font-weight: normal;
	margin-bottom: 10px;
}
#area_map > h2:after,
#area_map > h3:after{
	clear: both;
	content: "";
	display: block;
}
#area_map > h2 strong,
#area_map > h3 strong{
	color: #A2145A;
	display: block;
	float: left;
	font-size: 70px;
	font-weight: normal;
	line-height: 1;
	margin-bottom: 10px;
	margin-right: 20px;
}
#area_map p{
	margin-bottom: 20px;
}
#area_map p strong{
	color: #BB1E79;
}
#area_map ul{
	background-image: url("./images/map/area_map_00.png");
	background-position: top center;
	background-repeat: no-repeat;
	position: relative;
	/* max-width: 520px; */
	margin: 0 0 8% 0;
	width: 100%;
	background-size: contain;
	/* padding: 0 0 100%; */
}

#area_map ul:before{
	content: "";
	display: block;
	padding-top: 100%;
}
#area_map ul li{
	line-height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	text-align: center;
	width: 15%;
}
#area_map ul li:before{
	content: "";
	display: block;
	padding-top: 81%;
}
#area_map ul li{
}
#area_map ul li.active{
	z-index: 30;
}
#area_map ul li{
	display: inline-block;
	position: absolute;
	width: 15%;
	z-index: 0;
	cursor: pointer;
	position: absolute;
	top: 0;
	left: 0;
}
#area_map ul li[id^="area_"] > section{
	height: auto;
	/* padding-top: 72%; */
	position: relative;
	text-align: center;
	width: 100%;
	color: #7C7C7C;
	font-size: 83%;
}
#area_map ul li[id^="area_"] [id^="area_num_"]{
	display: inline-block;
	/* height: 24px; */
	/* line-height: 24px; */
}
#area_map ul li > section > div{
	background-color: rgba(255, 255, 255, 0.9);
	border: 1px solid #333;
	display: none;
	padding-bottom: 10px;
	position: absolute;
	left: -18em;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 17em;  z-index:1000
}
#area_map ul li > section > div:after{
	border-style: solid;
	border-width: 0.5em 1em;
	border-color: transparent transparent transparent #34236D;
	content: "";
	font-size: 14px;
	position: absolute;
	top: 50%;
	left: 100%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
#area_map ul li.active > section > div{
	display: block; z-index:1000
}
#area_map ul li > section > div h3:first-child{
	background-color: #555;
	color: #FFFFFF;
	font-size: 14px;
	padding: 0.5em 0;
	text-align: center;
}
#area_map ul li > section > div h4:first-child{
	background-color: #ffbdbd;
	border-radius: 7px;
	color: #333;
	cursor: pointer;
	font-weight: normal;
	margin: 10px auto 0;
	padding: 10px 0;
	width: 90%;
	text-align:center;
	padding: 0.5em 0;
}
#area_map ul li > section > div h4:not(:first-child),
#area_map ul li > section > div h5:not(:first-child){
	background-color: #ffbdbd;
	border-radius: 7px;
	color: #FFFFFF;
	cursor: pointer;
	font-weight: normal;
	margin: 10px auto 0;
	padding: 10px 0;
	width: 90%;
}
/*
#area_map ul li > section > div h4:not(:first-child):before,
#area_map ul li > section > div h5:not(:first-child):before,
#area_map ul li > section > div h4:not(:first-child):after,
#area_map ul li > section > div h5:not(:first-child):after{
	content: "▼";
	font-size: 160%;
	line-height: 1;
	margin-left: 0.3em;
	margin-right: 0.3em;
	vertical-align: sub;
}
*/
/*
#area_map ul li > section > div h4.active:not(:first-child):before,
#area_map ul li > section > div h5.active:not(:first-child):before,
#area_map ul li > section > div h4.active:not(:first-child):after,
#area_map ul li > section > div h5.active:not(:first-child):after{
	content: "▼";
}
*/
/*
#area_map ul li > section > div a{
	color: #333;
	display: block;
	font-size: 14px;
	padding: 0.5em 1em 0.5em 2.3em;
	position: relative;
	text-align: left;
}
*/
/*
#area_map ul li > section > div a:before{
	color: #999;
	content: "●";
	font-family: FontAwesome;
	text-decoration: none;
	position: absolute;
	top: 50%;
	left: 1em;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
*/
#area_map ul li > section > div a:hover{
	text-decoration: none;
}
#area_map ul li > section > div > section{
	display: none;
}

#area_map ul li#area_1{
	top: 7.6%;
	left: 44.6%;
}
#area_map ul li#area_2{
	top: 29.7%;
	left: 83.8%;
}
#area_map ul li#area_3{
	top: 56.0%;
	left: 83.8%;
}
#area_map ul li#area_4{
	top: 31.7%;
	left: 44.5%;
}
#area_map ul li#area_5{
	top: 79.7%;
	left: 75.9%;
}
#area_map ul li#area_6{
	top: 79.6%;
	left: 48.7%;
}
#area_map ul li#area_7{
	top: 37.9%;
	left: 21.6%;
}
#area_map ul li#area_8{
	top: 79.7%;
	left: 23.6%;
}
#area_map ul li#area_9{
	top: 35.0%;
	left: 3.2%;
}
#area_map ul li#area_9 > section{
	height: auto;
	/* padding-top: 89%; */
}
#area_map ul li#area_9:before{
	padding-top: 100%;
}

#group_banner_area {
	display: none;
}
#area_list{
	margin-top: 3.125%;
}
#area_list li{
	margin: 0 auto 3.125%;
	width: 93.75%;
}
#area_list li > h3,
#area_list li > h4{
	background-color: #5671D5;
	color: #FFFFFF;
	text-align: center;
	padding: 1.5625%;
}
#area_list li > h3:before,
#area_list li > h3:after,
#area_list li > h4:before,
#area_list li > h4:after{
	content: "\F0D7";
	font-family: FontAwesome;
	font-size: 160%;
	line-height: 1;
	margin: 0 0.3em;
	vertical-align: sub;
}
#area_list li > h3.active:before,
#area_list li > h3.active:after,
#area_list li > h4.active:before,
#area_list li > h4.active:after{
	content: "\F0D8";
}
#area_list li > section{
	border: 1px solid #5671D5;
	display: none;
	padding: 1.666666666666667% 0;
}
#area_list li > section > h4,
#area_list li > section > h5{
	background-color: #FF95D0;
	border-radius: 15px;
	color: #FFFFFF;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	width: 90%;
	padding: 2% 0;
}
#area_list li > section > h4:before,
#area_list li > section > h4:after,
#area_list li > section > h5:before,
#area_list li > section > h5:after{
	content: "\F0D7";
	font-family: FontAwesome;
	font-size: 160%;
	line-height: 1;
	margin: 0 0.3em;
	vertical-align: sub;
}
#area_list li > section > h4.active:before,
#area_list li > section > h4.active:after,
#area_list li > section > h5.active:before,
#area_list li > section > h5.active:after{
	content: "\F0D8";
}
#area_list li > section > h4:not(:first-child),
#area_list li > section > h5:not(:first-child){
	margin-top: 2%;
}
#area_list li > section > section{
	display: none;
}
#area_list li section a{
	color: #5671D5;
	display: block;
	padding: 1.672240802675585% 3.344481605351171%;
	position: relative;
	text-decoration: none;
}
#area_list li section a:before{
	color: #FF7B92;
	content: "\F111";
	font-family: FontAwesome;
	margin-right: 0.3em;
}
#area_list li section a:after{
	content: "\F105";
	font-family: FontAwesome;
	font-size: 140%;
	position: absolute;
	top: 50%;
	right: 0.5em;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

/*--- menu ---*/
#tlbtbox{float:left; width:48% !important; margin:10px auto; padding:0 1%;/*max-height:480px; overflow-y:scroll;*/}

ul, ul ul {margin: 0;
	padding: 0;
	list-style: none;
}
.menu {
	width:auto;
	height: auto;
}
.menu > li > a {
	background-image: -webkit-gradient(linear, left top, left bottom, from( #fff /*{a-bar-background-start}*/), to( #eee /*{a-bar-background-end}*/)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient( #FFF /*{a-bar-background-start}*/, #eee /*{a-bar-background-end}*/); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient( #FFF /*{a-bar-background-start}*/, #eee /*{a-bar-background-end}*/); /* FF3.6 */
	background-image:     -ms-linear-gradient( #FFF /*{a-bar-background-start}*/, #eee /*{a-bar-background-end}*/); /* IE10 */
	background-image:      -o-linear-gradient( #FFF /*{a-bar-background-start}*/, #eee /*{a-bar-background-end}*/); /* Opera 11.10+ */
	background-image:         linear-gradient( #FFF /*{a-bar-background-start}*/, #eee /*{a-bar-background-end}*/);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#d8c59e', EndColorStr='#eee');
	border-radius:8px; border:1px solid #9a8e8f; text-align:center;
	width: 100%;
	height: 3.5em;
	line-height: 3.5em;
	display: block;
	text-indent:.8em;
	position: relative;
	font-weight: 600;
	color:#603; text-decoration:none;

	/* add */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.menu li ul li{padding:.8em; line-height:110%;}
.menu li ul li span{font-weight:bold; color:#F99;}
.menu li ul li .kome{font-size:10px; color:#999;}
.menu ul li a {
	width: 100%;
	height: 3.5em;
	line-height: 3.5em;
	text-indent: .8em;
	display: block;
	position: relative;
	font-size: 0.923em;
	font-weight: 400;text-decoration:none;
}
.menu ul li:last-child a {text-decoration:none;
}
.menu > li > a:hover, .menu > li > a.active {
	background-image: -webkit-gradient(linear, left top, left bottom, from( #fff /*{a-bar-background-start}*/), to( #fff /*{a-bar-background-end}*/)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient( #eee /*{a-bar-background-start}*/, #fff /*{a-bar-background-end}*/); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient( #eee /*{a-bar-background-start}*/, #fff /*{a-bar-background-end}*/); /* FF3.6 */
	background-image:     -ms-linear-gradient( #eee /*{a-bar-background-start}*/, #fff /*{a-bar-background-end}*/); /* IE10 */
	background-image:      -o-linear-gradient( #eee /*{a-bar-background-start}*/, #fff /*{a-bar-background-end}*/); /* Opera 11.10+ */
	background-image:         linear-gradient( #eee /*{a-bar-background-start}*/, #fff /*{a-bar-background-end}*/);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#d8c59e', EndColorStr='#fff');
	border:none;

	/* add */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

	border-top:1px solid #EEE;
	border-bottom:1px solid #EEE;
}
.menu > li > a.active {
}
@media only screen and (min-width:1080px){
#tlbtbox{float:left !important; width:44% !important; margin:15px 1%;}
}

@media only screen and  (max-width:1081px){
#tlbtbox{float:left !important; width:44% !important; margin:15px 1%;}
}
@media only screen and (max-width:816px){
.#tlbtbox{float:left !important; width:43% !important; margin:15px 1%;}
}

.menu > li > a.active {
}

@media all and (min-width: 768px) {
	#area_map{
		color: #4A4A4A;
		/* margin-bottom: 0px; */
		max-width: 480px;
		width: 48%;
		/* overflow: hidden; */
		margin:0 1% 10px; float:right;
	}
	#area_map ul{
		background-image: url("./images/map/area_map_00.png");
		background-position: top center;
		background-repeat: no-repeat;
		position: relative;
		/* max-width: 520px; */
		margin: 0 0 6% 0;
		width: 100%;
		background-size: contain;
		padding: 0 0 0%;
	}

	#area_map ul li{
		width: 16%;
		z-index: 0;
		top: 0;
		left: 0;
	}
	#area_map ul li#area_1{
		top: 7.6%;
		left: 44.3%;
	}
	#area_map ul li#area_2{
		top: 29.3%;
		left: 83%;
	}
	#area_map ul li#area_3{
		top: 55.8%;
		left: 83.2%;
	}
	#area_map ul li#area_4{
		top: 31.3%;
		left: 43.5%;
	}
	#area_map ul li#area_5{
		top: 79.3%;
		left: 75.5%;
	}
	#area_map ul li#area_6{
		top: 79.4%;
		left: 47.9%;
	}
	#area_map ul li#area_7{
		top: 37.6%;
		left: 21%;
	}
	#area_map ul li#area_8{
		top: 79.3%;
		left: 23%;
	}
	#area_map ul li#area_9{
		top: 34.4%;
		left: 2.2%;
	}
	#area_map ul li#area_9 > section{
		height: auto;
		/* padding-top: 94%; */
	}
#area_map ul{
		background-image:
			url("./images/map/area_map_00.png"),
			url("./images/map/area_map_01.png"),
			url("./images/map/area_map_02.png"),
			url("./images/map/area_map_03.png"),
			url("./images/map/area_map_04.png"),
			url("./images/map/area_map_05.png"),
			url("./images/map/area_map_06.png"),
			url("./images/map/area_map_07.png"),
			url("./images/map/area_map_08.png"),
			url("./images/map/area_map_09.png");
		background-size: contain, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0;
	}
}

@media all and (max-width: 768px) {
	#tlbtbox{float:none !important; width:95% !important; margin:0 2% 10px 1%;padding-top:10px;}
#area_map{
		color: #4A4A4A;
		/* margin-bottom: 0px; */
		float:none !important;
		max-width: 480px;
		width: 98% !important;
		/* overflow: hidden; */
		margin:0 1% 10px !important; 
	}
}