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


/*====================
content
====================*/
#content {
	clear:both;
	padding-top:27px;
	padding-bottom:27px;
}
#content .wrapper {
	position:relative;
}

#content .news {
    float: left;
    width: 780px;
    border: 3px solid #A97492;
    border-radius: 5px;
    box-sizing: border-box;
    padding: 8px;
    box-shadow: inset 1px 1px 3px rgba(0,0,0,.5);
    margin-right: 12px;
    margin-bottom: 12px;
}
#content .news h2 {
	background:#B05A80;
	border-radius:3px;
	font-size:16px;
	color:#FFF;
	line-height:28px;
	text-align:center;
	height:28px;
	font-weight:bold;
}
#content .news iframe {
	box-sizing:border-box;
	font-size:16px;
	color:#000;
	border:none;
	background:#FFF;
	height:32px;
	padding:3px 0px;
	margin:0px 0px 0 0;
	width:100%;
	border-radius:7px;
}

.banner {
    width: 180px;
    display: block;
    float: right;
    margin-right: 0px;
    position: absolute;
    right: 0;
}
.banner a {
	box-sizing:border-box;
	display:block;
	width:100%;
	height:86px;
	padding:17px 0 0;
	background:url(../images/hatsurei_btn_bg.png);
	text-decoration:none;
	border-radius:5px;
	border:1px solid #3352A0;
	box-shadow: 1px 1px 3px rgba(0,0,0,.5)
}
.banner a:hover {
	background:url(../images/hatsurei_btn_bg_on.png);
}
.banner a h3 {
	font-size:16px;
	color:#FFF;
	font-weight:bold;
	text-decoration:none;
	text-shadow:0px 1px 2px #20336B;
	text-align:center;
	line-height:1em;
	margin-bottom:15px;
}
.banner a p {
	font-size:15px;
	text-align:center;
	color:#FFFF99;
	line-height:1em;
}


.qrcode {
    box-sizing: border-box;
    padding: 0px 0 0 0px;
    width: 180px;
    height: 86px;
    display: block;
    float: right;
    margin-bottom: 34px;
    border: 1px solid #3352A0;
    border-radius: 0px;
}
.qrcode .side1 {
	width:110px;
	float:left;
	padding:5px 0 0 5px;
}
.qrcode .side2 {
	width:58px;
	float:right;
}
.qrcode .side2 img {
	width:100%;
	height:auto;
}
.qrcode a {
	color:#3352A0;
	font-weight:bold;
	text-decoration:none;
}
.qrcode a:hover {
	text-decoration:underline;
}
.qrcode h4 {
	font-size:12px;
	color:#000000;
	font-weight:normal;
	text-decoration:none;
	text-align:left;
	line-height:1.3em;
	margin-bottom:6px;
}
.qrcode .side2 p {
	font-size:11px;
	text-align:center;
	line-height:1.1em;
	font-weight:bold;
}

/*====================
map
====================*/
.map {
	clear:both;
	margin-top:34px;
	position:relative;
}
.map .hanrei {
	width:256px;
	box-sizing:border-box;
	padding:6px;
	background:#FFF;
	position:absolute;
	top:16px;
	left:16px;
}
.map .hanrei h2 {
	color:#FFF;
	font-size:16px;
	line-height:27px;
	padding:0 4px;
	background:#7D3253;
	text-align:center;
	margin-bottom:10px;
}

.map .hanrei p {
	color:#000;
	font-size:14px;
	line-height:20px;
	margin:0 10px 10px;
	
}
.map .hanrei ul {
	margin:0 10px;
}
.map .hanrei ul li {
	font-size:15px;
	font-weight:bold;
	padding-left:24px;
	line-height:24px;
}

.map .hanrei ul li.cat1 {
	background:url(../images/point01.png) no-repeat 0 3px;
}
.map .hanrei ul li.cat2 {
	background:url(../images/point02.png) no-repeat 0 3px;
}
.map .hanrei ul li.cat3 {
	background:url(../images/point03.png) no-repeat 0 3px;
}
.map ul.point li {
	position:absolute;
	left:0%;
	top:0%;
	width:1.93877551%;
    line-height: 1.0em;
    margin-left: -2px;
}
.map ul.point li img {
	width:100%;
	height:auto;
}
.map ul.point li.point01 {
	left:35.30612245%;
	top:25.13736264%;
}
.map ul.point li.point02 {
    left: 34.7%;
    top: 51.5%;
}
.map ul.point li.point03 {
	left:40.00000000%;
	top:71.42857143%;
}
.map ul.point li.point04 {
	left:40.00000000%;
	top:85.85164835%;
}
.map ul.point li.point05 {
	left:57.14285714%;
	top:69.50549451%;
}
.map ul.point li.point06 {
	left:55.00000000%;
	top:50.27472527%;
}
.map ul.point li.point07 {
    left: 46.73469388%;
    top: 58.8%;
}
.map ul.point li.point08 {
	left:48.97959184%;
	top:72.80219780%;
}
.map ul.point li.point09 {
	left:34.28571429%;
	top:29.53296703%;
}
.map ul.point li.point10 {
	left:50.00000000%;
	top:29.80769231%;
}
.map ul.point li.point11 {
	left:85.71428571%;
	top:59.89010989%;
}
.map ul.point li.point12 {
	left:41.02040816%;
	top:22.52747253%;
}
.map ul.point li.point13 {
	left:49.79591837%;
	top:18.54395604%;
}
.map ul.point li.point14 {
	left:56.02040816%;
	top:29.53296703%;
}
.map ul.point li.point15 {
	left:41.73469388%;
	top:30.90659341%;
}

