/* ============================
  表示時にふわっと
============================ */
body {
  opacity: 0;
  transition: opacity 0.6s ease;
}

body.is-loaded {
  opacity: 1;
}

/* ============================
  common
============================ */
html {
    width: 100%;
    scroll-behavior: smooth;
    box-sizing: border-box;
    overflow-x: hidden;
}


body {
  background-color: var(--bk);
  font-family: var(--font);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
  overflow-x: hidden;
  color: var(--wh);
  margin: 0;
  padding: 0;
  scroll-behavior: smooth;
}

a {
    text-decoration: none;
}

a:hover {
  opacity: 1;
  -webkit-transition: background-color 0.5s ease-in;
}


br.sp-br {
    display: none;
}
span.forSP {
    display: none;
}
    @media(max-width:768px){
    span.forSP {
        display: block;
    }
    br.sp-br {
    display: block;
    }
    br.pc-pr {
    display: none;
    }
    }

/* ============================
  color
============================ */
:root {
  --bk: #000238;
  --wh: #FFFFFF;
}


/* ============================
  fonts
============================ */
:root {
  --font: "Zen Old Mincho", serif;
}

.zen-old-mincho-regular {
  font-family: "Zen Old Mincho", serif;
  font-weight: 400;
  font-style: normal;
}


:root {
  --12 : clamp(10px, 0.625vw, 12px);
  --13 : clamp(11px, 0.677vw, 13px);
  --15 : clamp(11.3px, 0.78125vw, 15px);
  --16 : clamp(12px, 0.8333vw, 16px);
  --17 : clamp(12.75px, 0.8854vw, 17px);
  --18 : clamp(13px, 0.9375vw, 18px);
  --20 : clamp(15px, 1.041vw, 20px);
  --21 : clamp(15.75px, 1.09375vw, 21px);
  --22 : clamp(16.5px, 1.145vw, 22px);
  --23 : clamp(17.25px, 1.198vw, 23px);
  --24 : clamp(18px, 1.25vw, 24px);
  --26 : clamp(19.5px, 1.354vw, 26px);
  --28 : clamp(21px, 1.458vw, 28px);
  --30 : clamp(22.5px, 1.5625vw, 30px);
  --33 : clamp(24.75px, 1.718vw, 33px);
  --35 : clamp(26.25px, 1.823vw, 35px);
  --38 : clamp(28.5px, 1.98vw, 38px);
  --40 : clamp(30px, 2.083vw, 40px);
  --45 : clamp(33px, 2.343vw, 45px);
  --50 : clamp(37.5px, 2.604vw, 50px);
  --57 : clamp(42px, 2.968vw, 57px);
  --101 : clamp(75px, 5.2604vw, 101px);
}

/* ============================
  h2
============================ */
h2 {
  margin-block-start: 0;
  margin-block-end: 0;
  line-height: 1;
  font-size: clamp(53px, 5.26vw, 101px);
  font-weight: 400;
}

    @media(max-width:768px){
      h2 {
        font-size: 40px;
        line-height: 2;
    }
    }


/* ============================
  h3
============================ */
h3{
    margin-block-start: 0;
    margin-block-end: 0;
    line-height: 1;
    font-size: clamp(18px, 1.8229vw, 35px);
    font-weight: 700;
}
    @media(max-width:768px){
    h3 {
    font-size: 22px;
    }
    }

    @media (max-width: 375px) {
    h3 {
    font-size: 19px;
    }
    }


/* ============================
  bg_motion video
============================ */
.bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  z-index: -2;
}

/* 動画（最背面） */
.bg__motion {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 180vw;   /* ← 回転対策 */
  height: 180vh;  /* ← 回転対策 */
  transform: translate(-50%, -50%) rotate(135deg);
}

.bg__motion video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.5;
}

/* ============================
  bg_light 左上の光背景
============================ */
/* 上に重ねる光画像 */
.bg__light {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none; /* ← クリック邪魔しない */
  z-index: -1;
}

.bg__light img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1;
}


/* ============================
  header
============================ */
.header {
    display: flex;
    align-items: self-start;
    justify-content: space-between;
    padding: 42px 5.6% 0 1.7%;
}

a.header__logo {
    display: flex;
    align-items: center;
    font-size: var(--45);
    gap: .5em;
    color: var(--wh);
}

.header__logo img {
    width: 55px;
    display: block;
}

.header__nav {
    max-width: 440px;
}

.header__nav ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: min-content;
    gap: 10px 20px;
    padding: 0;
    margin: 0;
    list-style: none;
}

nav.header__nav ul li {
    place-content: center;
}

.header__nav li:nth-child(1)  { grid-column: 1; grid-row: 1; }
.header__nav li:nth-child(2)  { grid-column: 2; grid-row: 1; }
.header__nav li:nth-child(3)  { grid-column: 3; grid-row: 1; }

.header__nav li:nth-child(4)  { grid-column: 1; grid-row: 2; }
.header__nav li:nth-child(5)  { grid-column: 2; grid-row: 2; }
.header__nav li:nth-child(6)  { grid-column: 3; grid-row: 2; }

.header__nav li:nth-child(7)  { grid-column: 1; grid-row: 3; }
.header__nav li:nth-child(8)  { grid-column: 2; grid-row: 3; }
.header__nav li:nth-child(9)  { grid-column: 3; grid-row: 3; }

.header__nav li:nth-child(10) {
    grid-column: 3;
    grid-row: 4;
}

/* .noteのみ小文字 */
.header__nav li:nth-child(6) a {
  font-size: calc(var(--22) * 1.5);
  text-transform: lowercase;
  padding: 0 0 10px;
}
.header__nav li:nth-child(6) a::after {
    bottom: 8px;
}


