@charset "UTF-8";
html {
  overflow-x: hidden; }

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

#header--include {
  width: 100vw; }

#footer--include {
  width: 100vw; }

.onoff1 .off__section {
  padding-bottom: 26.819%; }

.onoff1 .off__animation__container--1 {
  position: relative;
  height: 0;
  padding-top: 79.334%; }

.onoff1 .off__image__01__wrap {
  width: 40%;
  height: 50.421%;
  left: -5.555%;
  top: 20.029%;
  background-image: url(../img/onoff/onoff1/off__image__01.png);
  z-index: 2; }

.onoff1 .off__image__02__wrap {
  width: 86.667%;
  height: 75.631%;
  right: -13.666%;
  top: -2.941%;
  background-image: url(../img/onoff/onoff1/off__image__02.png); }

.onoff1 .off__image__03__wrap {
  width: 25%;
  height: 31.513%;
  right: -8.666%;
  top: 68.488%;
  background-image: url(../img/onoff/onoff1/off__image__03.png); }

.onoff1 .off__animation__container--2 {
  position: relative;
  height: 0;
  margin-top: -5.555%;
  padding-top: 81.556%; }

.onoff1 .off__image__04__wrap {
  width: 57.778%;
  height: 49.047%;
  left: 0;
  top: 18.257%;
  background-image: url(../img/onoff/onoff1/off__image__04.png); }

.onoff1 .off__image__05__wrap {
  width: 33.334%;
  height: 40.872%;
  top: 0;
  right: -13.111%;
  background-image: url(../img/onoff/onoff1/off__image__05.png); }

.onoff1 .off__image__06__wrap {
  width: 30.445%;
  height: 25.886%;
  left: -7.555%;
  top: 58.039%;
  background-image: url(../img/onoff/onoff1/off__image__06.png);
  z-index: 2; }

.onoff1 .off__image__07__wrap {
  width: 26.112%;
  height: 32.017%;
  right: 5.334%;
  top: 50.682%;
  background-image: url(../img/onoff/onoff1/off__image__07.png);
  z-index: 2; }

.onoff1 .off__image__08__wrap {
  width: 20%;
  height: 24.524%;
  right: -8.444%;
  top: 75.477%;
  background-image: url(../img/onoff/onoff1/off__image__08.png); }

.onoff1 .off__info__wrap {
  position: relative;
  width: 76.667%;
  margin-top: -10.777%; }

.onoff1 .off__btn__wrap {
  position: relative;
  width: 50%;
  margin: -6.666% auto 0;
  padding-top: 15.223%; }

.onoff1 .off__btn {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: url(../img/onoff/onoff1/off__btn.png); }

.onoff1 .on__section {
  padding-bottom: 1.364%; }

.onoff1 .on__animation__container--1 {
  position: relative;
  height: 0;
  margin-top: -0.777%;
  padding-top: 87%; }

.onoff1 .on__image__01__wrap {
  width: 86.667%;
  height: 68.966%;
  left: -13.888%;
  top: 0;
  background-image: url(../img/onoff/onoff1/on__image__01.png); }

.onoff1 .on__image__02__wrap {
  width: 26.112%;
  height: 30.013%;
  right: 15.445%;
  top: 13.666%;
  background-image: url(../img/onoff/onoff1/on__image__02.png); }

.onoff1 .on__image__03__wrap {
  width: 20%;
  height: 22.989%;
  right: -1%;
  top: 7.28%;
  background-image: url(../img/onoff/onoff1/on__image__03.png); }

.onoff1 .on__image__04__wrap {
  width: 40%;
  height: 45.978%;
  right: -7.333%;
  top: 54.023%;
  background-image: url(../img/onoff/onoff1/on__image__04.png); }

.onoff1 .on__animation__container--2 {
  position: relative;
  height: 0;
  margin-top: -48.777%;
  padding-top: 44.334%; }

.onoff1 .on__image__05__wrap {
  width: 20%;
  height: 45.113%;
  right: 3.334%;
  top: 0;
  background-image: url(../img/onoff/onoff1/on__image__05.png); }

.onoff1 .on__image__06__wrap {
  width: 26.112%;
  height: 58.898%;
  right: -13.333%;
  top: 41.103%;
  background-image: url(../img/onoff/onoff1/on__image__06.png); }

.onoff1 .on__animation__container--3 {
  position: relative;
  height: 0;
  margin-top: 6.667%;
  padding-top: 54.889%; }

.onoff1 .on__image__07__wrap {
  width: 26.112%;
  height: 47.571%;
  left: -12.444%;
  top: 52.43%;
  background-image: url(../img/onoff/onoff1/on__image__07.png);
  z-index: 2; }

.onoff1 .on__image__08__wrap {
  width: 41.556%;
  height: 52.43%;
  left: 1%;
  top: 26.721%;
  background-image: url(../img/onoff/onoff1/on__image__08.png); }

.onoff1 .on__image__09__wrap {
  width: 48%;
  height: 87.45%;
  right: -2.444%;
  top: 0;
  background-image: url(../img/onoff/onoff1/on__image__09.png); }

.onoff1 .on__info__wrap {
  position: relative;
  width: 74.445%;
  margin-top: -15.777%; }

.onoff1 .on__info__wrap--2 {
  position: relative;
  width: 74.445%;
  margin-top: 3.445%; }

