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

/* common&reset */
body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, a, pre, form, fieldset, input, textarea, p, blockquote, th, td, address{
	font-style: normal;
	font-weight: normal;
	font-size:100%;
	margin: 0;
	padding: 0;
	}

ul, li {
	list-style-type: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}
img{
	width:100%;
	margin:0;
	padding:0;
	vertical-align: bottom;
	border: 0 none;
	}
	
a {
	text-decoration:none;
	color: #2EA7E0;
}

a:hover {
	color:#F60;
}

body {
	width: 100%;
	height:100%;
	background-position: 50% 50%;
	background-attachment:fixed;
	font-size: 16px;
	color: #434343;
	line-height: 1.8em;
	font-family: "メイリオ","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  -webkit-text-size-adjust: 100%;
  }


a:hover img {
	opacity:0.75;
	filter: alpha(opacity=75);
	-ms-filter: "alpha( opacity=75 )";
}
section {}

article, aside, figure, figcaption, footer, header, nav, section {
	display: block;
}

/*共通*/
#over{overflow: hidden;}

.right{float:right;}
.left{float:left;}

.pc{display:block;}
.sp{display:none;}



/*インナー*/
.inner{padding:0 5%;margin:0 auto;width:90%;max-width:960px;}

/*ヘッダー*/
header h1{max-width:480px;float:left;padding-top:7%;}
header .btn_order{max-width:152px;float:right;padding:2% 0 0;}
header .header_wrap{background:url(../img/common/head_bg.jpg) bottom center no-repeat;min-height:185px;}


/*メインイメージ*/


/*ナビ*/
nav.pc{background:#000;}
nav.pc li{float:left;border-left:1px #ccc solid;width:33%;text-align:center;}
nav.pc li.last{border-right:1px #ccc solid;}
nav.pc li:hover{background:#666;}
nav.pc li a{display:block;width:100%;font-size:1.2em;color:#FFF;padding:4% 0;}


/*コンテンツ*/

#contents{padding:8% 0 0;font-size:20px;line-height:1.8em;}



/*フッター*/
footer{background:#000;color:#FFF;padding:2% 0 0;}
footer h4{font-size:1.2em;font-weight:bold;}
footer .copy{display:block;margin-top:2%;text-align:right;}

.ftr_link{margin:10% auto 5%;max-width:760px;}
.ftr_link li{max-width:250px;width:33%;float:left;border-left:1px #888 solid;display:block;text-align:center;}
.ftr_link li.last{border-right:1px #888 solid;}


/*共有*/
.cf:after {
  display: block;
  clear: both;
  content: "";
}




/*navi開閉部分*/
    .nav-wrap{
		display:block;
        box-sizing: border-box;
        position: fixed;
        top: 0;
        width: 100%;
		float:left;
		z-index:200;
}
    .gnav {
      list-style-type: none;
      background: #fff;
      width: 100%;
      /*　z-indexは.wrapper部分でpositionを使用した場合は適切な数字（一番大きい値）に変更*/
      z-index: 200;
      position: relative;
	  border-top:1px #888 solid;
}

    .gnav li {
      border-bottom: 1px solid #ccc;
}
	.gnav li:hover {
      background: #ddd;
}

    .gnav li a {
      display: block;
      text-decoration: none;
      /* (44-16)/2=14px */
      padding: .5rem 1rem;
  	  color:#003459;
}
    /*ハンバーガーボタン*/

    .icon-animation {
      width: 50px;
      height: 50px;
      display: block;
      cursor: pointer;
      float: right;
      position: absolute;
      right: 0;
      text-align: center;
      top: 0;
	  background:#fff;
	  border-left:1px #ccc solid;
	  border-bottom:1px #ccc solid;
	  z-index:999;
}
.icon-animation .menutext {
      position: absolute;
      top: 110%;
        font-size:11px;
     font-weight:bold;
 font-feature-settings : "palt";

        text-align:left;
}
    
.icon-animation span {
      width: 40px;
      height: 3px;
      display: block;
      background: #003459;
      position: absolute;
      left: 55%;
      top: 45%;
      margin-left: -23px;
      -webkit-transition: all 0.3s;
      transition: all 0.3s;
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
	  border-radius: 3px;		/* CSS3草案 */
	  -webkit-border-radius: 3px;	/* Safari,Google Chrome用 */
	  -moz-border-radius: 3px;	/* Firefox用 */
}

 .icon-animation .top {
      -webkit-transform: translateY(-10px);
      -ms-transform: translateY(-10px);
      transform: translateY(-10px);
}

.icon-animation .bottom {
      -webkit-transform: translateY(10px);
      -ms-transform: translateY(10px);
      transform: translateY(10px);
}

.is-open .middle {
      background: rgba(51, 51, 51, 0);
}

.is-open .top {
      -webkit-transform: rotate(-45deg) translateY(0px);
      -ms-transform: rotate(-45deg) translateY(0px);
      transform: rotate(-45deg) translateY(0px);
}

.is-open .bottom {
      -webkit-transform: rotate(45deg) translateY(0px);
      -ms-transform: rotate(45deg) translateY(0px);
      transform: rotate(45deg) translateY(0px);
}


.pgtop{
	border: medium none;
    bottom: 45px;
    cursor: pointer;
    background:url("../img/common/pt_img.png") no-repeat;
    height: 30px;
    overflow: hidden;
    position: fixed;
    right: 20px;
    text-decoration: none;
    width: 30px;
    z-index: 100;
    opacity:0;
    transition:all 0.5s;
}

/*フェードイン*/
.fadein{
opacity:1;
filter: alpha(opacity=100);
-ms-filter: "alpha( opacity=100 )";
  transition:all 0.5s;
}


@media screen and (max-width:700px) {
.pc{display:none;}
.sp{display:block;}

/*文字サイズ*/
.f28{font-size:1.1em;}
.f32{font-size:1.5em;}


/*ヘッダー*/
header h1{max-width:650px;float:none;margin:0 auto;padding:0 10%;position:absolute;top:27%;}
header .header_wrap{background:url(../img/common/head_bg.jpg) center 20px no-repeat;position: relative;width:100%;min-height:150px;border-bottom:10px #000 solid;}

/*フッター*/
footer{padding:4% 0;}
footer address{width:100%;text-align:center;}
footer .copy{text-align:center;line-height:1.2em;margin-top:8%;}

.ftr_link{margin:5% 0 0;}
.ftr_link li{
	max-width:700px;
	width:100%;
	float:none;
	border-left:none;
	border-bottom:1px #FFF solid;
	text-align:left;
	}
.ftr_link li a{
	color:#FFF;
	background:#77181D url(../img/common/icon_arrow.png) 10px 10px no-repeat;
	padding:1% 0 1% 30px;
	display:block;
	}
.ftr_link li a:hover{
	background:#541017 url(../img/common/icon_arrow.png) 10px 10px no-repeat;
}
.ftr_link li.last{border-right:none;}


/*メインイメージ*/
.main_img{
	background:none;
	padding:0;
	}


/*ナビ*/
nav ul li div{position:absolute;}
nav ul li div ul{margin:10px 0 0 -120px;}
nav ul li div li{padding:10px 20px;background:#000;}
nav ul li div li:hover{}

/*コンテンツ*/
#contents{padding:8% 0;font-size:16px;line-height:1.8em;}



}


@media screen and (max-width:600px) {
/*ヘッダー*/
header h1{top:36%;padding:0 2%;}
}