body {
    font-family:"游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
    font-style: normal;
    color:#000;
    font-size:12px;
    line-height: 16px;
    background: #fff;
    text-align: center;
}

@font-face {
  font-family: 'Futura Light';
  src: url('../fonts/futura-light.woff') format('woff'),
       url('../fonts/futura-light.ttf') format('truetype');
}

@font-face {
  font-family: 'Futura Medium';
  src: url('../fonts/futura-medium.woff') format('woff'),
       url('../fonts/futura-medium.ttf') format('truetype');
}
.fontF {
    font-family:"Futura Light";
}
.fontB {
    font-family:"Futura Medium";
    font-weight: bold;
}

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

a:hover {
    color:#999;
}


.dpc{display: none;}
.dsp{display: block;}

.pageTop{
  position: fixed;
  bottom: 30px;
  width: 20px;
  height: 60px;
  right: 8%;
  cursor: pointer;
}

.pageTop.active img{
  opacity: 1;
}

.pageTop img{
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity, .5s;
}

h2 {
    font-size:18px;
    margin-bottom: 65px;
    display: inline-block;
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    position:fixed;
    top:150px;
    right:-28px;
    z-index: 60;
}

h2:after {
    content: "";
    display: block;
    width:200px;
    height:1px;
    background-color: #000;
    margin-top:15px;

}


h3 {
    font-size:36px;
}

.active {
    color:#999;
}

.nav ul li{
    position: relative;
}
.nav ul li a:hover{
  color: #000;
}
.nav ul li a:hover .square{
    width: 100%;
}

.nav ul li .square{
    position: absolute;
    top: 0;
    bottom: 0;
    width: 0;
    height: 3px;
    margin: auto;
    left: 0;
    background-color: #666;
    transition: all 0.3s ease;
}

@media screen and (max-width:640px) {

    body {
        font-size:10.5px;
        line-height: 16px;
    }

    h2 {
        font-size:9px;
        margin-bottom: 65px;
        display: inline-block;
        top:100px;
        right:-20px;
    }

    h2:after {
        content: "";
        display: block;
        width:100px;
        height:1px;
        background-color: #000;
        margin-top:7px;
    }

    h3 {
        font-size:18px;
    }

    .dpc{display: block;}
    .dsp{display: none;}

    header {
        width:100%;
        position: inherit;
        bottom:inherit;
        left:0;
    }

    #header_bar {
        width: 100%;
        height: 27px;
        padding-top:13px;
        padding-bottom:10px;
        position:fixed;
        top:0;
        left:0;
        z-index: 99;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        justify-content: space-between;
    }

    .toggle{
        width:17px;
        height: 20px;
        -webkit-transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
        transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
        -webkit-transform: translate3d(0, 0, 0);
        margin-top:7px;
        margin-right:21px;
        position: relative;
    }

    .toggle .nav1,
    .toggle .nav2{
      position: absolute;
      top: 0;
      left: 0;
      content: ' ';
      z-index: 100;
      width: 100%;
      height: 2px;
      -webkit-transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
      transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
      background-color: #000;
    }

    .toggle .nav2{
      top: 10px
    }

    .toggle.open .nav1{
      -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      transform: rotate(-45deg);
      top: 2px;
    }

    .toggle.open .nav2{
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg);
      top: 2px;
    }


    #nav {
        font-size: 17.5px;
        text-align: center;
        display: none; /*トグルにしてください*/
    }

    #nav ul{
        width:100vw;
        height:100vh;
        background-color:rgba(255,255,255,0.79);
        padding-top:150px;
        position:fixed;
        top:0;
        left: 0;
        z-index: 80;
        cursor: pointer;
    }

    #nav ul li{
        margin-bottom:30px;
    }

    .pageTop{
      width: 15px;
      height: 30px;
    }
}