@media screen and (max-width: 768px) {

/*====================
content
====================*/
#content {
	clear:both;
	padding-top:20px;
	padding-bottom:20px;
}


#content .news {
	float:none;
	width:100%;
	border:3px solid #A97492;
	border-radius:5px;
	box-sizing:border-box;
	padding:8px;
	box-shadow:inset 1px 1px 3px rgba(0,0,0,.5);
	margin-right:0px;
	margin-bottom:10px;
}
#content .news h2 {
	background:#B05A80;
	border-radius:3px;
	font-size:16px;
	color:#FFF;
	line-height:28px;
	text-align:center;
	height:28px;
}
#content .news iframe {
	box-sizing:border-box;
	font-size:16px;
	color:#000;
	border:none;
	background:#FFF;
	height:32px;
	padding:3px 8px;
	margin:0px 0px 0 0;
	width:100%;
	border-radius:7px;
}
.banner {
    width: 75%;
    display: block;
    float: none;
    margin: 0 auto;
    position: static;
}
.banner a {
	box-sizing:border-box;
	display:block;
	width:100%;
	height:60px;
	padding:10px 0 0;
	background:url(../images/hatsurei_btn_bg.png);
	text-decoration:none;
	border-radius:5px;
	border:1px solid #3352A0;
	box-shadow: 1px 1px 3px rgba(0,0,0,.5)
}
.banner a:hover {
	background:url(../images/hatsurei_btn_bg_on.png);
}
.banner a h3 {
	font-size:16px;
	color:#FFF;
	font-weight:bold;
	text-decoration:none;
	text-shadow:0px 1px 2px #20336B;
	text-align:center;
	line-height:1em;
	margin-bottom:10px;
}
.banner a p {
	font-size:14px;
	text-align:center;
	color:#FFFF99;
	line-height:1em;
}

.qrcode {
	box-sizing:border-box;
	padding:8px;
	width:75%;
	height:auto;
	display:block;
	float:none;
	margin:12px auto 0;
	border:1px solid #3352A0;
	border-radius:0px;
}
.qrcode .side1 {
	width:100%;
	box-sizing:border-box;
	float:none;
	padding:5px 5px 0;
}
.qrcode .side2 {
	width:40%;
	float:none;
	margin:0 auto 5px;
}
.qrcode .side2 img {
	width:100%;
	height:auto;
}
.qrcode a {
	color:#3352A0;
	font-weight:bold;
	text-decoration:none;
}
.qrcode a:hover {
	text-decoration:underline;
}
.qrcode h4 {
	font-size:12px;
	color:#000000;
	font-weight:normal;
	text-decoration:none;
	text-align:center;
	line-height:1.3em;
	margin-bottom:6px;
}
.qrcode .side2 p {
	font-size:11px;
	text-align:center;
	line-height:1.1em;
	font-weight:bold;
}

/*====================
map
====================*/
.mask {
	width:100%;
	overflow:hidden;
}
.map {
	clear:both;
	margin-top:14px;
	position:relative;
	width:135%;
	margin-left:-35%;
}
.map img.mainmap {
	width:100%;
	height:auto;
}

.map .hanrei {
	width:35%;
	box-sizing:border-box;
	padding:6px;
	background:#FFF;
	position:absolute;
	top:10px;
	left:auto;
	right:10px;
}
.map .hanrei h2 {
	color:#FFF;
	font-size:10px;
	line-height:15px;
	padding:0 2px;
	background:#7D3253;
	text-align:center;
	margin-bottom:6px;
}

.map .hanrei p {
	color:#000;
	font-size:10px;
	line-height:1.4em;
	margin:0 0px 5px;
	
}
.map .hanrei ul {
	margin:0 0px;
}
.map .hanrei ul li {
	font-size:10px;
	font-weight:bold;
	padding-left:1.8em;
	line-height:1.6em;
}

.map .hanrei ul li.cat1 {
	background:url(../images/point01.png) no-repeat 0 3px;
	background-size:1.2em;
}
.map .hanrei ul li.cat2 {
	background:url(../images/point02.png) no-repeat 0 3px;
	background-size:1.2em;
}
.map .hanrei ul li.cat3 {
	background:url(../images/point03.png) no-repeat 0 3px;
	background-size:1.2em;
}
.map ul.point {
	width:100%;
	margin:0px;
	padding:0px;
}
.map ul.point li {
	position:absolute;
	left:0%;
	top:0%;
	width:2.43877551%;
    line-height: 1em;
    margin-top: -0.7%;
    margin-left: -0.7%;
}


}