.headline-l {display: none;}
.headline-l.align-l {display: block;}

.lp-box img {
  opacity: 1;
  transition: opacity 0.19s ease;
  width: 100%;
  max-width: none;
  height: auto;
  image-rendering: auto;
}

img[data-image] {opacity: 0;}

.lp-box a{
  display: block;
  transition: opacity 0.19s ease;
}

.lp-box a:hover{
  opacity: 0.4;
}

.lp-box div.lp-ab,
.lp-ab{
  position: absolute;
  z-index: 2;
}

.lp-box {
  position: relative;
  max-width: 750px;
  margin: 0 auto;
  overflow: hidden;
  line-height: 1;
  text-align: center;
  letter-spacing: 0;
  white-space: nowrap;
  font-family: "Noto Sans JP", sans-serif;
  color:#fff;
 }
 .lp-box.bg{
  left:0;
  top:0;
  width: 100%;
  z-index: 0;
 }

.lp-box div,
.lp-box section{
  position: relative;
}
.lp-box .atop{
  z-index: 2;
}
.lp-box section{
  z-index: 2;
}

.sh1{
    text-shadow: 
    0 0 1px #975d60,
    0 0 2px #975d60,
    0 0 3px #975d60,
    0 0 4px #975d60,
    0 0 5px #975d60,
    0 0 6px #975d60,
    0 0 7px #975d60,
    0 0 8px #975d60;
}

.atop .msg1 {
  top: 55.4%;
  width: 100%;
  line-height: 1.68;
  /* font-size: 3.23rem; */
  text-align: center;
}

.atop .msg2 ,
.atop .msg3 {
  width: 34%;
  left: 62.5%;
  top: 77.5%;
  /* font-size: 2.6rem; */
  letter-spacing: 0.1em;
  line-height: 1.55;
}

.atop .msg3 {
  top: 84.5%;
  left: 62.8%;
}

.item .color{
  left:0;
  top:10%;
}

.item .color {
  left: 37%;
  top: 7.3%;
}

.item .msg {
  top: 54.3%;
  left: 0%;
  width: 100%;
  text-align: center;
  line-height: 1.78;
  /* font-size: 2.7rem; */
  letter-spacing: -0.01em;
}

.item .link {
  left: 21%;
  top: 69.5%;
  aspect-ratio: 462 / 112;
  display: block;
  width: calc((462 / 800) * 100%);
}

.item .spec {
  left: 9.5%;
  top: 41.9%;
  width: 81%;
  display: flex;
  aspect-ratio: 750 / 152;
}

.item .spec>li {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 33.33%;
  line-height: 1.45;
  /* font-size: 3.35rem; */
}

.item .spec>li:nth-child(3) {
  padding-left: 0.25em;
}

.item1 .color { left: 37%; width: calc(( 207 / 800 ) * 100% );}
.item2 .color { left: 34.5%; width: calc(( 245 / 800 ) * 100% );}
.item3 .color { left: 38.65%; width: calc(( 177 / 800 ) * 100% );}
.item4 .color { left: 38.65%; width: calc(( 178 / 800 ) * 100% );}
.item5 .color { left: 36.4%; width: calc(( 220 / 800 ) * 100% );}
.item6 .color { top: 7.5%; left: 38%; width: calc(( 193 / 800 ) * 100% );}

.item1 .spec { top: 41.9%;}
.item2 .spec { top: 41%;}
.item3 .spec { top: 40.8%;}
.item4 .spec { top: 40.8%;}
.item5 .spec { top: 40.58%;}
.item6 .spec { top: 42.6%;}

.item1 .msg { top: 54.3%;}
.item2 .msg { top: 53.5%;}
.item3 .msg { top: 53.2%;}
.item4 .msg { top: 53.2%;}
.item5 .msg { top: 52.8%;}
.item6 .msg { top: 55.25%; letter-spacing: -0.015em; }

.item1 .link { top: 69.5%;}
.item2 .link { top: 68.1%;}
.item3 .link { top: 67.55%;}
.item4 .link { top: 67.55%;}
.item5 .link { top: 67.5%;}
.item6 .link { top: 70.5%;}

.atop .msg1 {
  font-size: clamp(2.7rem, 2.7vw, 3.23rem);
}

.atop .msg2,
.atop .msg3 {
  font-size: clamp(2.2rem, 2.2vw, 2.6rem);
}

.item .msg {
  font-size: clamp(2.25rem, 2.25vw, 2.7rem);
}

.item6 .msg {
  font-size: clamp(2.2rem, 2.2vw, 2.6rem);
}

.item .spec>li {
  font-size: clamp(2.8rem, 2.8vw, 3.35rem);
}

@media screen and (max-device-width: 767px){
  .lp-box span:hover,
  .lp-box a:hover{  
    opacity: 1;
  }

  .lp-box img {
    height: auto;
  }
  
  .lp-box{
    width: calc(100% + 26px);
    margin-left: -13px;
  }

  .atop .msg1 {
    font-size: 4.16vw;
  }

  .atop .msg2,
  .atop .msg3 {
    font-size: 3.35vw;
  }

  .item .msg {
    font-size: 3.48vw;
  }

  .item .spec>li {
    font-size: 4.32vw;
  }
}
