@charset "UTF-8";

/*
///////////////////////////////////////////////////////////////////////////////////////
 contents__wrapper
 ///////////////////////////////////////////////////////////////////////////////////////
*/
@media only screen and (min-width: 768px) {
  body{
    overflow-x: hidden;
  }
}

.lp0704{
  --font-yu: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
  --font-zen: "Zen Kaku Gothic New", sans-serif;;
  --fw-light: 200;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;
}

.lp0704 a{
  display: inline-block;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
}

.lp0704 p,
.lp0704 a,
.lp0704 span,
.lp0704 h1,
.lp0704 h2{
  -webkit-font-smoothing: antialiased;
}

.lp0704 .cai__wrapper span{
  line-height: 1;
}

/* ============= contents_maintxt__wrapper */
.lp0704 .contents_maintxt,
.lp0704 .contents_maintxt{
  font-family: var(--font-zen);
  font-weight: var(--fw-medium);
  font-style: normal;
}

.lp0704 .contents_maintxt__wrapper{
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

/* ============= item__wrapper */

.lp0704 .item__wrapper{
  display: flex;
  justify-content: center;
  align-items: flex-start;
  position: relative;
  z-index: 1;
}

.lp0704 .block_ttl,
.lp0704 .model-detail{
  font-family: var(--font-barbour-sans);
  line-height: 1;
  font-weight: var(--fw-light);
}

.lp0704 .sticky-ttl{
  position: sticky;
  z-index: 10;
  width: 0;
  top: 0;
}

.lp0704 .block_txt{
  font-family: var(--font-zen);
  line-height: 2;
  font-weight: var(--fw-regular);
  text-align: left;
  margin: 0 0 0 auto;
}

.lp0704 .contents_detail-txt{
  margin: 0 auto;
  font-weight: var(--fw-medium);
  width: 100%;
}

.lp0704 .block__wrapper01{
  width: 100vw;
}

.lp0704 .block__wrapper02{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.lp0704 .pic__wrapper{
  display: flex;
  justify-content: space-between;
}

/* ============= credit */
.lp0704 .crdt{
  display: flex;
  justify-content: space-between;
  font-weight: var(--fw-regular);
  font-family: var(--font-barbour-sans);
}

.lp0704 .crdt a{
  font-weight: var(--fw-medium);
  border-bottom: 2px solid #000;
}

/* ============= last-sec__wrapper */

.lp0704 .last-sec__wrapper{
  background-color: #F6F6F6;
}

.lp0704 .last-txt__inner{
  font-family: var(--font-zen);
}

.lp0704 .last-ttl{
  font-weight: var(--fw-medium);
  line-height: 1;
}

.lp0704 .last-txt{
  font-weight: var(--fw-regular);
  line-height: 2;
}

.lp0704 .last-btn{
  width: 100%;
  text-align: center;
  line-height: 1;
}

.lp0704 .last-btn span{
  font-weight: var(--fw-regular);
}



@media only screen and (min-width: 768px) {

  .lp0704{
    width: 100vw;
    margin: 0 auto calc(180* (100vw /1440));
  }

  .lp0704 .crdt{
    font-size: calc(15* (100vw /1440));
    line-height: 1;
  }

  .lp0704 .block_txt{
    font-size: calc(17* (100vw /1440));
  }

  .lp0704 .mb-40pc{
    margin-bottom: calc(30* (100vw /1440));
  }

  .lp0704 .mb-60{
    margin-bottom: calc(60* (100vw /1440));
  }

  .lp0704 .mb-140{
    margin-bottom: calc(140* (100vw /1440));
  }

  .lp0704 .mb-120pc{
    margin-bottom: calc(120* (100vw /1440));
  }

  .lp0704 .mb-180pc{
    margin-bottom: calc(180* (100vw /1440));
  }

  /* ============= contents_maintxt */

  .lp0704 .contents_maintxt__wrapper{
    width: calc(960* (100vw /1440));
    text-align: center;
  }

  .lp0704 .contents_maintxt{
    font-size: calc(24* (100vw /1440));
    line-height: 1;
  }

  .lp0704 .contents_detail-txt{
    font-size: calc(17* (100vw /1440));
  }

  /* ============= items__wrapper */

  .lp0704 .item__wrapper .block_txt{
    width: calc(720* (100vw /1440));
  }

   .items_txt{
    width: calc(800* (100vw /1440));
    margin-right: auto;
    margin-left: auto;
  }

  .lp0704 .block_ttl{
    /* writing-mode: vertical-rl;
    white-space: nowrap; */
    padding-top: calc(30* (100vw /1440));
    margin-left: calc(20* (100vw /1440));
    /* font-size: calc(64* (100vw /1440)); */
  }

  /* ----------- block_ttl */
  .lp0704 .item__wrapper.--01 .block_ttl{
    width: calc(57.28* (100vw /1440));
    margin-left: calc(10 * (100vw / 1440));
  }

  .lp0704 .item__wrapper.--02 .block_ttl{
    width: calc(56.32* (100vw /1440));
    margin-left: calc(10 * (100vw / 1440));
  }

  .lp0704 .item__wrapper.--03 .block_ttl{
    width: calc(44.7* (100vw /1440));
  }

  .lp0704 .item__wrapper.--04 .block_ttl{
    width: calc(47.68* (100vw /1440));
  }

  .lp0704 .item__wrapper.--05 .block_ttl{
    width: calc(48.32* (100vw /1440));
  }

  .lp0704 .item__wrapper.--06 .block_ttl{
    width: calc(46.72* (100vw /1440));
  }


  /* ----------- block__wrapper01 */
  .lp0704 .block__wrapper01{
    display: flex;
    justify-content: space-between;
    column-gap: calc(10* (100vw /1440));
  }

  .lp0704 .item-img01{
    width: 53.47222222%;
  }

  .lp0704 .item-img02__conteiner{
    width: 45.83333333%;
  }

  .lp0704 .model-detail{
    font-size: calc(16* (100vw /1440));
    text-align: right;
    margin-right: calc(20 * (100vw / 1440));
    margin-top: calc(10* (100vw /1440));
  }

  /* ----------- block__wrapper02 */
  .lp0704 .block__wrapper02{
    max-width: 140rem;
    margin: 0 auto;
    padding: 0 calc(120* (100vw /1440));
  }

  .lp0704 .pic__wrapper{
    width: calc(850* (100vw /1440));
    margin-right: auto;
  }

  .lp0704 .item-img03,
  .lp0704 .item-img04{
    width: calc(420* (100vw /1440));
  }

  /* ----------- credit__wrapper */
  .lp0704 .credit__wrapper{
    width: calc(370 * (100vw / 1440));
    margin-left: auto;
    margin-right: calc(350 * (100vw / 1440));
  }

  .lp0704 .crdt{
    font-size: calc(20* (100vw /1440));
  }

  .lp0704 .prc-buy a{
    margin-left: calc(20* (100vw /1440));
  }

  /* ============= last-sec__wrapper */
  .lp0704 .last-sec__wrapper{
    display: flex;
    width: calc(1200* (100vw / 1440));
    margin: 0 auto;
  }

  .lp0704 .last-img{
    width: 50%;
  }

  .lp0704 .last-txt__ccontainer{
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .lp0704 .last-txt__inner{
    width: calc(400* (100vw / 1440));
  }

  .lp0704 .last-ttl{
    font-size: calc(24* (100vw / 1440));
  }

  .lp0704 .last-txt{
    font-size: calc(17* (100vw / 1440));
  }

  .lp0704 .last-btn{
    font-size: calc(17* (100vw / 1440));
    padding: calc(20* (100vw / 1440)) 0;
  }

}

@media only screen and (max-width: 767px) {
  .lp0704{
    overflow-x: clip;
  }

  .lp0704 p{
    font-size: calc(22* (100vw / 402));
  }

  .lp0704 .block_txt{
    font-size: calc(15* (100vw / 402));
  }

  .lp0704 .mb-30sp{
    margin-bottom: calc(30* (100vw / 402));
  }

  .lp0704 .mb-60{
    margin-bottom: calc(60* (100vw /402));
  }

  .lp0704 .mb-80sp{
    margin-bottom: calc(80* (100vw / 402));
  }

  .lp0704 .mb-100sp{
    margin-bottom: calc(100* (100vw / 402));;
  }

  .lp0704 .mb-150sp{
    margin-bottom: calc(150* (100vw / 402));;
  }

  .lp0704 .mb-140sp{
    margin-bottom: calc(140* (100vw / 402));;
  }

  /* ============= mvWrapper */
  .contents_maintxt__wrapper{
    width: calc(360* (100vw / 402));
  }

  .lp0704 .contents_maintxt{
    font-size: calc(22* (100vw / 402));
    line-height: 1.6363636364;
  }

  /* ============= item__wrapper */

  .lp0704 .item__wrapper{
    transform: translateZ(0);
    backface-visibility: hidden;
    will-change: transform;
  }

  .lp0704 .item__wrapper .block_txt{
    width: calc(300* (100vw / 402));
    text-align: left;
    margin-right: calc(20 * (100vw / 402));
  }

  .lp0704 .sticky-ttl{
    top: calc(20 * (100vw / 402));
  }

  .lp0704 .block_ttl{
    font-size: calc(40* (100vw / 402));
    margin-left: calc(21* (100vw / 402));
  }

  /* ----------- block_ttl */
  .lp0704 .item__wrapper.--01 .block_ttl{
    width: calc(87.09* (100vw /402));
  }

  .lp0704 .item__wrapper.--02 .block_ttl{
    width: calc(177.08* (100vw /402));
  }

  .lp0704 .item__wrapper.--03 .block_ttl{
    width: calc(121.01* (100vw /402));
  }

  .lp0704 .item__wrapper.--04 .block_ttl{
    width: calc(176.73* (100vw /402));
  }

  .lp0704 .item__wrapper.--05 .block_ttl{
    width: calc(157.55* (100vw /402));
  }

  .lp0704 .item__wrapper.--06 .block_ttl{
    width: calc(125.89* (100vw /402));
  }

  /* ----------- block__wrapper01 */
  .lp0704 .block__wrapper01{
    padding-top: calc(20 * (100vw / 402));
  }

  .lp0704 .model-detail{
    font-size: calc(14* (100vw / 402));
    margin-top: calc(10* (100vw / 402));
    margin-right: calc(20 * (100vw / 402));
    text-align: right;
  }

  /* ----------- block__wrapper02 */
  .lp0704 .pic__wrapper{
    width: calc(360* (100vw / 402));
  }

  .lp0704 .item-img03,
  .lp0704 .item-img04{
    width: calc(175* (100vw / 402));
  }

  /* ----------- credit__wrapper */
  .lp0704 .credit__wrapper{
    width: calc(300* (100vw / 402));
    margin-right: calc(20* (100vw / 402));
    margin-left: auto;
  }

  .lp0704 .crdt{
    font-size: calc(16* (100vw / 402));
  }

  .lp0704 .prc-buy a{
    margin-left: calc(20* (100vw / 402));
  }

  /* ----------- item__wrapper --04 */
  .lp0704 .item__wrapper.--04 .block__wrapper01{
    padding-top: calc(60 * (100vw / 402));
  }

  /* ============= last-sec__wrapper */

  .lp0704 .last-sec__wrapper{
    padding-bottom: calc(80* (100vw / 402));
  }

  .lp0704 .last-txt__ccontainer{
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .lp0704 .last-txt__inner{
    width: calc(362* (100vw / 402));
  }

  .lp0704 .last-ttl{
    font-size: calc(20* (100vw / 402));
  }

  .lp0704 .last-txt{
    font-size: calc(15* (100vw / 402));
  }

  .lp0704 .last-btn{
    font-size: calc(15* (100vw / 402));
    padding: calc(20* (100vw / 402)) 0;
  }

}


/*
///////////////////////////////////////////////////////////////////////////////////////
 animation
 ///////////////////////////////////////////////////////////////////////////////////////
*/

.jsFade {
  opacity: 0;
  transform: translateY(20px);
}

.jsFade.isActive {
  opacity: 1;
  transform: translateY(0px);
  transition: opacity 0.7s, transform 0.7s;
}

.jsFade.delay05{
  transition-delay: 0.5s;
}

@media only screen and (min-width: 768px) {
  .jsFade.delay05pc{
    transition-delay: 0.5s;
  }

  .lp0704 .last-btn:hover{
    color: #4E4E4E;
    background-color: #fff;
    border: 1px solid #4E4E4E;
  }
}

.lp0704 .last-btn{
  color: #fff;
  background-color: #4E4E4E;
  border: 1px solid #4E4E4E;
}