/* .contactのみ別仕様 */
.header__nav li:nth-child(10) a {
    border: .6px solid var(--wh);
    line-height: 1;
    margin-left: -10px;
    padding: 10px;
    max-width: 150px;
    transition: all 0.3s ease;
    margin-top: 10px;
}
.header__nav li:nth-child(10) a:hover {
    background-color: var(--wh);
    color: var(--bk);
}
.header__nav li:nth-child(10) a::after {
    display: none;
}


/* 必要に応じてリンクの装飾 */
.header__nav a {
    text-decoration: none;
    color: var(--wh);
    padding: 5px 0;
    font-size: var(--23);
    max-width: 150px;
    line-height: 1.435;
}
.header__nav .ext-link {
    display: inline-block;
    width: 0.7vw;
    margin-left: 0.7vw;
}

@media(max-width:1024px){
a.header__logo {
font-size: 20px;
}
a.header__logo img {
width: 26px;
}
}


@media(max-width:768px){
  .header {
    padding: 7px 20px;
}
  a.header__logo {
    position: fixed;
    font-size: 16px;
    z-index: 999999;
}
a.header__logo img {
    width: 40px;
}

}



/* hoverで下線が延びる  共通
==========================*/
.header__nav a,
.footer__nav a,
.drawer__nav a {
  position: relative;
  text-decoration: none;
  display: inline-block;
}

/* 下線（最初は0） */
.header__nav a::after,
.footer__nav a::after,
.drawer__nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background: var(--wh);
  transition: width 0.3s ease;
}

.header__nav a:nth-child(10)::after,
.footer__nav a:nth-child(10)::after,
.drawer__nav a:nth-child(10)::after {
  position: static;
}

/* hoverで伸びる */
.header__nav a:hover::after,
.footer__nav a:hover::after,
.drawer__nav a:hover::after {
  width: 100%;
}

@media(max-width:768px){
.header__nav {
    display: none;
}
}


/* ============================
  side-menu
============================ */
.side-menu {
  height: 100vh;
  width: 55px;
  position: fixed;
  top: 0;
  padding: 42px 1.7% 0;
  z-index: 10000;
}

.side-menu a {
  width: 55px;
  height: 55px;
  display: block;
}

.side-menu a img {
  width: 100%;
  object-fit: contain;
  vertical-align: bottom;
}

/* ボタン */
.side-menu__btn {
  position: absolute;
  top: calc(50% - 75px);
  left: 50%;
  transform: translate(-50%, -50%);
  background: none;
  border: none;
  cursor: pointer;
  width: 60px;
  height: 27px;
}

/* テキスト */
.side-menu__text {
  display: inline-block;
  position: absolute;
  top: calc(50% - 40px);
  left: calc(50% - 9px);
  font-size: 18px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  letter-spacing: 0.3em;
  transition: opacity 0.3s, letter-spacing 0.3s;
}

/* OPEN時 */
.side-menu.is-open .side-menu__text {
  letter-spacing: 0.1em;
}


        @media(max-width:768px){
        .side-menu {
        height: 52px;
        width: 100%;
        padding: 0;
        backdrop-filter: blur(10px);
        }
        .side-menu__btn {
        top: 50%;
        right: 0;
        left: auto;
        width: 42px;
        height: 27px;
        }
        .side-menu a {
        width: 42px;
        height: 42px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 20px;
        }
        .side-menu a img {
        display: none;
        }
        .side-menu__text {
        display: none;
        }
        }


/* コンセプトセクションに入ったらサイドメニュー表示
=============================================== */
.side-menu {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.5s ease;
}

/* 表示状態 */
.side-menu.is-show {
  opacity: 1;
  pointer-events: auto;
}



/* ============================
  drawer
============================ */
.drawer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: #ffffff38;
  transform: translateX(100%);
  transition: transform 0.5s ease;
  z-index: 9999;
}

/* 開いた状態 */
.drawer.is-open {
  transform: translateX(0);
}

/* 背景オーバーレイ */
.drawer::before {
  content: "";
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 1);
  opacity: 0;
  pointer-events: none;
  transition: 0.5s;
  z-index: -1;
}

.drawer.is-open::before {
  opacity: 1;
  pointer-events: auto;
}

/* ナビ */
.drawer__nav {
  padding: 120px 40px;
  display: grid;
  gap: 20px;
}



/* ============================
  hamburger
============================ */
.side-menu__hamburger {
  position: absolute;
  left: 50%;
  width: 36px;
  height: 2px;
  background: var(--wh);
  display: block;
  transition: 0.4s;
  transform: translateX(-50%);
}

/* ＝状態 */
.side-menu__hamburger:nth-child(1) {
  top: 6px;
}

.side-menu__hamburger:nth-child(2) {
  bottom: 6px;
}

/* ×状態 */
.side-menu.is-open .side-menu__hamburger:nth-child(1) {
  top: 50%;
  transform: translate(-50%, -50%) rotate(30deg);
}

.side-menu.is-open .side-menu__hamburger:nth-child(2) {
  bottom: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-30deg);
}

/* ============================
  fv
============================ */
.fv {
    height: calc(100vh - 200px);
    padding: 0 8%;
}
.fv__main-text {
    display: flex;
    align-items: end;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 84%;
    left: 50%;
    max-width: 1620px;
    margin: 0 auto;
}
.fv__main-text p {
    font-size: clamp(19px, 1.354vw, 26px);
    width: 42%;
}

