@charset "utf-8";
/* ------ ------ ------ ------ ------

 CSS information

 File Name  : base.css
 Author	 : Hiroshi Honjo
 Author URI : https://www.shashin-kagaku.co.jp/skm/
 Style Info : base & commmon

------ ------ ------ ------ ------ */

/* ------ ------ ------ ------ ------ ------ ------ ------
 body & basic
 ----- ------ ------ ------ ------ ------ ------ ------ */
body {
	display: none;
font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
color: #222;
}
*{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}


h1,h2,h3,h4,h5,h6 { font-weight: normal; font-size: 100%;}
img { vertical-align: top;}
a,
a:link	   { color: #005BAC; text-decoration: none;}
a:visited	{ text-decoration: none;}
a:hover		 { color: #005BAC; text-decoration: none;}
a:active	 { text-decoration: none;}

/*
-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
*/
/* ------ ------ ------ ------ ------ ------ ------ ------
 layout common
 ----- ------ ------ ------ ------ ------ ------ ------ */
/* #header
------ ------ ------ ------ ------ ------ */
#header{
	width: 100%;
	height: 70px;
	background: #000;
	position: fixed;
	top: 0px;
	-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
	z-index: 2000;
}
#header .inner{
	width: 1000px;
	height: 70px;
	margin: 0 auto;
	position: relative;
}
#header h1{
	position: absolute;
	left: 24px; top: 23px;
	-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
}
#header h1 a{
	display: block;
	width: 157px;
	height: 25px;
	background: url(../img/logo_w.png) no-repeat;
	overflow: hidden; text-indent: 100%; white-space: nowrap;
	-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
}
#header h1 a:hover{
	opacity: 0.5;
}

/* #gNav
------ ------ ------ ------ ------ ------ */
#gNav{
	width: 600px;
	position: absolute;
	right: 0;
	top: 28px;
	-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
}
#gNav ul{
	display: flex;
	display: -webkit-flex; /* Safari */
	justify-content: space-around;
	-webkit-justify-content: space-around; /* Safari */
}
#gNav li{
	padding: 0 12px;
	text-align: center;
	flex: auto;
	-webkit-flex: auto;
}
#gNav a{
	font-size: 14px;
	color: #FFF;
	-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
}
#gNav a:hover{
	opacity: 0.5;
}
#gNav li:last-child a{
	border: 1px solid #FFF;
	padding: 6px 10px;
}

/* #footer
------ ------ ------ ------ ------ ------ */
#footer{
	width: 100%;
	height: 70px;
	background: #000;
	position: fixed;
	bottom: 0px;
	-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
	z-index: 1500;
}
#footer .inner{
	width: 1000px;
	height: 70px;
	margin: 0 auto;
	position: relative;
}
#footer small{
	line-height: 70px;
	color: #FFF;
	font-family: Verdana, Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#footer .skLink{
	position: absolute;
	right: 0; top: 14px;
}
#footer .skLink a{
	display: block;
	width: 217px;
	height: 43px;
	background: url(../img/logo_sk.png) no-repeat;
	overflow: hidden; text-indent: 100%; white-space: nowrap;
	-webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
}
#footer .skLink a:hover{
	opacity: 0.5;
}











/* ------ ------ ------ ------ ------ ------ ------ ------
 clear
 ----- ------ ------ ------ ------ ------ ------ ------ */
.clear { clear: both;}
/* CSS -micro clearfix */
.cf:before,.cf:after {content: "";display: table;}
.cf:after{clear:both;}
.cf{zoom: 1;}