.onoff1 .on__btn__wrap {
  position: relative;
  width: 50%;
  height: 0;
  margin-top: 10.667%;
  padding-top: 15.445%; }

.onoff1 .on__btn {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: url(../img/onoff/onoff1/on__btn.png); }

@media screen and (max-width: 767px) {
  .onoff1 .top__kv__wrap {
    background-image: url(../img/onoff/onoff1/top__title__kv_sp.png); }
  .onoff1 .off__section {
    padding-bottom: 46.094%; }
  .onoff1 .off__animation__container--1 {
    height: 80.625vw;
    margin-top: 49.167%; }
  .onoff1 .off__image__01__wrap {
    width: 33.594%;
    height: 41.667%;
    left: 59.532%;
    top: 58.14%; }
  .onoff1 .off__image__02__wrap {
    width: 91.25%;
    height: 78.295%;
    left: 10.782%;
    top: 0; }
  .onoff1 .off__animation__container--2 {
    height: 95.313vw;
    margin-top: 0; }
  .onoff1 .off__image__03__wrap {
    width: 28.125%;
    height: 29.509%;
    right: -3.125%;
    top: 0; }
  .onoff1 .off__image__04__wrap {
    width: 69.063%;
    height: 50.164%;
    left: -8.125%;
    top: 10.328%;
    z-index: 3; }
  .onoff1 .off__image__05__wrap {
    display: none; }
  .onoff1 .off__image__06__wrap {
    width: 32.5%;
    height: 23.607%;
    left: 56.875%;
    top: 29.345%;
    z-index: 1; }
  .onoff1 .off__image__07__wrap {
    width: 36.719%;
    height: 38.525%;
    left: 12.032%;
    top: 55.574%;
    z-index: 5; }
  .onoff1 .off__image__08__wrap {
    width: 28.125%;
    height: 29.509%;
    left: 52.188%;
    top: 70.492%;
    background-image: url(../img/onoff/onoff1/off__image__08.png); }
  .onoff1 .off__info__wrap {
    width: 100%;
    height: auto;
    top: auto;
    left: auto;
    margin: -10.833% auto 0; }
  .onoff1 .off__btn__wrap {
    position: relative;
    width: 91.667%;
    margin: 14% auto 0;
    padding-top: 28%; }
  .onoff1 .off__btn {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0; }
  .onoff1 .on__section {
    padding-bottom: 10.469%; }
  .onoff1 .on__animation__container--1 {
    position: relative;
    height: 97.813vw;
    margin-top: 1%; }
  .onoff1 .on__image__01__wrap {
    width: 91.25%;
    height: 64.537%;
    left: -14.062%;
    top: 0; }
  .onoff1 .on__image__02__wrap {
    width: 31.25%;
    height: 31.949%;
    right: -3.125%;
    top: 22.684%; }
  .onoff1 .on__image__03__wrap {
    width: 28.125%;
    height: 28.754%;
    left: 14.375%;
    top: 70.927%; }
  .onoff1 .on__image__04__wrap {
    width: 39.063%;
    height: 39.937%;
    left: 51.563%;
    top: 54.633%; }
  .onoff1 .on__animation__container--3 {
    height: 82.032vw;
    margin-top: 5.667%;
    padding: 0; }
  .onoff1 .on__image__07__wrap {
    width: 36.719%;
    height: 44.762%;
    left: 9.688%;
    top: 55.048%;
    background-image: url(../img/onoff/onoff1/on__image__06.png);
    z-index: 1; }
  .onoff1 .on__image__08__wrap {
    width: 52.572%;
    height: 44.381%;
    left: auto;
    right: 56.875%;
    top: 0; }
  .onoff1 .on__image__09__wrap {
    width: 54.688%;
    height: 66.667%;
    left: 43.125%;
    top: 19.429%;
    z-index: 3; }
  .onoff1 .on__info__wrap {
    width: 100%;
    height: auto;
    top: auto;
    left: auto;
    margin: 7.167% auto 0; }
  .onoff1 .on__info__wrap--2 {
    width: 100%;
    height: auto;
    top: auto;
    left: auto;
    margin: 6% auto 0; }
  .onoff1 .on__btn__wrap {
    position: relative;
    width: 91.667%;
    height: 0;
    margin-top: 16%;
    padding-top: 30%; }
  .onoff1 .on__btn {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-image: url(../img/onoff/onoff1/on__btn.png); } }

/* end レスポンシブ--------*/
.onoff2 .off__section {
  padding-bottom: 26.455%; }

.onoff2 .off__animation__container--1 {
  position: relative;
  height: 0;
  margin-top: 2.445%;
  padding-top: 63%; }

.onoff2 .off__image__01__wrap {
  width: 82.112%;
  height: 90.3%;
  top: 9.524%;
  left: -12.333%;
  background-image: url(../img/onoff/onoff2/off__image__01.png); }

.onoff2 .off__image__02__wrap {
  width: 35%;
  height: 41.27%;
  right: 5.556%;
  top: 0;
  background-image: url(../img/onoff/onoff2/off__image__02.png); }

.onoff2 .off__image__03__wrap {
  width: 21.112%;
  height: 33.51%;
  right: -6.111%;
  top: 35.979%;
  background-image: url(../img/onoff/onoff2/off__image__03.png); }

