#section01 {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 75%);
  margin-bottom: -190px;
}
#section01 .videobox {
  width: 100%;
  height: 680px;
  position: relative;
  overflow: hidden;
}
#section01 video {
  -o-object-fit: cover;
     object-fit: cover;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
#section01 .video_txt {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
#section01 .video_deco {
  clip-path: polygon(0 0, 0% 100%, 100% 100%);
  width: 100%;
  height: 200px;
  background-color: #000;
  position: absolute;
  bottom: 0;
  right: 0;
}

.panel {
  position: relative;
}

.panel figure {
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: -1;
}

#section02 {
  width: 100%;
  padding: 200px 0 340px 0;
  color: #fff;
  text-align: left;
}
#section02 figure {
  background-image: url(../images/top/bg01.webp);
  background-color: #000;
}
#section02 .mainread {
  font-size: 3em;
  font-weight: bold;
}
#section02 .itemboxover {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 30px 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 20px 30px;
}
#section02 .itemboxover .item_a {
  font-size: 1.2em;
  font-weight: bold;
}

.s03img01 {
  position: relative;
  margin-top: -80px;
}
.s03img01 .imgbox {
  position: absolute;
  width: 100%;
  top: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  z-index: 10;
}

#section03 {
  background-color: #EE2314;
  position: relative;
  clip-path: polygon(0 10%, 100% 0, 100% 90%, 0 100%);
  margin-top: -300px;
}
#section03 .deco03upper {
  background-color: #fff;
  clip-path: polygon(0 20%, 100% 0, 100% 60%, 0 100%);
  height: 300px;
  margin-top: -200px;
}
#section03 .textblick01 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 30px 1fr 30px 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px 30px;
  padding-top: 260px;
}
#section03 .textblick02 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 30px 1fr;
  grid-template-columns: 1fr 1fr;
  gap: 20px 30px;
  padding-bottom: 200px;
}
#section03 .slidebox {
  padding: 60px 0 100px 0;
}

#before_section04 {
  height: 800px;
  margin-top: -200px;
}
#before_section04 figure {
  background-image: url(../images/top/bg02.webp);
  background-color: #000;
}

#section04 h3, #section05 h3, #section06 h3 {
  font-size: 3em;
  border-left: 5px #fff solid;
  padding-left: 10px;
  font-family: "Shippori Mincho", serif;
  font-weight: bold;
  margin-bottom: 40px;
}
#section04 .texboxinner p, #section05 .texboxinner p, #section06 .texboxinner p {
  line-height: 1.6;
}

#section04 {
  background-color: #000;
  clip-path: polygon(0 0, 100% 14%, 100% 100%, 0 80%);
  margin-top: -300px;
  color: #fff;
  position: relative;
  z-index: 4;
}
#section04 .itemboxover {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 30px 1fr;
  grid-template-columns: 1fr 1fr;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 30px;
     -moz-column-gap: 30px;
          column-gap: 30px;
  height: 600px;
}
#section04 .itemboxover .txtbox .texboxinner {
  width: 37vw;
  margin: 0 0 0 auto;
  padding-right: 20px;
}
#section04 .itemboxover .imgboxbox {
  background: url(../images/top/s4bg.webp) center left no-repeat;
  background-size: cover;
  height: 100%;
}

#before_section05 {
  height: 800px;
  margin-top: -200px;
  position: relative;
}
#before_section05 figure {
  background-image: url(../images/top/bg03.webp);
  background-color: #000;
}
#before_section05:after {
  content: "";
  background-color: #F8E0C7;
  clip-path: polygon(0 0, 0 46%, 100% 0);
  width: 100%;
  height: 400px;
  position: absolute;
  left: 0;
  top: 80px;
  z-index: -1;
}

#section05 {
  background-color: #EE2314;
  clip-path: polygon(0 0, 100% 14%, 100% 100%, 0 80%);
  margin-top: -300px;
  color: #fff;
}
#section05 .itemboxover {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 600px;
}
#section05 .itemboxover .txtbox .texboxinner {
  width: 37vw;
  margin: 0 auto 0 0;
  padding-left: 40px;
}
#section05 .itemboxover .imgboxbox {
  background: url(../images/top/s5bg.webp) center left no-repeat;
  background-size: cover;
  height: 100%;
}

