:root{
  --g: 24px;
  --radius: 18px;
  --border: rgba(255,255,255,.18);
  --shadow: 0 16px 40px rgba(0,0,0,.22);
  --text: #fff;
  --muted: rgba(255,255,255,.75);
  --gold1: #f7e7b2;
  --gold2: #d6a84f;
  --gold3: #b5852a;
}
*{
  box-sizing: border-box;
}
html{
  scroll-behavior: smooth;
}
body{
  margin:0;
  font-family: system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;
  color: var(--text);
  background:#000;
  line-height:1.7;
}
a{
  color: inherit; text-decoration: none;
}
.lp-container{
  width:min(var(--container), calc(100% - 32px)); margin-inline:auto;
}
.lp-section{
  padding: 72px 0;
}
.lp-center{
  text-align:center;
}
.lp-h2{
  margin:0 0 18px;
  font-size: clamp(22px, 2.4vw, 34px);
  line-height:1.25;
  letter-spacing:.02em;
}
.lp-lead{
  margin:0 auto 28px;
  color: var(--muted);
  max-width: 52ch;
}

/* ===== bands (背景帯) ===== */
.lp-band{
  position: relative;
  overflow: hidden;
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
}
.lp-band--dark{
  background-image: url("/wp-content/themes/ikemen/images/lp/market/dark-bg-pc.webp");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  background-color: #0b0b10;
}
@media (max-width: 768px){
  .lp-band--dark{
    background-image: url("/wp-content/themes/ikemen/images/lp/market/dark-bg-sp.webp");
    background-position: center top;
    background-size: cover;
    padding: 0 15px;
  }
}

/* ===== header ===== */
.lp-header{
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.lp-header__inner{
  padding: 14px 0;
}
.lp-header__logo{
  font-weight: 800; letter-spacing:.06em;
}

/* ===== button ===== */
.lp-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 800;
  letter-spacing: .02em;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.06);
}
.lp-btn--gold{
  border-color: rgba(255,255,255,.25);
  background: linear-gradient(180deg, var(--gold1), var(--gold2));
  color: #2b1b05;
  box-shadow: 0 12px 30px rgba(0,0,0,.22);
}
.lp-btn--xl{
  padding: 16px 22px; font-size: 16px;
}
.lp-btn:focus-visible{
  outline: 3px solid rgba(255,220,140,.35); outline-offset: 2px;
}