.fv__main-text h1 {
    width: 58%;
    font-size: clamp(49px, 4vw, 88px);
    line-height: 1.36;
    font-weight: 700;
}
.fv__footer-text {
    display: flex;
    align-items: end;
    position: absolute;
    transform: translate(-50%, -50%);
    width: 84%;
    left: 50%;
    bottom: 68px;
    max-width: 1620px;
    margin: 0 auto;
}
.fv__footer-text span {
  display: block;
  width: 58%;
}

.fv__footer-text span {
  display: block;
  width: 58%;
}
.fv__footer-text p {
  width: 42%;
  font-size: clamp(24px, 2.08vw, 40px);
  line-height: 1.95;
}

.fv__emblem {
    width: 100%;
    position: fixed;
    z-index: -1;
    bottom: 0;
    right: 0;
}
.fv__emblem img {
    margin: 0 0 0 auto;
    display: block;
    width: 26%;
}


@media(max-width:1024px){
.fv__main-text {
flex-direction: column;
align-items: flex-start;
}
.fv__main-text h1 {
width: 100%;
        font-size: 38px;
}
.fv__main-text p {
margin-top: 24px;
}
.fv__footer-text {
  text-align: right;
}
.fv__footer-text p {
width: 100%;
}
.fv__footer-text span {
display: none;
}
}

    @media(max-width:768px){
    .fv {
    height: 100vh;
    padding: 0 5%;
    }
    .fv__main-text {
    width: 90%;
    }
    .fv__footer-text {
    width: 100%;
    flex-direction: column;
    left: 45%;
    bottom: 40px;
    }
    .fv__main-text h1 {
    width: 100%;
    font-size: 33px;
    }
    .fv__footer-text p {
    width: 100%;
    font-size: 16px;
    }
    .fv__main-text p {
    width: 100%;
    font-size: 14px;
    }
    .fv__emblem img {
      margin: 0 0 0 auto;
      display: block;
    width: 58%;
    }
    }

    @media (max-width: 375px) {
    .fv__main-text h1 {
      font-size: 32px;
    }
    }



/* ============================
  concept
============================ */
section.concept {
    padding: 100px 8% 0;
    margin-top: 40px;
}
.concept__inner {
    display: flex;
    align-items: flex-start;
    left: 50%;
    max-width: 1620px;
    margin: 0 auto;
}
.concept__inner h2 {
  width: 58%;
}
.concept__inner p {
  width: 42%;
  font-size: var(--26);
  line-height: 1.58;
}

    @media(max-width:768px){
    section.concept {
    padding: 100px 5% 0;
    margin-top: 75px;
    }
    .concept__inner {
    flex-direction: column;
    }
    .concept__inner p {
    width: 100%;
    font-size: 14px;
    margin-top: 30px;
    }
    }


/* ============================
  about
============================ */
section.about {
    padding: 100px 8% 130px;
    margin-top: 44px;
}
.about__inner {
    text-align: center;
    max-width: 1620px;
    margin: 0 auto;
}
.about__inner h3 {
    margin-top: 68px;
    line-height: 1.6;
}
.about__subTitle {
    font-size: var(--38);
    margin-top: 40px;
    font-weight: 700;
}
p.about__text {
    font-size: var(--22);
    line-height: 1.95;
    margin-top: 44px;
}

    @media(max-width:768px){
    section.about {
    padding: 100px 5% 115px;
    margin-top: 0;
    }
    .about__subTitle {
    font-size: 23px;
    margin-top: 0;
    }
    .about__inner h3 {
    margin-top: 30px;
    font-size: 20px;
    }
    p.about__text {
    font-size: 14px;
    margin-top: 20px;
    }
    }
    @media(max-width:375px){
      .about__inner h3 {
        font-size: 19px;
    }
    }


/* ============================
  about-method
============================ */
.about-method {
text-align: center;
}
.about-method p {
font-size: clamp(38px, 4.9vw,98px);
color: var(--wh);
font-weight: 400;
letter-spacing: 0;
display: inline-flex;
align-items: center;
text-transform: lowercase;
opacity: .39;
line-height: 1;
margin-top: -1em;
}    
    @media(max-width:768px){
    .about-method p {
    font-size: clamp(38px, 8vw, 98px);
    }
    .bg__method-voice {
    position: relative;
    }
    .about-method {
    position: absolute;
    top: -1em;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    }
    }


/* ============================
  method
============================ */
section.method {
    padding: 160px 8% 0;
    margin-top: 0;
}
.method__inner {
    max-width: 1620px;
    margin: 0 auto;
}
.method__inner h3 {
    margin-top: 30px;
}
.method__flex {
    display: flex;
    justify-content: space-between;
    gap: 4%;
}
.method__flex img {
    width: 100%;
    object-fit: contain;
    vertical-align: baseline;
}
.method__text {
    font-size: var(--22);
    line-height: 1.95;
}

.method__left {
    /* margin-top: 64px; 修正0427*/
    margin-top: auto;
    /* 追加0427 */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-bottom: 36px;
}
.method__left img {
    margin-top: 64px;
}

.method__right img {
    /* margin-bottom: 64px; */
    margin-bottom: auto;
}

