@charset "utf-8";
/************************************************************************************************************************************
	#wrapper	-CommonSetting-
************************************************************************************************************************************/
#wrapper {
	width: 100%;
}




/************************************************************************************************************************************
	header	-CommonSetting-
************************************************************************************************************************************/
#header {
	width: 100%;
	border-top: solid 5px #6e8ffa;
}

#header #header_content {
	width: 100%;
	padding: 4.6428571428571428571428571428571% 0;	/* 65/1400*100 */
	margin: 0 auto;
	background-image: url('../img/header_bg.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}


#header #header_content h1 {
	text-align: center;
	width: 100%;
	padding-top: 2.1428571428571428571428571428571%;	/* 30/1400*100 */
	background-color: rgba(0,0,0, 0.3);
}
#header #header_content h1 img {
	width: 35.428571428571428571428571428571%;	/* 496/1400*100 */
	height: auto;
}
#header #header_content h1 a:hover {
	opacity: 0.6;
}



@media screen and (max-width: 767px) {
	#header #header_content h1 img {
		width: 71.70795306388526727509778357236%;	/* 550/767*100 */
	}
}


/**	header	#nav	*****************************************************************/
#header #nav {
	width: 100%;
	padding: 1px 0;
	background-color: #6e8ffa;
}
#header #nav.fixed {
	position: fixed;
	top: 0;
	z-index: 100000;
}

#header #nav ul {
	max-width: 980px;
/*	width: 70%;	/* 980/1400*100 */
	width: 100%;
	margin: 0 auto;
}


#header #nav ul li {
	float: left;
	box-sizing: border-box;
	width: 16.666666666666666666666666666667%;	/* 100/6 */
	padding: 1px;
}
#header #nav ul li a {
	display: block;
	color: #333;
	font-size: 125%;	/* 20/16*100 */
	font-weight: bold;
	font-family: 'Quicksand', sans-serif;
	text-align: center;
	text-decoration: none;
	line-height: 1;
	padding: 0.125em 0;
	border: solid 2px #333;
	border-radius: 2px;
}

#header #nav ul li a:hover {
	color: #FFF;
}

#header #nav ul li a.active {
}


@media screen and (max-width: 1200px) {
	#header #nav ul li a {
		font-size: 112.5%;	/* 18/16*100 */
	}
}

@media screen and (max-width: 1024px) {
	#header #nav ul li a {
		font-size: 100%;	/* 16/16*100 */
	}
}

@media screen and (max-width: 767px) {
	#header #nav ul li {
		width: 33.333333333333333333333333333333%;	/* 100/3 */
	}
}





/************************************************************************************************************************************
	main	-CommonSetting-
************************************************************************************************************************************/
#main {
	width: 100%;
	padding: 0;
	margin: 0;
	background-image: url('../img/bg.jpg');
	background-position: left top;
	background-repeat: repeat;
}

@media screen and (max-width: 767px) {
	#main {
		width: 100%;
		padding: 0;
	}
}




/************************************************************************************************************************************
	footer	-CommonSetting-
************************************************************************************************************************************/
#footer {
	z-index: 1000;
	width: 100%;
	padding: 14.285714285714285714285714285714% 0 3.5714285714285714285714285714286%;	/* 200/1400*100 , 50/1400*100 */
	margin: -7.1428571428571428571428571428571% 0 0;	/* 100/1400*100 */
	background-image: url('../img/footer_bg.png');
	background-size: 100% auto;
	background-position: center top;
	background-repeat: no-repeat;
}

#footer #footer_content h1 {
	color: #FFF;
	font-size: 112.5%;	/* 18/16*100 */
	font-family: '游明朝体', '游明朝', 'Yu Mincho', YuMincho, 
							 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 
							 'Quicksand', '游ゴシック体', 'Yu Gothic', YuGothic, 
							 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', 
							 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	text-align: center;
}

#footer #footer_content p.copy {
	text-align: center;
	width: 100%;
}
#footer #footer_content p.copy small {
	color: #FFF;
	font-size: 75%;	/* 12/16*100 */
}


@media screen and (max-width: 767px) {
	#footer {
		position: relative;
		padding: 19.556714471968709256844850065189% 0 6.5189048239895697522816166883963%;	/* 150/767*100 , 50/767*100 */
		margin: -13.037809647979139504563233376793% 0 0;	/* 100/767*100 */
		background-image: url('../img/footer_bg.png');
		background-size: 200% auto;
		background-position: center top;
		background-repeat: no-repeat;
	}

	#footer #footer_content p.copy small {
		font-size: 62.5%;
	}
}




/************************************************************************************************************************************
	#go_top_btn
************************************************************************************************************************************/
#go_top_btn {
	position: fixed;
	left: 0;
	bottom: 100px;
	z-index: 1;
	width: 100%;
}
#go_top_btn p {
	text-align: right;
	max-width: 980px;
	width: 70%;	/* 980/1400*100 */
	height: 0;
	margin: 0 auto;
}
#go_top_btn p a {
	display: inline-block;
	width: 80px;
	height: 0;
}
#go_top_btn p a img {
	width: 100%;
	height: auto;
}
#go_top_btn p a:hover {
	opacity: 0.7;
}


@media screen and (max-width: 767px) {
	#go_top_btn {
		bottom: 70px;
	}
	#go_top_btn p {
		box-sizing: border-box;
		width: 100%;
		padding: 0 3.3333333333333333333333333333333%;	/* 25/750*100 */
	}
	#go_top_btn p a {
		display: inline-block;
		width: 60px;
		height: 0;
	}
}




/************************************************************************************************************************************
	#contents	-CommonSetting-
************************************************************************************************************************************/
#contents {
	width: 100%;
	margin: 0 auto;
}


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




/** blockTypeElement white space	*****************************************************************/
.box_wrap {
	max-width: 1400px;
	width: 100%;
	margin: 0 auto;
}
.in_box {
	max-width: 980px;
	width: 70%;	/* 980/1400*100 */
	margin: 0 auto;
}
.section {
	margin: 0 auto 10.204081632653061224489795918367%;	/* 100/980*100 */
}

.inner {
	padding: 0 2.5510204081632653061224489795918%;	/* 25/980*100 */
}

.bg_white {
	background-color: rgba(255,255,255, 0.4);
	padding-bottom: 7.1428571428571428571428571428571%;	/* 100/1400*100 */
}

@media screen and (max-width: 1024px) {
	.in_box {
		width: 100%;
	}
}

@media screen and (max-width: 767px) {
	.in_box {
		box-sizing: border-box;
		width: 100%;
		margin: 0 auto;
	}
	.section {
		margin: 0 auto 13.333333333333333333333333333333%;	/* 100/750*100 */
	}
	.inner {
		padding: 0 3.3333333333333333333333333333333%;	/* 25/750*100 */
	}
}




/* Youtube埋め込みタグをレスポンシブル対応にする */
.youtube-wrapper {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	margin: 30px 0;
}
.youtube-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}