.onoff2 .off__animation__container--2 {
  position: relative;
  height: 0;
  margin-top: -29.222%;
  padding-top: 63.667%; }

.onoff2 .off__image__04__wrap {
  width: 46.667%;
  height: 73.299%;
  right: 64.445%;
  top: 0;
  background-image: url(../img/onoff/onoff2/off__image__04.png); }

.onoff2 .off__image__05__wrap {
  width: 37.778%;
  height: 41.187%;
  left: 21.112%;
  top: 58.814%;
  background-image: url(../img/onoff/onoff2/off__image__05.png); }

.onoff2 .off__image__06__wrap {
  width: 20.667%;
  height: 32.461%;
  left: 55.667%;
  top: 50.611%;
  background-image: url(../img/onoff/onoff2/off__image__06.png); }

.onoff2 .off__animation__container--3 {
  position: relative;
  height: 0;
  margin-top: -20%;
  padding-top: 74.112%; }

.onoff2 .off__image__07__wrap {
  width: 16.778%;
  height: 22.639%;
  right: -10.555%;
  top: 0;
  background-image: url(../img/onoff/onoff2/off__image__07.png); }

.onoff2 .off__image__08__wrap {
  width: 40.889%;
  height: 79.761%;
  right: -5.888%;
  top: 20.24%;
  background-image: url(../img/onoff/onoff2/off__image__08.png); }

.onoff2 .off__image__09__wrap {
  width: 25%;
  height: 33.734%;
  left: -7.444%;
  top: 47.227%;
  background-image: url(../img/onoff/onoff2/off__image__09.png); }

.onoff2 .off__image__10__wrap {
  width: 35.112%;
  height: 32.834%;
  left: 23.223%;
  top: 42.279%;
  background-image: url(../img/onoff/onoff2/off__image__10.png); }

.onoff2 .off__image__11__wrap {
  width: 16.223%;
  height: 21.89%;
  left: 13.445%;
  top: 69.266%;
  background-image: url(../img/onoff/onoff2/off__image__11.png); }

.onoff2 .off__info__wrap1 {
  position: relative;
  width: 100%;
  padding-top: 3.334%; }

.onoff2 .off__info__wrap2 {
  position: relative;
  width: 68%;
  margin: 5.112% -6.111% 0 auto;
  padding: 0; }

.onoff2 .off__info__wrap3 {
  position: relative;
  width: 100%;
  margin: 9.778% 0 0 0;
  padding: 0; }

.onoff2 .off__btn__wrap {
  position: relative;
  width: 50%;
  margin: 12.445% auto 0;
  padding-top: 15.445%; }

.onoff2 .off__btn {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: url(../img/onoff/onoff2/off__btn.png); }

.onoff2 .on__section {
  padding-bottom: 6.364%; }

.onoff2 .on__animation__container--1 {
  position: relative;
  height: 0;
  margin-top: -14.666%;
  padding-top: 106%; }

.onoff2 .on__image__01__wrap {
  width: 82.112%;
  height: 53.669%;
  right: -12.333%;
  top: 18.659%;
  background-image: url(../img/onoff/onoff2/on__image__01.png); }

.onoff2 .on__image__02__wrap {
  width: 29.334%;
  height: 27.673%;
  left: -5.555%;
  top: 32.076%;
  background-image: url(../img/onoff/onoff2/on__image__02.png); }

.onoff2 .on__image__03__wrap {
  width: 22%;
  height: 20.755%;
  left: 55.556%;
  top: 75.891%;
  background-image: url(../img/onoff/onoff2/on__image__03.png); }

.onoff2 .on__image__04__wrap {
  width: 23.112%;
  height: 21.803%;
  right: -5.333%;
  top: 0;
  background-image: url(../img/onoff/onoff2/on__image__04.png); }

.onoff2 .on__image__05__wrap {
  width: 39.112%;
  height: 36.898%;
  left: 7.889%;
  top: 63.103%;
  background-image: url(../img/onoff/onoff2/on__image__05.png); }

.onoff2 .on__info__wrap {
  position: relative;
  padding-top: 4.223%; }

.onoff2 .on__btn__wrap {
  position: relative;
  width: 50%;
  margin: 11.112% auto 0;
  padding-top: 15.445%; }

.onoff2 .on__btn {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: url(../img/onoff/onoff2/on__btn.png); }

@media screen and (max-width: 899px) {
  .onoff2 .off__animation__container--2 {
    margin-left: -5%; }
  .onoff2 .off__info__wrap2 {
    margin: 5.112% auto 0 32%; } }

