/*
Theme Name: blueagapanthus
Author: blueagapanthus
Version: 1.3
*/

/* 共通レイアウト：PC max1000 + 左右30 / SP 左右20 */
.container{
  width: min(1000px, calc(100% - 60px));
  margin: 0 auto;
}

@media (max-width: 768px){
  .container{
    width: calc(100% - 0px);
  }
}

/* PCだけ改行 */
.br-pc{ display:none; }

@media (min-width: 769px){
  .br-pc{ display:inline; }
}


/* =========================
   Base & Variables
   ========================= */
:root {
  --primary: #8ba2ff; /* ロゴの色 */
  --ink: #4a4a4a;     /* キャッチコピーの色 */
  --line: #6a6a6a;    /* ハンバーガー線の色 */
}

* { box-sizing: border-box; }
body {
  margin: 0;
  padding: 0;
  color: #333;
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Hiragino Mincho Pro","Noto Serif JP","MS Mincho",serif;
  font-weight: 400;
  overflow-x: hidden;
}

/* =========================
   Header (PC)
   ========================= */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
}

.header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 30px 60px; /* PCの左右余白 */
}

.brand-link {
  font-family: "Georgia", "Times New Roman", serif;
  font-size: 32px;
  color: var(--primary);
  text-decoration: none;
}

/* ハンバーガーはPCでは隠す */
.nav-toggle {
  display: none;
}

/* PCメニュー */
.global-menu {
  display: flex;
  gap: 40px;
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: "Georgia", "Times New Roman", serif;
}
.global-menu a {
  text-decoration: none;
  font-size: 14px;
  color: #666;
  letter-spacing: 0.1em;
  font-family: "Georgia", "Times New Roman", serif;
}

/* =========================
   Hero (First View)
   ========================= */
.hero {
  position: relative;
  height: 80vh;
  background-color: #f7fbff;
}

.hero-catch {
  position: absolute;
  left: 6%;
  bottom: 10%;
  font-family: "YuMincho", "Hiragino Mincho ProN", serif;
  font-size: clamp(24px, 4vw, 34px); /* 画面サイズで可変 */
  letter-spacing: 0.35em;
  line-height: 1.6;
  color: var(--ink);
  writing-mode: horizontal-tb;
  z-index: 10;
}

/* =========================
   Responsive (768px以下)
   ========================= */
@media (max-width: 768px) {
  .hero {
  height: 70vh;
}
  .header-inner {
    padding: 20px 24px;
  }

  .brand-link {
    font-size: 26px;
  }

  /* ハンバーガーを表示 */
  .nav-toggle {
    display: flex; /* flexにして中の線を中央寄せ */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 44px;
    height: 44px;
    background: none;
    border: none;
    cursor: pointer;
    position: relative;
    z-index: 9999;
  }

  /* 3本線のデザイン */
  .nav-toggle__line {
    display: block;
    width: 30px;
    height: 1px; /* スクショ同様の細い線 */
    background: var(--line);
    margin: 4px 0; /* 線の間隔 */
    transition: 0.3s;
  }

  /* PC用メニューを隠し、パネル化する */
  .nav-panel {
    display: none; /* 通常は非表示 */
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    background: rgba(255, 255, 255, 0.98);
    z-index: 2000;
    padding: 100px 40px;
  }

  /* JavaScriptで body に .nav-open がついた時の動き */
  body.nav-open .nav-panel {
    display: block;
  }

  /* ハンバーガーの「×」化 */
  body.nav-open .nav-toggle__line:nth-child(1) { transform: translateY(9px) rotate(45deg); }
  body.nav-open .nav-toggle__line:nth-child(2) { opacity: 0; }
  body.nav-open .nav-toggle__line:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

  .global-menu {
    flex-direction: column;
    gap: 30px;
  }
}

/* 「つながる」の後で、スマホだけ改行 */
.sp-break { display: none; }

@media (max-width: 768px){
  .sp-break {
    display: block;
    height: 0;
    line-height: 0;
  }
}

/* 「つながる」の後で、スマホだけ改行 */
.pc-break { display: none; }

@media (min-width: 768px){
  .pc-break {
    display: block;
    height: 0;
    line-height: 0;
  }
}

/* =========================
   ABOUT block（FV下エリア）
   ========================= */
.about-block{
  background: #f7fbff;
}

.about-head{
  text-align: center;
  padding-top: 90px;
  padding-bottom: 40px;
  line-height: 1.2;
}

.about-kicker{
  margin: 0 0 10px;
  font-family: "YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  letter-spacing: 0.18em;
  color: #333;
}

.about-title{
  margin: 100px auto;
  font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Noto Serif JP", "MS Mincho", serif;
  font-weight: 400;
  font-size: clamp(36px, 2.2vw, 26px);
  letter-spacing: 0.18em;
  line-height: 1.8;
  color: #333;
}

.about-grid{
  display: grid;
  grid-template-columns: 1.3fr 1fr 1.1fr;
  grid-template-areas:
  "hero  note  note"
  "flower body  space"
  ".     cta   .";
  gap: 44px 48px;
  padding: 20px 0 50px;
  align-items: start;
}

.about-photo{
  margin: 0;
  overflow: hidden;
  background: #eaf2ff;
}

/* 画像は枠にフィットさせる（※これだけでOK） */
.about-photo img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ★ここが重要：grid-area を割り当てる */
.about-photo--hero{ grid-area: hero; }
.about-photo--flower{ grid-area: flower; }
.about-photo--space{ grid-area: space; }

/* PC：画像サイズを指定（はみ出し防止で max-width:100% を併用） */
.about-photo--hero{
  width: 90%;
  height: 120%;
  max-width: 100%;
}

.about-photo--flower{
  margin-top: 100px;
  width: 60%;
  height: 80%;
  max-width: 100%;
  margin-left: 100px; /* flowerだけ左余白100px */
}

.about-photo--space{
  width: 60%;
  height: 80%;
  max-width: 100%;
    justify-self: end;
    margin-top: -100px;
}

.about-note{
  font-family: "YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  grid-area: note;
  font-size: 18px;
  line-height: 2.0;
  color: #333;
  padding: 18px 0;
}

.about-body{
 font-family: "YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  grid-area: body;
  font-size: 18px;
  line-height: 2.0;
  color: #333;
  padding-top: 0px;
  margin-top: -8px;
}

.about-cta{
  grid-area: cta;
  display: flex;
  justify-content: center;
  padding-top: 10px;
}