#section06 {
  background-color: #000;
  clip-path: polygon(0 0, 100% 14%, 100% 100%, 0 80%);
  margin-top: -140px;
  color: #fff;
}
#section06 .itemboxover {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 600px;
}
#section06 .itemboxover .txtbox {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
#section06 .itemboxover .txtbox .texboxinner {
  width: 37vw;
  margin: 0 0 0 auto;
  padding-right: 40px;
}
#section06 .itemboxover .imgboxbox {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
  background: url(../images/top/s6bg.webp) center left no-repeat;
  background-size: cover;
  height: 100%;
}

/* -------------------------------sp--------------------------------------------- */
@media screen and (max-width: 842px) {
  .panel figure {
    height: 100vh;
    width: 100vw;
    position: fixed;
    background-attachment: unset;
  }
  #section01 {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 85%);
    margin-bottom: -120px;
  }
  #section01 .video_txt {
    width: 24vw;
  }
  #section02 {
    padding: 100px 0 280px 0;
  }
  #section02 figure.bg01 {
    background-image: url(../images/top/bg01_sp.webp);
  }
  #section02 figure.bg02 {
    background-image: url(../images/top/bg02_sp.webp);
  }
  #section02.bg03 figure {
    background-image: url(../images/top/bg03_sp.webp);
  }
  #section02 .sectioninner {
    padding-bottom: 100px;
  }
  #section02 .mainread {
    font-size: 2em;
    line-height: 1.6;
  }
  #section02 .itemboxover {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  #section02 .itemboxover .item_a {
    line-height: 1.6;
  }
  #section03 {
    clip-path: polygon(0 5%, 100% 0, 100% 95%, 0 100%);
  }
  #section03 slidebox {
    padding: 20px 0 60px 0;
  }
  #section03 .deco03upper {
    clip-path: polygon(0 15%, 100% 0, 100% 70%, 0 100%);
  }
  #section03 .textblick01 {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    padding-top: 100px;
    row-gap: 20px;
  }
  #section03 .textblick02 {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    row-gap: 20px;
  }
  #section04 h3, #section05 h3, #section06 h3 {
    font-size: 2.4em;
  }
  #section04 .texboxinner p, #section05 .texboxinner p, #section06 .texboxinner p {
    line-height: 1.8;
  }
  #before_section04 {
    height: 400px;
  }
  #before_section04 figure {
    background-image: none;
    background-color: transparent;
  }
  #section04 {
    clip-path: polygon(0 0, 100% 4%, 100% 100%, 0 95%);
    margin-top: -40px;
  }
  #section04 .itemboxover {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    height: auto;
  }
  #section04 .itemboxover .txtbox {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    padding: 20px 0 120px 0;
  }
  #section04 .itemboxover .txtbox .texboxinner {
    width: 90vw;
    margin: 0 auto;
    padding: 0;
  }
  #section04 .itemboxover .imgboxbox {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    height: 400px;
    clip-path: polygon(0 1%, 100% 0, 100% 100%, 0 90%);
  }
  #before_section05 figure {
    background-image: none;
    background-color: transparent;
  }
  #section05 {
    clip-path: polygon(0 0, 100% 8%, 100% 100%, 0 95%);
  }
  #section05 .itemboxover {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    height: auto;
  }
  #section05 .itemboxover .txtbox {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    padding: 20px 0 120px 0;
  }
  #section05 .itemboxover .txtbox .texboxinner {
    width: 90vw;
    margin: 0 auto;
    padding: 0;
  }
  #section05 .itemboxover .imgboxbox {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    height: 400px;
    clip-path: polygon(0 1%, 100% 0, 100% 100%, 0 90%);
  }
  #section06 {
    clip-path: polygon(0 0, 100% 8%, 100% 100%, 0 95%);
    margin-top: -70px;
  }
  #section06 .itemboxover {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    height: auto;
  }
  #section06 .itemboxover .txtbox {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    padding: 20px 0 120px 0;
  }
  #section06 .itemboxover .txtbox .texboxinner {
    width: 90vw;
    margin: 0 auto;
    padding: 0;
  }
  #section06 .itemboxover .imgboxbox {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
    height: 400px;
    clip-path: polygon(0 1%, 100% 0, 100% 100%, 0 90%);
  }
}