@media screen and (max-width: 767px) {
  .onoff2 .top__kv__wrap {
    background-image: url(../img/onoff/onoff2/top__title__kv_sp.png); }
  .onoff2 .off__section {
    padding-bottom: 52.344%; }
  .onoff2 .off__animation__container--1 {
    height: 120.313vw;
    margin-top: 3.667%; }
  .onoff2 .off__image__01__wrap {
    width: 115.469%;
    height: 66.494%;
    left: 13.594%;
    top: 0; }
  .onoff2 .off__image__02__wrap {
    width: 49.219%;
    height: 30.39%;
    left: 3.438%;
    top: 62.208%; }
  .onoff2 .off__image__03__wrap {
    width: 29.688%;
    height: 24.676%;
    left: 47.344%;
    top: 75.325%; }
  .onoff2 .off__animation__container--2 {
    height: 105.625vw;
    margin-top: 4.667%;
    margin-left: 0; }
  .onoff2 .off__image__04__wrap {
    width: 65.625%;
    height: 62.131%;
    left: 3.75%; }
  .onoff2 .off__image__05__wrap {
    width: 53.125%;
    height: 34.912%;
    left: 36.719%;
    top: 49.853%; }
  .onoff2 .off__image__06__wrap {
    width: 29.063%;
    height: 27.515%;
    left: 13.282%;
    top: 72.338%; }
  .onoff2 .off__animation__container--3 {
    height: 141.875vw;
    margin-top: 0; }
  .onoff2 .off__image__07__wrap {
    width: 23.594%;
    height: 16.63%;
    left: 14.063%;
    top: 15.199%;
    z-index: 2; }
  .onoff2 .off__image__08__wrap {
    width: 57.5%;
    height: 58.591%;
    left: 31.719%;
    top: 0; }
  .onoff2 .off__image__09__wrap {
    width: 35.157%;
    height: 24.78%;
    left: 55.157%;
    top: 70.705%;
    z-index: 2; }
  .onoff2 .off__image__10__wrap {
    width: 57.032%;
    height: 27.754%;
    left: 4.375%;
    top: 50.771%; }
  .onoff2 .off__image__11__wrap {
    width: 22.813%;
    height: 16.08%;
    left: 28.438%;
    top: 83.921%; }
  .onoff2 .off__info__wrap1 {
    width: 100%;
    height: auto;
    top: auto;
    left: auto;
    margin: 0;
    padding-top: 6.167%; }
  .onoff2 .off__info__wrap2 {
    width: 100%;
    height: auto;
    top: auto;
    left: auto;
    margin: 0;
    padding-top: 7.834%; }
  .onoff2 .off__info__wrap3 {
    width: 100%;
    height: auto;
    top: auto;
    left: auto;
    margin: 0;
    padding-top: 8.167%; }
  .onoff2 .off__btn__wrap {
    width: 91.834%;
    margin: 12.167% auto 0;
    padding-top: 29.334%; }
  .onoff2 .off__btn {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0; }
  .onoff2 .on__section {
    padding-bottom: 6.364%; }
  .onoff2 .on__animation__container--1 {
    height: 179.063vw;
    margin-top: 7.5%; }
  .onoff2 .on__image__01__wrap {
    width: 95.782%;
    height: 37.086%;
    left: 5.157%;
    top: 0; }
  .onoff2 .on__image__02__wrap {
    width: 46.563%;
    height: 26.004%;
    left: 43.75%;
    top: 73.997%; }
  .onoff2 .on__image__03__wrap {
    width: 30.938%;
    height: 17.278%;
    left: 5.157%;
    top: 69.459%; }
  .onoff2 .on__image__04__wrap {
    width: 32.5%;
    height: 18.151%;
    right: 6.407%;
    top: 52.793%;
    z-index: 2; }
  .onoff2 .on__image__05__wrap {
    width: 55%;
    height: 30.716%;
    left: 13.282%;
    top: 33.247%; }
  .onoff2 .on__info__wrap {
    padding: 6% 0; }
  .onoff2 .on__btn__wrap {
    width: 91.834%;
    margin: 16.667% auto 0;
    padding-top: 30%; }
  .onoff2 .on__btn {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0; } }

/* end レスポンシブ--------*/
.onoff3 .off__section {
  padding-bottom: 26.455%; }

.onoff3 .off__animation__container--1 {
  position: relative;
  height: 0;
  padding-top: 52.667%;
  margin-top: 5.778%; }

.onoff3 .off__image__01__wrap {
  width: 63.223%;
  height: 79.536%;
  top: 0;
  left: -5.222%;
  background-image: url(../img/onoff/onoff3/off__image__01.png); }

.onoff3 .off__image__02__wrap {
  width: 34%;
  height: 50.211%;
  top: 16.878%;
  right: -5.555%;
  background-image: url(../img/onoff/onoff3/off__image__02.png); }

.onoff3 .off__image__03__wrap {
  width: 25.778%;
  height: 43.249%;
  top: 56.963%;
  right: 22.778%;
  background-image: url(../img/onoff/onoff3/off__image__03.png); }

.onoff3 .off__animation__container--2 {
  position: relative;
  height: 0;
  padding-top: 107.334%;
  margin-top: -68.555%; }

.onoff3 .off__image__04__wrap {
  width: 41.556%;
  height: 58.282%;
  top: 0;
  left: -0.777%;
  background-image: url(../img/onoff/onoff3/off__image__04.png); }

.onoff3 .off__image__05__wrap {
  width: 31.445%;
  height: 20.29%;
  top: 56.108%;
  left: -7.111%;
  background-image: url(../img/onoff/onoff3/off__image__05.png); }

.onoff3 .off__image__06__wrap {
  width: 41.556%;
  height: 26.812%;
  top: 73.085%;
  right: 13.445%;
  background-image: url(../img/onoff/onoff3/off__image__06.png); }

.onoff3 .off__image__07__wrap {
  width: 19%;
  height: 17.702%;
  top: 70.497%;
  left: 28.667%;
  background-image: url(../img/onoff/onoff3/off__image__07.png); }