/* ===== FV ===== */
.lp-fv__inner{
  display:grid; gap: 22px;
}
.lp-fv__hero{
  position: relative;
}
.lp-fv__bg img{
  width: 100%;
  height: auto;
  display: block;
}
.fv__texts{
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.fv__texts img{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: auto;
}
.fv__t1{
  top: clamp(90px, 47.75px + 11.27vw, 210px);
  width: clamp(347px, 120.24px + 60.47vw, 991px);
}
.fv__t2{
  top: clamp(120px, 63.66px + 15.02vw, 280px);
  width: clamp(364px, 175.27px + 50.33vw, 900px);
}
.fv__t3{
  top: 95vw;
  width: clamp(285px, 157.54px + 33.99vw, 647px);
}


@media (max-width: 1300px){
  .fv__t1{
    width: 59vw;
  }
  .fv__t2{
    width: 64vw;
  }
  .fv__t3{
    width: 46vw;
    top: 28vw;
  }
}

@media (max-width: 768px){
  .fv__t1{
    top: 24vw;
    width: clamp(347px, 120.24px + 60.47vw, 991px);
  }
  .fv__t2{
    top: 32vw;
    width: clamp(364px, 175.27px + 50.33vw, 900px);
  }
  .fv__t3{
    top: 95vw;
    width: 90%;
    max-width: 293px;
  }
}

@media (max-width: 350px){
  .fv__t1{
    width: 90%;
  }
  .fv__t2{
    width: 95%;
  }
  .fv__t3{
    top: 90vw;
    max-width: 95%;
  }
}

@media (min-width: 1301px){
  .fv__t3 {
    top: 28vw;
  }
}


/* ===== CTA ===== */
.lp-fv__cta{
  position: absolute;
  left: 50%;
  top: 82%;
  transform: translate(-50%, -50%);
  z-index: 3;
}
@media (max-width: 768px){
  .lp-fv__cta{
    top: 120vw;
    width: 100%;
    text-align: center;
  }
}
.lp-ctaImgLink{
  display: inline-block;
  line-height: 0;
}
.lp-ctaImgLink img{
  width: 100%;
  max-width: 520px;
  height: auto;
  display: block;
  margin-inline: auto;
}

@media (max-width: 1300px){
  .lp-ctaImgLink img{
    max-width: initial;
    width: 40vw;
  }
}

@media (max-width: 768px){
  .lp-ctaImgLink img {
    width: 90%;
    max-width: 320px;
    height: auto;
    display: block;
  }
}

/* ===== worry section ===== */
.lp-worry{
  padding: 80px 0;
}

.lp-worry__head,
.lp-worry__foot{
  text-align: center;
}

.lp-worry__headImg{
  width: clamp(294px, 98.93px + 52.02vw, 848px);
  height: auto;
  display: block;
  margin: 0 auto 55px;
}

.lp-worry__footImg{
  width: clamp(289px, 136.18px + 40.75vw, 723px);
  height: auto;
  display: block;
  margin: 80px auto 0;
}

.lp-worry__items{
  width: min(960px, 100%);
  margin-left:auto;
  margin-right: auto;
}

.lp-worryItem{
  display: flex;
  justify-content: center;
  width: 100%;
  margin-bottom: clamp(0px, -14.08px + 3.76vw, 40px);
}

.lp-worryItem:last-child{
  margin-bottom: 0;
}

.lp-worryItem__frame{
  display: flex;
  align-items: center;
}

.lp-worryItem__img{
  width: clamp(205.43px, 65.79px + 37.24vw, 602px);
}

.lp-worryItem__bubble{
  width: clamp(159px, 56.54px + 27.32vw, 450px);
  margin-left: -2.8vw;
}

.lp-worryItem--a .lp-worryItem__bubble{
  width: clamp(120px, 37.96px + 21.88vw, 353px);
  margin-left: 0;
}

.lp-worryItem--b .lp-worryItem__bubble{
  width: clamp(156px, 32.41px + 32.96vw, 507px);
  margin-right: -2.5vw;
}

.lp-worryItem__bubble img {
  width: 100%;
}

/* ===== responsive ===== */
@media (max-width: 768px){
  .lp-worry{
    padding: 30px 0 0;
  }

  .lp-worry__headImg{
    margin-bottom: 20px;
  }

  .lp-worry__items{
    width: 100%;
    gap: 22px;
  }
  .lp-worryItem--b {
    justify-content: flex-end;
  }
  .lp-worryItem__frame{
    margin-left: -4vw;
  }
  .lp-worryItem--b .lp-worryItem__frame{
    margin-left: 0;
    margin-right: -3vw;
  }
  .lp-worryItem__bubble{
    margin-left: -4vw;
  }
  .lp-worryItem--b .lp-worryItem__bubble{
    margin-right: -3vw;
    margin-left: 0;
}
  .lp-worryItem__bubble img,.lp-worryItem--a .lp-worryItem__bubble img,.lp-worryItem--b .lp-worryItem__bubble img{
    width: 100%;
  }
  .lp-worry__footImg{
    margin: 40px auto 0;
  }
}

@media (max-width: 350px){
  .lp-worryItem__bubble,.lp-worryItem--a .lp-worryItem__bubble,.lp-worryItem--b .lp-worryItem__bubble{
    width: 36%;
  }
}

/* ===== intro section ===== */
.lp-intro{
  padding: 72px 0;
}

.lp-intro__head{
  text-align: center;
}

.lp-intro__headImg{
  width: 100%;
  width: clamp(200px, -50px + 66.67vw, 910px);
  height: auto;
  display: block;
  margin: 0 auto 28px;
}

.lp-intro__figure{
  text-align: center;
}

.lp-intro__figureImg{
  width: 100%;
  max-width: 960px;
  height: auto;
  display: block;
  margin: 0 auto;
}

@media (max-width: 768px){
  .lp-intro {
    padding: 20px 0 40px;
  }
  .lp-intro__figure {
    margin: 0 -18px;
  }
  .lp-intro__headImg{
    margin: 0 auto;
  }
}

/* ===== plan section ===== */
.lp-plan{
  position: relative;
}

.lp-plan__inner{
  position: relative;
  /* overflow: hidden; */
}

/* background */
.lp-plan__bg img{
  width: 100%;
  height: auto;
  display: block;
}

@media (min-width: 1441px){
  .lp-plan__bg img{
    height: 915px;
  }
}

/* content overlay */
.lp-plan__content{
  position: absolute;
  inset: 0;
  padding: 70px 16px 22px;
  display: grid;
  justify-items: center;
  align-content: start;
}

.lp-plan__contentInner{
  width: 100%;
}

/* head image */
.lp-plan__head{
  width: clamp(271px, 97.06px + 46.38vw, 765px);
  height: auto;
  display: block;
  margin: 0 auto 30px;
}

.lp-plan__cta{
  position: relative;
  margin-top: 10px;
  text-align: center;
  z-index: 99;
}

.lp-plan__note{
  width: min(980px, 100%);
  text-align: right;
  margin-block-start: 0;
  margin-block-end: 0;
  padding-top: .5rem;
  margin: 0 auto;
}

.lp-plan__note img{
  position: relative;
  display: inline-block;
  max-width: 768px;
  height: auto;
  z-index: 99999;
}

.lp-ctaLink{
  display: inline-block;
  text-decoration: none;
  transition: transform .2s ease, filter .2s ease;
}

.lp-ctaLink img{
  width: clamp(150px, calc(17.5vw + 84px), 360px);
  height: auto;
  display: block;
}

@media (hover:hover){
  .lp-ctaLink:hover{
    transform: translateY(-2px);
    filter: brightness(1.04);
  }
}

.lp-plan__pc{
  width: 100%;
  position: relative;
  z-index: 1000;
}

.lp-planGrid{
  list-style: none;
  padding: 0;
  margin: 0 auto;
  width: min(980px, 100%);
  display: grid;
  grid-template-columns: repeat(3, auto);
  justify-content: center;
  align-items: end;
  gap: clamp(16px, calc(1.31vw + 11.1px), 30px);
}

.lp-planCard{
  width: clamp(125px, calc(16.43vw + 63.4px), 300px);
}

.lp-planCard img{
  width: 100%;
  height: auto;
  display: block;
}

.lp-plan__sp{
  display: none;
  width: 100%;
}

.lp-planCarousel{
  position: relative;
  width: min(560px, 100%);
  margin-inline: auto;
  padding-top: 6px;
}

.lp-planCarousel__track{
  list-style: none;
  margin: 0;
  padding: 0;
}

.lp-planCarousel__item{
  opacity: 1;
}

.lp-planCarousel__item img{
  width: 100%;
  height: auto;
  display: block;
}

/* buttons */
.lp-planCarousel__btn{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 38px;
  height: 38px;
  border: 0;
  background: rgba(120, 0, 0, .35);
  color: #fff;
  border-radius: 50%;
  cursor: pointer;
  display: grid;
  place-items: center;
  z-index: 4;
  backdrop-filter: blur(2px);
}

.lp-planCarousel__btn--prev{
  left: 6px;
}

.lp-planCarousel__btn--next{
  right: 6px;
}

@media (max-width: 768px){
  .lp-plan__inner{
    overflow: unset;
  }
  .lp-plan__pc{
    display: none;
  }

  .lp-plan__sp{
    display: block;
    width: 100%;
    max-width: 375px;
    margin-inline: auto;
  }

  .lp-plan__content{
    padding: 20px 14px 18px;
  }

  .lp-plan__head{
    margin-bottom: 0;
  }

  .lp-planCarousel{
    position: relative;
    width: 100%;
    height: 290px;
    padding-top: 0;
  }

  .lp-planCarousel__track{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
  }

  .lp-planCarousel__item{
    position: absolute;
    width: 150px;
    top: 0;
    left: 50%;
    transform-origin: center center;
    transition:
      transform .6s cubic-bezier(.22, .61, .36, 1),
      opacity .6s ease,
      filter .6s ease;
    will-change: transform, opacity, filter;
    cursor: pointer;
  }

  .lp-planCarousel__item img{
    width: 100%;
    height: auto;
    display: block;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
  }

  .lp-planCarousel__item.is-left{
    transform: translate(-50vw,0) scale(.82);
    opacity: .42;
    filter: brightness(.72) saturate(.9);
    z-index: 1;
  }

  .lp-planCarousel__item.is-center{
    transform: translate(-50%, 25%) scale(1.12);
    opacity: 1;
    filter: brightness(1) saturate(1);
    z-index: 3;
  }

  .lp-planCarousel__item.is-right{
    transform: translate(10vw,0) scale(.82);
    opacity: .42;
    filter: brightness(.72) saturate(.9);
    z-index: 1;
  }

  [data-plan="30000"] {
    margin-top: -21px;
  }

  .lp-plan__note{
    width: 100%;
    padding-top: 15px;
  }

  .lp-plan__note img{
    width: 100%;
    margin-inline: auto;
    max-width: 380px;
  }

  .lp-plan__cta{
    width: 100%;
    display: grid;
    justify-items: center;
    margin-top: 0;
  }
}

@media (max-width: 350px){
  .lp-planCarousel__item.is-right {
    transform: translate(3vw, 0) scale(.82);
  }
}

/* ===== star band ===== */
.lp-band--star{
  background-image: url("/wp-content/themes/ikemen/images/lp/market/star-bg.webp");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  margin-top: clamp(-90px, -93.52px + 0.94vw, -80px);
}
@media (max-width: 768px){
  .lp-band--star{
    padding: 0 10px;
  }
}
@media (max-width: 350px){
  .lp-band--star{
    margin-top: -70px;
  }
}
@media (min-width: 1441px){
  .lp-band--star{
    margin-top: -112px;
  }
}
@media (min-width: 1300px){
  .lp-band--star{
    margin-top: -8vw;
  }
}

/* ===== section head ===== */
.lp-sectionHead{
  text-align: center;
  margin: 0 0 40px;
}

.lp-sectionHead__img{
  width: clamp(210px,calc(30vw),540px);
  height: auto;
  display: block;
  margin: 0 auto;
}

/* ===== support titles ===== */
.lp-supportTitles{
  padding: 140px 0 36px;
}

.lp-supportTitles__panel{
  background: rgba(12, 0, 31, 0.90);
  padding: clamp(18px, 5vw, 40px);
  max-width: 960px;
  margin:0 auto;
}

.lp-titlesGrid{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: clamp(16px, 7vw, 35px);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}

@media (min-width: 1441px){
  .lp-supportTitles {
    padding: 200px 0 36px;
  }
}

@media (max-width: 1300px){
  .lp-supportTitles {
    padding: 12vw 0 36px;
  }
}

@media (max-width: 1000px){
  .lp-supportTitles {
    padding: 18vw 0 36px;
  }
}

@media (max-width: 768px){
  .lp-sectionHead{
    margin: 0;
  }
  .lp-faq .lp-sectionHead{
    margin: 0 0 30px;
  }
  .lp-supportTitles{
    padding: 100px 0 36px;
  }
  .lp-supportTitles__panel{
    padding: clamp(15px, 2vw, 40px);
    padding-top: 30px;
    padding-bottom: 30px;
    background: none;
  }
  .lp-titlesGrid{
    grid-template-columns: 1fr;
    gap: 30px;
  }
}

@media (max-width: 350px){
  .lp-supportTitles {
    padding: 150px 0 36px;
  }
}

.lp-titleCard{
  text-align: center;
}

.lp-titleCard__link{
  display: block;
  text-decoration: none;
  color: inherit;
  transition: transform .25s ease, filter .25s ease;
}

.lp-titleCard__link:hover{
  transform: translateY(-4px);
  filter: brightness(1.05);
}

@media (hover: none){
  .lp-titleCard__link:hover{
    transform: none;
    filter: none;
  }
}

.lp-titleCard__thumb{
  width: 100%;
  max-width: 391px;
  height: auto;
  display: block;
  border-radius: 10px;
}

.lp-titleCard__nameWrap{
  height: 21px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 15px;
}
.lp-titleCard__nameImg{
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  display: block;
}

@media (hover: none){
  .lp-titleCard__nameWrap{
    height: 16px;
  }
}

/* ===== FAQ ===== */
.lp-faq{
  padding: 36px 0 40px;
  position: relative;
  z-index: 10;
}

.lp-faq__panel{
  margin-top: 14px;
  border-radius: 12px;
  max-width: 960px;
  margin: 0 auto 6rem;
}

@media (max-width: 768px){
  .lp-faq__panel{
    margin: 0 auto 3rem;
  }
}

/* リスト */
.lp-faqList{
  display: grid;
  gap: 14px;
}

/* ===== FAQ box ===== */
.lp-faqItem{
  border-radius: 0;
  overflow: hidden;
  border: 3px solid #7a5a16;
  box-shadow:
    inset 0 0 0 1px #e8d39a,
    inset 0 6px 10px rgba(255,255,255,.45),
    inset 0 -8px 12px rgba(120,90,20,.25),
    0 6px 18px rgba(0,0,0,.25);
  background: linear-gradient(
    180deg,
    #e3d1a3 0%,
    #f7f4d8 52%,
    #e3d1a3 100%
  );
}

/* Q行 */
.lp-faqQ{
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 14px 18px;
  cursor: pointer;
  color: #3a2a00;
}

/* A行 */
.lp-faqA{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  padding: 12px 18px 18px;
  border-top: 1px solid rgba(120,90,20,.25);
  color: #3a2a00;
}
.lp-faqItem:not([open]){
  background:
    linear-gradient(
      180deg,
      #e8dbb0 0%,
      #dcc488 100%
    );
}

/* ===== FAQ icon size + rotate ===== */
.lp-faqQ__icon{
  width: 30px;   /* PC */
  height: 30px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}

@media (max-width: 768px){
  .lp-faqQ__icon{
    width: 25px; /* SP */
    height: 25px;
  }
}

.lp-faqQ__iconImg{
  width: 100%;
  height: auto;
  display: block;
  transition: transform .25s ease;
  transform-origin: 50% 50%;
  transform: rotate(0deg);
}

.lp-faqItem[open] .lp-faqQ__iconImg{
  transform: rotate(180deg);
}


/* ===== responsive ===== */
@media (max-width: 768px){
  .lp-faq{
    padding: 0 0 56px;
  }
  .lp-faqQ{
    padding: 12px 14px;
  }
  .lp-faqA{
    padding: 10px 14px 14px;
  }
}



/* ===== closing ===== */
.lp-closing{
  position: relative;
  margin-top: -270px;
}
.lp-closing__inner{
  position: relative; overflow: hidden;
}

.lp-closing__bg img{
  width: 100%;
  height: auto;
  display: block;
}

.lp-closing__content{
  position: absolute;
  inset: 0;
  padding: 24px 16px;
  text-align: center;
}

.lp-closing__texts{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: clamp(100px, calc(27.2vw - 2px), 390px);
  display: grid;
  justify-items: center;
  gap: 10px;
  width: min(960px, 100%);
}

.lp-closing__t1{
  width: clamp(300px,calc(45.1vw + 131px),780px);
  height: auto;
  display: block;
}

.lp-closing__t2{
  width: clamp(355px,calc(43.7vw + 191px),820px);
  height: auto;
  display: block;
}

/* CTA：固定 */
.lp-closing__cta{
  text-align: center;
}

.lp-closing__cta a{
  position: relative;
  display: inline-block;
  text-decoration: none;
  transition: transform .2s ease, filter .2s ease;
}

.lp-closing__cta img{
  width: min(520px, 88vw);
  height: auto;
  display: block;
  margin-inline: auto;
}

/* hover */
@media (hover:hover){
  .lp-closing__cta a:hover{
    transform: translateY(-2px);
    filter: brightness(1.04);
  }
}

/* SP微調整 */
@media (max-width: 768px){
  .lp-closing{
    margin: 0 -15px;
  }
  .lp-closing__texts{
    gap: 8px;
    width: 100%;
  }
  .lp-closing__cta{
    bottom: clamp(24px, 8vw, 48px);
  }

  .lp-closing__cta img{
    width: 90%;
    max-width: 320px;
  }
}



/* ===== 追従CTA ===== */
.lp-ctaImgLink{
  display: inline-block;
  text-decoration: none;
  line-height: 0;
}

/* ===== sticky ===== */
.lp-stickyCta{
  text-align: center;
  position: fixed;
  z-index: 60;
  left: 50%;
  bottom: 0;
  background: transparent;
  border: 0;
  padding: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%,100%);
  transition: opacity .28s ease, transform .28s ease, visibility .28s ease;
  z-index: 1000000;
}

.lp-stickyCta.is-show{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%,0);
}

.lp-stickyCta.is-hide{
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%,100%);
}

@media (hover:hover){
  .lp-ctaImgLink:hover{
    transform: translateY(-2px);
    filter: brightness(1.04);
  }
}

@media (max-width: 768px){
  .lp-stickyCta{
    width: 100%;
  }
}

.small {
  padding: 0.5em 0;
  display: block;
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-size: 12px;
  color: #ffffff;
}

@media (max-width: 768px){
  .small {
    font-size: 10px;
  }
}