/* 追加0427 */
.method__right {
margin-top: clamp(-18px, -1.8229vw, -35px);
display: flex;
flex-flow: column;
justify-content: space-between;
}
.method__right .method__text {
margin-bottom: 36px;
}
.method__center {
display: flex;
flex-direction: column;
justify-content: end;
}

    /* ===== SP ===== */
    @media (max-width: 768px) {
    section.method {
    padding: 20px 0 0;
    margin-top: 0;
    }
    .method__inner {
    display: grid;
    grid-template-areas:
    "imgCenter"
    "ttlH2"
    "ttlH3";
    }
    .method__flex {
    display: contents;
    }
    .method__center {
    grid-area: imgCenter;
    width: 90%;
    margin: 70px 5% 0;
    }
    .method__inner h2 {
    grid-area:ttlH2;
    width: 95%;
    margin-left: 5%;
    margin-top: 30px;
    }
    .method__inner h3 {
    grid-area:ttlH3;
    width: 95%;
    margin-left: 5%;
    margin-top: 15px;
    }
    .method__left {
    display: flex;
    margin-top: 20px;
    flex-direction: column;
    margin-bottom: auto;/*0427追加*/
    }
    .method__right {
    display: flex;
    flex-direction: column-reverse;
    }
    .method__left .method__text {
    width: 95%;
    text-align: left;
    margin-left: 5%;
    line-height: 1.5;
    font-size: 14px;
    }

    .method__left img {
    margin-top: 40px;
    width: 80%;
    margin-left: 20%;
    }
    .method__right .method__text {
    width: 95%;
    text-align: right;
    margin-right: 5%;
    line-height: 1.5;
    margin-top: 40px;
    font-size: 14px;
    }

    .method__right img {
    width: 80%;
    margin: 40px 20% 0 0;
    }
    }


/* ============================
  service
============================ */
section.service {
    padding: 100px 8% 0;
    margin-top: 130px;
}
.service__inner {
    max-width: 1620px;
    margin: 0 auto;
}
.service__title {
    display: flex;
    align-items: flex-end;
}
.service__title h3 {
    margin-left: 7%;
}
p.service__text {
    font-size: var(--22);
    line-height: 1.95;
    text-align: center;
    margin: 115px auto 0;
    padding-bottom: 170px;
}
.service__title p {
    display: none;
}

@media(max-width:768px){
  section.service {
    padding: 100px 5% 0;
    margin-top: 30px;
}
  .service__title {
    flex-direction: column;
    align-items: flex-start;
}
.service__title h3 {
    margin-left: 0;
    margin-top: 15px;
}
.service__title p {
    font-size: 14px;
    line-height: 1.57;
    margin-top: 20px;
    display: block;
}
p.service__text {
    font-size: 14px;
    line-height: 1.57;
    margin: 25px auto 0;
    padding-bottom: 78px;
}
}



/* --- base --- */
.menu-cards {
  padding: 60px 0 0;
}

.cards {
  flex-wrap: wrap;
  max-width: 1620px;
  margin: 0 auto;
  display: flex;
  gap: 40px 4.5%;
  justify-content: center;
}

/* --- card --- */
.card {
    background: rgba(0, 2, 56, 0.5);
    padding: 58px 30px 48px;
    color: #fff;
    text-align: center;
    min-height: 320px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 25%;
    max-width: 420px;
    min-width: 220px;
    box-shadow: 0 0 0 .5px var(--wh);
    border: none;
    outline: none;
}



.card__title {
  margin: 0 0 6px;
  /* font-size: clamp(20px, 1.8229vw, 35px); */
  font-size: clamp(20px, 1.7229vw, 35px);
  letter-spacing: 0.06em;
  font-weight: 600;
  font-style: italic;
  text-transform: uppercase;
  white-space: nowrap;/* 0427追加*/
}

.card__subtitle {
  margin: 0;
  font-size: var(--18);
  opacity: 0.9;
}

.card__text {
  margin: 0;
  font-size: var(--20);
  line-height: 1.6;
  height: 17em;/* 0427追加*/
}

/* ボタン */
.card__btn {
/* margin-top: auto; 0427削除*/
  display: inline-flex;
  align-items: center;
  gap: 40px;
  padding: 13px 30px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  color: var(--wh);
  text-decoration: none;
  font-size: var(--21);
  letter-spacing: 0.04em;
  font-style: italic;
  text-transform: uppercase;
  transition: all .3s ease;
}

.card__btn:hover {
  background: var(--wh);
  color: var(--bk);
}

.card__arrow {
  display: inline-block;
  transform: translateY(-1px);
}
.card__memo1 {
    font-size: var(--16);
    margin-top: 1em;
}
.card__memo2 {
  font-size: var(--16);
  margin-top: 1em;
  margin-bottom: -1em;
}

.card.card--wide:nth-child(4) .card__tag {
  margin-top: -1em;
}

    @media(max-width:768px){
    .card__text {
    font-size: 12px;
    line-height: 1.5;
    height: 13em;
    }
    .card:nth-child(4) .card__text {
      height: 15em;
    }
    .card__btn {
    gap: 24px;
    padding: 8px 38px;
    font-size: 15px;
    margin-top: 25px;
    }
    }

      @media (max-width: 375px) {
      .card__text {
        font-size: 11px;
      }
      }



/* 矢印 
=====================-*/
.card__arrow {
  position: relative;
  width: 30px;
  height: 10px;
}

/* 横線 */
.card__arrow::before {
  content: "";
  position: absolute;
  top: calc(50% + 1.5px);
  left: 0;
  width: 30px;
  height: 1px;
  background: currentColor;
  transform: translateY(-50%);
}

/* 矢印（ちょい離す） */
.card__arrow::after {
  content: "";
  position: absolute;
  top: calc(50% + 2px); /* 横線から少し下 */
  right: 1.5px;
  width: 10px;
  height: 10px;
  border-top: 1.5px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
}




/* 下段の帯（COMING SOON など） */
.card__tag {
width: calc(100% + 60px);
background-color: #262626;
padding: 12px 0;
font-size: var(--21);
letter-spacing: 0.1em;
line-height: 1.5;
margin: 0 -30px;
}

/* hr.card__hr {
width: 37px;
border-top: solid .5px var(--wh);
margin: 20px 0 30px;
} 0428修正*/
hr.card__hr {
  width: 37px;
  border: none;
  margin: 20px 0 30px;
  position: relative;
  height: 1px;
}