.onoff3 .off__animation__container--3 {
  position: relative;
  height: 0;
  padding-top: 80.223%;
  margin-top: 3.667%; }

.onoff3 .off__image__08__wrap {
  width: 33.334%;
  height: 41.552%;
  top: 5.956%;
  left: -5.222%;
  background-image: url(../img/onoff/onoff3/off__image__08.png); }

.onoff3 .off__image__09__wrap {
  width: 72.445%;
  height: 60.111%;
  top: 0;
  right: -5.777%;
  background-image: url(../img/onoff/onoff3/off__image__09.png); }

.onoff3 .off__image__10__wrap {
  width: 26.445%;
  height: 22.023%;
  top: 68.56%;
  right: 3.112%;
  background-image: url(../img/onoff/onoff3/off__image__10.png); }

.onoff3 .off__image__11__wrap {
  width: 52.889%;
  height: 47.646%;
  top: 52.355%;
  left: 8%;
  background-image: url(../img/onoff/onoff3/off__image__11.png); }

.onoff3 .off__info__wrap1 {
  position: relative;
  width: 91.381%;
  margin: 5.112% auto 0 0; }

.onoff3 .off__info__wrap2 {
  position: relative;
  width: 60.445%;
  margin: 10.334% -5.222% 0 auto; }

.onoff3 .off__info__wrap3 {
  position: relative;
  width: 103.667%;
  margin: 12.112% -3.666% 0 auto; }

.onoff3 .off__btn__wrap {
  position: relative;
  width: 50%;
  margin: 10.445% auto 0;
  padding: 15.945% 0 0; }

.onoff3 .off__btn {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-image: url(../img/onoff/onoff3/off__btn.png); }

.onoff3 .on__section {
  padding-bottom: 4.637%; }

.onoff3 .on__animation__container--1 {
  position: relative;
  height: 0;
  margin-top: 7.556%;
  padding-top: 56.889%; }

.onoff3 .on__animation__container--2 {
  position: relative;
  height: 0;
  padding-top: 43.667%; }

.onoff3 .on__image__01__wrap {
  width: 82.223%;
  height: 100%;
  top: 0;
  right: -9.111%;
  background-image: url(../img/onoff/onoff3/on__image__01.png); }

.onoff3 .on__image__02__wrap {
  width: 26.223%;
  height: 46.094%;
  top: -39.062%;
  right: 0.667%;
  background-image: url(../img/onoff/onoff3/on__image__02.png); }

.onoff3 .on__image__03__wrap {
  width: 27.223%;
  height: 47.852%;
  top: 13.672%;
  left: -8.888%;
  background-image: url(../img/onoff/onoff3/on__image__03.png); }

.onoff3 .on__image__04__wrap {
  width: 46.667%;
  height: 106.871%;
  top: -39.949%;
  left: -2.222%;
  background-image: url(../img/onoff/onoff3/on__image__04.png); }

.onoff3 .on__image__05__wrap {
  width: 44.223%;
  height: 70.23%;
  top: 29.771%;
  right: 7.556%;
  background-image: url(../img/onoff/onoff3/on__image__05.png); }

.onoff3 .on__info__wrap {
  position: relative;
  width: 77.778%;
  margin: 0 auto 0 0;
  padding: 2% 0 0; }

.onoff3 .on__btn__wrap {
  position: relative;
  width: 50%;
  height: 0;
  margin-top: 10%;
  padding-top: 15.889%; }

.onoff3 .on__btn {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-image: url(../img/onoff/onoff3/on__btn.png); }

