body{
	color: #212121;
	font-family: "Yu Gothic", "Yu Gothic", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック";	
	font-size: 14px;
	line-height: 26px;
}
	
a{outline: none!important; text-decoration: none; color: #212121;}
a:hover{opacity: 0.6;}
*{transition: 0s;}
	
/*==========================================================
	
	header

==========================================================*/
header{
	width: 100%;
	position: fixed;
	transition: 0.6s;
	z-index: 9999;
}

header h1{
	background: #FFF;
	overflow: hidden;
	float: left;
	padding: 20px 40px 20px 38px;
}

header h1 a{
	background: url("../img/common/h1.jpg") no-repeat;
	background-size: cover;
	width: 67px;
	padding-top: 53px;
	height: 0;
	overflow: hidden;
	display: inline-block;
}

header ul{
	float: right;
	margin-right: 45px;
	margin-top: 35px;
}

header ul li{
	display: inline-block;
	margin-right: 35px;
	letter-spacing: 3px;
	text-align: center;
}

header ul li a{display: inline-block; line-height: 18px;}

header ul li span{
	display: inline-block;
	font-size: 10px;
}

header ul li a{color: #FFF;}

/*スクロール後色を変える*/
header.black{background: rgba(255,255,255,0.85);}
header.black ul li a{color: #000000;}

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

	header ul{margin-right: 0;}

}

@media screen and (max-width: 710px) {
	header h1{padding: 15px 40px 7px 38px;}
	header h1 a{width: 57px; padding-top: 48px;}
	
	header ul{
		float: none;
		margin: 0 auto;
	}
	
	header ul li{
		display: block;
		margin: 0 auto 40px;
	}
	
	/* ハンバーガーメニュー */
	header nav {
		position: fixed;
		top: 0;
		right: -1000px;
		width: 100%;
		height: 100%;
		padding-top: 130px;
		/*background:#333;*/
		box-sizing: border-box;
		z-index: 2;
		background-image:linear-gradient( 50deg, rgb(81,221,136) 0%, rgb(64,193,196) 38%, rgb(46,164,255) 81%);
		background-image: -moz-linear-gradient( 50deg, rgb(81,221,136) 0%, rgb(64,193,196) 38%, rgb(46,164,255) 81%);
		background-image: -webkit-linear-gradient( 50deg, rgb(81,221,136) 0%, rgb(64,193,196) 38%, rgb(46,164,255) 81%);
		background-image: -ms-linear-gradient( 50deg, rgb(81,221,136) 0%, rgb(64,193,196) 38%, rgb(46,164,255) 81%);
	}

	header .btn-gnavi {
		position: fixed;
		top: 27px;
		right: 20px;
		width: 30px;
		height: 24px;
		z-index: 3;
		box-sizing: border-box;
		cursor: pointer;
		-webkit-transition: all 400ms;
		transition: all 400ms
	}

	header .btn-gnavi span {
		position: absolute;
		width: 30px;
		height: 4px;
		background: #FFFFFF;
		border-radius: 10px;
		-webkit-transition: all 400ms;
		transition: all 400ms
	}

	header .btn-gnavi span:nth-child(1) {
		top: 0
	}

	header .btn-gnavi span:nth-child(2) {
		top: 10px
	}

	header .btn-gnavi span:nth-child(3) {
		top: 20px
	}

	header .btn-gnavi.open {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg)
	}

	header .btn-gnavi.open span {
		background: #fff
	}

	header .btn-gnavi.open span {
		width: 24px;
	}
	header .contents section p {
		position: absolute;
		top: 50%;
		width: 30%;
		line-height: 1.4;
		font-size: 20px;
		color: #fff;
		text-shadow: 0 0 6px #666
	}

	header .contents section:nth-child(odd) p {
		left: 10%
	}

	header .contents section:nth-child(even) p {
		right: 10%
	}
	
	/*スクロール後色を変える*/
	header.black ul li a{color: #FFFFFF;}
	header.black .btn-gnavi span{background:#272727;}
}

/*==========================================================
	
	#hed

==========================================================*/
#hed{
	width: 100%;
	padding: 170px 0 115px;
	background: url("../img/common/hed.jpg");
	background-size: cover;
	text-align: center;
}

@media screen and (max-width: 700px) {
	#hed{
		padding: 130px 0 80px;
	}
}



/*==========================================================
	
	#pan : パンくず

==========================================================*/
#pan{
	width: 100%;
	padding: 15px 0;
	font-size: 12px;
	font-weight: bold;
	color: #727272;
	border-bottom: 1px solid #e7e7e7;
	text-align: justify;
}

#pan p{
	width: 1100px;
	margin: 0 auto;
}

#pan p a{text-decoration: underline;color: #727272;}
#pan p a:hover{text-decoration: none;opacity: 1;}

@media screen and (max-width: 1200px) {
	#pan p{width: 90%;}
}


/*==========================================================
	
	ページ上部に戻るボタン

==========================================================*/
#page_top{
  position: fixed;
  right: 60px;
  bottom: 103px;
}

@media screen and (max-width: 710px) {
	#page_top{
	  right: 30px;
	  bottom: 30px;
	}
}

/*==========================================================
	
	footer

==========================================================*/
footer{
	width: 100%;
	text-align: center;
	font-size: 12px;
}

footer a{color: #8d8d8d;}

footer > a{display: inline-block; margin: 60px auto 40px;}

footer ul{padding: 25px 0; border-top: 1px solid #ebebeb; border-bottom: 1px solid #ebebeb;}
footer ul li{display: inline-block;}
footer small{display: inline-block; margin: 30px auto; color:#8d8d8d; font-size: 12px;}