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

/* Reset base element settings */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
p,article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font-weight: normal;
	vertical-align: baseline;
	background: transparent;
}

/* New elements of HTML5 to display: block */
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
	display: block;
}

/* Clear image border */
img{
	border: 0;
	vertical-align: top;
}

/* Selected Text */
::selection {
/*	color: #333;*/
	background: #d5dede;
}
::-moz-selection {
/*	color: #333;*/
	background: #d5dede; /* Firefox */
}

/* Basic settings */
html {
	-webkit-text-size-adjust: 100%; /* Font size adjust for mobile */
	font-size: 62.5%; /* 10px */
	height: 100%;
/*	box-sizing: border-box;*/
	font-family: 'ヒラギノ角ゴ Pro W3',
				 'Hiragino Kaku Gothic Pro',
				 'メイリオ', Meiryo,
				 'ＭＳ Ｐゴシック',
				 'Roboto',
				 sans-serif;
	color: #333;
}
body {
	font-size: 15px; /* for IE */
	font-size: 1.5rem;
	line-height: 21px;
	line-height: 2.1rem;
	background-color: #fff;
}

a {
	outline: none; /* No dotted line of frame when linking */
	transition: 0.5s;
}

/*リンクの装飾の設定*/
a:link,
a:visited,
a:active{
	color: #c0c0c0; /*#333*/
	text-decoration: none;
}

a:hover{
	color: #828b8b;
	text-decoration: none;
}

a:hover img {
	opacity: .6;
	transition: 0.5s;
}

/*リスト要素の初期値をリセット*/
ul,ol{
	list-style: none;
}

/*clearfixの設定*/
.clearfix:after,
.contents_box:after,
.moviebox01:after {
	content: "."; 
	display: block; 
	height: 0; 
	font-size:0;	
	clear: both; 
	visibility:hidden;
}
.clearfix {
	display: inline-block;
}

* html .clearfix             { zoom: 1; } 
*:first-child+html .clearfix { zoom: 1; }#wrap {
	width: 980px;
	margin: 0 auto;
	padding: 0;
}

.box-sizing {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
}



/*////////////////////////////////////////////////*/
/*//////////////////// Header ////////////////////*/
/*////////////////////////////////////////////////*/

#header_wrap {
	width: 100%;
	padding: 0;
	margin: 0;
	background: #fff;
	position: fixed;
	top: 0;
	z-index: 999;
	border-bottom: solid 2px #26499c;
}




/*////////////////////////////////////////////////*/
/*//////////////////// Footer ////////////////////*/
/*////////////////////////////////////////////////*/

#footer_wrap {
	width: 100%;
	padding: 0;
	background-color: #26499c;
}
footer img {
	display: block;
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
}


/* Pagetop Button */
#pagetop {
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 300;
	opacity: .65;
/*	color: #c0c0c0;*/
}
#pagetop:hover {
	opacity: 1;
	transition: 0.5s;
}




/*////////////////////////////////////////////////*/
/*/////////////////// Contents ///////////////////*/
/*////////////////////////////////////////////////*/

.contents_box {
	max-width: 940px;
	padding: 0 3%;
	margin: 0 auto;
	position: relative;
}
.header_contents_box {
	max-width: 1000px;
	padding: 0;
	margin: 0 auto;
	position: relative;
}
.contents_box img,
.header_contents_box img {
	max-width: 100%;
}
.main_image {
	margin: 0 auto;
	position: relative;
	width: 100%;
/*	max-width: 2000px;*/
	background: url("../../top_images/main_image.jpg") center center no-repeat;
	background-size: cover;
}
.main_image::before {
    content:"";
    display: block;
    padding-top: 50%; /* 高さを幅の●%に固定 */
}
.bg_gradation {
	position: relative;
	width: 100%;
	background: url("../images/bg_gradation.png") center top repeat-x;
	background-size: contain;
}
.bg_gradation::before {
	content:"";
    display: block;
    padding-top: 10%; /* 高さを幅の●%に固定 */
}

.moviebox01 {
	width: 100%;
/*	max-width: 940px;*/
	margin: 0;
	position: relative;
}
.moviebox01 .img {
	position: relative;
}
.top_movie_l {
	position: absolute;
	width: 45%;
	max-width: 450px;
	padding: 25.2% 0 0 0;
	margin: 0 auto;
	border: solid 1px #ccc;
	top: 0;
	left: 0;
	z-index: 10;
}
.top_movie_r {
	position: absolute;
	width: 45%;
	max-width: 450px;
	padding: 25.2% 0 0 0;
	margin: 0 auto;
	border: solid 1px #ccc;
	top: 0;
	right: 0;
	z-index: 11;
}
.top_movie_l iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.top_movie_r iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.googlemap_wrap {
	width: 100%;
}
.map_l {
	float: left;
}
.map_r {
	float: right;
}
.map_l,
.map_r {
	max-width: 420px;
	width: 45%;
}
.map_l .map,
.map_r .map {
	width: 100%;
	padding-bottom: 80%;
	position: relative;
}
.map_l iframe,
.map_r iframe {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
}



@media all and (min-width: 100px) {

.bg_gradation::before {
	content:"";
    display: block;
    padding-top: 5%; /* 高さを幅の●%に固定 */
}

}