@media screen and (max-width: 767px) {
  .onoff3 .top__kv__wrap {
    background-image: url(../img/onoff/onoff3/top__title__kv_sp.png); }
  .onoff3 .off__section {
    padding-bottom: 51.875%; }
  .onoff3 .off__animation__container--1 {
    height: 88.594vw;
    margin-top: 9.167%;
    padding-top: 0; }
  .onoff3 .off__image__01__wrap {
    width: 74.532%;
    height: 55.909%;
    top: 0;
    left: 2.032%; }
  .onoff3 .off__image__02__wrap {
    width: 47.813%;
    height: 41.976%;
    top: 44.621%;
    left: 53.438%; }
  .onoff3 .off__image__03__wrap {
    width: 36.25%;
    height: 36.332%;
    top: 63.493%;
    left: 11.25%; }
  .onoff3 .off__animation__container--2 {
    height: 96.875vw;
    margin-top: 4.667%;
    padding-top: 0; }
  .onoff3 .off__image__04__wrap {
    width: 45.938%;
    height: 71.452%;
    left: 3.594%; }
  .onoff3 .off__image__05__wrap {
    width: 35.469%;
    height: 25.323%;
    top: 74.678%;
    left: 19.063%;
    z-index: 3; }
  .onoff3 .off__image__06__wrap {
    width: 58.438%;
    height: 41.775%;
    top: 40.968%;
    left: 38.125%; }
  .onoff3 .off__image__07__wrap {
    width: 29.063%;
    height: 30%;
    top: 0;
    left: 57.032%; }
  .onoff3 .off__animation__container--3 {
    height: 86.719vw;
    margin-top: 5.5%;
    padding-top: 0; }
  .onoff3 .off__image__08__wrap {
    width: 27.813%;
    height: 32.073%;
    top: 0;
    left: -3.125%;
    z-index: 2; }
  .onoff3 .off__image__09__wrap {
    width: 72.032%;
    height: 55.316%;
    top: 5.226%;
    left: 17.969%; }
  .onoff3 .off__image__10__wrap {
    width: 34.688%;
    height: 26.667%;
    top: 67.928%;
    right: 3.125%; }
  .onoff3 .off__image__11__wrap {
    width: 56.25%;
    height: 46.667%;
    top: 53.334%;
    left: 1.25%; }
  .onoff3 .off__info__wrap1 {
    width: 100%;
    height: auto;
    top: auto;
    left: auto;
    margin-top: 0;
    padding-top: 6.167%; }
  .onoff3 .off__info__wrap2 {
    width: 100%;
    height: auto;
    top: auto;
    left: auto;
    margin: 11.834% auto 0; }
  .onoff3 .off__info__wrap3 {
    width: 100%;
    height: auto;
    top: auto;
    left: auto;
    margin: 12.667% auto 0; }
  .onoff3 .off__btn__wrap {
    width: 91.667%;
    margin-top: 17.667%;
    padding-top: 29.167%; }
  .onoff3 .off__btn {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-image: url(../img/onoff/onoff3/off__btn.png); }
  .onoff3 .on__section {
    padding-bottom: 4.637%; }
  .onoff3 .on__animation__container--1 {
    height: 124.688vw;
    margin-top: 8%;
    padding-top: 0;
    z-index: 5; }
  .onoff3 .on__animation__container--2 {
    height: 107.813vw;
    margin-top: -7.666%;
    padding-top: 0; }
  .onoff3 .on__image__01__wrap {
    width: 102.5%;
    height: 54.386%;
    top: 0;
    right: 4.063%; }
  .onoff3 .on__image__02__wrap {
    width: 29.844%;
    height: 23.935%;
    top: 76.066%;
    right: 4.844%; }
  .onoff3 .on__image__03__wrap {
    width: 40.469%;
    height: 32.457%;
    top: 52.006%;
    left: 12.657%; }
  .onoff3 .on__image__04__wrap {
    width: 65.625%;
    height: 60.87%;
    top: 0;
    left: 3.907%; }
  .onoff3 .on__image__05__wrap {
    width: 62.188%;
    height: 40%;
    top: 66.667%;
    right: 4.844%; }
  .onoff3 .on__info__wrap {
    width: 100%;
    padding: 6.667% 0 0; }
  .onoff3 .on__btn__wrap {
    width: 91.667%;
    margin-top: 15.834%;
    padding-top: 29.334%; }
  .onoff3 .on__btn {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-image: url(../img/onoff/onoff3/on__btn.png); } }

/* end レスポンシブ--------*/
.hidden__sp {
  display: block; }

@media screen and (max-width: 600px) {
  .hidden__sp {
    display: none; } }

.hidden__pc {
  display: none; }

@media screen and (max-width: 600px) {
  .hidden__pc {
    display: block; } }

/* end レスポンシブ--------*/
.fv__section {
  width: 100vw;
  min-width: 900px;
  margin: auto; }
  .fv__section img {
    width: 100vw;
    min-width: 900px; }

@media screen and (max-width: 899px) {
  .fv__section {
    min-width: inherit; }
    .fv__section img {
      min-width: inherit; } }

@media screen and (max-width: 600px) {
  .fv__section {
    display: none; } }

/* end レスポンシブ--------*/
.contents__wrap {
  width: 100vw;
  margin: auto;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 999px) {
  .contents__wrap {
    overflow: hidden; } }

@media screen and (max-width: 600px) {
  .contents__wrap {
    width: 100vw;
    margin: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow-x: hidden; } }

/* end レスポンシブ--------*/
/*-------------------------------------------------------------------------
 top section
 ---------------------------------------------------------------------------*/
.top__section {
  width: 100vw;
  height: 290px;
  min-width: 900px;
  margin: auto;
  margin-bottom: 20vw;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 899px) {
  .top__section {
    min-width: inherit; } }

