/*▼テキストインモーション（左→右）▼*/

    .lead-anim{
      --easing: cubic-bezier(.2,.8,.2,1);
      --step: calc(var(--bg-dur) + var(--gap) + var(--text-dur) + var(--between));
    }

    .lead-anim .commonLead{
      position:relative; display:inline-block;
      line-height:1.35; font-weight:700;
      font-size: var(--font-size, clamp(1.5rem, 4.5vw, 3.5rem));
      color: var(--font-color, #ffffff);
		margin-bottom:0!important;
    }

    .lead-anim .commonLead .line{
      position:relative; display:block;
      padding:.5em .8em; margin:.5em; z-index:0;
      width:max-content;
      width:fit-content;
    }

    .lead-anim .commonLead .line:nth-child(2){
      margin-left: var(--indent-2, 0);
    }

    .lead-anim .commonLead .line::before{
      content:""; position:absolute; inset:0; z-index:-1;
      background:var(--bg-color); border-radius:0;
      transform:scaleX(0); transform-origin:left center;
      transition: transform var(--bg-dur) var(--easing);
      transition-delay: calc(var(--i) * var(--step));
    }

    .lead-anim .commonLead .text{
      display:inline-block;
      -webkit-mask-image:linear-gradient(#000 0 0);
              mask-image:linear-gradient(#000 0 0);
      -webkit-mask-size:0% 100%; mask-size:0% 100%;
      -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
      transition:
        -webkit-mask-size var(--text-dur) var(--easing),
                mask-size var(--text-dur) var(--easing);
      transition-delay: calc(var(--i) * var(--step) + var(--bg-dur) + var(--gap));
    }

    .lead-anim .commonLead.onAnim .line::before{ transform:scaleX(1); }
    .lead-anim .commonLead.onAnim .text{
      -webkit-mask-size:100% 100%; mask-size:100% 100%;
    }

    .lead-anim .commonLead.leaving .line::before,
    .lead-anim .commonLead.leaving .text{
      transition: none !important;
    }

    @media (prefers-reduced-motion: reduce){
      .lead-anim .commonLead .line::before,
      .lead-anim .commonLead .text{ transition:none !important; }
      .lead-anim .commonLead .line::before{ transform:none; }
      .lead-anim .commonLead .text{
        -webkit-mask-size:100% 100%; mask-size:100% 100%;
      }
    }

    @supports not (mask-size: 100% 100%){
      .lead-anim .commonLead .text{
        clip-path: inset(0 100% 0 0);
        transition: clip-path var(--text-dur) var(--easing);
        transition-delay: calc(var(--i) * var(--step) + var(--bg-dur) + var(--gap));
      }
      .lead-anim .commonLead.onAnim .text{ clip-path: inset(0 0 0 0); }
      .lead-anim .commonLead.leaving .text{ transition:none !important; }
    }

/*▼左右インモーション画像用▼*/
.right_in_pl{
  width: 100%;
  padding-right:5px;
}

.right_in_pl img{
  width: 100%;
  height:clamp(300px,50vw,600px)!important;
  display: block;
  object-fit: cover;
  object-position: right center;
  clip-path: inset(0 0 0 0 round 80px 0 0 80px);
  margin-bottom:2em;
}

.left_in_pl{
  width: 100%;
}

.left_in_pl img{
  width: 100%;
  height:clamp(300px,50vw,600px)!important;
  display: block;
  object-fit: cover;
  object-position: left center;
  clip-path: inset(0 0 0 0 round 0 80px 80px 0);
}

.left_in_pl .wp-block-image .alignright {margin-left:0!important;}

/*▼タイトル裏タイトル▼*/
.title_wrap {
  position: relative;
  display: inline-block;
  margin-bottom:0!important;   
}

.title_back {
  position: absolute;
  top: 20%;
  left: 100%;
  transform: translate(-5%, 0%);
  font-size: 120px;
  font-weight: 900;
  color: transparent;                 
  -webkit-text-stroke: 1px #0071bc; 
  z-index: -10;
  opacity:.8;
  white-space: nowrap;
}

.title_front {
  position: relative;
  font-size: 70px;
  font-weight: 900;
  background: linear-gradient(to right, #1f4ebd, #9d7dc5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  z-index: 1;
}

.title_wrap2 {
  position: relative;
  display: grid;
  place-items: end center;  
  width: 100%;          
  margin-bottom: 1em!important;

}

.title_back2,
.title_front2 {
  grid-area: 1 / 1;
    line-height: 1;
}

.title_back2 {
  font-size: clamp(100px,5vw,120px);
  font-weight: 900;
  color: transparent;
  -webkit-text-stroke: 1px #0071bc;
  opacity: .8;
  white-space: nowrap;
  z-index: 0;           
  pointer-events: none;
}

.title_front2 {
  font-size:clamp(60px,5vw,70px);
  font-weight: 900;
  background: linear-gradient(to right, #1f4ebd, #9d7dc5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  z-index: 1;
}

.title_wrap2_2 {
  position: relative;
  display: grid;
  place-items: end center;  
  width: 100%; 
  margin-bottom: 1em!important;

}

.title_back2_2,
.title_front2_2 {
  grid-area: 1 / 1;
    line-height: 1;
}
.title_back2_2 {
  font-size: clamp(45px,5vw,120px);
  font-weight: 900;
  color: transparent;
  -webkit-text-stroke: 1px #0071bc;
  opacity: .8;
  white-space: nowrap;
  z-index: 0;             
  pointer-events: none;
}

.title_front2_2 {
  font-size: clamp(35px,5vw,70px);
  font-weight: 900;
  background: linear-gradient(to right, #1f4ebd, #9d7dc5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  z-index: 1;
}
.title_wrap2_3 {
  position: relative;
  display: grid;
  place-items: end center;   
  width: 100%;       
  margin-bottom: 1em!important;

}

.title_back2_3,
.title_front2_3 {
  grid-area: 1 / 1;
    line-height: 1;
}
.title_back2_3 {
  font-size: clamp(80px,5vw,120px);
  font-weight: 900;
  color: transparent;
  -webkit-text-stroke: 1px #0071bc;
  opacity: .8;
  white-space: nowrap;
  z-index: 0;            
  pointer-events: none;
}

.title_front2_3 {
  font-size: clamp(60px,5vw,70px);
  font-weight: 900;
  background: linear-gradient(to right, #1f4ebd, #9d7dc5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  z-index: 1;
}

/*▼ネオンフレーム4▼*/

.corner-frame{
  --corner-w: clamp(50px, 3.8vw, 80px);
  --corner-h: clamp(50px, 3.8vw, 80px);
  --corner-gap: 3px;
  --corner-out: 0px;  
  --glow-color:#7fe2ff; --glow-outer:18px; --glow-inner:10px;

  --corner-url: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500'><path fill='%23fff' d='M37.82,245.03L245.41,37.44h253.71v-14.33l-106.79-.05L380.04.5h-203.24v1.57L.88,177.18v203.24l22.56,12.29.05,106.79h14.33v-254.47Z'/></svg>");

  position: relative; isolation:isolate;
  padding: clamp(20px, 4vw, 48px);
  background:#0b1a27; border-radius:0px;
  box-shadow:
    inset 0 0 0 2px rgba(127,226,255,.7),
    inset 0 0 24px color-mix(in srgb, var(--glow-color) 45%, transparent);
}

.corner-frame__body{ position:relative; z-index:3; }

.corner-frame::before,
.corner-frame::after,
.corner-frame__overlay::before,
.corner-frame__overlay::after{
  content:""; position:absolute; width:var(--corner-w); height:var(--corner-h);
  background-image:var(--corner-url); background-repeat:no-repeat; background-size:contain;
  filter: drop-shadow(0 0 var(--glow-inner) var(--glow-color))
          drop-shadow(0 0 var(--glow-outer) color-mix(in srgb, var(--glow-color) 70%, transparent));
  pointer-events:none;
}

.corner-frame::before{ top:calc(var(--corner-gap)*-1 - var(--corner-out)); left:calc(var(--corner-gap)*-1 - var(--corner-out)); }
.corner-frame::after { top:calc(var(--corner-gap)*-1 - var(--corner-out)); right:calc(var(--corner-gap)*-1 - var(--corner-out)); transform:scaleX(-1); }

.corner-frame__overlay{
  position:absolute; top:0; left:0; right:0;
  bottom: calc(-1 * var(--corner-out));
  z-index:2; pointer-events:none;
}
.corner-frame__overlay::before{ bottom:calc(var(--corner-gap)*-1 - var(--corner-out)); left:calc(var(--corner-gap)*-1 - var(--corner-out)); transform:scaleY(-1); }
.corner-frame__overlay::after { bottom:calc(var(--corner-gap)*-1 - var(--corner-out)); right:calc(var(--corner-gap)*-1 - var(--corner-out)); transform:scale(-1,-1); }

.corner-frame.corner-frame--outside{ overflow:visible; }
.wp-block-columns.corner-frame{ display:block; }

/* ▼おススメフレーム▼ */

.recommend{
  border: 2px solid rgba(255,255,255,.65);
  border-radius: 6px;
  padding: 20px 24px;         
  margin-bottom: 2em;
}

.recommend > legend{
  padding: 0 .6em;
  margin-inline-start: 16px;    
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .03em;
  white-space: nowrap;
}

.recommend-list{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px 28px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.recommend-list li{
  position: relative;
  padding-left: 26px;
  line-height: 1.6;
}
.recommend-list li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  transform: translateY(.1em);
  font-weight: 900;
  color: #25c4ad;
}

@media (max-width: 520px){
  .recommend-list{ grid-template-columns: 1fr; }
}


/*▼ラインサンド▼*/
.point-band{
  --person-w: clamp(140px, 22vw, 240px); 
  --badge-w : 96px;                  
  --pad     : 20px;                  
  --line-h  : 2px;                      
  --line    : 0, 240, 255;           

  position: relative;
  padding: 20px calc(var(--person-w) + var(--pad)) 20px calc(var(--badge-w) + var(--pad) + 8px);
  color: #eaf6ff;
  background: #0b1118;
  border-radius: 8px;
  line-height: 1.9;
  isolation: isolate;
margin-bottom:2em;
}

.point-band::before,
.point-band::after{
  content:"";
  position:absolute;
  left: 12px;
  right: 12px;
  height: var(--line-h);
  background: linear-gradient(
    to right,
    rgba(var(--line), 0) 0%,
    rgba(var(--line), .65) 20%,
    rgba(var(--line), .65) 80%,
    rgba(var(--line), 0) 100%
  );
  z-index: 0;
}
.point-band::before{ top: 0; }
.point-band::after { bottom: 0; }

.point-band__badge{
  position: absolute;
  left: var(--pad);
  top: 50%;
  transform: translateY(-50%);
  width: var(--badge-w);
  height: auto;
  z-index: 1;
}

.point-band__text{
  margin: 0;
  font-size: clamp(14px, 1.6vw, 16px);
  z-index: 1;
}

.point-band__person{
  position: absolute;
  right: 0;
  top: -40px;                   
  width: var(--person-w);
  height: auto;
  object-fit: contain;
  z-index: 2;                   
  pointer-events: none;         
}