@charset "utf-8";
/*----------------------------------------------------
	基本
----------------------------------------------------*/
body {
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	min-width: 1280px;
}
input, textarea { font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif; }
img {
	max-width: 100%;
	/* [disabled]display: block; */
	margin: 0 auto;
	vertical-align: bottom;
}
#contents input[type="radio"]{
  display    : none;
}
/* HEADDER
---------------------------*/
#header {
	height: 980px;
	width: 100%;
	overflow: hidden;
	position: relative;
	background: url("../img/topimage.png") 50% 50% no-repeat /cover;
}
#header #video-background {
  position:absolute;
  left: 0;
  top: 0;
  min-width: 100%;
  min-height: 100%;
  z-index: 10;
}
.header_area{
  position: relative;
  margin: 0 auto;
  width: 1280px;
  z-index: 1000;
  color: white;
  text-align: center;
}
#container {
    font-family: "Yu Gothic", YuGothic, Verdana, 'Hiragino Kaku Gothic ProN','Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, sans-serif;
	text-align: right;
	position: relative;
	z-index: 1001;
	color: white;
	margin: 10px;
}
/* ここから下がボタンのCSS　*/
.btn-animation-02 {
	display: inline-block;
	width: auto;
	text-align: center;
	border: 2px solid #fff;
	font-size: 16px;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	border-radius: 10px;
	position: relative;
	z-index: 9999;
}
.btn-animation-02 label{
	padding: 10px;
	display: block;
}
.btn-animation-02:hover {
	background-color: rgba(255,255,255,0.5);	
}
.logo{
	font-size: 50px;
	font-weight: bold;
	margin-top: 100px;	
}
.header_bb{
    background: url("../img/white_wave.png") bottom repeat-x;
	padding-bottom: 10px;
}
.header_logo{
	text-align: center;
	margin-top: 40px;
}
.header_text{
	margin-top: 350px;
}
em{
	font-size: 30px;
	font-weight: bold;
}
#header_under{
	margin-top: 30px;
}
/* section#about_dondontei
---------------------------*/
#about_dondontei{
	background:url("../img/about_bg01.png"),url("../img/about_bg02.png"),url("../img/about_mainbg.jpg");
	background-position:100% 25%,0% 75%,center;
	background-repeat: no-repeat,no-repeat;
	background-size:auto,auto,cover;
	color: #fff;
	font-size: 20px;
	font-weight: bold;
}
.bottun_loc{
	display: block;
	padding: 100px 0 150px 0;
	text-align: center;
	width: 100%;
	margin: 0 auto;
}
.float_l{
	float: left;
	width: 480px;
	vertical-align: middle;
}
.float_r{
	float: right;
	width: 480px;
	height: 520px;
	vertical-align: middle;
}
.about-box{
	clear: both;
	width: 1040px;
	margin: 0 auto;
}
.aboutbox_top{
	padding: 100px 0 0 0;
}
.parent {/*親要素*/
position: relative;
height: 520px;
}
.parent p {
position: absolute;
top: 50%;
-ms-transform: translateY(-50%);
-webkit-transform : translateY(-50%);
transform : translateY(-50%);
}
/* section#menu_dondontei
---------------------------*/
#menu_dondontei{
	background-color: #000;
	text-align: center;
}
h2{
	background:transparent url("../img/menulist01.png") no-repeat 50% 50% /cover;
	height: auto;
}
#menu_w{
    color: #fff;
    font-family: "HGS明朝E";
    font-size: 500%;
    padding: 10%;
}
.bottun_pt{
	padding-top: 50px;
	display: block;
}
#font_w{
	color: white;
	margin: 50px 0;
	font-weight: bold;
	font-size: 110%;
}
/* FOOTER
---------------------------*/
footer{
	background-color: #000;
	text-align: center;
}
#footer_logo{
	padding-top: 150px;
}
.snsbox{
	width: 300px;
	margin: 100px auto 30px;
}
.snsbox li{
	float: left;
	width: 33.3%;
}
.copyright{
	color: #fff;
}
/* リンク*/
a {
	color: #FFF;
	text-decoration: none;
	outline: none;
}
a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover { text-decoration: none; }
a:active { text-decoration: none; }
/* CLEAR FIX*/
.clearfix:before,.clearfix:after { content: " "; display: table; }.clearfix:after { clear: both; }.clearfix { *zoom: 1; }
/* TEXT DECORATION & LAYOUT*/
.red { color: #C00; }.blue { color: #00C; }.bold { font-weight: bold; }
/* TEXT ALIGN*/
.alignleft { text-align: left; }.aligncenter { text-align: center; }.alignright { text-align: right; }.alignjust { text-align: justify; }
/* FLOAT*/
.left { float: left; }.right { float: right; }.clear { clear: both; }
/* POSITION*/
.relative{ position: relative; }.absolute{ position: absolute; z-index: 1;}
/* BOX MODEL*/
.block { display: block; }

/* よく使いそうなCSS3
----------------------------------------------------*/
#selectors {
/* 角丸 */
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;

/* 角丸個別 */
	-webkit-border-top-right-radius: 15px;
	-moz-border-radius-topright: 15px;
	border-top-right-radius: 15px;

/* ボックスに影 */
	-webkit-box-shadow: 1px 1px 3px #999;
	-moz-box-shadow: 1px 1px 3px #999;
	box-shadow: 1px 1px 3px #999;

/* テキストに影 */
	text-shadow: 1px 1px 0px #999;

/*アルファ設定*/
	filter:alpha(opacity=80); 
	-moz-opacity:0.80; 
	opacity:0.80; 
	-khtml-opacity:0.80;

/*グラデーション*/
	/* Firefox */
	background: -moz-linear-gradient(top center, #fff 0%, #999 100%);
	/* Chrom と Safari */
	background: -webkit-gradient(linear, center top, center bottom, from(#fff), to(#999));
	/* 共通 */
	background: linear-gradient(top center, #fff 0%, #999 100%);
}
/* =====================================================================
*    common
* =================================================================== */
.mb10 { margin-bottom: 10px; }
.mb20 { margin-bottom: 20px; }
/* =====================================================================
*    common
* =================================================================== */
/* =====================================================================
*    common
* =================================================================== */


@media screen and (max-width: 1280px){
	body {
		min-width: 100%;
	}

	.header_area{
		width: 100%;
		overflow: hidden;
	}
	.about-box{
		width: 90%;
		padding-top: 10%;
	}
	.float_l{
		width: 45%;
	}
	.float_r{
		width: 45%;
	}

	.bottun_loc{
		padding-top: 60%;
	}
	#header{
		height:inherit;
		display:inherit;
	}
}
@media screen and (max-width: 768px){
	.parent {/*親要素*/
	position: relative;
	height: auto;
	}

.parent p {
	margin-top: 10%;
	font-size: medium;
	height: auto;
	position: inherit;
	top: 0;
	-ms-transform: translateY(0%);
	-webkit-transform : translateY(0%);
	transform : translateY(0%);
	}
}
@media screen and (max-width: 600px){
	#video-background {
		position:absolute;
		top:0;
		left:0;
		display: none;
	}
	.logo{
		font-size: 25px;
	}
	#tubular-container iframe {
		display: none;
	}
	.header_logo,.header_text{
		margin-top: 50px;
	}
	em{
		font-size: inherit;
	}
	#header_under{
		margin-top: 170px;
	}
	#header{
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
		height: 700px;
		overflow: hidden;
	}
	#about_dondontei{
		background:url("../img/about_bg01.png"),url("../img/about_bg02.png"),url("../img/about_mainbg.jpg");
		background-position:100% 20%,0% 55%,center;
		background-repeat: no-repeat,no-repeat,no-repeat;
		background-size:70% auto,70% auto,cover;
}
	.change{
		display: flex;
		flex-direction: column-reverse;
	}
	.float_l{
		width: 100%;
		height: inherit;
	    margin-bottom: 40px;
	}
	.float_r{
		float: none;
		width: 100%;
		height: inherit;
	}
	.parent p{
		top:inherit;
	}
	.bottun_loc {
		padding: 25% 0;
		width: 60%;
	}
	#menu_w{
		padding: 10%;
		font-size: 300%;
	}
	.bottun_pt{
		width: 90%;
		margin: 0 auto;
	}
	#menu_dondontei a img{
		width: 60%;
	}
	#footer_logo {
        padding-top: 100px;
		width: 50%;
		margin: 0 auto;
	}
	.snsbox{
		width: 40%;
	}
	.copyright{
		font-size: 7px;
	}
}