@media screen and (max-width: 600px) {
  .top__section {
    width: 100vw;
    height: 196.5vw;
    min-width: 100vw;
    margin: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

/* end レスポンシブ--------*/
.top__inner {
  position: relative;
  width: 900px;
  height: 100%;
  margin: auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 899px) {
  .top__inner {
    width: 100vw; } }

@media screen and (max-width: 600px) {
  .top__inner {
    position: relative;
    width: 100vw;
    height: 100%;
    margin: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

/* end レスポンシブ--------*/
.top__kv__wrap {
  position: absolute;
  width: 1000px;
  height: 481px;
  top: 0;
  left: 0;
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 999px) {
  .top__kv__wrap {
    width: 100vw; } }

@media screen and (max-width: 600px) {
  .top__kv__wrap {
    position: absolute;
    width: 100vw;
    height: 104vw;
    top: 0;
    left: 0;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

/* end レスポンシブ--------*/
.top__info__wrap {
  position: absolute;
  width: 777px;
  height: 220px;
  top: 85px;
  left: 50%;
  margin-left: -370.5px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 899px) {
  .top__info__wrap {
    width: 100%;
    left: 0;
    margin-left: 0;
    padding: 0 10px; } }

@media screen and (max-width: 756px) {
  .top__info__wrap {
    width: 100vw; } }

@media screen and (max-width: 600px) {
  .top__info__wrap {
    position: absolute;
    width: 86vw;
    height: 433px;
    top: 113vw;
    left: 50%;
    margin-left: -43vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

/* end レスポンシブ--------*/
.top__kv__wrap {
  display: none; }

@media screen and (max-width: 600px) {
  .top__kv__wrap {
    display: block;
    position: absolute;
    width: 100vw;
    height: 104vw;
    top: 0;
    left: 0;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

/* end レスポンシブ--------*/
.top__ttl__wrap {
  letter-spacing: 0.1em;
  line-height: 1.641em;
  font-size: 2.4vw;
  font-weight: bold;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (min-width: 1500px) {
  .top__ttl__wrap {
    font-size: 36px; } }

@media screen and (max-width: 767px) {
  .top__ttl__wrap {
    font-size: 4.694vw; } }

@media screen and (max-width: 600px) {
  .top__ttl__wrap {
    line-height: 1.668em;
    font-size: 7.032vw; } }

/* end レスポンシブ--------*/
.top__info {
  line-height: 2.107em;
  font-size: 1.259vw;
  font-weight: normal;
  letter-spacing: normal;
  padding-top: 20px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (min-width: 1500px) {
  .top__info {
    font-size: 18.88px; } }

@media screen and (max-width: 767px) {
  .top__info {
    font-size: 2.347vw; } }

@media screen and (max-width: 600px) {
  .top__info {
    line-height: 2em;
    font-size: 3.75vw;
    padding-top: 4vw;
    text-align: justify; } }

/* end レスポンシブ--------*/
/*-------------------------------------------------------------------------
 off section
 ---------------------------------------------------------------------------*/
.off__section {
  position: relative;
  width: 100vw;
  margin-top: 247px;
  background-color: #dcdddd;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 600px) {
  .off__section {
    width: 100vw;
    margin-top: 21.875vw; }
    .off__section::before {
      position: absolute;
      content: "";
      width: 100vw;
      height: 21.875vw;
      background-image: url(../img/onoff/off__bg__head_sp.png);
      background-repeat: no-repeat;
      background-size: cover;
      top: -20.5vw;
      left: 0;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; } }

/* end レスポンシブ--------*/
.off__section__head {
  position: absolute;
  width: 103vw;
  top: -18vw;
  left: 50%;
  margin-left: -50.5vw; }
  .off__section__head img {
    width: 103vw; }

@media screen and (max-width: 600px) {
  .off__section__head {
    display: none; } }

/* end レスポンシブ--------*/
.off__section__inner {
  position: relative;
  width: 900px;
  height: 100%;
  margin: auto; }

@media screen and (max-width: 899px) {
  .off__section__inner {
    width: 100vw;
    padding: 0 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

@media screen and (max-width: 600px) {
  .off__section__inner {
    position: relative;
    width: 100vw;
    height: 100%;
    margin: auto; } }

/* end レスポンシブ--------*/
[class^="off__animation__container--"] {
  position: relative;
  width: 900px;
  margin: auto; }

@media screen and (max-width: 899px) {
  [class^="off__animation__container--"] {
    width: 100vw; } }

@media screen and (max-width: 600px) {
  [class^="off__animation__container--"] {
    width: 100vw;
    padding: 0 !important; } }

/* end レスポンシブ--------*/
[class^="off__image__"] {
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain; }

.off__info__wrap {
  position: absolute;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 899px) {
  .off__info__wrap {
    position: relative;
    padding: 0 10px; } }

@media screen and (max-width: 600px) {
  .off__info__wrap {
    position: absolute;
    width: 86vw;
    height: 100vw;
    top: 75vw;
    left: 50%;
    margin-left: -43vw;
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

/* end レスポンシブ--------*/
.off__ttl__wrap {
  letter-spacing: 0.1em;
  line-height: 1.641em;
  font-size: 2.4vw;
  font-weight: bold;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (min-width: 1500px) {
  .off__ttl__wrap {
    font-size: 36px; } }

@media screen and (max-width: 899px) {
  .off__ttl__wrap {
    font-size: 4.694vw; } }

@media screen and (max-width: 600px) {
  .off__ttl__wrap {
    letter-spacing: 0.05em;
    line-height: 1.668em;
    font-size: 7.032vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

/* end レスポンシブ--------*/
.off__info {
  line-height: 2.21em;
  font-size: 1.2vw;
  font-weight: normal;
  letter-spacing: normal;
  padding-top: 20px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (min-width: 1500px) {
  .off__info {
    font-size: 18px; } }

@media screen and (max-width: 899px) {
  .off__info {
    font-size: 2.347vw; } }

@media screen and (max-width: 600px) {
  .off__info {
    line-height: 2.084em;
    font-size: 3.75vw;
    padding-top: 4vw;
    text-align: justify; }
  .off__info--2 {
    padding-top: 0; } }

/* end レスポンシブ--------*/
.off__btn__wrap {
  position: absolute;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  z-index: 100; }

.off__btn {
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url(../img/onoff/onoff1/off__btn.png);
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer; }
  .off__btn:hover, .off__btn.hover {
    opacity: 0.7; }

/*-------------------------------------------------------------------------
 on section
 ---------------------------------------------------------------------------*/
.on__section {
  position: relative;
  width: 100vw;
  margin-bottom: 231px;
  background-color: #898989;
  color: #fff;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 600px) {
  .on__section {
    position: relative;
    width: 100vw;
    margin-bottom: 21.875vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
    .on__section::before {
      position: absolute;
      content: "";
      width: 100vw;
      height: 28.125vw;
      background-image: url(../img/onoff/on__bg__head_sp.png);
      background-repeat: no-repeat;
      background-size: contain;
      top: -28vw;
      left: 0;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
    .on__section::after {
      position: absolute;
      content: "";
      width: 102vw;
      height: 17.813vw;
      background-image: url(../img/onoff/on__bg__foot_sp.png);
      background-repeat: no-repeat;
      background-size: contain;
      bottom: -17.812vw;
      left: 0;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      visibility: visible; } }

/* end レスポンシブ--------*/
.on__section__head {
  position: absolute;
  width: 100vw;
  top: -20vw;
  left: 50%;
  margin-left: -50vw; }
  .on__section__head img {
    width: 100vw; }

@media screen and (max-width: 600px) {
  .on__section__head {
    display: none; } }

/* end レスポンシブ--------*/
.on__section__foot {
  position: absolute;
  width: 105vw;
  bottom: -18.5vw;
  left: 50%;
  margin-left: -50.1vw; }
  .on__section__foot img {
    width: 105vw; }

@media screen and (max-width: 600px) {
  .on__section__foot {
    display: none; } }

/* end レスポンシブ--------*/
.on__section__inner {
  position: relative;
  width: 900px;
  height: 100%;
  margin: auto; }

@media screen and (max-width: 899px) {
  .on__section__inner {
    width: 100vw;
    padding: 0 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

@media screen and (max-width: 600px) {
  .on__section__inner {
    position: relative;
    width: 100vw;
    margin: auto; } }

/* end レスポンシブ--------*/
[class^="on__animation__container--"] {
  position: relative;
  width: 900px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 899px) {
  [class^="on__animation__container--"] {
    width: 100vw; } }

/* end レスポンシブ--------*/
[class^="on__image__"] {
  position: absolute;
  background-repeat: no-repeat;
  background-size: contain; }

.on__info__wrap, .on__info__wrap--2 {
  position: absolute;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 899px) {
  .on__info__wrap, .on__info__wrap--2 {
    position: relative;
    padding: 0 10px; } }

.on__ttl__wrap {
  letter-spacing: 0.1em;
  line-height: 1.641em;
  font-size: 2.4vw;
  font-weight: bold;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (min-width: 1500px) {
  .on__ttl__wrap {
    font-size: 36px; } }

@media screen and (max-width: 899px) {
  .on__ttl__wrap {
    font-size: 4.694vw; } }

@media screen and (max-width: 600px) {
  .on__ttl__wrap {
    letter-spacing: 0.05em;
    line-height: 1.668em;
    font-size: 7.032vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

/* end レスポンシブ--------*/
.on__info {
  line-height: 2.21em;
  font-size: 1.2vw;
  font-weight: normal;
  letter-spacing: normal;
  padding-top: 20px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (min-width: 1500px) {
  .on__info {
    font-size: 18px; } }

@media screen and (max-width: 899px) {
  .on__info {
    font-size: 2.347vw; } }

@media screen and (max-width: 600px) {
  .on__info {
    line-height: 2.084em;
    font-size: 3.75vw;
    padding-top: 4vw;
    text-align: justify; }
  .on__info--2 {
    padding-top: 0; } }

/* end レスポンシブ--------*/
.on__btn__wrap {
  position: relative;
  margin: auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

.on__btn {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer; }
  .on__btn:hover, .on__btn.hover {
    opacity: 0.7; }

.foot__logo__wrap {
  position: relative;
  width: 900px;
  height: 195.991px;
  margin: auto;
  margin-top: 15vw;
  margin-bottom: 50px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

@media screen and (max-width: 899px) {
  .foot__logo__wrap {
    width: 100vw; } }

@media screen and (max-width: 600px) {
  .foot__logo__wrap {
    position: relative;
    width: 100vw;
    height: 8.5vw;
    margin: auto;
    margin-bottom: 38vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; } }

/* end レスポンシブ--------*/
.foot__logo {
  position: absolute;
  width: 371px;
  height: 54px;
  top: 50%;
  left: 50%;
  margin-top: -27px;
  margin-left: -185.5px;
  background-image: url(../img/onoff/guys__logo.png);
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer; }
  .foot__logo:hover, .foot__logo.hover {
    opacity: 0.7; }

@media screen and (max-width: 600px) {
  .foot__logo {
    position: absolute;
    width: 57.5vw;
    height: 8.7vw;
    top: 50%;
    left: 50%;
    margin-top: -4.35vw;
    margin-left: -28.75vw;
    background-image: url(../img/onoff/guys__logo.png);
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer; } }

/* end レスポンシブ--------*/
#sns--include {
  display: none; 
}

@media screen and (max-width: 600px) {
  #sns--include {
    display: block;
    position: relative;
    bottom: 24vw; } }

#goPageTopBtn img{
    /* display:none; */
}