.btn-pill{
  display: inline-block;
  min-width: 320px;
  padding: 18px 34px;
  border-radius: 999px;
  text-align: center;
  text-decoration: none;
  letter-spacing: 0.22em;
  font-family: "YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  color: #fff;
  background: linear-gradient(180deg, #6f92ff 0%, #4e73ff 100%);
    box-shadow: 0 14px 30px rgba(78,115,255,0.18);
}

.btn-pill2{
  margin-left: -10px;
  display: inline-block;
  min-width: 320px;
  padding: 18px 34px;
  border-radius: 999px;
  text-align: center;
  text-decoration: none;
  letter-spacing: 0.22em;
  font-family: "YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  color: #fff;
  background: linear-gradient(180deg, #6f92ff 0%, #4e73ff 100%);
    box-shadow: 0 14px 30px rgba(78,115,255,0.18);
}

/* SP：ABOUTはグリッドを使わず縦並びにする */
@media (max-width: 768px){

  .about-head{
    padding-top: 0;
    padding-bottom: 0;
  }

  .about-title{
    margin: 0;
    padding: 50px 20px;
    font-size: 24px;
  }

  /* ★ここがポイント：gridを無効化して縦に流す */
  .about-grid{
    display: block;
    padding: 0 0 78px; /* 下だけ残す（好みで） */
  }

  /* 要素の間隔（縦並びの余白） */
  .about-grid > *{
    margin-top: 22px;
  }
  .about-grid > *:first-child{
    margin-top: 0;
  }

  /* grid-areaの影響を消す（保険） */
  .about-note,
  .about-body,
  .about-cta{
    font-size: 16px;
    padding: 20px;
    grid-area: auto;
  }

  /* 画像は横幅100%で */
  .about-photo--hero{
   padding-right: 30%; 
   background-color: #f7fbff;
  }
  .about-photo--flower{
    padding-left: 10%;
    width: 70%;
    height: auto;
    background-color: #f7fbff;
  }

  .about-photo--space{
    display: none;
  }

  .about-photo img{
    width: 100%;
    height: auto;
    object-fit: cover;
  }

  .btn-pill{
    min-width: 220px;
  }
}

/* スクロール出現アニメーション */
.reveal{
  opacity: 0;
  transform: translateY(26px) scale(0.985);
  transition: opacity 1.6s ease, transform 1.6s ease;
}
.reveal.is-inview{
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* 3枚を少しずつ遅らせる（自然に） */
.about-photo--hero.reveal{ transition-delay: 0s; }
.about-photo--space.reveal{ transition-delay: 0.24s; }
.about-photo--flower.reveal{ transition-delay: 0.36s; }

/* 動きを減らしたい設定の人には配慮 */
@media (prefers-reduced-motion: reduce){
  .reveal{
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* note内に入れたABOUTボタン */
.about-cta.in-note{
  display: flex;
  justify-content: center;
  margin-top: 80px;
}

/* ふわっとホバー（なめらか） */
.btn-pill{
  transition:
    opacity 0.55s cubic-bezier(.22,1,.36,1),
    transform 0.55s cubic-bezier(.22,1,.36,1),
    box-shadow 0.55s cubic-bezier(.22,1,.36,1);
  will-change: opacity, transform;
  width: 350px;
}

.btn-pill:hover{
  opacity: 0.86;                 /* ほんのり薄く */
  transform: translateY(-2px);   /* ほんのり浮く */
  box-shadow: 0 18px 34px rgba(78,115,255,0.22);
}

/* キーボード操作も同じ挙動に（任意） */
.btn-pill:focus-visible{
  opacity: 0.86;
  transform: translateY(-2px);
  box-shadow: 0 18px 34px rgba(78,115,255,0.22);
  outline: none;
}

/* =========================
   CONCEPT（背景固定）
   ========================= */
.concept-block{
  position: relative;
  padding: 140px 0;
  text-align: center;

  /* 背景 */
  background-image: url("assets/img/concept-img.png");
  background-size: cover;
  background-position: center;
}

/* 背景固定（PCだけ） */
@media (min-width: 769px){
  .concept-block.parallax{
    background-attachment: fixed;
  }
}

/* うっすら白い霧（可読性UP） */
.concept-block::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(255,255,255,0.35);
  pointer-events:none;
}
.concept-inner{ position: relative; z-index: 1; }

.concept-title{
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 400;
  letter-spacing: 0.18em;
  font-size: clamp(22px, 2.8vw, 34px);
  margin: 0 0 22px;
  color: #333;
}

.concept-text{
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 400;
  letter-spacing: 0.12em;
  line-height: 2.2;
  margin: 0;
  color: #333;
}

/* SP */
@media (max-width: 768px){
  .concept-block{ 
    padding:50px 20px;
    font-size: 18px;
  }
}

/* =========================
   SERVICE block
   ========================= */
.service-block{
  background: #f7fbff;
  padding: 110px 0;
}

/* 幅1000px + 左右余白30px */
.service-wrap{
  width: min(1000px, calc(100% - 60px));
  margin: 0 auto;
}

.service-section-title{
  margin: 0 0 48px;
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 400;
  letter-spacing: 0.18em;
  font-size: 36px;
  color: #333;
}

.service-section-text{
  line-height: 2;
}

/* 各行 */
.service-list{
  display: flex;
  flex-direction: column;
  gap: 46px;
}

.service-row{
  display: grid;
  grid-template-columns: 440px 1fr;
  gap: 58px;
  align-items: center;
}

/* 画像 */
.service-photo{
  margin: 0;
  overflow: hidden;
  border-radius: 100px 0 100px 0;
  background: #f7fbff;;
  height: 260px;
}

.service-photo img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 右テキスト */
.service-content{
  max-width: 520px; /* 文章が伸びすぎないように（好みで） */
}

.service-head{
  display: flex;
  align-items: baseline;
  gap: 22px;
  margin-bottom: 10px;
}

.service-no{
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 400;
  font-size: 32px;
  color: #6f92ff;
  letter-spacing: 0.06em;
}

.service-name{
  margin: 0;
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 400;
  font-size:28px;
  letter-spacing: 0.14em;
  color: #333;
}

/* nameブロックを基準に、subを中央に */
.service-text{
  display: inline-block;
}

.service-sub{
  margin: 0 0 18px;
  font-size: 12px;
  letter-spacing: 0.12em;
  color: #333;
   text-align: center;
}

.service-desc p{
  margin: 0 0 10px;
  font-size: 16px;
  line-height: 2.0;
  color: #333;
}
.service-desc p:last-child{
  margin-bottom: 0;
}

/* ボタン */
.service-cta{
  display: flex;
  justify-content: center;
  margin-top: 80px;
}

/* SP */
@media (max-width: 768px){
  .service-block{
    padding: 78px 0;
  }

  .service-wrap{
    width: calc(100% - 40px); /* SPは左右20pxくらいが見やすい */
  }

  .service-row{
    grid-template-columns: 1fr;
    gap: 18px;
    align-items: start;
  }

  .service-photo{
    height: auto;
    border-radius: 26px;
  }
  .service-photo img{
    height: auto;
  }

  .service-name{
    font-size: 22px;
  }

  .service-content{
    max-width: none;
  }
}

/* =========================
   PROFILE block
========================= */
.profile-block{
  background: #eaf0ff;
}

.profile-inner{
  padding: 110px 0;
  margin: 0 auto;
}

/* 見出し */
.profile-title{
  font-size: 32px;
  margin: 0 0 40px;
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 400;
  letter-spacing: 0.18em;
  color: #333;
}

/* PC：左右2カラム */
.profile-grid{
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  gap: 60px;
  align-items: center;
}

.profile-left{
  max-width: 520px;
}

.profile-role{
  margin: 0 0 10px;
  font-size: 16px;
  letter-spacing: 0.12em;
  color: #333;
  font-weight: 400;
}

.profile-name{
  margin: 0 0 22px;
  font-size: 40px;
  letter-spacing: 0.18em;
  color: #333;
  font-weight: 400;
}

.profile-body p{
  margin: 0 0 16px;
  font-size: 16px;
  line-height: 2.0;
  color: #333;
}
.profile-body p:last-child{
  margin-bottom: 0;
}

/* 右：画像（PCで大きすぎないよう制限） */
.profile-photo,
.profile-photo2{
  margin: 0;
  overflow: hidden;
  background: #ebf0ff;
  border-radius: 24px;
  max-width: 560px;     /* 好みで 480〜620 */
  margin-left: auto;    /* 右寄せ */
}

.profile-photo img,
.profile-photo2 img{
  width: 100%;
  height: 300px;        /* 好みで 420〜560 */
  object-fit: cover;
  object-position: center;
  display: block;
}

/* CTA */
.profile-cta{
  margin-top: 34px;
}

/* =========================
   SP
========================= */
@media (max-width: 768px){

  /* SP：左右余白 */
  .profile-inner{
    padding-left: 20px;
    padding-right: 20px;
  }

  /* 縦並び */
  .profile-grid{
    display: flex !important;
    flex-direction: column !important;
    gap: 18px;
  }

  .profile-grid > .profile-photo,
  .profile-grid > .profile-photo2{
    order: 1 !important;
  }
  .profile-grid > .profile-left{
    order: 2 !important;
  }

  .profile-left{
    display: flex;
    flex-direction: column;
  }
  .profile-role{ order: 1; }
  .profile-name{ order: 2; }
  .profile-body{ order: 3; }
  .profile-cta{ order: 4; }

  /* SP：画像は高さを抑える */
  .profile-photo,
  .profile-photo2{
    max-width: 100%;
    margin-left: 0;
    border-radius: 18px;
  }

  .profile-photo img,
  .profile-photo2 img{
    height: 320px;               /* 好みで 280〜360 */
    object-position: center top; /* 顔を残しやすい */
  }
}
/* =========================
   WORKS slider
   ========================= */
.works-block{
  position: relative;
  background: #f7fbff;
  padding: 110px 0;
  overflow-x: hidden; /* 横はみ出し保険（最重要） */
}

/* 下に白10%の段差 */
.works-block::after{
  content:"";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 10%;
  background: #fff;
  z-index: 0;
}

.works-inner{
  position: relative;
  z-index: 1;

  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 80px;            /* ← PC：ここでボタンと画像の間（80px） */
  align-items: center;
}

/* 左カラム */
.works-left{
  display: block;
}

.works-title{
  margin: 0 0 26px;
  display: flex;              /* 横並びにする */
  align-items: center;        /* 縦位置を中央揃え */
  gap: 38px;                  /* WORKS と 制作事例の間隔 */
  
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 400;
  letter-spacing: 0.28em;     /* 英字の間隔（スクショ寄せ） */
  font-size: 32px;            /* WORKS を大きく */
  color: #333;
  line-height: 1;
}

.works-ja{
  font-size: 14px;            /* 制作事例を大きめに */
  letter-spacing: 0.18em;
  margin-left: 0;             /* gapで管理するので消す */
  color: #333;
  line-height: 1;
}

/* 右カラム：PCのみ右端0へ伸ばす（※SPでは解除） */
.works-slider{
  position: relative;
  margin-right: calc((100vw - 100%) / 2 * -1);
  overflow: visible;
}

/* Swiper崩れ防止 */
.works-swiper{
  overflow: hidden;
}
.works-swiper .swiper-wrapper{
  display: flex;
  gap: 30px; /* spaceBetween=30 と合わせる */
}
.works-swiper .swiper-slide{
  flex-shrink: 0;
  width: auto;
}

/* 左だけ少し余白（タイトルとの距離） */
.works-slider .swiper{
  padding-left: 0;
  padding-right: 0;
}

/* カード */
.works-card{
  display: block;
  width: 260px;
  aspect-ratio: 230 / 370;
  overflow: hidden;
  background: #fff;
}
.works-card img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ドット */
.works-dots{
  position: static;
  margin-top: 22px;
  text-align: center;
}
.works-dots .swiper-pagination-bullet{
  width: 6px;
  height: 6px;
  opacity: 0.35;
  margin: 0 7px !important;
  background: #6f92ff;
}
.works-dots .swiper-pagination-bullet-active{
  opacity: 1;
}

/* =========================
   VIEW MORE ボタン（表示切り替え）
   ========================= */
/* SP用ボタンはPCでは隠す */
.works-cta-sp2{
  display: none;
}

/* =========================
   SP
   ========================= */
@media (max-width: 768px){
  .works-block{
    padding: 78px 0;
    overflow-x: hidden; /* 横はみ出しの最終保険 */
  }

  .works-inner{
    grid-template-columns: 1fr;
    gap: 22px;
  }

  /* SPは右端伸ばしを完全に解除（重要） */
  .works-slider{
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
  }

  .works-swiper,
  .works-swiper .swiper-wrapper{
    max-width: 100%;
  }

  .works-card{
    width: 230px;
    aspect-ratio: 230 / 370;
  }

  /* ✅ スマホではSwiperのナビ（青い丸）を消す */
  #works .swiper-button-prev,
  #works .swiper-button-next{
    display: none !important;
  }

  /* SPではPC用ボタンを隠して、下のボタンだけ表示 */
  .works-left .btn-pill{
    display: none;
  }

  .works-title{
    margin-left: 20px;
    margin-right: 20px;
  }
}

@media (max-width: 768px){

  /* セクション */
  #works.works-block{
    padding: 78px 0;
    overflow-x: hidden;
  }

  /* ✅ gridをやめて縦積み（横幅が引っ張られる事故防止） */
  #works .works-inner{
    display: block !important;
  }

  /* 左右幅の事故防止（min-widthが地味に効く） */
  #works .works-left,
  #works .works-slider,
  #works .works-cta-sp2{
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  /* タイトル（containerの余白に任せたいならmarginは付けない）
     もしタイトルだけ内側にしたい場合はここで調整 */
  /* #works .works-title{ margin: 0 20px 26px; } */

  /* ✅ スライダー：左右20px（スライダーだけ内側に入れる） */
  #works .works-slider{
    padding-left: 20px;
    box-sizing: border-box;

    margin-right: 0 !important;   /* PC用右端伸ばしを確実に解除 */
  }

  /* Swiper：横幅を引っ張らない */
  #works .works-swiper{
    overflow: hidden;
    max-width: 100%;
  }

  #works .works-swiper .swiper-wrapper{
    gap: 0 !important;            /* gapは禁止（Swiperの計算が崩れる） */
  }

  /* スライド */
  #works .works-card{
    width: 230px;
    aspect-ratio: 230 / 370;
  }

  /* スマホではナビ非表示 */
  #works .swiper-button-prev,
  #works .swiper-button-next{
    display: none !important;
  }

  /* ✅ PC用ボタンは隠す */
  #works .works-left .btn-pill{
    display: none;
  }

  /* ✅ SP用ボタン：中央寄せ＆短め */
  #works .works-cta-sp2{
    display: flex;
    justify-content: center;
    padding: 0 20px;              /* 左右20px */
    box-sizing: border-box;
    margin-top: 22px;
  }

  #works .works-cta-sp2 .btn-pill2{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    width: 100% !important;
    max-width: 320px !important;  /* 280〜360で好み */
    margin: 0 auto 80px !important;

    float: none !important;
    position: static !important;
    transform: none !important;
  }

  #works .works-swiper .swiper-slide{
  margin-right: 20px;
}
#works .works-swiper .swiper-slide:last-child{
  margin-right: 0;
}
}