hr.card__hr::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: .7px;
  background: var(--wh);
}

/* 下段2枚を中央寄せにするため、4・5枚目を 2列分に広げる */
.card--wide {
  grid-column: span 1; /* 初期値 */
}

/* .card.card--wide:last-child .card__btn {
    margin-top: 60px;0426削除
} */


    /* PC想定：下段を2枚にして中央寄せ（4枚目=2列分、5枚目=2列分） */
    @media (min-width: 900px) {
    .card:nth-child(4) {
    grid-column: 1 / span 2; /* 1-2列を使用 */
    }
    .card:nth-child(5) {
    grid-column: 2 / span 2; /* 2-3列を使用 */
    }
    }

    @media(max-width:1024px){
    .card.card--wide:last-child .card__btn {
    margin-top: auto;
    }
    .card__btn {
    gap: 20px;
    }
    }

    /* --- responsive --- */
    @media (max-width: 768px) {
    .cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    }
    .card {
    width: 100%;
    padding: 26px 0 36px;
    min-height: auto;
    }
    .card__tag {
    margin: 25px -34px 0 -34px;
    font-size: 12px;
    width: 100%;
    }
    .card.card--wide:last-child .card__btn {
    margin-top: 25px;
    }

    }


/* ============================
  event
============================ */
section.event {
    padding: 100px 8% 0;
    margin-top: 130px;
}
.event__inner {
    max-width: 1620px;
    margin: 0 auto;
}
.event__title--item {
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
}
/* .event__title-btn {
    display: flex;
} 修正0427*/
.event__title-btn {
    display: inline-block;
    margin-top: auto;
}

.event__title--item p {
    font-size: var(--22);
    line-height: 1.95;
    font-weight: 600;
}
.event__item--Title,
.event__item--subTitle {
    text-align: center;
    margin-block-start: 0;
    margin-block-end: 0;
}
.event__item--wrap {
    display: flex;
    justify-content: space-between;
    margin-top: 100px;
}
.event__item {
    width: 30%;
}

.event__item .accordion-inner ul li {
    list-style: none;
}
.event__item .accordion-inner ul {
    padding-inline-start: 0;
}

.event__item--img {
    margin-top: 27px;
}

.event__item img {
    width: 100%;
    object-fit: contain;
    vertical-align: bottom;
}
p.event__item--Title {
    margin-block-start: 0;
    margin-block-end: 0;
    font-size: var(--35);
    line-height: 1.5;
    font-weight: 700;
}
p.event__item--subTitle {
    font-size: var(--20);
    font-style: italic;
    font-weight: 400;
}
.event__item .accordion-header h3 {
    font-size: var(--20);
    line-height: 1.6;
}
    @media(max-width:768px){
    section.event {
    padding: 100px 5% 0;
    margin-top: 0;
    }
    .event__title--item {
    flex-direction: column;
            margin-top: 15px;
    }
    .event__item--wrap {
    flex-direction: column;
    margin-top: 45px;
    gap: 70px;
    }
    .event__item {
    width: 100%;
    }
    .event__item--img {
    margin-top: 11px;
    }
    .event__title--item p {
    font-size: 14px;
    margin-top: 20px;
    line-height: 1.57;
    }
    p.event__item--subTitle {
    font-size: 11px;
    }
    p.event__item--Title {
    font-size: 20px;
    }
    .event__item .accordion-header h3 {
    font-size: 14px;
    width: 100%;
    }
    .accordion-inner p {
      font-size: 13px;
    }
    .event__item .accordion-inner ul li {
    font-size: 13px;
    }
    .event__title--item .card__btn {
    display: none;
    }
    }



/* ============================
  voice
============================ */
section.voice {
    padding: 100px 8% 170px;
    margin-top: 74px;
}
.voice__inner {
    max-width: 1620px;
    margin: 0 auto;
}
.voice__title {
    display: flex;
    align-items: end;
    justify-content: space-between;
}
.voice__title h3 {
    margin-left: 18%;
        white-space: nowrap;
}

.voice_flex {
    display: flex;
    justify-content: space-between;
    margin-right: 5%;
}
.voice_item--wrapper {
    display: flex;
    justify-content: space-between;
    margin-right: 5%;
    margin-top: 60px;
}
.voice__right {
    width: 37%;
}
.voice__item {
    width: 37%;
}
.voice__item img {
    width: 100%;
    object-fit: contain;
    vertical-align: bottom;
}
.voice__right .voice__item {
    width: 100%;
    object-fit: contain;
    vertical-align: bottom;
}

.voice__item .accordion-header h3 {
    font-size: var(--22);
    line-height: 1.5;
        margin-top: 11px;
}
.voice__left p {
    margin-top: 60px;
    font-size: clamp(14px, 1.145vw, 22px);
    line-height: 1.8;
}
.voice__q {
    text-decoration-line: underline;
}


/* 左固定 */
.voice_flex {
  position: relative;
  display: flex;
}

.voice__left {
  position: absolute;
  top: 0;
  left: 0;
}

.voice__right {
  margin-left: 63%;
}
.voice__item--subTitle {
  font-size: var(--20);
  font-style: italic;
  letter-spacing: 0.1em;
}

    @media(max-width:1024px){
    .voice__title {
    flex-direction: column;
    align-items: flex-start;
    }
    .voice__title h3 {
    margin-left: 0;
    margin-top: 15px;
    }
    .voice__left {
    width: max-content;
    }
    }

        @media(max-width:768px){
        .voice__title {
        flex-direction: column;
        align-items: flex-start;
        }
        .voice__title h3 {
        margin-left: 0;
        }
        .voice__left p {
        margin-top: 20px;
        font-size: 14px;
        }
        .voice_flex {
        position: static;
        display: flex;
        flex-direction: column;
        margin-right: 0;
        }
        .voice__left {
        position: static;
        width: 100%;
        }
        .voice__right {
        margin-left: 0;
        width: 100%;
        }
        .voice_item--wrapper {
        flex-direction: column;
        margin-right: 0;
        margin-top: 0;
        }
        .voice__item {
        width: 100%;
        margin-top: 45px;
        }
        .voice__item .accordion-header h3 {
        width: 100%;
        font-size: 20px;
        }
        section.voice {
        padding: 100px 5% 60px;
        }
        }


