body::before {
  background: url("imgW/haikei.jpg") no-repeat center;/* 画像（ここにfixedは入れない） */
  background-size: cover;/* cover指定できる */
  content: "";
  display: block;
  position: fixed;/* 擬似要素ごと固定 */
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;/* 横幅いっぱい */
  height: 100vh;/* 縦幅いっぱい */
}


body {
  -webkit-text-size-adjust: 100%;
}

@font-face {
   font-family: Arvo;
   src: url('./font/Arvo-Regular.ttf') format("truetype");
}


#wrapper {
  overflow:hidden;
}


.base {
  margin: 0 auto;

}





/* タイトル&コンテンツ タイトル&コンテンツ タイトル&コンテンツ */

/* ワイドPC--- */
  @media (min-width: 768px) {

    .boxSPmenu {    display: none;
        }

.boxMENU {
  width: 100%;
    height: 70px;
      position: fixed;
      padding-top: 30px;

      z-index: 100;
      background-color: rgb(0, 0, 0);
}

.boxTC {
    width: 93%;
    height: 80px;
    max-width: 1190px;
      position: fixed;
      top: 44px;
      left: 0;
      right: 0;
      margin: auto;
      }

      .boxTC > div {
        display: table-cell;
      }

.boxTC:after {
        content:'';
        display: block;
        clear: both; }
.boxMD {float: left;
        width: 25%;
        height: 43px;
        position: relative;

      }
.boxAB {float: left;
        width: 14%;
        height: 43px;
        position: relative;
      }
.boxAC {float: left;
        width: 14%;
        height: 43px;
        position: relative;
      }
.boxME {float: left;
        width: 14%;
        height: 43px;
        position: relative;
      }
.boxMI {float: left;
        width: 14%;
        height: 43px;
        position: relative;
        }
.boxCO {float: left;
        width: 14%;
        height: 43px;
        position: relative;
        }
.boxFb {float: left;
                width: 5%;
                height: 43px;
                position: relative;
                }

.boxMD img {
  width: 90%;
  max-width: 190px;
  display: block;
  margin-bottom: 0;
}


.boxAB img {
  width: 88%;
  max-width: 125px;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.boxAC img {
  width: 88%;
  max-width: 125px;
  display: block;
  position: absolute;
    top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.boxME img {
  width: 88%;
  max-width: 125px;
  display: block;
  position: absolute;
    top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.boxMI img {
  width: 88%;
  max-width: 125px;
  display: block;
  position: absolute;
    top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.boxCO img {
  width: 88%;
  max-width: 125px;
  display: block;
  position: absolute;
    top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.boxFb img {
  width: 65%;
  max-width: 44px;
  display: block;
  position: absolute;
    top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}


.space0 {
  width: 100%;
  height: 150px;
}

.box1 {
  width: 770px;
  margin: 0 auto;
}

.box1 img {
  width: 770px;
  display: block;
  margin: 0 auto;

}

.space1 {
  width: 100%;
  height: 60px;
}

.space2 {
  width: 100%;
  height: 30px;
}

.box02 {

  width: 573px;
  margin: 0 auto;
}

.box02 p {
margin-top: 30px;
  color: rgb(255, 255, 255);
  text-align: left;
  font-size: 13.5px;
  font-family: Helvetica;
  font-weight: lighter;
  line-height: 2.0;
  letter-spacing: 0.2em;
}


  }
/* ---ワイドPC */



/* スマホ横--- */
@media (max-width: 768px) {
    @media (min-width: 450px) {

      .boxMENU {    display: none;
      }



      .boxMD {
              width: 100%;
              height: 75px;
              position: fixed;
    background-color: black;
    z-index: 2;
            }




    .boxMD img {
                width: 100%;
                max-width: 180px;
                margin-top: 25px;
               margin-left: 30px;
                      }


                      /*============
                      nav
                      =============*/
                      nav {
                        display: block;
                        position: fixed;
                        top: 75px;
                        left: -300px;
                        bottom: 0;
                        width: 300px;
                        background: black;
                        overflow-x: hidden;
                        overflow-y: auto;
                        -webkit-overflow-scrolling: touch;
                        transition: all .5s;
                        z-index: 3;
                        opacity: 0;
                      }
                      .open nav {
                        left: 0;
                        opacity: 0.8;
                      }
                      nav .inner {
                        padding: 25px;
                      }
                      nav .inner ul {
                        list-style: none;
                        margin: 0;
                        padding: 0;
                      }
                      nav .inner ul li {
                        position: relative;
                        margin: 0;
                        border-bottom: 1px solid #333;
                      }
                      nav .inner ul li a {
                        display: block;
                        color: white;
                        font-size: 12px;
                        padding: 1em;
                        text-decoration: none;
                        transition-duration: 0.2s;
                        letter-spacing: 0.15em;
                      }
                      nav .inner ul li a:hover {
                        background: #002B3B;
                      }
                      @media screen and (max-width: 767px) {
                        nav {
                          left: -220px;
                          width: 220px;
                        }
                      }
                      /*============
                      .toggle_btn
                      =============*/
                      .toggle_btn {
                        display: block;
                        position: fixed;
                        top: 30px;
                        right: 30px;
                        width: 30px;
                        height: 30px;
                        transition: all .5s;
                        cursor: pointer;
                        z-index: 3;
                      }
                      .toggle_btn span {
                        display: block;
                        position: absolute;
                        left: 0;
                        width: 30px;
                        height: 2px;
                        background-color: white;
                        border-radius: 4px;
                        transition: all .5s;
                      }
                      .toggle_btn span:nth-child(1) {
                        top: 4px;
                      }
                      .toggle_btn span:nth-child(2) {
                        top: 14px;
                      }
                      .toggle_btn span:nth-child(3) {
                        bottom: 4px;
                      }
                      .open .toggle_btn span {
                        background-color: #fff;
                      }
                      .open .toggle_btn span:nth-child(1) {
                        -webkit-transform: translateY(10px) rotate(-315deg);
                        transform: translateY(10px) rotate(-315deg);
                      }
                      .open .toggle_btn span:nth-child(2) {
                        opacity: 0;
                      }
                      .open .toggle_btn span:nth-child(3) {
                        -webkit-transform: translateY(-10px) rotate(315deg);
                        transform: translateY(-10px) rotate(315deg);
                      }
                      /*============
                      #mask
                      =============*/
                      #mask {
                        display: none;
                        transition: all .5s;
                      }
                      .open #mask {
                        display: block;
                        position: fixed;
                        top: 0;
                        left: 0;
                        width: 100%;
                        height: 100%;
                        background: #000;
                        opacity: 0.6;
                        z-index: 2;
                        cursor: pointer;
                      }
                      /*============
                      main
                      =============*/
                      main {
                        padding: 50px;
                      }
                      main h1 {
                        font-family: 'Open Sans', sans-serif;
                        font-weight: 400;
                        text-align: center;
                      }
                      /*============
                      body
                      =============*/
                      body {
                        font-family: 'Open Sans', sans-serif;
                        font-weight: 400;
                      }





              .space0 {
                width: 100%;
                height: 110px;
              }

            .box1 {
              width: 630px;
              margin: 0 auto;
            }

            .box1 img {
              width: 630px;
              display: block;
              margin: 0 auto;

            }

            .space1 {
              width: 100%;
              height: 40px;
            }

            .space2 {
              width: 100%;
              height: 20px;
            }

            .box02 {

              width: 465px;
              margin: 0 auto;
            }

            .box02 p {
            margin-top: 30px;
              color: rgb(255, 255, 255);
              text-align: left;
              font-size: 11.5px;
              font-family: Helvetica;
              font-weight: lighter;
              line-height: 2.0;
              letter-spacing: 0.2em;
            }



      }
}
/* ---スマホ横*/


/* スマホ縦-- */
@media (max-width: 450px) {

  .boxMENU {    display: none;
  }




  .boxMD {
          width: 100%;
          height: 85px;
          position: fixed;
background-color: black;
z-index: 2;
        }




.boxMD img {
            width: 100%;
            max-width: 180px;
            margin-top: 25px;
           margin-left: 20px;
                  }




                  /*============
                  nav
                  =============*/
                  nav {
                    display: block;
                    position: fixed;
                    top: 85px;
                    left: -300px;
                    bottom: 0;
                    width: 300px;
                    background: black;
                    overflow-x: hidden;
                    overflow-y: auto;
                    -webkit-overflow-scrolling: touch;
                    transition: all .5s;
                    z-index: 3;
                    opacity: 0;
                  }
                  .open nav {
                    left: 0;
                    opacity: 0.8;
                  }
                  nav .inner {
                    padding: 25px;
                  }
                  nav .inner ul {
                    list-style: none;
                    margin: 0;
                    padding: 0;
                  }
                  nav .inner ul li {
                    position: relative;
                    margin: 0;
                    border-bottom: 1px solid #333;
                  }
                  nav .inner ul li a {
                    display: block;
                    color: white;
                    font-size: 12px;
                    padding: 1em;
                    text-decoration: none;
                    transition-duration: 0.2s;
                    letter-spacing: 0.15em;
                  }
                  nav .inner ul li a:hover {
                    background: #002B3B;
                  }
                  @media screen and (max-width: 767px) {
                    nav {
                      left: -220px;
                      width: 220px;
                    }
                  }
                  /*============
                  .toggle_btn
                  =============*/
                  .toggle_btn {
                    display: block;
                    position: fixed;
                    top: 30px;
                    right: 30px;
                    width: 30px;
                    height: 30px;
                    transition: all .5s;
                    cursor: pointer;
                    z-index: 3;
                  }
                  .toggle_btn span {
                    display: block;
                    position: absolute;
                    left: 0;
                    width: 30px;
                    height: 2px;
                    background-color: white;
                    border-radius: 4px;
                    transition: all .5s;
                  }
                  .toggle_btn span:nth-child(1) {
                    top: 4px;
                  }
                  .toggle_btn span:nth-child(2) {
                    top: 14px;
                  }
                  .toggle_btn span:nth-child(3) {
                    bottom: 4px;
                  }
                  .open .toggle_btn span {
                    background-color: #fff;
                  }
                  .open .toggle_btn span:nth-child(1) {
                    -webkit-transform: translateY(10px) rotate(-315deg);
                    transform: translateY(10px) rotate(-315deg);
                  }
                  .open .toggle_btn span:nth-child(2) {
                    opacity: 0;
                  }
                  .open .toggle_btn span:nth-child(3) {
                    -webkit-transform: translateY(-10px) rotate(315deg);
                    transform: translateY(-10px) rotate(315deg);
                  }
                  /*============
                  #mask
                  =============*/
                  #mask {
                    display: none;
                    transition: all .5s;
                  }
                  .open #mask {
                    display: block;
                    position: fixed;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    background: #000;
                    opacity: 0.6;
                    z-index: 2;
                    cursor: pointer;
                  }
                  /*============
                  main
                  =============*/
                  main {
                    padding: 50px;
                  }
                  main h1 {
                    font-family: 'Open Sans', sans-serif;
                    font-weight: 400;
                    text-align: center;
                  }
                  /*============
                  body
                  =============*/
                  body {
                    font-family: 'Open Sans', sans-serif;
                    font-weight: 400;
                  }





          .space0 {
            width: 100%;
            height: 110px;
          }

          .box1 {
            width: 410px;
            margin: 0 auto;
          }

          .box1 img {
            width: 410px;
            display: block;
            margin: 0 auto;

          }

          .space1 {
            width: 100%;
            height: 20px;
          }

          .space2 {
            width: 100%;
            height: 10px;
          }

          .box02 {

            width: 305px;
            margin: 0 auto;
          }

          .box02 p {
          margin-top: 30px;
            color: rgb(255, 255, 255);
            text-align: left;
            font-size: 11px;
            font-family: Helvetica;
            font-weight: lighter;
            line-height: 2.0;
            letter-spacing: 0.2em;
          }




  }
/* ---スマホ縦 */




















/* WORKS WORKS WORKS WORKS WORKS WORKS WORKS WORKS  */









.box0W {
  display: none;}





  .inviewfadeInUp {
       opacity: 0;
       transform: translate(0, 60px);
       -webkit-transform: translate(0, 60px);
       transition: 1.5s;
   }

   .fadeInUp {
       opacity: 1.0;
       transform: translate(0, 0);
       -webkit-transform: translate(0, 0);
   }














/* ワイドPC--- */
    @media (min-width: 768px) {



    }
  /* ---ワイドPC */


/* スマホ横--- */
@media (max-width: 768px) {
      @media (min-width: 450px) {



      }
      }
  /* ---スマホ横*/


/* スマホタテ--- */
    @media (max-width: 450px) {


      }

  /* ---スマホタテ*/















/* コピーライト */


.CPR {
  display: none;}




.CPR p {
  padding: 50px 0 100px 0;
  color: rgb(255, 255, 255);
  text-align: center;
  font-size: 9px;
  font-family: Helvetica;
  line-height: 1.6;
  letter-spacing: 0.1em;
}