/* PROFILEのボタンだけ白に戻す（.btn-pillを共通で青にしていてもOK） */
.profile-block .btn-pill{
  background: #fff !important;
  color: #4e73ff !important;
  box-shadow: 0 14px 30px rgba(0,0,0,0.08) !important;
  width: 100%;
}

/* =========================
   NEWS block
   ========================= */
.news-block{
  background: #fff;
  padding: 110px 0;
}

.news-inner{
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 80px;
  align-items: start;
}

.news-title{
  margin: 0 0 26px;
  display: flex;              /* 横並びにする */
  align-items: center;        /* 縦位置を中央揃え */
  gap: 38px;                  /* WORKS と 制作事例の間隔 */
  
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 400;
  letter-spacing: 0.28em;     /* 英字の間隔（スクショ寄せ） */
  font-size: 24px;            /* WORKS を大きく */
  color: #333;
  line-height: 1;
}

.news-ja{
  font-size: 14px;            /* 制作事例を大きめに */
  letter-spacing: 0.18em;
  margin-left: 0;             /* gapで管理するので消す */
  color: #333;
  line-height: 1;
}

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

.news-item{
  padding: 18px 0;
}

.news-link{
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 26px;
  align-items: baseline;
  text-decoration: none;
  color: #333;
}

.news-date{
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-size: 16px;
  letter-spacing: 0.08em;
  color: #333;
  white-space: nowrap;
}

.news-text{
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-size: 16px;
  letter-spacing: 0.08em;
  line-height: 1.9;
  color: #333;
}