/* ============================
  contact
============================ */
section.contact {
    padding: 100px 8% 235px;
    margin-top: 0;
}
.contact__inner {
    max-width: 1620px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
.contact__link--wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2列 */
    gap: 14px;
    width: 56%;
    margin-top: 60px;
}
a.contact__link img {
    width: 28%;
    margin: 0 6% 0 0;
}
a.contact__link {
    display: flex;
    max-width: 400px;
    justify-content: flex-start;
    align-items: center;
    text-decoration: none;
    color: var(--wh);
    /* background: rgba(0, 3, 126, 0.15); 0427修正*/
    backdrop-filter: brightness(0.25);
    -webkit-backdrop-filter: blur(12px);
    padding: 10px 6%;
    transition: .3s;
    box-shadow: 0 0 0 .5px var(--wh);
    border: none;
    outline: none;
    backdrop-filter: brightness(0.85);
}
a.contact__link:hover {
  background: rgba(0, 2, 56, 0.8);
}
a.contact__link > div > p {
  margin-block-start: 0;
  margin-block-end: 0;
  line-height: 1.8;
}
.contact__link--title--pc {
  font-size: var(--23);
  line-height: 1.8;
}
.contact__link--title--sp {
  display: none;
}
.contact__link--subTitle {
  font-size: var(--17);
  line-height: 1;
  font-style: italic;
  text-transform: uppercase;
}
.contact__link--des {
  font-size: var(--15);
  letter-spacing: 0.05em;
  line-height: 1.78;
}

.contact__title h3 {
    margin-top: 30px;
    line-height: 1.5;
}

.contact__title p {
    font-size: var(--22);
    line-height: 1.8;
    margin-top: 39px;
}
.contact__title h2,
.contact__title h3,
.contact__title p {
    color: #000238;
}
p.contact__link--tag {
/* font-size: var(--15);
letter-spacing: 0.05em;
text-align: center;
padding: 0 28px;
background: rgba(0, 3, 126, 0.5);
backdrop-filter: brightness(0.25);
-webkit-backdrop-filter: blur(12px);
transition: .3s;
box-shadow: 0 0 0 .5px var(--wh);
border: none;
outline: none; */
font-size: var(--15);
letter-spacing: 0.05em;
text-align: center;
padding: 0 28px;
background-color: rgba(74, 46, 31, 0.8);
/* background-color: #262626; */
color: #fff;
display: inline-block;
box-shadow: 0 0 0 .5px var(--wh);
border: none;
outline: none;
}

    @media(max-width:1024px){
    section.contact {
    padding: 100px 8% 235px;
    }
    .contact__inner {
    flex-direction: column;
    }
    .contact__link--wrap {
    width: 100%;
    gap: 8px 2%;
    margin-top: 45px;
    }
    .contact__link--subTitle {
    font-size: 7.5px;
    }
    .contact__link--title {
    font-size: 12px;
    line-height: 1.25;
    }
    a.contact__link img {
    width: 19%;
    margin: 0 3% 0 0;
    }
    .contact__link--des {
    font-size: 8px;
    line-height: 1.38;
    }
    a.contact__link {
    padding: 10px 3%;
    }
    }

        @media (max-width: 768px) {
        section.contact {
          padding: 90px 5% 85px;
        }
        .contact__title h3 {
        margin-top: 15px;
        }
        .contact__title p {
        font-size: 14px;
        line-height: 1.57;
        margin-top: 20px;
        }
        .contact__link--title--pc {
        display: none;
        }
        .contact__link--title--sp {
        display: block;
        }
        img.contact__link--icon {
        opacity: 0;
        }
        p.contact__link--title--sp img {
        width: 50px;
        vertical-align: bottom;
        margin-right: 0;
        margin-top: 4px;
        display: block;
        }
        p.contact__link--tag {
        font-size: 8px;
        padding: 0 23px;
        }
        }

/* ============================
  footer
============================ */
footer {
background: rgba(0, 0, 0, 0.3);
}

.footer__inner {
padding: 100px 8% 86px;
max-width: 1620px;
margin: 0 auto;
}

.footer__nav {
max-width: 520px;
margin: 38px auto 0;
}

.footer__nav ul {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-auto-rows: min-content;
gap: 10px 20px;
padding: 0;
margin: 0;
list-style: none;
}

nav.footer__nav ul li {
place-content: center;
}

.footer__nav li:nth-child(1)  { grid-column: 1; grid-row: 1; }
.footer__nav li:nth-child(2)  { grid-column: 2; grid-row: 1; }
.footer__nav li:nth-child(3)  { grid-column: 3; grid-row: 1; }

.footer__nav li:nth-child(4)  { grid-column: 1; grid-row: 2; }
.footer__nav li:nth-child(5)  { grid-column: 2; grid-row: 2; }
.footer__nav li:nth-child(6)  { grid-column: 3; grid-row: 2; }

.footer__nav li:nth-child(7)  { grid-column: 1; grid-row: 3; }
.footer__nav li:nth-child(8)  { grid-column: 2; grid-row: 3; }
.footer__nav li:nth-child(9)  { grid-column: 3; grid-row: 3; }

