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

*, *:before, *:after {-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0}

a{text-decoration:none;color:#fff}

#header:after{content:"";clear:both;display:block;background-color: #000}
.search{float:right;padding:30px}
input{border:none;padding:10px;border-radius:20px}
.logo{padding:0px 0px}
.logo a{font-size:20px;display:block;padding:0px 0px 0px 0px}
nav>ul{
    float: left;
    position: relative;
}
nav li{list-style:none;float:left}
nav .dropdown{position:relative}
nav li a{float:left;padding:35px}
nav li a:hover{background: #565656}
nav li ul{display:none}
nav li:hover ul{display:inline}
nav li li{float:none}
nav .dropdown ul{position:absolute;left:0;top:100%;background:#fff;padding:20px 0;border-bottom:3px solid #34495e}
nav .dropdown li{white-space:nowrap}
nav .dropdown li a{padding:10px 35px;font-size:13px;min-width:200px}
nav .mega-dropdown{width:100%;position:absolute;top:100%;left:0;background:#fff;overflow:hidden;padding:20px 35px;border-bottom:3px solid #34495e}
nav li li a{float:none;color:#333;display:block;padding:8px 10px;border-radius:3px;font-size:13px}
nav li li a:hover{background:#bdc3c7;background:#FAFBFB}
.mega-col{width:33%;float:left}
#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 .1s}


@media only screen and (max-width: 760px) {
  #header{background:#fff;width:100%;position:relative}
  .sp_only {
      display: block;
      overflow: hidden;
  }
  .pc_only {
      display: none;
  }
  .sp_only ul li:first-child {
      float: left;
      width: 35%;
      text-align: left;
  }
  .sp_only ul li{
      float: left;
      width: 15%;
      text-align: left;
  }
  .sp_only ul li img {
      max-height: 50px;
  }
  nav{display:none;width:100%;clear:both;float:none;max-height:100%;margin-bottom: 65px; overflow-y:scroll}
  #menu-icon{display:inline;top:30px;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}
  nav li{float:none}
  nav ul li a{float:none;padding:5px 0px 5px 15px;text-align: left; display:block;}
  #header nav ul ul{display:block;position:static;background:none;border:none;padding:0}
  #header nav a{color:#000;padding:10px 20px}
  #header nav a:hover{background:#fff;color:#333;border-radius:1px}
  #header nav ul li li a:before{content:"- "}
  .mega-col{width:100%}
  .megamenuL {
      color: none;
  }
  .menustackbox {
      width: 100%;
      background-color: #000;
  }
  .site-header{
        /*position: absolute;
        justify-content: space-between;
        z-index: 200;
        width: 100%;*/
    }
    .site-header.fixed {
        /*position: absolute;
        top: 0;*/
    }
    .site-header.fixed {
        /*position: fixed;
        overflow-y: scroll;
        top: 0;
        z-index: 99;
        width:100%;
        height:100%;
        -webkit-overflow-scrolling: touch;*/
    }
}

@media only screen and (min-width: 760px) {
  #header{background:#000;width:100%;position:relative}
  .sp_only {
      display: none;
  }
  .pc_only {
      display: block;
      overflow: hidden;
  }
  nav >ul>li >a{padding:20px 18px;}
  nav{float:left;font-size: 80%;;background-color: #000000;}
  nav{display:block!important}
  .megamenuL {
      color: #2E2E2E ;
  }
  .menustackbox {
      width: 100%;
      background-color: #000;
  }
  .site-header{
        position: absolute;
        justify-content: space-between;
        z-index: 200;
        width: 100%;
        border-bottom: solid 1px #2E2E2E;
        background-color: #000;
    }
    .site-header.fixed {
        position: fixed;
        top: 0;
    }
}

@media only screen and (min-width: 1020px) {
  #header{background:#000;width:100%;position:relative}
  .sp_only {
      display: none;
  }
  .pc_only {
      display: block;
      overflow: hidden;
  }
  nav >ul>li >a{padding:18px 25px}
  nav {
    float: left;
    font-size: 100%;
    background-color: #000000;
  }
  .menustackbox {
      width: 980px;
      margin: 0px auto;
      background-color: #000;
  }
  .megamenuL {
      color: #2E2E2E ;
  }
  .site-header{
        position: absolute;
        justify-content: space-between;
        z-index: 200;
        width: 100%;
        background-color: #fff;
        border-bottom: solid 1px #2E2E2E;
        background-color: #000;
    }
    .site-header.fixed {
        position: fixed;
        top: 0;
    }
}
