@charset "utf-8";
/* ===================================================================
CSS information

file name  :common.css
style info  :ベース設定
=================================================================== */
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 960px) {
.pc { display: none !important; }
.sp { display: block !important; }
}


/*--------------------------------------------------------------------
基本設定
--------------------------------------------------------------------*/
html,body {
width:100%;
height:100%;
color: #484848;
}

html {
height:100%;
overflow-y:scroll;
}

/*--Reset-----------------------------------------------------------*/
* {
margin:0;
padding:0;
}

a {
text-decoration:none;
}

img {
border:none;
vertical-align:middle;
}

ul,ol {
list-style:none;
}

*, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
/*--Text------------------------------------------------------------*/
body {
background: url(../images/bg_head.gif) repeat-x;
font-size:88%;
font-weight:normal;
line-height:1.5;
font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

* html body {/*IE6*/
font-family:"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

*:first-child + html body {/*IE7*/
font-family:"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

h2,h3,h4,h5,h6 {
font-size:100%;
}

/*--Link------------------------------------------------------------*/
a,a:link {color:#333333;}
a:visited {color:#333333;}
a:hover,a:active {color:#777777;}
a:focus {outline:none;}

/*--HTML5-----------------------------------------------------------*/
article,aside,details,footer,header,hgroup,menu,nav,section,summary {
display:block;
}


/*--------------------------------------------------------------------
共通パーツ
--------------------------------------------------------------------*/
h1 {
margin: 15px 0 0 0;
float:left;
font-weight: normal;
font-size: 11px;
color: #818181;
}

h1 img{
margin: 10px 0 0 0;
}

h2 {
}

#column1 p {
}

#column2 p {
}

#wrap-btm p {
}

#wrapper {
width:100%;
overflow:hidden;
}


/*--------------------------------------------------------------------
header（ヘッダー部分）
--------------------------------------------------------------------*/
header {
background: url(../images/bg_m.jpg) no-repeat bottom center;
height: 100px;
text-align:left;
margin:0 auto;
overflow:hidden;
}

header #sub_btn{
float: right;
}
header #sub_btn dl{
margin: 10px 0 0 0;
float: left;
}
header #sub_btn dt{
float: left;
}
header #sub_btn dd{
margin: 0 0 0 5px;
float: left;
}
header #sub_btn ul{
float: left;
}
header #sub_btn li{
float: left;
margin: 0 0 0 10px;
}
/*--nav------------------------------------------------------------*/
header nav{
margin: 29px 0 0 0;
float:right;
}

header nav ul{
overflow:hidden;
width:714px;
}

header nav ul li{
float:left;
padding:0 0 0 0;
}


/*--------------------------------------------------------------------
content（コンテンツ部分）
--------------------------------------------------------------------*/
#content {
clear:both;
margin:0 auto 30px;
}

#content #main_column{
}

/*--aside------------------------------------------------------------*/
#content aside{
float:right;
text-align:left;
width:150px;
}

#content aside ul{
}

#content aside ul li{
}


/*--------------------------------------------------------------------
footer部分
--------------------------------------------------------------------*/
#wrap-btm {
background: url(../images/bg_foot.gif) repeat-x 0 31px;
clear:both;
width:100%;
text-align:center;
overflow: hidden;
}

#wrap-btm footer {
text-align:left;
margin:0 auto;
}

#wrap-btm footer ul#fm{
margin: 20px 0 0 0;
float: left;
}

#wrap-btm footer ul#fm li{
display: inline;
font-size:0.85em;
background: url(../images/icon_arw.gif) no-repeat 0 0.3em;
padding: 0 15px 0 10px;
}

#wrap-btm footer p#pagetop{
text-align: right;
}

#wrap-btm footer p#copyright{
margin: 20px 0 0 0;
float: right;
font-size:0.85em;
color: #666666;
text-align: right;
}

/*--------------------------------------------------------------------
センター固定 or リキッドレイアウトの変更
（リキッドレイアウトにする場合はwidthを100%に変更）
--------------------------------------------------------------------*/
header,
#content,
footer {
width:960px;
}


/*----------------------------------------------------
リンク画像ロールオーバー設定
----------------------------------------------------*/

a img{
-webkit-transition: 0.3s ease-in-out;
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}

a:hover img{
opacity: 0.6;
filter: alpha(opacity=40);
}

a:hover img.nonfade{
filter:alpha(opacity=100);
-moz-opacity:1;
-khtml-opacity: 1;
opacity:1;
-webkit-transition: 0s ease-in-out;  
-moz-transition: 0s ease-in-out;  
-o-transition: 0s ease-in-out;  
transition: 0s ease-in-out;
}


/*----------------------------------------------------
ハンバーガーメニュー
----------------------------------------------------*/
#header{
	position: relative;
}

#openMenu{
	position:absolute;
	top: 0;
	right: 0;
}

#layerMenu{
	display: none;
	position:absolute;
	top:37px;
	left:0;
	width:100%;
	height:100%;
	font-size: 12px;
	z-index:9999;
}

#layerMenu ul{
	border-top: solid 1px #ccc;
}

#layerMenu ul li{
	background: #fff;
	list-style: none;
	border-bottom: solid 1px #ccc;
}

#layerMenu ul li a{
	position: relative;
	padding: 10px;
	text-decoration: none;
	color: #555;
	display: block;
}

#layerMenu ul li a:hover{
	color: #EA0001;
}

#closeMenu {
	position: absolute;
	top: -37px;
	right: 0;




/*--------------------------------------------------------------------
スマートフォン＆タブレット対応
--------------------------------------------------------------------*/
/*デバイスの横幅が960pxpx以下の場合*/
@media only screen and (max-width: 960px) {

#sub_btn{
display: none;
}

header nav{
display: none;
}

header,
#content,
footer {
width:100%;
}

h1 {
margin: 15px 0 0 15px;
}

h1 img{
margin: 10px 0 0 0;
}

header {
    background: none;
}














}

/* デバイスの横幅が768以下の場合 */
@media only screen and (max-width: 768px) {









}