.footer__nav li:nth-child(10) {
grid-column: 3;
grid-row: 4;
}

/* .noteのみ小文字 */
.footer__nav li:nth-child(6) a {
font-size: calc(var(--22) * 1.5);
text-transform: lowercase;
padding: 0 0 0.4em;
}
.footer__nav li:nth-child(6) a::after {
bottom: 8px;
}


/* .contactのみ別仕様 */
.footer__nav li:nth-child(10) a {
border: .6px solid var(--wh);
line-height: 1;
margin-left: -10px;
padding: 10px;
max-width: 150px;
transition: all 0.3s ease;
margin-top: 10px;
}
.footer__nav li:nth-child(10) a:hover {
background-color: var(--wh);
color: var(--bk);
}
.footer__nav li:nth-child(10) a::after {
display: none;
}


/* 必要に応じてリンクの装飾 */
.footer__nav a {
text-decoration: none;
color: var(--wh);
padding: 5px 0;
font-size: var(--23);
max-width: 150px;
line-height: 1.435;
}
.footer__nav .ext-link {
display: inline-block;
width: 0.7vw;
margin-left: 0.7vw;
}

a.footer__logo {
display: flex;
align-items: center;
max-width: 700px;
margin: 0 auto;
justify-content: center;
font-size: var(--45);
gap: .5em;
color: var(--wh);
}

.footer__logo img {
width: var(--57);
display: block;
}
    @media(max-width:768px){
    .footer__inner {
    padding: 40px 5% 75px;
    max-width: 1620px;
    }
    a.footer__logo img {
    width: 42px;
    }
    a.footer__logo {
    font-size: 20px;
    justify-content: flex-start;
    }
    .footer__nav {
    margin: 21px auto 0;
    width: 90%;
    }
    .footer__nav a {
    font-size: 13px;
    }
    .footer__nav ul {
    gap: 0 10%;
    }
    .footer__nav .ext-link {
    width: 11px;
    margin-left: 10px;
    }
    .footer__nav li:nth-child(6) a {
    font-size: 18px;
    padding: 0 0 0.3em;
    }
    }



/* ============================
  ループ＿テキスト帯
============================ */
/* メインビューのテキスト帯 */
.marquee {
  width: 100%;
  overflow: hidden;
  padding: 5px 0;
  position: relative;
  z-index: 0;
  font-size: var(--30);
  border-top: solid .4px var(--wh);
  border-bottom: solid .4px var(--wh);
}

.marquee-inner {
  display: flex;
  animation: marquee 30s linear infinite;
}

.marquee span {
  color: var(--wh-op);
  padding-right: 8%;
  font-family: var(--font-en);
  font-weight: 500;
  letter-spacing: 0.03em;
  display: inline-flex;
  align-items: center;
  text-transform: uppercase;
  white-space: nowrap;
}

.marquee-inner span img {
    width: 1.5em;
}

/* 無限ループ（右→左） */
@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}


/* .marquee.about-method {
  width: 100%;
  overflow: hidden;
  padding: 0 0 10px;
  position: relative;
  z-index: 0;
  font-size: clamp(73px, 5.104vw,98px);
  border-top: none;
  border-bottom: none;
  top:-30px;
} */

/* .marquee.about-method span {
  color: var(--wh);
  padding-right: 5%;
  font-weight: 400;
  letter-spacing: 0;
  display: inline-flex;
  align-items: center;
  text-transform: lowercase;
  opacity: .39;
} */


/* .marquee.about-method {
    font-size: 40px;
} */

    @media(max-width:768px){
    .marquee {
    font-size: 14px;
    }
    .marquee span {
    padding-right: 14%;
    }
    /* .marquee.about-method {
    font-size: 40px;
    padding: 0;
    } */
    }



/* ============================
  ドロワーメニュー
============================ */
.drawer__nav {
    max-width: 840px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.drawer__nav ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: min-content;
    gap: 10px 16%;
    padding: 0;
    margin: 0;
    list-style: none;
}

nav.drawer__nav ul li {
    place-content: center;
}

.drawer__nav li:nth-child(1)  { grid-column: 1; grid-row: 1; }
.drawer__nav li:nth-child(2)  { grid-column: 2; grid-row: 1; }
.drawer__nav li:nth-child(3)  { grid-column: 3; grid-row: 1; }

.drawer__nav li:nth-child(4)  { grid-column: 1; grid-row: 2; }
.drawer__nav li:nth-child(5)  { grid-column: 2; grid-row: 2; }
.drawer__nav li:nth-child(6)  { grid-column: 3; grid-row: 2; }

.drawer__nav li:nth-child(7)  { grid-column: 1; grid-row: 3; }
.drawer__nav li:nth-child(8)  { grid-column: 2; grid-row: 3; }
.drawer__nav li:nth-child(9)  { grid-column: 3; grid-row: 3; }

.drawer__nav li:nth-child(10) {
    grid-column: 3;
    grid-row: 4;
}

/* .noteのみ小文字 */
.drawer__nav li:nth-child(6) a {
  font-size: calc(var(--40) * 1.5);
  text-transform: lowercase;
  padding: 0 0 .45em;
}
.drawer__nav li:nth-child(6) a::after {
    bottom: 8px;
}


/* .contactのみ別仕様 */
.drawer__nav li:nth-child(10) a {
    margin-top: 20px;
    border: .6px solid var(--wh);
    line-height: 1;
    margin-left: -20px;
    padding: 10px 20px;
    transition: all 0.3s ease;
}
.drawer__nav li:nth-child(10) a:hover {
    background-color: var(--wh);
    color: var(--bk);
}
.drawer__nav li:nth-child(10) a::after {
    display: none;
}