.news-link:hover .news-text{
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* CTA */
.news-cta{
  margin-top: 34px;
}

/* 白ボタン（PROFILE/NEWSなどで使用） */
.btn-pill--white{
  background: #fff;
  color: #4a4a4a;
  box-shadow: 0 14px 30px rgba(0,0,0,0.08);
  border: 1px solid rgba(0,0,0,0.12);
}

/* =========================
   SP
   ========================= */
@media (max-width: 768px){
  .news-block{
    padding: 78px 20px;
  }

  .news-inner{
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .news-link{
    grid-template-columns: 86px 1fr;
    gap: 16px;
  }

  .news-date,
  .news-text{
    font-size: 14px;
  }

  .news-cta{
    display: flex;
    justify-content: center;
  }
	
	.news-title{
	font-size:24px;
}
}

/* 左カラムを縦センター */
.news-left{
  display: flex;
  align-items: center;   /* ←上下中央 */
  margin-top: -100px;
}

/* news-inner は高さを持たせるため stretch 推奨 */
.news-inner{
  align-items: stretch;
}

/* =========================
   CONTACT block
   ========================= */
.contact-block{
  padding: 130px 0;
  background: #eaf2ff; /* 画像が無いときの保険色 */
  position: relative;

  /* 背景画像（花） */
  background-image: url("assets/img/contact-bg.jpg"); /* ←画像パス差し替え */
  background-size: cover;
  background-position: center;
}

/* 中央カード */
.contact-card{
  background: rgba(255,255,255,0.96);
  border-radius: 34px;
  padding: 64px 60px;
  text-align: center;

  /* ふんわり */
  box-shadow: 0 22px 60px rgba(0,0,0,0.06);
}

/* タイトル（CONTACT） */
.contact-title{
  margin: 0 0 22px;
  font-family: "Georgia","Times New Roman",serif;
  font-weight: 400;
  letter-spacing: 0.22em;
  font-size: 64px;
  line-height: 1.0;
  color: #6f92ff; /* 文字の淡いブルー */
}

/* 文章 */
.contact-text{
  margin: 0;
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-size: 16px;
  letter-spacing: 0.12em;
  line-height: 2.2;
  color: #333;
}

/* ボタン */
.contact-cta{
  margin-top: 34px;
  display: flex;
  justify-content: center;
}

.contact-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: min(560px, 100%);
  height: 64px;

  border-radius: 12px;
  text-decoration: none;

  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-size: 16px;
  letter-spacing: 0.18em;

  color: #fff;
  background: linear-gradient(180deg, #6f92ff 0%, #4e73ff 100%);
  box-shadow: 0 14px 30px rgba(78,115,255,0.18);

  transition: opacity .35s ease, transform .35s ease, box-shadow .35s ease;
}

.contact-btn:hover{
  opacity: 0.92;
  transform: translateY(-2px);
  box-shadow: 0 18px 34px rgba(78,115,255,0.22);
}

/* =========================
   SP
   ========================= */
@media (max-width: 768px){
  .contact-block{
    padding: 90px 0;
  }

  .contact-card{
    padding: 46px 22px;
    border-radius: 26px;
  }

  .contact-title{
    font-size: 44px;
    letter-spacing: 0.18em;
  }

  .contact-text{
    font-size: 16px;
    line-height: 2.1;
  }

  .contact-btn{
    height: 58px;
    font-size: 16px;
    width: 100%;
    max-width: 520px;
  }
}

/* =========================
   CONTACT block
   ========================= */
.contact-block{
  padding: 130px 0;
  background: #eaf2ff; /* 画像が無いときの保険色 */
  position: relative;

  /* 背景画像（花） */
  background-image: url("assets/img/img02.webp");
  background-size: cover;
  background-position: center;
}

/* 中央カード */
.contact-card{
  background: rgba(255,255,255,0.96);
  border-radius: 34px;
  padding: 64px 60px;
  text-align: center;

  /* ふんわり */
  box-shadow: 0 22px 60px rgba(0,0,0,0.06);
}

/* タイトル（CONTACT） */
.contact-title{
  margin: -90px 0 22px;
  font-family: "STKaiti","Times New Roman",serif;
  font-weight: 300;
  letter-spacing: 0.22em;
  font-size: 64px;
  line-height: 1.0;
  color: #6f92ff; /* 文字の淡いブルー */
}

/* 文章 */
.contact-text{
  margin: 0;
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-size: 16px;
  letter-spacing: 0.12em;
  line-height: 2.2;
  color: #333;
}

/* ボタン */
.contact-cta{
  margin-top: 34px;
  display: flex;
  justify-content: center;
}

.contact-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: min(560px, 100%);
  height: 64px;

  border-radius: 12px;
  text-decoration: none;

  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-size: 16px;
  letter-spacing: 0.18em;

  color: #fff;
  background: linear-gradient(180deg, #6f92ff 0%, #4e73ff 100%);
  box-shadow: 0 14px 30px rgba(78,115,255,0.18);

  transition: opacity .35s ease, transform .35s ease, box-shadow .35s ease;
}

.contact-btn:hover{
  opacity: 0.92;
  transform: translateY(-2px);
  box-shadow: 0 18px 34px rgba(78,115,255,0.22);
}

.contact-block::before{
  content:"";
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.7); /* ←70% */
  pointer-events: none;
  z-index: 0;
}


/* 中身をベールより上に */
.contact-block .container{
  position: relative;
  z-index: 1;
}

/* =========================
   SP
   ========================= */
@media (max-width: 768px){
  .contact-block{
    padding: 90px 20px;
  }

  .contact-card{
    padding: 46px 22px;
    border-radius: 26px;
    margin: 0 auto;
  }

  .contact-title{
    font-size: 44px;
    letter-spacing: 0.18em;
    margin: -65px 0 22px;
  }

  .contact-text{
    font-size: 16px;
    line-height: 2.1;
  }

  .contact-btn{
    height: 58px;
    font-size: 15px;
    width: 100%;
    max-width: 520px;
  }
}

/* =========================
   Footer
   ========================= */
.site-footer{
  background: #eef1ff; /* スクショの淡いラベンダー寄り */
  padding: 90px 0 0;
}

.footer-inner{
  display: grid;
  grid-template-columns: 1.2fr 1.8fr;
  gap: 80px;
  align-items: start;
}

/* 左：ブランド */
.footer-brand{
  display: flex;
  flex-direction: column;
  align-items: center;   /* 中央寄せ */
  text-align: center;
  padding-top: 10px;
}

.footer-logo{
  display: inline-block;
  font-family: "Georgia","Times New Roman",serif;
  font-size: 36px;
  letter-spacing: 0.04em;
  color: #6f92ff;
  text-decoration: none;
}

.footer-ig{
  margin-top: 18px;
  width: auto;
  height: auto;
}

.footer-ig-img{
  width: 34px;   /* 好みで調整OK */
  height: 34px;
  display: block;
}

.footer-ig-icon{
  width: 34px;
  height: 34px;
  display: inline-block;
  background: currentColor;
  color: #6f92ff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zm10 2H7a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V7a3 3 0 0 0-3-3zm-5 4.5A5.5 5.5 0 1 1 6.5 12 5.5 5.5 0 0 1 12 8.5zm0 2A3.5 3.5 0 1 0 15.5 12 3.5 3.5 0 0 0 12 10.5zM18 6.7a1.3 1.3 0 1 1-1.3 1.3A1.3 1.3 0 0 1 18 6.7z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zm10 2H7a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V7a3 3 0 0 0-3-3zm-5 4.5A5.5 5.5 0 1 1 6.5 12 5.5 5.5 0 0 1 12 8.5zm0 2A3.5 3.5 0 1 0 15.5 12 3.5 3.5 0 0 0 12 10.5zM18 6.7a1.3 1.3 0 1 1-1.3 1.3A1.3 1.3 0 0 1 18 6.7z'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* 右：リンク */
.footer-nav{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 60px;
  padding-top: 18px;
}

.footer-col-title{
  font-family: "Georgia","Times New Roman",serif;
  font-size: 16px;
  letter-spacing: 0.14em;
  color: #333;
  margin-bottom: 16px;
}

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

.footer-list li{
  margin: 0 0 12px;
}

.footer-list a{
  text-decoration: none;
  font-family: "Yu Mincho","YuMincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-size: 13px;
  letter-spacing: 0.10em;
  color: #333;
}

.footer-list a:hover{
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* 下段 */
.footer-bottom{
  margin-top: 70px;
  padding: 18px 0;
}

.footer-copy{
  font-size: 12px;
  color: #333;
  letter-spacing: 0.08em;
}

/* コピーライトを中央に */
.footer-bottom-inner{
  text-align: center;
}
/* =========================
   SP
   ========================= */
@media (max-width: 768px){
  .site-footer{
    padding: 70px 0 0;
  }

  .footer-inner{
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .footer-logo{
    font-size: 38px;
  }

  .footer-nav{
    grid-template-columns: repeat(2, 1fr);
    column-gap: 14px;  /* ←ここがポイント（26px→14pxくらい） */
    row-gap: 20px;
    justify-items: start;
    max-width: 520px;
    margin: 0 auto;
  }

  .footer-bottom{
    margin-top: 46px;
  }
}

/* ========================= CONTACT PAGE ========================= */
.page-hero{
  position: relative;
  padding: 70px 0;
  overflow: hidden;
}
.page-hero--contact{
   background-image: url("assets/img/img02.webp");
   background-size: cover;
   background-position: center;
   background-attachment: fixed;
  }
.page-hero--contact::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(255,255,255,.30);
  /* 画像を70%見せる = 白30% */
  pointer-events:none;
}
.page-hero__inner{
  position: relative;
} 
.page-hero__title{
  margin: 0;
  text-align: center;
  letter-spacing: .18em;
  font-weight: 500;
  font-size: clamp(28px, 3vw, 44px);
  color: #6b6b6b;
}

.contact{
  padding: 70px 0 90px;
} 
.contact__lead{
  text-align: center;
  color: #333;
  font-size: 16px;
  line-height: 2.2;
  margin-bottom: 40px;
}
 /* フォーム枠の幅（スクショの“中央に細め”） */
 .contact__form{
  width: min(620px, 100%);
  margin: 0 auto;
}
/* ========================= Contact Form 7 想定スタイル （別フォームでもクラス読み替えで使えます） ========================= */ 
.wpcf7 form{
  margin: 0;
} 
.wpcf7 p{
  margin: 0 0 18px;
}
.wpcf7 label{
  display: block;
  font-size: 13px;
  color: #6b6b6b;
  margin: 18px 0 8px;
}
 /* テキスト入力 */
 .wpcf7 input[type="text"],
 .wpcf7 input[type="email"],
 .wpcf7 input[type="tel"],
 .wpcf7 textarea{
  width: 100%;
  border: 1px solid #d7d7d7;
  border-radius: 0;
  padding: 12px 12px;
  font-size: 14px;
  outline: none;
  background: #fff;
}
.wpcf7 textarea{
  min-height: 140px;
  resize: vertical;
} 
/* チェックボックス（縦並び） */ 
.wpcf7 .wpcf7-checkbox{
  display: block;
  margin: 6px 0 10px;
}
 .wpcf7.wpcf7-checkbox .wpcf7-list-item{
  display: block;
  margin: 8px 0;
}
.wpcf7 .wpcf7-checkbox input{
   transform: translateY(1px);
   margin-right: 10px;
  }
.wpcf7 input[type="submit"]{
  display: block;
  width: 100%;
  height: 52px;
  border: none;
  cursor: pointer;
  color: #fff;
  letter-spacing: .35em;
  text-indent: .35em;
  background: linear-gradient(180deg, #6f8fff 0%, #3d63ea 100%); 
  margin-top: 18px;
}
/* エラーメッセージの整え */
.wpcf7-not-valid-tip{
   font-size: 12px;
   margin-top: 6px;
  }
  .wpcf7 form .wpcf7-response-output{
    margin: 18px 0 0;
    padding: 12px;
    font-size: 13px;
  }
   /* スマホ余白 */
    @media (max-width: 768px){
       .page-hero{ padding: 54px 0; }
       .contact{ padding: 54px 20px 70px 20px;
		} 
      }
       /* ========================= 下層ページ：ヘッダー白背景 + 高さ100px ========================= */
       body:not(.home) .site-header{
        background: #fff; height: 100px;
      }
      /* 中身（ロゴ・メニュー）を縦中央に */ 
      body:not(.home) .site-header .header-inner{
         height: 100%;
         display: flex;
         align-items: center;
        }
        /* スマホは少し低めに（任意） */ 
        @media (max-width: 768px){
           body:not(.home)
           .site-header{ height: 80px;
          } }


.page-hero--contact{
  padding-top: calc(70px + 100px);
  padding-bottom: 70px;
  /* 背景を3枚重ね（上から順に） */
  background-image:
    linear-gradient(#fff 0 100px, rgba(255,255,255,0) 100px), /* 白帯 */
    linear-gradient(rgba(255,255,255,.30), rgba(255,255,255,.30)), /* 透明膜（白30%） */
    url("assets/img/img02.webp"); /* 背景画像 */
  background-size: 100% 100%, 100% 100%, cover;
  background-position: top left, top left, center;
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-attachment: scroll, scroll, fixed; /* 画像だけfixed */
}

@media (max-width: 768px){
  .page-hero--contact{
    padding-top: calc(54px + 80px);
    padding-bottom: 54px;
  }
}

  

/* タイトルは前面 */
.page-hero__inner{ position: relative; z-index: 1; }

/* =========================
   Contact Form 7（CONTACTページ用）
========================= */

.contact__form{
  width: min(620px, 100%);
  margin: 0 auto;
}

/* label（項目名） */
.wpcf7 label{
  display:block;
  font-size:13px;
  color:#6b6b6b;
  margin:18px 0 8px;
}

/* 入力欄 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea{
  width:100%;
  border:1px solid #d7d7d7;
  padding:12px;
  font-size:14px;
  background:#fff;
  outline:none;
}

.wpcf7 textarea{
  min-height:140px;
  resize:vertical;
}

/* ---- お問い合わせ内容（タイトル） ---- */
.contact__form .cf-title{
  margin:18px 0 10px !important; /* ← タイトルとチェックの間を10pxに固定 */
  font-size:13px;               /* ← タイトル文字サイズ（好みで調整OK） */
  color:#6b6b6b;
  font-weight:500;
  line-height:1.6;
}

/* ---- チェックボックス ---- */
.wpcf7 .wpcf7-checkbox{
  margin:-10px 0 18px !important;   /* 上0、下18 */
  display:flex;
  flex-wrap:wrap;
  gap: 0 26px;                  /* 横の間隔 */
}

/* 各項目 */
.wpcf7 .wpcf7-checkbox .wpcf7-list-item{
  margin:0 !important;          /* CF7のデフォmarginを消す */
  display:inline-flex;
  align-items:center;
}

/* チェックと文字の距離 */
.wpcf7 .wpcf7-checkbox input{
  margin-right:10px;
  transform:translateY(1px);
}

/* チェックの文字 */
.wpcf7 .wpcf7-checkbox .wpcf7-list-item-label{
  font-size:14px;
  color:#6b6b6b;
}

/* 送信ボタン（すでに入ってるなら不要） */
.wpcf7 input[type="submit"]{
  display:block;
  width:100%;
  height:52px;
  border:none;
  cursor:pointer;
  color:#fff;
  letter-spacing:.35em;
  text-indent:.35em;
  background: linear-gradient(180deg, #6f8fff 0%, #3d63ea 100%);
  margin-top:18px;
}

/* スマホ：チェックは縦並び */
@media (max-width:768px){
  .wpcf7 .wpcf7-checkbox{
    display:block;
    gap:0;
  }
  .wpcf7 .wpcf7-checkbox .wpcf7-list-item{
    display:flex;
    margin:8px 0 !important;
  }
}


/* =========================
   ABOUT Page
========================= */

.page-about { background: #f6f7fb; }

/* HERO（背景画像は好みで差し替え） */
.about-hero{
  position: relative;
  min-height: 240px;
  display: grid;
  place-items: center;
  background: url("./assets/img/about/img02.webp") center/cover no-repeat;
}
.about-hero::after{
  content:"";
  position:absolute; inset:0;
  background: rgba(255,255,255,.35);
}
.about-hero__inner{ position: relative; z-index: 1; }
.about-hero__title{
  margin: 0;
  letter-spacing: .2em;
  font-size: 28px;
  color: #6c6c6c;
}

/* リード */
.about-lead{
  background: #fff;
  padding: 50px 0 28px;
}
.about-lead__copy{
  margin: 50px 0 0 0;
  text-align: center;
  font-size: 24px;
  line-height: 1.9;
  color: #333;
  letter-spacing: .08em;
}

/* MISSION / VISION */
.about-mv{
  background:#fff;
  padding: 20px 20px 40px 20px;
}
.mv-row{
  display: grid;
  grid-template-columns: 160px 1fr;
  column-gap: 18px;
  padding: 26px 0;
}


.mv-row__head{ padding-top: 2px; }
.mv-row__en{
  margin: 0;
  font-size: 22px;
  letter-spacing: .18em;
  color: #4b74ff;
  font-weight: 500;
}

/* 横線（スクショの細いライン感） */
.mv-row__line{
  grid-column: 1 / -1;
  height: 1px;
  background: #cfd7ff;
  margin: 10px 0 14px;
  opacity: .8;
}

.mv-row__body{ grid-column: 1 / -1; }
.mv-row__title{
  margin: 0 0 10px;
  color: #4b74ff;
  font-size: 20px;
  letter-spacing: .06em;
}
.mv-row__text{
  margin: 0;
  color: #333;
  font-size: 16px;
  line-height: 2.0;
}

/* PROFILE */
.about-profile{
  background: #eaf0ff;
  padding: 42px 0 100px;
}
.about-section-title{
  margin: 0 0 22px;
  font-size: 22px;
  letter-spacing: .18em;
  color: #6c6c6c;
  font-weight: 500;
}
.profile-grid{
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 26px;
  align-items: center;
}
.profile-brand{ margin: 0 0 6px; color:#6c6c6c; font-size: 13px; }
.profile-name{ margin: 0 0 10px; font-size: 22px; color:#3a3a3a; letter-spacing:.12em; }
.profile-role{ margin: 0 0 18px; color:#3a3a3a; font-size: 13px; }
.profile-desc{ margin: 0; color:#6c6c6c; font-size: 13px; line-height: 2.0; }

.profile-photo img
.profile-photo2 img{
    max-width: 100%;
  height: auto;
  display:block;
  border-radius: 10px;
}

/* 経歴/あいさつ：左見出し + 右に線 */
.about-history, .about-greeting{ margin-top: 34px; }
.about-history__row{
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 18px;
  margin-bottom: 10px;
}
.about-subtitle{
  margin: 0;
  font-size: 24px;
  letter-spacing: .14em;
  color:#3a3a3a;
  font-weight: 500;
}
.about-subline{
  height: 1px;
  background: #c8cff0;
  opacity: .9;
}
.about-history__text{
  margin: 0;
  color:#333;
  font-size: 16px;
  line-height: 2.0;
}
 .container_profile-inner2{
  width: 1000px;
  margin: 0 auto;
  padding-top: 50px;
 }

/* CONTACT CTA（背景固定したいならここ） */
.about-contact-cta{
  position: relative;
  padding: 48px 0 64px;
  overflow: hidden;
}

/* 背景（固定 + 透明度） */
.about-contact-cta__bg{
  position:absolute; inset:0;
  background: url("./assets/img/about/img02.webp") center/cover no-repeat;
  background-attachment: fixed;         /* ← 背景固定 */
  opacity: .7;                          /* ← 透明度70% */
  z-index: 0;
}
.about-contact-cta .container{ position: relative; z-index: 1; }

.cta-box{
  background: rgba(255,255,255,.88);
  border-radius: 22px;
  padding: 34px 22px 28px;
  text-align: center;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
}
.cta-title{
  margin: 0 0 14px;
  font-size: 28px;
  letter-spacing: .22em;
  color: #7aa1ff;
  font-weight: 500;
}
.cta-text{
  margin: 0 0 18px;
  color: #6c6c6c;
  font-size: 13px;
  line-height: 2.0;
}
.cta-btn{
  display: inline-block;
  min-width: 240px;
  padding: 12px 18px;
  border-radius: 10px;
  background: linear-gradient(180deg, #7aa1ff, #4b74ff);
  color: #fff;
  text-decoration: none;
  letter-spacing: .08em;
}

/* Responsive */
@media (max-width: 900px){
  .profile-grid{ grid-template-columns: 1fr 300px;
  }
   .container_profile-inner2{
    padding:50px 20px 30px 20px;
  max-width: 100%;
  margin: 0 auto;
 }
 .about-profile{
  background: #eaf0ff;
  padding: 40px 20px 100px 20px;
}
}
@media (max-width: 768px){
  .about-hero{ min-height: 200px; }
  .about-lead__copy{ font-size: 24px; }

  .mv-row{ grid-template-columns: 1fr; }
  .mv-row__line{ margin: 10px 0 12px; }

  .profile-grid{ grid-template-columns: 1fr; }
  .profile-photo{ order: -1; } /* 写真を上にしたければ */
  .cta-title{ font-size: 24px; }
  .cta-btn{ min-width: 220px; }
}

/* =========================
   Coming Soon
========================= */
.coming-soon__wrap{
  position: relative;
  min-height: calc(100vh - 120px); /* ヘッダー/フッターの高さにより調整OK */
  display: grid;
  place-items: center;
  overflow: hidden;
}

/* 背景（固定 + 透明度） */
.coming-soon__bg{
  position: absolute;
  inset: 0;
  background: url("./assets/img/common/coming-soon-bg.jpg") center/cover no-repeat;
  background-attachment: fixed;
  opacity: .7;
  z-index: 0;
}

.coming-soon__inner{
  position: relative;
  z-index: 1;
  text-align: center;
  background: rgba(255,255,255,.88);
  border-radius: 22px;
  padding: 38px 22px 30px;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
}

.coming-soon__brand{
  margin: 0 0 10px;
  letter-spacing: .12em;
  color: #6c6c6c;
}

.coming-soon__title{
  margin: 0 0 14px;
  font-size: 34px;
  letter-spacing: .18em;
  color: #4b74ff;
  font-weight: 500;
}

.coming-soon__text{
  margin: 0 0 18px;
  color: #6c6c6c;
  line-height: 2.0;
  font-size: 14px;
}

.coming-soon__links{
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

.coming-soon__btn{
  display: inline-block;
  min-width: 200px;
  padding: 12px 18px;
  border-radius: 10px;
  background: linear-gradient(180deg, #7aa1ff, #4b74ff);
  color: #fff;
  text-decoration: none;
  letter-spacing: .06em;
}

.coming-soon__btn.is-ghost{
  background: transparent;
  border: 1px solid #4b74ff;
  color: #4b74ff;
}

@media (max-width: 768px){
  .coming-soon__title{ font-size: 28px; }
  .coming-soon__btn{ min-width: 220px; }
}

/* NEWS一覧：上下余白を増やす（PC 80 / SP 50） */
.post-archive__body{
  padding: 80px 0;
}

@media (max-width: 768px){
  .post-archive__body{
    padding: 50px 20px;
  }
}

/* =========================
  PAGE SERVICE：共通
========================= */
.page-service{
  --effect-blue: #4b74ff;
}

/* =========================
  SERVICE：装花の3つの魅力（上下2ブロック）
========================= */
.page-service .service-charm{
  padding: 80px 0 70px;
}

/* 見出し */
.service-charm__head{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom: 28px;
}
.service-charm__line{
  width:40px;
  height:1px;
  background:#8aa6ff;
  opacity:.7;
}
.service-charm__title{
  margin:0;
  font-size: 36px;
  letter-spacing: .08em;
  color:#6a85ff;
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-weight: 500;
}

/* 2ブロック共通：紐（背面） */
.service-charm__wrap{
  position: relative;
  padding: 10px 0 10px;
  z-index: -10;
}
.service-charm__wrap::before{
  content:"";
  position:absolute;
  left:50%;
  top: 70px;
  width: min(1100px, 100%);
  height: 980px;
  transform: translateX(-50%);
  background: url("./assets/img/service/bk-line.png") no-repeat center / contain;
  opacity: .9;
  pointer-events:none;
  z-index: 0;
}

/* ブロック本体を前面に */
.charm-block{
  position: relative;
  z-index: 1;
}

/* 画像共通 */
.charm-img img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
  border-radius: 22px;
}

/* EFFECT文字（PC） */
.page-service .charm-ttl{
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 24px;
  line-height: 1.25;
  letter-spacing: .06em;
  color: var(--effect-blue);
  margin: 0 0 14px;
}
.page-service .charm-lead{
  font-family: "Noto Sans JP", system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  font-size: 24px;
  line-height: 1.35;
  letter-spacing: .04em;
  color: var(--effect-blue);
  margin: 0 0 14px;
}
.page-service .charm-desc{
  font-family: "Noto Sans JP", system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  font-size: 18px;
  line-height: 2;
  letter-spacing: .02em;
  color: var(--effect-blue);
  margin: 0;
  font-weight: 300;
}

/* ===== 上：ブロック（PC） ===== */
.charm-block--top{
  display: grid;
  grid-template-columns: 300px minmax(320px, 420px) minmax(320px, 1fr);
  grid-template-rows: auto auto;
  column-gap: 48px;
  row-gap: 42px;
  align-items: start;
  padding-left: 30px;
  padding-right: 30px;
  box-sizing: border-box;
}

/* 左：画像① */
.charm-img--tall{
  width: 300px;
  aspect-ratio: 300 / 450;
  grid-column: 1;
  grid-row: 1 / span 2;
  justify-self: start;
}

/* EFFECT01（2〜3横断） */
.charm-text--01{
  grid-column: 2 / 4;
  grid-row: 1;
  justify-self: end;
  max-width: 450px;
}

/* アイコン（110） */
.charm-icon--110{
  width:70px;
  height:70px;
  grid-column: 2;
  grid-row: 2;
  justify-self: center;
  align-self: start;
  margin-top: 40px;
  z-index: 2;
}
.charm-icon--110 img{
  width:100%;
  height:100%;
  object-fit: contain;
  display:block;
}

/* EFFECT02（1〜2横断・左画像回避） */
.charm-text--02{
  grid-column: 1 / 3;
  grid-row: 2;
  padding-left: 310px;
  box-sizing: border-box;
  margin-top: 200px;
  margin-left: 20px;
}
.charm-text--02 .charm-desc{
  line-height: 2.1;
  max-width: 400px;
}

/* 右下：画像② */
.charm-img--small{
  grid-column: 3;
  grid-row: 2;
  justify-self: end;
  width: 300px;
  aspect-ratio: 430 / 460;
  margin-top: 100px;
}

/* ===== 下：ブロック（PC） ===== */
.charm-block--bottom{
  position: relative;
  display: grid;
  grid-template-columns: minmax(360px, 460px) minmax(520px, 900px);
  gap: 28px 40px;
  align-items: start;
  padding: 56px 0 10px;
}

.charm-text--03{
  max-width: 460px;
  padding-top: 70px;
  font-weight: 400;
  margin-top: 120px;
}

.charm-img--wide{
  width: 100%;
  aspect-ratio: 900 / 650;
  justify-self: end;
  border-radius: 26px;
  overflow: hidden;
  margin-top: 100px;
}
.charm-img--wide img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* アイコン150（HTMLに無いなら出ませんが、残してOK） */
.charm-icon--150{
  position: absolute;
  left: 0;
  top: 10px;
  width: 150px;
  height: 150px;
  z-index: 2;
}
.charm-icon--150 img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* ===== SP：装花ブロック ===== */
@media (max-width: 768px){
  .page-service .service-charm{ padding: 60px 0 50px; }
  .service-charm__title{ font-size: 32px; }

  .service-charm__wrap::before{
    top: 40px;
    height: 980px;
    opacity: .35;
    background-size: cover;
    z-index: 0; /* 変な負数は使わない */
  }

  .page-service .charm-ttl{ font-size: 22px; }
  .page-service .charm-lead{ font-size: 20px; }
  .page-service .charm-desc{ font-size: 16px; }

  /* 上：1カラム */
  .charm-block--top{
    display:flex;
    flex-direction: column;
    gap: 22px;
    padding: 18px 0 34px;
  }
  .charm-img--tall{ order: 1; }
  .charm-text--01{ order: 2; }
  .charm-img--small{ order: 3; }
  .charm-text--02{ order: 4; }
  .charm-icon--110{ order: 5; }

  /* スマホは画像・アイコンを出す場合はここで調整（今は非表示にしていたので統一） */
  .charm-img--tall,
  .charm-img--small,
  .charm-icon--110{
    display: none;
  }

  .charm-text--01,
  .charm-text--02{
    width: 100%;
    margin: 0 auto;
    padding: 24px 20px;
    box-sizing: border-box;
  }

  /* 下：縦積み */
  .charm-block--bottom{
    grid-template-columns: 1fr;
    gap: 18px;
    padding-top: 24px;
  }
  .charm-text--03{
    max-width: none;
    padding: 0 20px;
    margin-top: 0;
  }
  .charm-img--wide{
    display: none;
  }
  .charm-icon--150{
    display: none;
  }
}

/* =========================
  service-wide（office.webp）+ reveal animation
========================= */
.service-wide img{
  width: 100vw;
  margin-left: calc(50% - 50vw);
  height: 400px;
  object-fit: cover;
  display: block;
  margin: 100px 0;
}

/* reveal */
.js-reveal{
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .9s ease, transform .9s ease;
  will-change: opacity, transform;
}
.js-reveal.is-inview{
  opacity: 1;
  transform: translateY(0);
}
.service-wide.js-reveal{
  transition-delay: .1s;
}
@media (prefers-reduced-motion: reduce){
  .js-reveal{ opacity:1; transform:none; transition:none; }
}

@media (max-width: 768px){
  .service-wide img{
    height: 200px;
    margin: 50px 0;
  }
}

/* =========================
  SERVICE：サービス（01〜04）
========================= */
.service-menu{
  padding: 70px 0 0;
  margin-top: 80px;
}

/* 見出し */
.service-menu__head{
  display:flex;
  align-items:center;
  gap:14px;
  margin: 0 0 26px;
}
.service-menu__line{
  width:40px;
  height:1px;
  background:#8aa6ff;
  opacity:.7;
}
.service-menu__title{
  margin:0;
  font-size: 36px;
  letter-spacing: .08em;
  color:#6a85ff;
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-weight: 500;
}

/* panel：左80%水色・右20%白（画面幅） */
.service-menu__panel{
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  padding: 70px 0;
  overflow: hidden;
  background: transparent;
}
.service-menu__panel::before{
  content:"";
  position:absolute;
  inset: 0;
  left:50%;
  width:100vw;
  transform: translateX(-50%);
  background: linear-gradient(
    to right,
    #f6fbff 0%,
    #f6fbff 80%,
    #ffffff 80%,
    #ffffff 100%
  );
  z-index: 0;
}
.service-menu__panel > *{
  position: relative;
  z-index: 1;
}

/* ブロック間：100px */
.service-menu__panel + .service-menu__panel{
  margin-top: 100px;
}

/* カード */
.service-card{
  position: relative;
  display:grid;
  grid-template-columns: 1fr 520px;
  column-gap: 24px;
  row-gap: 22px;
  align-items:start;
  width: 100%;
  color: #333;
}

/* 番号 */
.service-card__num{
  position:absolute;
  right: 0;
  top: -18px;
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 84px;
  letter-spacing:.08em;
  color:#c9d6ff;
  opacity:.7;
  line-height: 1;
  pointer-events:none;
}

/* テキスト */
.service-card__title{
  margin: 0 0 12px;
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 42px;
  letter-spacing:.04em;
  color:#333;
}
.service-card__sub{
  margin: 0 0 18px;
  font-size: 24px;
  line-height: 1.9;
  color:#333;
}
.service-card__desc{
  margin: 0 0 22px;
  font-size: 18px;
  line-height: 2;
  color:#333;
}

/* ボタン（中央寄せ） */
.service-card__btn{
  display: inline-flex;
  align-items:center;
  justify-content:center;
  padding: 12px 22px;
  background:#4b74ff;
  color:#fff;
  text-decoration:none;
  border-radius: 10px;
  font-size: 18px;
  letter-spacing:.06em;
  margin: 0 auto 24px;
}

/* 箇条書き */
.service-card__list{
  margin: 0 0 14px;
  padding-left: 1.2em;
  font-size: 18px;
  line-height: 2;
  color:#555;
}
.service-card__note{
  margin: 0;
  font-size: 12px;
  line-height: 2;
  color:#666;
}

/* 画像：左上＆右下だけ100px */
.service-card__img img{
  width: 80%;
  height:auto;
  display:block;
  object-fit: cover;
  border-radius: 100px 0 100px 0;
  transform: translateY(80px);
  margin-left: 150px;
  margin-top: 50px;
}

/* SP：サービス */
@media (max-width: 768px){
  .service-menu{ padding: 55px 0 0; margin-top: 60px; }
  .service-menu__title{ font-size: 32px; }

  .service-menu__panel{
    padding: 50px 0;
  }
  .service-menu__panel::before{
    background: #f6fbff; /* スマホは全面 */
  }

  .service-menu__panel + .service-menu__panel{
    margin-top: 60px;
  }

  .service-card{
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .service-card__num{
    top: -10px;
    font-size: 58px;
  }
  .service-card__title{ font-size: 28px; }

  .service-card__text{
    padding: 0 20px;
    box-sizing: border-box;
  }

  .service-card__img{
    padding: 0 20px;
    box-sizing: border-box;
  }
  .service-card__img img{
      width: 100%;
    border-radius: 60px 0 60px 0;
    transform: translateY(0px);
    margin-left: 10px;
  }
}

@media (max-width: 768px){
  .service-card__btn{
    display: flex;        /* blockでもOKだけど、中央揃えが確実 */
    width: fit-content;   /* 中身の幅にする */
    margin: 0 auto 24px;  /* 中央寄せ */
  }
}

/* =========================
  SERVICE：最後の料金案内ブロック（上下100px）
========================= */
.service-price-note{
  padding: 100px 0;
  background: #fff;
}
.service-price-note__text{
  margin: 0;
  text-align: center;
  font-size: 16px;
  line-height: 2.2;
  color: #4a4a4a;
}
.service-price-note__link{
  color: #4b74ff;
  text-decoration: underline;
  text-underline-offset: 4px;
}
@media (max-width: 768px){
  .service-price-note{
    padding: 70px 0;
  }
  .service-price-note__text{
    text-align: left;
    font-size: 14px;
    line-height: 2.1;
    padding: 0 20px;
    box-sizing: border-box;
  }
}

.js-reveal{ opacity:0; transform:translateY(18px); transition:.9s ease; }
.js-reveal.is-inview{ opacity:1; transform:none; }

/* =========================
  WORKS：事例紹介
========================= */
.page-works .works-cases{
  padding: 80px 0 40px;
}

/* 見出し（左タイトル＋右ライン） */
.page-works .works-head{
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 42px;
  margin-top: 50px;
}
.page-works .works-head__title{
  margin: 0;
  font-size: 32px;
  letter-spacing: .08em;
  color: #6a85ff;
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-weight: 500;
}
.page-works .works-head__line{
  height: 1px;
  background: #c9d6ff;
  flex: 1;
  opacity: .8;
}

/* 事例：カード */
.page-works .works-case-list{
  display: grid;
  gap: 38px;
}

.page-works .works-case{
  display: grid;
  grid-template-columns: 520px 1fr;
  gap: 46px;
  align-items: start;
}

/* CASE画像：500×375（4:3）比率に固定 */
.page-works .works-case__img{
  width: 100%;
  aspect-ratio: 500 / 375; /* = 4 / 3 */
  border-radius: 26px;
  overflow: hidden;
}

.page-works .works-case__img img{
  width: 100%;
  height: 100%;
  object-fit: cover; /* 4:3枠に合わせてトリミング */
  display: block;
}

/* 右テキスト */
.page-works .works-case__no{
  font-size: 22px;
  letter-spacing: .08em;
  color: #6a85ff;
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  margin: 0 0 14px;
}
.page-works .works-case__title{
  margin: 0 0 26px;
  font-size: 22px;
  line-height: 1.9;
  letter-spacing: .06em;
  color: #2f2f2f;
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-weight: 500;
}

/* meta（左にdt、右にdd） */
.page-works .works-case__meta{
  margin: 0;
  display: grid;
  gap: 10px;
  font-size: 18px;
  line-height: 2;
  color: #4a4a4a;
}
.page-works .works-case__row{
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 12px;
}
.page-works .works-case__row dt{
  margin: 0;
  white-space: nowrap;
  letter-spacing: .18em; /* 「社　名：」の雰囲気 */
  color: #4a4a4a;
}
.page-works .works-case__row dd{
  margin: 0;
  color: #4a4a4a;
}

/* もっと見る */
.page-works .works-more{
  margin-top: 26px;
  text-align: center;
}
.page-works .works-more__link{
  font-size: 14px;
  color: #6a85ff;
  text-decoration: none;
}
.page-works .works-more__link:hover{
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* SP */
@media (max-width: 768px){

  .page-works .works-cases{
    padding: 50px 20px 30px 20px;
  }

  .page-works .works-case{
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .page-works .works-case__title{
    font-size: 18px;
    margin-bottom: 18px;
  }

  .page-works .works-case__meta{
    font-size: 18px;
  }

  .page-works .works-case__row{
    grid-template-columns: 86px 1fr;
  }
}

/* =========================
  WORKS：CASE背景ぼかし円（指定色）
========================= */
.page-works .works-case{
  position: relative;
}

.page-works .works-case::before{
  content:"";
  position:absolute;
  width: 460px;
  height: 460px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  filter: blur(18px);
  left: 420px;
  top: -80px;
}

/* 中身を前面に */
.page-works .works-case > *{
  position: relative;
  z-index: 1;
}

/* CASE01 */
.page-works .works-case:nth-child(1)::before{
  background: radial-gradient(circle,
    rgba(255,232,222,.55) 0%,
    rgba(255,232,222,.22) 45%,
    rgba(255,232,222,0) 74%
  );
  left: 420px;
  top: -90px;
}

/* CASE02 */
.page-works .works-case:nth-child(2)::before{
  background: radial-gradient(circle,
    rgba(255,222,252,.55) 0%,
    rgba(255,222,252,.22) 45%,
    rgba(255,222,252,0) 74%
  );
  left: 440px;
  top: -40px;
}

/* CASE03 */
.page-works .works-case:nth-child(3)::before{
  background: radial-gradient(circle,
    rgba(214,242,217,.55) 0%,
    rgba(214,242,217,.22) 45%,
    rgba(214,242,217,0) 74%
  );
  left: 400px;
  top: -20px;
}

/* 説明文 */
.flow-read{
  font-size: 18px;
  margin-top: -20px;
  margin-bottom: 50px;
  line-height: 2;
}

/* SP：円を消す＆説明文調整 */
@media (max-width: 768px){
  .page-works .works-case::before{
    display: none;
  }

  .flow-read{
    margin-bottom: 0;
    line-height: 2;
  }
}

/* =========================
  画像みたいな “文字＋下線ライン” ボタン（共通）
========================= */
.btn-line-wrap{
  text-align: center;
}

.btn-line{
  --c:#081F77;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: var(--c);
  text-decoration: none;
  padding: 18px 0 22px;
  position: relative;

  font-family: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: clamp(22px, 3vw, 24px);
  letter-spacing: 0.12em;
  margin-top: 50px;
  margin-bottom: 50px;
}

.btn-line::after{
  content:"";
  position:absolute;
  left:50%;
  transform: translateX(-50%);
  bottom: 0;
  width: min(640px, 100%);
  height: 2px;
  background: currentColor;
}

.btn-line__arrow{
  font-size: 1em;
  line-height: 1;
}

.btn-line:hover{
  opacity: .8;
}

.btn-line:hover .btn-line__arrow{
  transform: translateX(4px);
  transition: transform .2s ease;
}
/* =========================
   STEPS（縦ライン＋STEP丸）
========================= */
.steps{
  padding: 90px 0;
}

.steps__list{
  display: grid;
  gap: 44px;
}

/* 1アイテム */
.step{
  display: grid;
  grid-template-columns: 120px 1fr;
  column-gap: 52px;
  position: relative;
}

/* 左側：縦ライン */
.step__left{
  position: relative;
  display: flex;
  justify-content: center;
}

/* 縦ライン（STEP間をつなぐ） */
.step__left::after{
  content:"";
  position: absolute;
  top: 90px;              /* 丸の下から */
  bottom: -44px;          /* 次のステップの余白分つなぐ */
  width: 1px;
  background: rgba(120, 150, 255, .45);
  left: 50%;
  transform: translateX(-50%);
}

/* 最後は線を止める */
.step--last .step__left::after{
  display: none;
}

/* STEPの丸 */
.step__badge{
  width: 86px;
  height: 86px;
  border-radius: 50%;
  background: #6f8bff;
  color: #fff;
  display: grid;
  place-items: center;
  text-align: center;
  box-shadow: 0 10px 24px rgba(50, 80, 200, .12);
}

.step__badge-top{
  font-family: "Times New Roman", serif;
  letter-spacing: 0.12em;
  font-size: 15px;
  line-height: 1;
  margin-top: 6px;
}

.step__badge-num{
  font-family: "Times New Roman", serif;
  font-size: 34px;
  line-height: 1;
  margin-bottom: 6px;
}

/* 右側 */
.step__title{
  margin: 0 0 10px;
  color: #6f8bff;
  font-size: 24px;
  letter-spacing: 0.06em;
  font-weight: 600;
}

.step__text{
  margin: 0;
  color: #333;
  line-height: 2.0;
  font-size: 16px;
}

/* STEP01のボタン */
.step__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 22px;
  padding: 16px 40px;
  border-radius: 999px;
  color: #fff;
  text-decoration: none;
  background: linear-gradient(180deg, #7f97ff 0%, #5b78ff 100%);
  box-shadow: 0 12px 28px rgba(70, 100, 220, .22);
  font-size: 15px;
  letter-spacing: .06em;
  min-width: 360px;
}

.step__btn:hover{
  filter: brightness(0.96);
}

/* SP */
@media (max-width: 768px){
  .steps{
    padding: 70px 0;
  }

  .step{
    grid-template-columns: 88px 1fr;
    column-gap: 18px;
  }

  .step__badge{
    width: 70px;
    height: 70px;
  }

  .step__badge-num{
    font-size: 28px;
  }

  .step__title{
    font-size: 18px;
  }

  .step__text{
    font-size: 16px;
    line-height: 1.9;
  }

  .step__btn{
    min-width: 0;
    width: 100%;
    padding: 14px 18px;
  }

  .step__left::after{
    top: 76px;
  }
}
/* 参考価格（セクション全体） */
.works-price{
  padding: 90px 0;
}

/* 上の説明パネル */
.price-lead{
  background: #eaf0ff;
  border-radius: 999px;
  padding: 46px 70px;
  margin-top: 36px;
}

.price-lead__text{
  margin: 0;
  line-height: 2;
  color: #333;
  font-size: 15px;
}

/* 下の価格パネル（前に出したやつのままでOK） */
.price-panel{
  margin-top: 46px;
}

@media (max-width: 768px){
  .works-price{ padding: 70px 0; }

  .price-lead{
    border-radius: 60px;
    padding: 26px 18px;
  }

  .price-lead__text{
    font-size: 14px;
    line-height: 1.9;
  }

  .price-panel{ margin-top: 28px; }
}

/* 下の価格ブロックの青背景（確実に表示される版） */
.price-panel{
  margin-top: 46px;
}

.price-panel__inner{
  background: #eaf0ff;      /* 薄い青 */
  border-radius: 180px;     /* 大きい角丸 */
  padding: 70px 0px;
}

/* =========================
  WORKS：参考価格
========================= */

/* セクション余白 */
.page-works .works-price{
  padding: 90px 0;
}

.page-works .works-price .works-head{
  margin-bottom: 36px;
}

/* 上の説明パネル */
.page-works .price-lead{
  background: #eaf0ff;
  border-radius: 999px;
  padding: 46px 70px;
}

.page-works .price-lead__text{
  margin: 0;
  color: #333;
  line-height: 2;
  font-size: 15px;
  letter-spacing: .04em;
}

/* 下の価格パネル */
.page-works .price-panel{
  margin-top: 46px;
}

.price-panel__inner{
  background: #eaf0ff;
  border-radius: 0 100px 0 100px; /* 左上0 / 右上100 / 右下0 / 左下100 */
  padding: 70px 80px;
  margin-bottom: 100px;
}

/* ブロック間 */
.page-works .price-block + .price-block{
  margin-top: 54px;
}

/* 見出し（英＋日本語） */
.page-works .price-block__title{
  margin: 0 0 18px;
  color: #081F77;
  font-family: "Times New Roman", serif;
  font-size: 34px;
  letter-spacing: .02em;
  font-weight: 500;
}

.page-works .price-block__sub{
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  font-size: 16px;
  color: #081F77;
  letter-spacing: .06em;
  margin-left: 10px;
}

/* 定期装花：項目 */
.page-works .price-items{
  display: grid;
  gap: 28px;
}

.page-works .price-item__name{
  display: inline-flex;
  justify-content: center;
  align-items: center;

  width: 160px;           /* ←ここで統一（お好みで調整） */
  padding: 6px 12px;
  margin-bottom: 10px;
  border: 1px solid #6a85ff;
  border-radius: 6px;
  line-height: 1;
}

.page-works .price-item__desc{
  margin: 0;
  color: #333;
  line-height: 2;
  font-size: 16px;
}

/* テキスト */
.page-works .price-text{
  margin: 0 0 8px;
  color: #333;
  line-height: 2;
  font-size: 15px;
}

.page-works .price-note{
  margin: 12px 0 0;
  color: #333;
  line-height: 2;
  font-size: 14px;
}

/* =========================
  SP
========================= */
@media (max-width: 768px){
  .page-works .works-price{
    padding: 0px;
  }

  .works-flow{
    padding-left: 20px;
    padding-right: 20px;
  }

  .page-works .works-price .works-head{
    margin-bottom: 26px;
  }

  .page-works .price-lead{
    border-radius: 60px;
    padding: 26px 18px;
  }

  .page-works .price-lead__text{
    font-size: 14px;
    line-height: 1.9;
  }

  .page-works .price-panel{
    margin-top: 28px;
  }

  .price-lead{
    border-radius: 0 60px 0 60px;
}

.price-panel__inner{
  border-radius: 0 60px 0 60px;
  padding: 30px;
  margin-bottom: 0px;
}

  .page-works .price-block__title{
    font-size: 24px;
  }

  .page-works .price-block__sub{
    font-size: 14px;
    margin-left: 6px;
  }

  .page-works .price-item__name,
  .page-works .price-item__desc,
  .page-works .price-text{
    font-size: 16px;
  }
}

/* =========================
   FAQ Accordion
========================= */
.faq{
  padding: 90px 0;
}

.faq__list{
  display: grid;
  gap: 18px;
}

/* 全体（枠） */
.faq-item{
  border: 1px solid #9fb2ff;
  border-radius: 14px;
  background: #ffffff;
  overflow: hidden;
}

/* summaryのデフォルト三角を消す */
.faq-q{
  list-style: none;
}
.faq-q::-webkit-details-marker{
  display:none;
}

/* 質問行 */
.faq-q{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 18px 22px;
  cursor: pointer;

  color:#6a85ff;
  font-family: "Yu Mincho", "游明朝", "Hiragino Mincho ProN", "Noto Serif JP", serif;
  letter-spacing: .08em;
  font-size: 18px;
}

/* Q： */
.faq-q__label{
  flex: 0 0 auto;
}

/* 右の▼ */
.faq-q__icon{
  margin-left:auto;
  width: 10px;
  height: 10px;
  border-right: 2px solid #6a85ff;
  border-bottom: 2px solid #6a85ff;
  transform: rotate(45deg);
  transition: transform .2s ease;
}

/* 開いた時：背景を薄青に＋▼を上向き */
.faq-item[open] .faq-q{
  background: #eaf0ff;
}
.faq-item[open] .faq-q__icon{
  transform: rotate(-135deg);
}

/* 回答 */
.faq-a{
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 10px;
  padding: 18px 22px 22px;
  background: #ffffff;
  color: #333;
  line-height: 2.0;
  font-size: 16px;
}

.faq-a__label{
  font-family: "Times New Roman", serif;
  color:#333;
}

/* SP */
@media (max-width: 768px){
  .faq{ padding: 70px 0; }

  .faq-q{
    padding: 16px 16px;
    font-size: 16px;
  }

  .faq-a{
    padding: 16px 16px 18px;
    font-size: 14px;
    grid-template-columns: 34px 1fr;
  }
}
.footer-legal{
  display: flex;
  justify-content: center;
  gap: 28px;
  margin-top: 40px; /* 位置調整 */
}

.footer-legal__link{
  color: #333;          /* サイトの青に */
  text-decoration: none;
  font-size: 13px;
  letter-spacing: .06em;
}

.footer-legal__link:hover{
  text-decoration: underline;
  text-underline-offset: 4px;
}

@media (max-width: 768px){
  .footer-legal{
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }
}

.footer-legal{
  display: flex;
  justify-content: center;
  gap: 34px;
  margin: 0 auto;
  padding: 34px 0 18px;
}

.footer-legal__link{
  color: #333;
  text-decoration: none;
  font-size: 13px;
  letter-spacing: .06em;
}

.footer-legal__link:hover{
  text-decoration: underline;
  text-underline-offset: 4px;
}

@media (max-width: 768px){
  .footer-legal{
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 22px 0 10px;
  }
}

@media (max-width: 768px){
  /* 画像枠（figure）に高さを与える */
  .profile-photo2{
    max-width: 100%;
    height: 320px;          /* ←ここで大きさ決まる（280〜360で調整） */
    border-radius: 18px;
    overflow: hidden;
  }

  /* 枠に合わせてトリミング */
  .profile-photo2 img{
    max-width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;  /* 顔を上に残したい時におすすめ */
    display: block;
  }
}

.service-card__list{
  list-style: none;
  padding-left: 0;
  margin: 0;
  color: #333;
}

.service-sub2{
  color: #3d63ea;
}

/* =========================
   SECTION HEAD（左タイトル＋右ライン）
========================= */
.section-head{
  display: flex;
  align-items: center;
  gap: 24px;
  margin: 50px auto 42px;

  /* ✅ 他のブロック（max1000 / 左右30, SP20）に合わせる */
  width: min(1000px, calc(100% - 60px));
}

.section-head__title{
  margin: 0;
  font-size: 36px;
  letter-spacing: .08em;
  color: #6a85ff;
  font-family: "Yu Mincho","游明朝","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 500;
}

.section-head__line{
  height: 1px;
  background: #c9d6ff;
  flex: 1;
  opacity: .8;
}

@media (max-width: 768px){
  .section-head{
    width: calc(100% - 40px); /* ✅ SP左右20px */
    gap: 18px;
    margin-bottom: 28px;
  }
  .section-head__title{
    font-size: 28px;
  }
}

.archive-head{
  padding: 90px 0 30px;
}
.archive-title{
  margin: 0;
  font-size: 32px;
  letter-spacing: .08em;
  color:#333;
  font-family: "Yu Mincho","游明朝","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 500;
}

.archive-body{
  padding: 30px 0 90px;
}

.archive-list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 14px;
}

.archive-link{
  display: flex;
  gap: 14px;
  text-decoration: none;
  color: #333;
  padding: 14px 0;
  border-bottom: 1px solid #e7e9f2;
}

.archive-date{
  color:#6a85ff;
  letter-spacing: .06em;
  white-space: nowrap;
}

/* =========================
  Category Archive（画像＋タイトル）
========================= */
.category-archive .archive-body{
  padding: 70px 0 110px;
	margin-left:20px;
	margin-right:20px;
}

.archive-grid{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 34px;
}

.archive-card__link{
  display: block;
  text-decoration: none;
  color: #333;
}

.archive-card__img{
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  aspect-ratio: 4 / 3;
}

.archive-card__img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.archive-card__title{
  margin: 14px 0 0;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: .06em;
  font-family: "Yu Mincho","游明朝","Hiragino Mincho ProN","Noto Serif JP",serif;
  font-weight: 500;
}

/* SP */
@media (max-width: 768px){
  .category-archive .archive-body{
    padding: 50px 0 80px;
  }

  .archive-grid{
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }

  .archive-card__img{
    border-radius: 14px;
  }

  .archive-card__title{
    font-size: 14px;
    margin-top: 10px;
  }
}

.post-thumbnail{
  margin: 24px 0 34px;
  border-radius: 18px;
  overflow: hidden;
  height: 520px;           /* 好きな高さに */
}

.post-thumbnail img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

@media (max-width: 768px){
  .post-thumbnail{
    height: 320px;
  }
}

@media (max-width: 768px){
  .single .container[style]{
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

.law{
  margin: 80px 20px;
}

.law__row dt{
  display: inline-block;          /* 下線を文字幅に合わせる */
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(106,133,255,.55); /* 薄い青ライン */
}

.law__row dd{
 margin: 15px 0 30px 0;
}

.news-title-2{
	font-size:24px;
	font-family: "Yu Mincho","游明朝","Hiragino Mincho ProN","Noto Serif JP",serif;
}


@media (max-width: 768px){
.news-title-2{
    font-size:18px;
  }
}