@charset "utf-8";
.sub_title1 {
  display:none;
}

h1 {
  margin:0 10px;
}
h1 img {
width:200px;
}
.button,.button2 {
      width:400px;
  font-size:15px;
}
  #nav-primary {
  clear: both;
  width: 100%;
}
  #nav-primary ul,
  #nav-primary li {
  list-style: none;
}
    #nav-primary a {
    float: left;
    display: block;
    padding: 0 7px;
}

/*ヘッダーデザイン---------------------------------------------*/
.container_h {
  width:100%;
  position: fixed;
    top:0;
    z-index: 10;
  background-color:rgba(255,255,255,0.9);
}
#header {
  display: block;
    margin: 0 auto;
    width:100%;

}


#header:after{
  content:"";
  clear:both;
  display:block
}
/* お問い合わせと資料請求のボタンデザイン */
.top_button {
  background-color:rgb(214, 6, 6);
  width:118px;
  text-align:center;
  border-radius:0 0 10px 10px;
  z-index: 11;
    float:left;
  margin:0 10px 0;
  box-shadow: 1px 1px 3px gray;
}
.top_button {
    display:none;
  }
.top_button2 {
    background-color: rgb(214, 6, 6);
    box-shadow:5px -1px 25px grey;
  border:solid 2px #fff;
}
.button,.button2 {
  width:80%;
  font-size:12px;
}

.request_button_d:hover {
  box-shadow: 0px 0px 0px;
}
.request_button_d a{
  color:rgb(255, 255, 255);
  padding:10px;
  display:block;
}
a{
  text-decoration:none;
}
.sub_title1 {
  font-size: 10px;
  position:relative;
  top: 7px;
  left:10px;
}
.logo{
  float:left;
  height:50px;
}
/*  グローバルメニューの基本デザイン*/
#nav-primary {
  display:none;
}
nav{
  float:right;
}
nav>ul{
  float:left;
  position:relative
}
nav li{
  list-style:none;
  float:left
}

nav li a{
  float:left;
  padding:5px 10px 10px 10px;
}

nav li ul{
  display:none
}
nav li:hover ul{
  display:inline
}
nav li li{
  float:none
}

/* メニューのアニメーション1 */
.link_u{
  position: relative;
  display: inline-block;
  color:#000;
  font-size:14px;
}

.link_u:hover {
color:#F30034;
}
#nav-primary {
  display:none;
}

.link_u:before,
.link_u:after{
  position: absolute;
  top: 27px;
  content: "";
  display: inline-block;
  width: 0;
  height: 2px;
  background: #F30034;
  transition: 0.2s;
}
.link_u:before{
  left: 50%;
}
.link_u:after{
  right: 50%;
}
.link_u:hover:before,
.link_u:hover:after{
  width: 50%;
}

/* ハンバーガーメニューの動作 とレスポンシブ時のメニューの変化*/
#menu-icon{
  position:absolute;
  right:0;top:50%;
  margin-top:-12px;
  margin-right:30px;
  display:none;
}
#menu-icon span{
  border:2px solid #000;
  width:30px;
  margin-bottom:5px;
  display:block;
  -webkit-transition:all .2s;
  transition:all .3s}


@media only screen and (max-width: 959px) {
  nav{display:none;width:100%;clear:both;float:none;max-height:400px;overflow-y:scroll}
  #menu-icon{display:inline;top:21px;cursor:pointer}
  #menu-icon.active .first{transform:rotate(45deg);-webkit-transform:rotate(45deg);margin-top:10px}
  #menu-icon.active .second{transform:rotate(135deg);-webkit-transform:rotate(135deg);position:relative;top:-9px;}
  #menu-icon.active .third{display:none}
 .search{float:none}
  .search input{width:100%}
  nav{padding:10px}
  nav ul{float:none;  background: rgba(255, 255, 255, 0.9);margin: 25px;}
  nav li{float:none}
  nav ul li a{float:none;padding:8px;display:block}
}

@media screen and (min-width:480px) and (max-width:599px) {
    #header {
    width:100%;
  }
      .top_button {
    display:none;
  }
    .button,.button2 {
    width:80%;
  font-size:12px;
}
}

@media screen and (min-width:600px) and (max-width:959px) {
    h1 img {
  width:200px;
}
#header {
    width:100%;
  }
.top_button{
      position: fixed;
      display:block;
  }
  .top_doc {
    right:200px;
  }
  .top_ask {
    right:70px;
  }
}
@media screen and (min-width:960px) and (max-width:1079px) {
  .sub_title1 {
  display:inline;
}

h1 img {
  width:210px;
}

nav{display:block!important}
#nav-primary {
  display:block;
}

    #header {
    width:100%;
  }

.top_button{
      position: fixed;
      display:block;
  }
  .top_doc {
    right:200px;
  }
  .top_ask {
    right:70px;
  }
.requesrt {
  margin:0 auto;
  width:300px;
  position:relative;
    right:-245px;
  bottom:150px;
  display: inline-block;
}
.requesrt .top_button2 {
  display:block;
    width:100%;
    margin-bottom:15px;
}
  .tell p:first-child {
  margin: 0 auto;
  width:500px;
  font-size:20px;
  border-bottom: solid 1.6px #555;
  }
    .button,.button2 {
      width:400px;
  font-size:15px;
}
}
@media screen and (min-width:1080px) {
    .sub_title1 {
  display:block;
}
  h1 img {
  width:210px;
}
nav{
  display:block!important;
  }
#nav-primary {
  display:block;
    height:10px;

}
  .wrap_width {
    width:1080px;
    margin:0 auto;
  }
  #header {
    width:1080px;
  }
.top_button{
      position: relative;
      display:block;
    left:300px;
  }
.button,.button2 {
    width:600px;
  font-size:15px;
}


}
@media screen and (min-width:1320px) {
}
/*ヘッダーデザイン終わり*/
@media screen and (max-width:800px) {
  .requesrt .top_button2{
    padding:10px;
  }
}