/* 必要に応じてリンクの装飾 */
.drawer__nav a {
text-decoration: none;
color: var(--wh);
padding: 5px 0;
font-size: var(--40);
line-height: 1.435;
}
.drawer__nav .ext-link {
display: inline-block;
width: 1.4vw;
margin-left: 1.4vw;
}
.drawer__message {
display: none;
}

.drawer .marquee {
position: absolute;
bottom: 47px;
}
a.drawer__title {
position: absolute;
top: 44px;
left: 119px;
font-size: 45px;
}


.drawer__bg {
position: absolute;
right: 0;
bottom: 0;
width: 26%;
z-index: -1;
}
.drawer__bg img {
width: 100%;
object-fit: cover;
vertical-align: bottom;
}

.drawer__bg--light {
position: fixed;
z-index: -1;
width: 100%;
height: 100%;
}
.drawer__bg--light img {
width: 100%;
height: 100%;
opacity: 0.7;
}

    @media(max-width:768px){
    .drawer__title {
    display: none;
    }

    .drawer .marquee {
    display: none;
    }
    .drawer__nav a {
    font-size: 18px;
    }
    .drawer__nav ul {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 20px 0;
    }
    nav.drawer__nav ul li {
    text-align: center;
    }
    .drawer__nav li:nth-child(6) a {
    font-size: 24px;
    }

    .drawer__nav li:nth-child(5) {
    grid-column: 1;
    grid-row: 4;
    }
    .drawer__nav li:nth-child(8) {
    grid-column: 1;
    grid-row: 5;
    }
    .drawer__nav li:nth-child(2) {
    grid-column: 1;
    grid-row: 6;
    }
    .drawer__nav li:nth-child(3) {
    grid-column: 1;
    grid-row: 7;
    }
    .drawer__nav li:nth-child(6) {
    grid-column: 1;
    grid-row: 8;
    }
    .drawer__nav li:nth-child(9) {
    grid-column: 1;
    grid-row: 9;
    }
    .drawer__nav li:nth-child(10) {
    grid-column: 1;
    grid-row: 10;
    }
    .drawer__nav .ext-link {
    display: inline-block;
    width: 12px;
    margin-left: 10px;
    }
    .drawer__message {
    right: 0;
    position: absolute;
    bottom: 40px;
    right: 5%;
    display: block;
    display: flex;
    align-items: end;
    transform: none;
    width: 95%;
    bottom: 40px;
    flex-direction: column;
    }
    .drawer__bg {
    width: 58%;
    }

    }




.no-scroll {
  overflow: hidden;
}

/* 背景色 */
.bg__header-top {
  background: linear-gradient(
  to bottom,
  rgba(0, 2, 56, 0.6) 0%,
  rgba(0, 2, 56, 0.6) 100%
);

}
.bg__top-about {
  background: linear-gradient(
  to bottom,
  rgba(0, 2, 56, 0.6) 0%,
  rgba(174, 145, 186, 0.6) 50%,
  rgba(255, 180, 237, 0.6) 100%
);
}



.bg__method-voice {
  background: linear-gradient(
    to bottom,
    /* rgba(0, 2, 56, 0.6) 30%,
    rgba(253, 208, 255, 0.8) 96%,
    rgba(255, 255, 255, 0.8) 100% */
    rgba(0, 2, 56, 0.6) 30%,
    rgba(253, 208, 255, 0.8) 90%,
    rgba(253, 204, 165, 0.8)100%
  );
}

.bg__contact {
  /* background-color: rgba(255, 255, 255, 0.8); */
  background: linear-gradient(
    to bottom,
    rgba(253, 204, 165, 0.8) 0%,
    /* rgba(253, 200, 55, 0.8) 100% */
    #FDC837 100%
  );
}



@media(max-width:768px){
  /* .bg__method-voice {
  background: linear-gradient(
    to bottom,
    rgba(0, 2, 56, 0.6) 30%,
    rgba(253, 208, 255, 0.8) 99%,
    rgba(255, 255, 255, 0.8) 100%
  );
} */
.bg__method-voice {
  background: linear-gradient(
    to bottom,
    /* rgba(0, 2, 56, 0.6) 30%,
    rgba(253, 208, 255, 0.8) 96%,
    rgba(255, 255, 255, 0.8) 100% */
    rgba(0, 2, 56, 0.6) 30%,
    rgba(253, 208, 255, 0.8) 96%,
    rgba(253, 204, 165, 0.8)100%
  );
}
}


/* ドロワー開いてるときにスクロール止める
======================================= */
body.is-lock {
  overflow: hidden;
}

/* 0424424修正
======================================= */
span.voice__item--titleName {
    display: block;
    font-size: var(--18);
    margin-top: 9px;
}
span.accordion-icon,
span.accordion-footer {
    display: flex;
    width: 100%;
    justify-content: end;
    align-items: center;
    gap: 14px;
}
span.accordion-icon__text,
span.accordion-footer__text {
    font-size: var(--18);
}

/* ver.13__0508追加  */
.card__memo1 {
    display: block;
}

a.card__btn.about__btn {
    margin-top: 70px;
    padding: 13px 30px 13px 60px;
    font-size: var(--21);
}
.event__title--item .card__memo2 {
    font-size: var(--16);
    text-align: center;
    margin-top: 9px;
}
p.card__memo2.event__sp {
    display: none;
}
    @media(max-width:768px){
    a.card__btn.about__btn {
        margin-top: 40px;
        padding: 8px 30px 8px 38px;
    }
    .event__title--item .card__memo2 {
        display: none;
    }
    p.card__memo2.event__sp {
        display: block;
    }
    }