/* 株式会社ママフリワークス 共通スタイル（全ページ共通） */
/* =========================================================
   色・フォント（ここを変えると全体が変わります）
   ========================================================= */
:root{
  --pink:#ff6779;        /* ボタン・英字見出し */
  --pink-news:#ff9aa6;   /* NEWSラベル */
  --pink-mv:#fbaab4;     /* メイン写真の下のピンク帯 */
  --pink-box:#fdc1c8;    /* ABOUTのピンク箱 */
  --pink-frame:#facdcd;  /* サービス写真のずらし枠 */
  --pink-script:#fddde0; /* 筆記体の飾り文字 */
  --pink-bg:#fcefef;     /* 淡いピンク背景 */
  --pink-name:#fc7c8b;   /* メンバーのローマ字 */
  --gray-bg:#faf8f8;     /* 理念エリアの背景 */
  --gold:#9c8c00;        /* ヘッダーボタン・斜め線 */
  --text:#000;
  --ff-base:"Noto Sans JP",sans-serif;
  --ff-head:"Zen Kaku Gothic New","Noto Sans JP",sans-serif;
  --ff-hand:"Zen Kurenaido",cursive;
  --ff-en:"Bodoni Moda",serif;
  --ff-script:"Corinthia",cursive;
  /* 1440px幅の参考デザインを画面幅に合わせて伸縮させる単位 */
  --u:calc(min(100vw,1600px) / 1425);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--text);font-family:var(--ff-base);font-size:16px;line-height:1.625;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,dl,dd,p,h1,h2,h3{margin:0;padding:0}
ul{list-style:none}

/* ---------- 写真スロット：images/ に同名ファイルを置くと自動で表示 ---------- */
.ph{position:relative;overflow:hidden;background:linear-gradient(135deg,#f6e9ea,#efe3e4)}
.ph::after{content:attr(data-label);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:8px;font-size:12px;letter-spacing:.05em;color:#b98f95;white-space:pre-line}
.ph img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%)}
/* 写真の見せたい位置を変えるとき：<div class="ph" style="--pos:50% 30%"> のように指定（左右% 上下%） */
.ph img.noimg{display:none}
.ph--br::after{align-items:flex-end;justify-content:flex-end;padding:16px 24px}

/* ---------- 共通ボタン ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:300px;height:60px;border-radius:30px;background:var(--pink);color:#fff;font-family:var(--ff-head);font-weight:700;font-size:20px;letter-spacing:.08em;transition:opacity .3s}
.btn::after{content:"";position:absolute;right:30px;top:50%;width:32px;height:7px;margin-top:-5px;border-bottom:1px solid rgba(255,255,255,.8);border-right:1px solid rgba(255,255,255,.8);transform:skewX(45deg);transform-origin:right bottom}
.btn:hover{opacity:.75}
.btn--s{width:225px;height:45px;border-radius:23px;font-size:15px}
.btn--s::after{right:22px;width:26px}

/* ---------- セクション見出し（英字＋筆記体） ---------- */
.secTitle{position:relative;text-align:center;color:var(--pink);font-weight:400;line-height:1.6;padding-bottom:6px}
.secTitle::before{content:"";position:absolute;left:50%;top:72px;width:34px;height:1px;background:var(--pink);transform:translateX(-50%)}
.secTitle__en01{position:relative;z-index:1;font-family:var(--ff-en);font-size:45px;letter-spacing:.02em;line-height:73px}
.secTitle__en02{position:absolute;font-family:var(--ff-script);font-size:calc(var(--u)*170);line-height:1;color:var(--pink);pointer-events:none}

/* =========================================================
   ヘッダー
   ========================================================= */
.header{position:sticky;top:0;z-index:100;height:117px;background:#fff;display:flex;align-items:center;padding:0 40px}
.logo{display:flex;align-items:center;gap:10px;width:auto;height:60px}
.logo__img{display:none;height:60px;width:260px;object-fit:contain;object-position:left center}
.logo.has-img .logo__img{display:block}
.logo.has-img .logo__mark,.logo.has-img .logo__text{display:none}
.logo__mark{width:46px;height:46px;flex:none}
.logo__text{font-family:var(--ff-head);font-weight:700;font-size:26px;letter-spacing:.02em;font-feature-settings:"palt";line-height:1;white-space:nowrap}
.gnav{margin-left:auto;display:flex;align-items:center}
.gnav ul{display:flex;gap:calc(var(--u)*50)}
.gnav li a{font-family:var(--ff-head);font-weight:700;font-size:15px;letter-spacing:.1em}
.gnav li a:hover{color:var(--pink)}
.gnav__btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;width:220px;height:52px;margin-left:calc(var(--u)*45);border-radius:26px;background:var(--gold);color:#fff;font-family:var(--ff-head);font-weight:700;font-size:15px;letter-spacing:.08em}
.gnav__btn svg{width:18px;height:18px}
.menuBtn{display:none}

/* =========================================================
   メインビジュアル
   ========================================================= */
.mv{position:relative;height:calc(var(--u)*657)}
.mv__pink{position:absolute;left:0;top:calc(var(--u)*468);width:calc(var(--u)*833);height:calc(var(--u)*380);background:var(--pink-mv);z-index:0}
.mv__pic{position:absolute;left:calc(var(--u)*171);right:0;top:0;bottom:0;z-index:1}
.mv__catch{position:absolute;z-index:2;left:calc(var(--u)*126);top:calc(var(--u)*255);font-family:var(--ff-hand);font-weight:400;font-size:calc(var(--u)*84);line-height:1.45;letter-spacing:-.02em;color:#111;transform:rotate(-3deg);-webkit-text-stroke:.6px #111;text-shadow:0 0 14px rgba(255,255,255,.85),0 0 4px rgba(255,255,255,.9)}
.mv__catch span{display:block}
.mv__catch span+span{padding-left:calc(var(--u)*160)}
.mv__scroll{position:absolute;z-index:2;left:45px;top:calc(var(--u)*510);height:200px;width:27px}
.mv__scroll span{position:absolute;left:0;top:19px;width:1px;height:200px;background:#fff}
.mv__scroll p{position:absolute;left:4px;top:0;writing-mode:vertical-rl;font-family:var(--ff-en);font-size:11px;letter-spacing:.2em;color:#fff;text-transform:uppercase}
.mv__news{position:absolute;z-index:3;right:0;left:calc(var(--u)*863);top:calc(var(--u)*641);height:32px;background:#fff;border-radius:14px 0 0 14px;display:flex;align-items:center;padding:0 22px}
.mv__news h2{font-family:var(--ff-base);font-weight:400;font-size:12px;color:var(--pink-news);padding-right:11px;border-right:1px solid #ddd;letter-spacing:.05em;line-height:1}
.mv__news a{flex:1;display:flex;align-items:center;gap:8px;padding-left:11px;font-size:12px;min-width:0;line-height:1}
.mv__news dt{flex:none}
.mv__news dd{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mv__news a::after{content:"";flex:none;width:26px;height:5px;border-bottom:1px solid var(--pink-news);border-right:1px solid var(--pink-news);transform:skewX(45deg);margin-left:10px}

/* =========================================================
   理念（ヘッドライン）
   ========================================================= */
.headline{position:relative;margin-top:calc(var(--u)*134);height:calc(var(--u)*737);z-index:1}
.headline::before{content:"";position:absolute;left:calc(var(--u)*253);right:0;top:calc(var(--u)*223);bottom:0;background:var(--gray-bg);z-index:-1}
.headline__img01{position:absolute;left:calc(var(--u)*120);top:0;width:calc(var(--u)*540);height:calc(var(--u)*357);z-index:1}
.headline__img02{position:absolute;left:calc(var(--u)*735);right:0;top:calc(var(--u)*438);height:calc(var(--u)*199);z-index:1}
.headline__text{position:absolute;left:calc(var(--u)*1043);top:calc(var(--u)*318);right:0;overflow:hidden;white-space:nowrap;font-family:var(--ff-script);font-weight:400;font-size:calc(var(--u)*154);line-height:1.6;color:var(--pink-script);z-index:2;pointer-events:none}
.headline__box{position:absolute;left:calc(var(--u)*615);top:calc(var(--u)*45);width:calc(var(--u)*525);min-height:calc(var(--u)*548);background:#fff;z-index:3;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--u)*60) calc(var(--u)*64)}
.headline__box::before,.headline__box::after{content:"";position:absolute;width:72px;height:1px;background:var(--gold);transform:rotate(-45deg);z-index:2}
.headline__box::before{left:-22.5px;top:15px}
.headline__box::after{right:-22.5px;bottom:15px}
.headline__boxTitle{font-family:var(--ff-head);font-weight:700;font-size:calc(var(--u)*31.5);line-height:1.5;letter-spacing:.01em;white-space:nowrap;margin-bottom:16px}
.headline__boxText{font-size:12.5px;line-height:1.65}
.headline__boxBtn{text-align:center;margin-top:46px}

/* =========================================================
   サービス
   ========================================================= */
.secService{position:relative;z-index:2;padding-top:0}
.secTitle__en02--service{left:calc(50% - var(--u)*190);top:calc(var(--u)*-150);font-size:calc(var(--u)*195);z-index:0}
.serviceBlock{display:flex;align-items:flex-start;padding:67.5px 60px 67.5px calc(var(--u)*184);border-bottom:10px solid var(--pink-bg)}
.serviceBlock:last-child{border-bottom:0}
.serviceBlock__cont{flex:1;min-width:0;padding-right:30px}
.serviceBlock__title{font-weight:700}
.serviceBlock__titleNum{position:relative;display:inline-block;font-family:var(--ff-en);font-weight:500;font-size:22.5px;color:var(--pink);line-height:1.6}
.serviceBlock__titleNum::before{content:"";position:absolute;left:calc(100% - 6px);top:28px;width:34.5px;height:1px;background:var(--pink);transform:rotate(-45deg);transform-origin:left center}
.serviceBlock__titleText{display:block;font-family:var(--ff-head);font-weight:700;font-size:calc(var(--u)*52.5);line-height:1.6;letter-spacing:.02em;font-feature-settings:"palt"}
.serviceBlock__text{max-width:470px;margin-top:12px;margin-bottom:22px}
.serviceBlock__pic{position:relative;flex:none;width:calc(var(--u)*551);height:calc(var(--u)*401)}
.serviceBlock__pic::before{content:"";position:absolute;top:34px;left:-34.5px;right:34.5px;bottom:-34px;background:var(--pink-frame);z-index:0}
.serviceBlock__pic .ph{position:relative;z-index:1;width:100%;height:100%}

/* =========================================================
   ABOUT US
   ========================================================= */
.secAbout{position:relative;background:var(--pink-bg);padding:138px 0 80px}
.secAbout__box{position:relative;padding-top:0}
.secAbout__box::before{content:"";position:absolute;left:50%;top:0;width:min(1140px,80vw);height:calc(100% + 183px);background:var(--pink-box);transform:translateX(-50%);z-index:0}
.secTitle--about{top:-35px}
.secTitle__en02--about{left:calc(50% + 70px);top:-25px;font-size:calc(var(--u)*150)}
.secAbout__boxTitle{position:relative;z-index:1;text-align:center;font-family:var(--ff-head);font-weight:700;font-size:21px;letter-spacing:.06em;padding:4px 20px 70px}
.message{position:relative;z-index:1;display:flex;align-items:flex-start;gap:calc(var(--u)*70);max-width:1000px;margin:0 auto;background:#fff;padding:calc(var(--u)*70) calc(var(--u)*80)}
.message__pic{flex:none;width:calc(var(--u)*360);aspect-ratio:4/5;position:relative}
.message__pic::before{content:"";position:absolute;top:24px;left:-24px;right:24px;bottom:-24px;background:var(--pink-frame);z-index:0}
.message__pic .ph{position:absolute;inset:0;z-index:1}
.message__cont{flex:1;min-width:0}
.message__lead{font-family:var(--ff-head);font-weight:700;font-size:calc(var(--u)*25);line-height:1.6;letter-spacing:.02em;font-feature-settings:"palt";margin-bottom:28px}
.message__text p{font-size:15px;line-height:2;margin-bottom:1.2em}
.message__sign{margin-top:30px;text-align:right}
.message__signPos{font-size:13px;line-height:1.7}
.message__signName{font-family:var(--ff-head);font-weight:700;font-size:22px;letter-spacing:.1em;line-height:1.6}
.message__signName span{display:block;font-family:var(--ff-base);font-weight:400;font-size:11px;letter-spacing:.05em;color:var(--pink-name)}
.secAbout__btn{text-align:center;margin-top:50px}

/* =========================================================
   BLOG
   ========================================================= */
.secBlog{padding:80px 0 80px}
.blogList01{display:grid;grid-template-columns:repeat(3,300px);justify-content:space-between;row-gap:60px;max-width:1100px;margin:40px auto 0;padding:0 10px}
.blogList01__item{position:relative}
.blogList01__pic{height:196px}
.blogList01__pic .ph{width:100%;height:100%}
.blogList01__cont{padding-top:20px}
.blogList01__contMeta{display:flex;justify-content:space-between;align-items:center}
.blogList01__contMeta .date{font-size:13px;color:#aaa}
.blogList01__contMeta .cate{position:relative;font-size:13px;color:var(--gold);padding-left:22px}
.blogList01__contMeta .cate::before{content:"";position:absolute;left:0;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%;border:1.5px solid #c9bd6a;background:radial-gradient(circle at 50% 38%,#c9bd6a 0 3px,transparent 3.5px),radial-gradient(circle at 50% 110%,#c9bd6a 0 6px,transparent 6.5px)}
.blogList01__contText{font-size:15px;font-weight:500;line-height:1.6;margin-top:4px}
.blogList01__contTag{margin-top:10px}
.blogList01__contTag span{display:inline-block;background:var(--pink);color:#fff;font-size:12px;line-height:22px;padding:0 10px;border-radius:6px}
.blogList01__contTag span::before{content:"#"}
.secBlog__btn{text-align:center;margin-top:60px}

/* =========================================================
   RECRUIT
   ========================================================= */
.secRecruit{position:relative;padding:145px 10px 110px}
.secRecruit__bg{position:absolute;inset:0;z-index:0}
.secRecruit__bg .ph{width:100%;height:100%}
.secRecruit__box{position:relative;z-index:1;max-width:976px;margin:0 auto;background:#fff;text-align:center;padding:0 20px 80px}
.secTitle--recruit{top:-36px;margin-bottom:-36px}
.secRecruit__boxTitle{font-family:var(--ff-head);font-weight:700;font-size:21px;letter-spacing:.06em;margin-top:8px}
.secRecruit__boxText{margin-top:60px}
.secRecruit__btn{margin-top:40px}

/* =========================================================
   INSTAGRAM
   ========================================================= */
.secInstagram{padding:60px 0 0}
.insta{max-width:1100px;margin:40px auto 0;padding:0 10px}
.insta__embed{display:block;width:100%;max-width:1000px;height:850px;margin:0 auto;border:1px solid #efe4e5;border-radius:4px;background:#fff}
.insta__head{display:flex;align-items:center;gap:14px;padding:0 0 16px 0;margin:0 auto;max-width:1000px}
.insta__icon{width:56px;height:56px;border-radius:50%;flex:none}
.insta__icon.ph::after{font-size:9px}
.insta__name{font-weight:700;font-size:16px}
.insta__desc{font-size:12px;line-height:1.5}
.insta__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:1100px}
.insta__grid .ph{display:block;aspect-ratio:1/1;transition:opacity .3s}
.insta__grid .ph:hover{opacity:.8}
.insta__btns{display:flex;justify-content:center;gap:8px;margin-top:10px}
.insta__btns a{font-size:12px;line-height:30px;padding:0 12px;border-radius:3px;color:#fff;background:#333}
.insta__btns a.follow{background:#408bd1}

/* ---------- バナー ---------- */
.bnrArea{display:flex;justify-content:center;align-items:center;gap:20px;padding:120px 10px 80px}
.bnrArea a{display:block;transition:opacity .3s}
.bnrArea a:hover{opacity:.8}
.bnrArea__wide{width:750px;height:150px}
.bnrArea__sq{width:150px;height:150px}
.bnrArea .ph{width:100%;height:100%}

/* =========================================================
   フッター
   ========================================================= */
.footer{background:var(--pink-bg)}
.footer__inner{display:flex;padding:70px calc(var(--u)*140) 45px}
.footerInfo{width:329px;flex:none}
.footerInfo__logo{margin-bottom:30px}
.footerInfo__detail{font-size:13px;line-height:1.7}
.footerInfo__detail dt{font-weight:700}
.footerNav{display:flex;gap:calc(var(--u)*100);padding-left:calc(var(--u)*140)}
.footerNav__unitItem{font-size:14px;line-height:1.65;margin-bottom:15px}
.footerNav__unitItem ul{margin-top:15px}
.footerNav__unitItem li{font-size:13px;padding-left:8px;margin-bottom:15px}
.footerNav__unitItem li::before{content:"-";margin-right:7px}
.footerNav a:hover{color:var(--pink)}
.copyright{text-align:center;font-size:10px;padding:5px 0}

/* =========================================================
   公式キャラクター「秘書ベビー ふうちゃん」
   ※すべて絶対配置・固定サイズ。レイアウトは一切動かない
   ========================================================= */
.chara{position:absolute;z-index:4;width:var(--cs,120px);height:var(--cs,120px);object-fit:contain;pointer-events:none;user-select:none}
.headline__box .chara{--cs:110px;left:18px;bottom:48px}
.serviceBlock__cont{position:relative}
.serviceBlock .chara{--cs:150px;right:10px;bottom:-10px}
.message__cont{position:relative}
.message .chara{--cs:120px;left:-6px;bottom:-14px}
.secRecruit__box .chara{--cs:130px;right:28px;bottom:16px}
.footerInfo{position:relative}
.footer .chara{--cs:110px;left:210px;top:-28px}

/* =========================================================
   スマホ（767px以下）
   ========================================================= */
@media (max-width:1100px){
  .gnav ul{gap:22px}
  .gnav li a{font-size:13px}
  .gnav__btn{width:170px}
}
@media (max-width:900px){
  .header{height:66px;padding:0 16px}
  .logo,.logo__img{height:40px}
  .logo__img{width:200px}
  .logo__mark{width:34px;height:34px}
  .logo__text{font-size:20px}
  .gnav{position:fixed;inset:66px 0 auto 0;background:#fff;flex-direction:column;align-items:stretch;padding:20px 24px 30px;box-shadow:0 10px 20px rgba(0,0,0,.05);transform:translateY(-120%);transition:transform .3s;z-index:-1}
  .gnav.is-open{transform:none}
  .gnav ul{flex-direction:column;gap:0}
  .gnav li a{display:block;padding:14px 0;border-bottom:1px solid #f1e6e6;font-size:15px}
  .gnav__btn{margin:20px auto 0;width:100%}
  .menuBtn{display:block;margin-left:auto;width:36px;height:24px;position:relative;background:none;border:0;padding:0;cursor:pointer}
  .menuBtn span{position:absolute;left:0;width:100%;height:2px;background:#000;transition:.3s}
  .menuBtn span:nth-child(1){top:2px}.menuBtn span:nth-child(2){top:11px;width:80%;left:20%}.menuBtn span:nth-child(3){top:20px}
}
@media (max-width:767px){
  :root{--u:calc(100vw / 390)}
  /* MV */
  .mv{height:auto;background:var(--pink-mv);padding-bottom:20px}
  .mv__pink{display:none}
  .mv__pic{position:relative;left:auto;right:auto;top:auto;bottom:auto;height:125vw}
  .mv__catch{left:6vw;top:10vw;font-size:9.4vw}
  .mv__catch span+span{padding-left:14vw}
  .mv__scroll{display:none}
  .mv__news{position:relative;left:auto;right:auto;top:auto;height:auto;margin:20px 20px 0;border-radius:10px;flex-direction:column;align-items:flex-start;padding:14px 20px}
  .mv__news h2{border:0;padding:0 0 6px;font-weight:700;font-size:14px}
  .mv__news a{width:100%;padding:0;font-size:13px}
  /* 理念 */
  .headline{margin-top:0;height:auto;background:var(--pink-mv);padding:0 20px 0}
  .headline::before{display:none}
  .headline__img01{position:relative;left:auto;top:auto;width:100%;height:62vw}
  .headline__box{position:relative;left:auto;top:auto;width:100%;min-height:0;padding:40px 30px 50px}
  .headline__box::before,.headline__box::after{display:none}
  .headline__boxTitle{font-size:22px}
  .headline__boxText{font-size:14px;line-height:1.8}
  .headline__boxBtn{margin-top:36px}
  .headline__boxBtn .btn{width:100%;height:56px;border-radius:28px;font-size:16px}
  .headline__img02{position:relative;left:auto;right:auto;top:auto;height:24vw;margin:0 -20px}
  .headline__text{top:auto;bottom:-6vw;left:30vw;font-size:22vw}
  /* サービス */
  .secService{padding-top:30px}
  .secTitle__en02--service{left:6vw;top:-40px;font-size:34vw}
  .serviceBlock{flex-direction:column-reverse;padding:40px 30px 50px}
  .serviceBlock__pic{width:calc(100% - 34px);height:56vw;margin:0 0 70px 34px}
  .serviceBlock__cont{padding:0;width:100%}
  .serviceBlock__titleText{font-size:30px;text-align:center}
  .serviceBlock__text{font-size:14px;line-height:1.8}
  .serviceBlock .btn{width:100%;height:56px;font-size:16px}
  /* ABOUT */
  .secAbout{padding:90px 0 60px}
  .secAbout__box::before{width:calc(100% - 30px)}
  .secTitle__en02--about{left:calc(50% + 50px);font-size:28vw}
  .secAbout__boxTitle{padding-bottom:40px}
  .message{flex-direction:column;gap:50px;margin:0 15px;padding:40px 24px 40px 48px}
  .message__pic{width:100%;max-width:300px}
  .message__lead{font-size:20px;margin-bottom:20px}
  .message__text p{font-size:14px;line-height:1.9}
  /* BLOG */
  .secBlog{padding:60px 0}
  .blogList01{grid-template-columns:1fr;row-gap:40px;padding:0 30px}
  .blogList01__pic{height:56vw}
  /* キャラクター（スマホ） */
  .headline__box .chara{--cs:84px;left:auto;right:8px;top:8px;bottom:auto}
  .serviceBlock .chara{--cs:84px;right:-6px;top:-78px;bottom:auto}
  .message .chara{--cs:84px;left:auto;right:-10px;bottom:auto;top:-60px}
  .secRecruit__box .chara{--cs:80px;right:auto;left:-6px;bottom:auto;top:-78px}
  .footer .chara{--cs:84px;left:auto;right:-6px;top:-10px}
  /* 共通 */
  .btn{width:calc(100% - 60px);max-width:320px;height:56px;font-size:16px}
  /* RECRUIT */
  .secRecruit{padding:90px 15px 60px}
  .secRecruit__boxText{margin-top:30px;font-size:14px;line-height:1.85}
  .secRecruit__box{padding:0 20px 50px}
  /* INSTAGRAM */
  .insta{padding:0 15px}
  .insta__grid{grid-template-columns:repeat(2,1fr)}
  .bnrArea{flex-direction:column;padding:60px 20px}
  .bnrArea__wide{width:100%;height:20vw}
  .bnrArea__sq{width:120px;height:120px}
  /* フッター */
  .footer__inner{flex-direction:column;padding:50px 30px 30px}
  .footerNav{flex-wrap:wrap;gap:0 30px;padding:30px 0 0}
  .footerInfo{width:auto}
}

/* =========================================================
   下層ページ（採用情報 recruit.html）
   ※写真枠はすべて固定サイズ。写真を差し替えてもレイアウトは動かない
   ========================================================= */
.pageMv{position:relative;height:calc(var(--u)*440);margin-bottom:calc(var(--u)*120)}
.pageMv__pink{position:absolute;left:0;bottom:calc(var(--u)*-70);width:calc(var(--u)*640);height:calc(var(--u)*280);background:var(--pink-mv)}
.pageMv__pic{position:absolute;left:calc(var(--u)*360);right:0;top:0;bottom:0;z-index:1}
.pageMv__title{position:absolute;z-index:3;left:calc(var(--u)*120);top:calc(var(--u)*150);background:#fff;padding:34px 56px 30px;text-align:center}
.pageMv__title::before,.pageMv__title::after{content:"";position:absolute;width:60px;height:1px;background:var(--gold);transform:rotate(-45deg)}
.pageMv__title::before{left:-18px;top:12px}
.pageMv__title::after{right:-18px;bottom:12px}
.pageMv__en{display:block;font-family:var(--ff-en);font-size:45px;line-height:1.3;color:var(--pink);letter-spacing:.02em}
.pageMv__ja{display:block;font-family:var(--ff-head);font-weight:700;font-size:18px;letter-spacing:.1em;margin-top:6px}
.breadcrumb{position:absolute;z-index:3;left:calc(var(--u)*120);bottom:calc(var(--u)*-50);font-size:12px;color:#555}
.breadcrumb a{color:var(--pink)}
.recSec{position:relative;padding:90px 20px}
.recSec--pink{background:var(--pink-bg)}
.recSec__inner{max-width:1000px;margin:0 auto;position:relative}
.recSec .secTitle{margin-bottom:46px}
.recSec__sub{display:block;text-align:center;font-family:var(--ff-head);font-weight:700;font-size:21px;letter-spacing:.06em;color:#000;margin:-30px 0 40px}
.recLead{text-align:center;font-family:var(--ff-head);font-weight:700;font-size:28px;line-height:1.7;letter-spacing:.04em;font-feature-settings:"palt";margin-bottom:28px}
.recText{text-align:center;line-height:2.1}
.recFeature{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.recFeature__item{background:#fff;position:relative}
.recFeature__pic{position:relative;aspect-ratio:3/2}
.recFeature__pic .ph{position:absolute;inset:0}
.recFeature__cont{padding:24px 26px 30px}
.recFeature__num{font-family:var(--ff-en);color:var(--pink);font-size:22px}
.recFeature__title{font-family:var(--ff-head);font-weight:700;font-size:19px;line-height:1.6;margin:4px 0 10px;font-feature-settings:"palt"}
.recFeature__text{font-size:14px;line-height:1.9}
.recWant{display:grid;grid-template-columns:repeat(2,1fr);gap:16px 30px;max-width:860px;margin:0 auto}
.recWant li{position:relative;background:#fff;border:1px solid #f3dfe1;padding:18px 20px 18px 54px;line-height:1.7}
.recWant li::before{content:"";position:absolute;left:20px;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;background:var(--pink-box)}
.recWant li::after{content:"";position:absolute;left:25px;top:50%;width:8px;height:4px;margin-top:-4px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.recTable{max-width:1000px;margin:0 auto;border-top:1px solid #f1dfe1}
.recTable div{display:flex;border-bottom:1px solid #f1dfe1}
.recTable dt{flex:none;width:220px;background:var(--pink-bg);padding:20px 24px;font-weight:700;font-size:15px}
.recTable dd{flex:1;padding:20px 24px;line-height:1.9;font-size:15px}
.recFlow{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;counter-reset:step}
.recFlow li{position:relative;background:#fff;text-align:center;padding:30px 18px 26px}
.recFlow li:not(:last-child)::after{content:"";position:absolute;right:-19px;top:50%;width:12px;height:12px;margin-top:-6px;border-top:2px solid var(--pink);border-right:2px solid var(--pink);transform:rotate(45deg)}
.recFlow__step{display:block;font-family:var(--ff-en);color:var(--pink);font-size:15px;letter-spacing:.1em}
.recFlow__title{display:block;font-family:var(--ff-head);font-weight:700;font-size:18px;margin:6px 0 10px}
.recFlow__text{font-size:13.5px;line-height:1.8;text-align:left}
.recFaq{max-width:900px;margin:0 auto}
.recFaq__item{border-bottom:1px solid #f1dfe1;padding:22px 0}
.recFaq__q,.recFaq__a{position:relative;padding-left:44px;line-height:1.85}
.recFaq__q{font-weight:700;margin-bottom:8px}
.recFaq__q::before,.recFaq__a::before{position:absolute;left:0;top:-2px;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--ff-en);font-size:16px}
.recFaq__q::before{content:"Q";background:var(--pink);color:#fff}
.recFaq__a::before{content:"A";background:var(--pink-bg);color:var(--pink)}
.recEntry{position:relative;padding:120px 20px 110px}
.recEntry__bg{position:absolute;inset:0;z-index:0}
.recEntry__bg .ph{width:100%;height:100%}
.recEntry__box{position:relative;z-index:1;max-width:860px;margin:0 auto;background:#fff;text-align:center;padding:0 30px 64px}
.recEntry__box .secTitle{top:-36px;margin-bottom:-36px}
.recEntry__mail{display:inline-block;font-family:var(--ff-en);font-size:28px;letter-spacing:.04em;color:var(--pink);border-bottom:1px solid var(--pink);margin:10px 0 18px;word-break:break-all}
.recEntry__list{display:inline-block;text-align:left;background:var(--pink-bg);padding:18px 28px;font-size:14px;line-height:1.9;margin:6px 0 34px}
.recEntry__note{font-size:12px;color:#666;margin-top:18px}
.recFeature .chara,.recSec .chara{--cs:120px}
.recSec--msg .chara{right:0;bottom:-60px}
.recSec--flow .chara{right:-10px;top:-120px}
.recSec--faq .chara{left:-20px;top:-110px}
.recEntry__box .chara{--cs:120px;right:24px;bottom:20px}

@media (max-width:767px){
  .pageMv{height:auto;margin-bottom:40px;padding-bottom:30px;background:var(--pink-mv)}
  .pageMv__pink{display:none}
  .pageMv__pic{position:relative;left:auto;right:auto;top:auto;bottom:auto;height:62vw}
  .pageMv__title{position:relative;left:auto;top:auto;margin:-40px 20px 0;padding:24px 20px}
  .pageMv__title::before,.pageMv__title::after{display:none}
  .pageMv__en{font-size:34px}
  .breadcrumb{position:relative;left:auto;bottom:auto;margin:14px 20px 0}
  .recSec{padding:60px 20px}
  .recLead{font-size:21px;text-align:left}
  .recText{text-align:left;font-size:14.5px;line-height:1.95}
  .recFeature{grid-template-columns:1fr;gap:24px}
  .recWant{grid-template-columns:1fr;gap:12px}
  .recTable div{flex-direction:column}
  .recTable dt{width:auto;padding:12px 16px}
  .recTable dd{padding:14px 16px}
  .recFlow{grid-template-columns:1fr;gap:26px}
  .recFlow li:not(:last-child)::after{right:50%;top:auto;bottom:-20px;margin:0 -6px 0 0;transform:rotate(135deg)}
  .recEntry{padding:90px 15px 60px}
  .recEntry__mail{font-size:20px}
  .recEntry__list{padding:16px 18px}
  .recFeature .chara,.recSec .chara,.recEntry__box .chara{--cs:80px}
  .recSec--msg .chara{right:-6px;bottom:auto;top:-70px}
  .recSec--flow .chara{right:-6px;top:-78px}
  .recSec--faq .chara{left:auto;right:-6px;top:-78px}
  .recEntry__box .chara{right:auto;left:-6px;bottom:auto;top:-78px}
}
.recJobs{padding-top:90px}
.recJobs .serviceBlock__titleText{font-size:calc(var(--u)*44)}
@media (max-width:767px){.recJobs{padding-top:60px}.recJobs .serviceBlock__titleText{font-size:24px}}
.pageMv__pic .ph{width:100%;height:100%}
.recFlow{list-style:none;margin:0;padding:0}
.recJobs .serviceBlock .chara{bottom:-40px}
@media (max-width:767px){
  .secTitle__en01{font-size:min(45px,9.6vw)}
  .recSec--msg .chara{top:auto;bottom:-56px}
}
.recEntry__box .btn{width:340px}
.footer .chara{left:290px;top:-34px}
@media (max-width:767px){.recEntry__box .btn{width:calc(100% - 20px);max-width:320px}.footer .chara{left:auto;right:-6px;top:-10px}}

/* タブレット幅（768〜1199px）：本文の横にキャラを置く余白がない所は表示しない */
@media (min-width:768px) and (max-width:1199px){
  .headline__box .chara,.serviceBlock .chara{display:none}
}
/* スマホ：ボタン文字と矢印の間をあける */
@media (max-width:767px){.btn{padding-right:34px}.btn::after{right:22px;width:24px}}

/* =========================================================
   下層ページ共通（会社概要・お問い合わせ・プライバシーポリシー・特商法表記）
   ========================================================= */
.pageMv--simple{height:calc(var(--u)*300)}
.pageMv--simple .pageMv__pink{bottom:auto;top:0;width:100%;height:calc(var(--u)*220);background:var(--pink-bg)}
.pageMv--simple .pageMv__title{top:calc(var(--u)*90)}
.pageMv--simple .breadcrumb{bottom:calc(var(--u)*20)}
.pageMv--simple .chara{--cs:150px;right:calc(var(--u)*150);top:calc(var(--u)*40)}
.philo{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:10px}
.philo__item{background:#fff;padding:34px 30px 32px;text-align:center}
.philo__en{display:block;font-family:var(--ff-en);color:var(--pink);font-size:15px;letter-spacing:.12em}
.philo__title{font-family:var(--ff-head);font-weight:700;font-size:20px;margin:8px 0 12px}
.philo__text{font-size:14px;line-height:1.95;text-align:left}
.contactCards{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
.contactCard{position:relative;background:#fff;border:1px solid #f3dfe1;padding:40px 34px 38px;text-align:center}
.contactCard__title{font-family:var(--ff-head);font-weight:700;font-size:20px;margin-bottom:12px}
.contactCard__text{font-size:14.5px;line-height:1.95;margin-bottom:26px;text-align:left}
.contactCard .btn{width:100%;max-width:300px}
.legal{max-width:860px;margin:0 auto}
.legal__intro{line-height:2;margin-bottom:40px}
.legal h2{position:relative;font-family:var(--ff-head);font-weight:700;font-size:19px;line-height:1.6;padding:0 0 10px 18px;margin:44px 0 16px;border-bottom:1px solid #f1dfe1}
.legal h2::before{content:"";position:absolute;left:0;top:6px;width:4px;height:20px;border-radius:2px;background:var(--pink)}
.legal p,.legal li{font-size:15px;line-height:2}
.legal ol,.legal ul{padding-left:1.5em;margin:6px 0}
.legal ol{list-style:decimal}.legal ul{list-style:disc}
.legal__date{text-align:right;margin-top:50px;font-size:14px;line-height:1.9}
.legal__box{background:var(--pink-bg);padding:22px 26px;margin-top:12px}
.recTable a,.legal a,.contactCard a:not(.btn){color:var(--pink);text-decoration:underline;word-break:break-all}

@media (max-width:767px){
  .pageMv--simple{height:auto;background:var(--pink-bg);padding:40px 0 26px;margin-bottom:30px}
  .pageMv--simple .pageMv__pink{display:none}
  .pageMv--simple .pageMv__title{margin:0 20px}
  .pageMv--simple .chara{--cs:84px;right:14px;top:auto;bottom:40px}
  .pageMv--simple .pageMv__title{padding-right:90px;text-align:left}
  .philo{grid-template-columns:1fr;gap:16px}
  .philo__item{padding:28px 22px}
  .contactCards{grid-template-columns:1fr;gap:20px}
  .contactCard{padding:30px 22px}
  .legal__intro{margin-bottom:26px}
  .legal h2{font-size:17px;margin:34px 0 12px}
  .legal p,.legal li{font-size:14.5px;line-height:1.95}
  .legal__box{padding:18px 18px}
}
.recSec--outline .chara{right:10px;top:-40px}
@media (max-width:767px){.recSec--outline .chara{right:-6px;top:-78px}}
@media (max-width:767px){.headline__box .chara{top:-74px;right:4px}}

/* ---- 画面幅ごとの最終調整（PCの見た目は変えない） ---- */
@media (max-width:1100px){
  .blogList01{grid-template-columns:repeat(3,minmax(0,300px));column-gap:30px;padding:0 30px}
  .blogList01__pic{height:auto;aspect-ratio:300/196}
}
@media (max-width:1199px){
  .recSec--msg .chara{right:-10px;bottom:-96px}
}
@media (max-width:767px){
  .blogList01{grid-template-columns:1fr}
  .blogList01__pic{aspect-ratio:auto;height:56vw}
  .message .chara{top:-100px}
  .recSec--msg .chara{bottom:-74px}
  .pageMv--simple .chara{top:44px;bottom:auto;right:24px}
}
@media (max-width:400px){
  .footer .chara{display:none}
}
/* ロゴ（ヘッダー：横並び／フッター：縦積み） */
.footerInfo__logo .logo{height:auto}
.footerInfo__logo .logo__img{width:220px;height:120px;object-position:left center}
@media (max-width:767px){.footerInfo__logo .logo__img{width:180px;height:98px}}

/* =========================================================
   スマホ表示（参考サイトのスマホ版の実測値に合わせた最終指定）
   ※ここより上のスマホ指定を上書きします
   ========================================================= */
@media (max-width:767px){
  :root{--d:calc(100vw / 1425)}
  body{font-size:13px;line-height:1.625}
  /* ヘッダー・メニュー */
  .header{height:56px;padding:0 20px}
  .logo,.logo__img{height:40px}
  .logo__img{width:210px}
  .menuBtn{width:30px;height:30px}
  .menuBtn span{height:2px;left:0;width:30px}
  .menuBtn span:nth-child(1){top:4px}
  .menuBtn span:nth-child(2){top:11px;left:0;width:30px}
  .menuBtn span:nth-child(3){top:18px;left:15px;width:15px}
  .menuBtn.is-open span:nth-child(1){top:11px;transform:rotate(45deg)}
  .menuBtn.is-open span:nth-child(2){opacity:0}
  .menuBtn.is-open span:nth-child(3){top:11px;left:0;width:30px;transform:rotate(-45deg)}
  .gnav{position:fixed;inset:56px 0 0 0;background:var(--pink-bg);padding:0 0 40px;box-shadow:none;overflow-y:auto;transform:translateY(-110%);transition:transform .3s}
  .gnav.is-open{transform:none}
  .gnav ul{display:block}
  .gnav li a{display:block;text-align:center;padding:0;line-height:68px;font-size:14px;letter-spacing:.08em;border-bottom:1px solid #e9cdd2}
  .gnav__btn{display:flex;width:calc(100% - 40px);height:60px;border-radius:30px;margin:24px auto 0;font-size:15px}

  /* メインビジュアル：PCの構図をそのまま縮小し、下にピンクの帯とNEWS */
  .mv{height:calc(var(--d)*657 + 214px);background:none;padding:0;margin-bottom:0}
  .mv__pink{display:block;left:0;top:calc(var(--d)*468);width:100%;height:calc(var(--d)*189 + 214px)}
  .mv__pic{position:absolute;left:calc(var(--d)*171);right:0;top:0;bottom:auto;height:calc(var(--d)*657)}
  .mv__catch{left:calc(var(--d)*126);top:calc(var(--d)*255);font-size:calc(var(--d)*84)}
  .mv__catch span+span{padding-left:calc(var(--d)*160)}
  .mv__scroll{display:block;left:20px;top:calc(var(--d)*510);height:200px}
  .mv__scroll p{font-size:10px}
  .mv__news{position:absolute;left:10px;right:10px;top:calc(var(--d)*657 + 115px);height:auto;margin:0;border-radius:10px;flex-direction:column;align-items:stretch;padding:20px}
  .mv__news h2{border:0;padding:0 0 5px;font-size:13px;font-weight:500}
  .mv__news a{padding:0;font-size:13px}

  /* 理念 */
  .headline{margin-top:0;height:auto;background:var(--pink-mv);padding:0 10px}
  .headline__img01{height:calc((100vw - 20px) * 0.662)}
  .headline__box{padding:40px 30px 50px}
  .headline__boxTitle{font-size:24px;font-weight:700;line-height:1.2;margin-bottom:30px;white-space:normal}
  .headline__boxText{font-size:13px;line-height:1.625}
  .headline__boxBtn{margin-top:30px}
  .headline__boxBtn .btn{width:100%;height:60px;border-radius:30px;font-size:16px}
  .headline__img02{height:28.8vw;margin:-22px -10px 0}
  .headline__text{font-size:36vw;bottom:-14vw;left:16vw}

  /* 共通の見出し・ボタン */
  .secTitle__en01{font-size:30px;line-height:49px}
  .secTitle::before{top:48px}
  .btn{width:100%;max-width:295px;height:60px;border-radius:30px;font-size:16px}

  /* サービス */
  .secService{padding-top:90px}
  .secTitle__en02--service{left:3vw;top:-110px;font-size:36.5vw}
  .serviceBlock{flex-direction:column-reverse;align-items:center;padding:0 40px 40px;border-bottom:0;border-top:10px solid var(--pink-bg)}
  .serviceBlock:first-of-type{border-top:0}
  .secTitle + .serviceBlock{border-top:0;margin-top:40px}
  .serviceBlock + .serviceBlock{padding-top:40px}
  .serviceBlock__pic{width:66vw;height:47.8vw;margin:0 0 51px 0}
  .serviceBlock__pic::before{top:9px;left:-9px;right:9px;bottom:-9px}
  .serviceBlock__cont{width:100%;padding:0}
  .serviceBlock__titleNum{font-size:16px}
  .serviceBlock__titleText{font-size:26px;line-height:1.6;text-align:center}
  .serviceBlock__text{font-size:13px;line-height:1.625;margin:10px 0 30px}

  /* ABOUT・代表あいさつ */
  .secAbout{padding:50px 0 40px}
  .secAbout__box::before{width:84vw;height:calc(100% + 120px)}
  .secTitle--about{top:-20px}
  .secTitle__en02--about{left:calc(50% + 40px);top:-40px;font-size:36.5vw}
  .message{margin:0 10px;padding:40px 30px 40px 40px;gap:46px}
  .message__lead{font-size:20px}
  .message__text p{font-size:13px;line-height:1.75}
  .secAbout__btn{margin-top:40px;padding:0 40px}

  /* ブログ：左にサムネイル、右に文字の一覧 */
  .secBlog{padding:30px 0}
  .blogList01{grid-template-columns:1fr;row-gap:0;padding:0 10px;margin-top:40px}
  .blogList01__item{display:flex;align-items:flex-start;padding:15px}
  .blogList01__pic{flex:none;width:32.8vw;height:21.3vw;aspect-ratio:auto}
  .blogList01__cont{flex:1;min-width:0;padding:10px 0 0 15px}
  .blogList01__contMeta .date{font-size:12px}
  .blogList01__contMeta .cate{font-size:10px;padding-left:20px}
  .blogList01__contText{font-size:13px;line-height:1.625;padding-top:5px;margin:0}
  .blogList01__contTag{margin-top:6px}
  .blogList01__contTag span{font-size:10px;line-height:20px}
  .secBlog__btn{margin-top:40px;padding:0 40px}

  /* 採用 */
  .secRecruit{padding:50px 20px 20px}
  .secRecruit__box{padding:0 20px 40px}
  .secRecruit__boxText{text-align:left;font-size:13px;line-height:1.625;margin-top:40px}
  .secRecruit__btn{margin-top:40px}

  /* バナー */
  .bnrArea{flex-direction:column;gap:10px;padding:60px 20px}
  .bnrArea__wide{width:100%;height:calc((100vw - 40px) * 0.2)}
  .bnrArea__sq{width:156px;height:128px;align-self:flex-start}

  /* フッター：ロゴ中央、項目は線で区切ったリスト（サブ項目は開閉） */
  .footer__inner{flex-direction:column;padding:50px 0 0}
  .footerInfo{width:auto;text-align:center}
  .footerInfo__logo{display:flex;justify-content:center;margin-bottom:30px}
  .footerInfo__logo .logo__img{object-position:center center}
  .footerInfo__detail{display:inline-block;text-align:left;font-size:13px;line-height:1.7;padding:0 20px}
  .footerNav{display:block;padding:0;margin-top:50px;border-top:1px solid #e0bdc3}
  .footerNav__unit{display:block}
  .footerNav__unitItem{position:relative;margin:0;font-size:14px;font-weight:700;text-align:center;border-bottom:1px solid #e0bdc3}
  .footerNav__unitItem > a{display:block;line-height:68px;letter-spacing:.06em}
  .footerNav__unitItem ul{display:none;margin:0;background:#fff7f8}
  .footerNav__unitItem.is-open ul{display:block}
  .footerNav__unitItem li{padding:0;margin:0;font-weight:400;font-size:13px;border-top:1px solid #f1dfe1}
  .footerNav__unitItem li::before{display:none}
  .footerNav__unitItem li a{display:block;line-height:52px}
  .footerNav__toggle{position:absolute;right:0;top:0;width:60px;height:68px;border:0;border-left:1px solid #e0bdc3;background:none;cursor:pointer}
  .footerNav__toggle::before{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-7px 0 0 -5px;border-right:2px solid #000;border-bottom:2px solid #000;transform:rotate(45deg);transition:transform .2s}
  .footerNav__unitItem.is-open .footerNav__toggle::before{margin-top:-2px;transform:rotate(-135deg)}
  .footer .chara{display:none}
  .copyright{padding:20px 0}
}
@media (min-width:768px){.footerNav__toggle{display:none}}
@media (max-width:767px){
  .headline__boxText br,.serviceBlock__text br,.recText br,.message__lead br{display:none}
  .recText{text-align:left}
}
@media (max-width:767px){
  .mv{height:calc(var(--d)*657 + 212px)}
  .mv__pink{height:calc(var(--d)*189 + 212px)}
  .headline__boxBtn{margin-top:40px}
  .headline__img02{margin-top:-30px}
}
@media (max-width:767px){
  .mv__news h2{line-height:21px;padding:0;margin:0 0 5px}
  .mv__news a,.mv__news dl,.mv__news dt,.mv__news dd{line-height:13px}
  .menuBtn{transform:translateY(3px)}
  .secTitle{padding-bottom:0}
  .serviceBlock .btn,.secAbout__btn .btn,.secBlog__btn .btn,.secRecruit__btn .btn,.headline__boxBtn .btn{width:100%;max-width:295px;height:60px;font-size:16px}
}
/* バナーの文字（写真の上に重ねる） */
.bnrArea a{position:relative;overflow:hidden}
.bnrArea__txt{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:rgba(255,255,255,.42);font-family:var(--ff-head);font-weight:700;font-size:16px;letter-spacing:.06em;color:#5b4a50;text-align:center;line-height:1.5}
.bnrArea__txt b{font-family:var(--ff-en);font-weight:500;font-size:30px;letter-spacing:.06em;color:var(--pink)}
.bnrArea__sq .bnrArea__txt{font-size:13px}
.bnrArea__sq .bnrArea__txt b{font-size:22px}
@media (max-width:767px){.bnrArea__txt{font-size:12px}.bnrArea__txt b{font-size:20px}.bnrArea__sq .bnrArea__txt b{font-size:18px}.bnrArea__sq .bnrArea__txt{font-size:11px}}

/* =========================================================
   トップページを参考サイトに合わせる最終調整（2026-10-20 目視比較）
   ========================================================= */
/* ABOUT：ピンクの箱の中に中央揃えの文章、その下に画面幅いっぱいの白い列 */
.secAbout__boxText{position:relative;z-index:1;text-align:center;font-size:16px;line-height:1.625;padding:4px 20px 80px}
.message{max-width:none;margin:0 10px;justify-content:center;gap:calc(var(--u)*70);padding:calc(var(--u)*60) calc(var(--u)*80)}
.message__cont{max-width:640px}
@media (max-width:767px){
  /* スマホ：箱の中の文章は左揃え13px（参考サイトと同じ） */
  .secAbout__boxText{text-align:left;font-size:13px;padding:0 30px 40px}
  .message{margin:0 10px;padding:40px 30px}
  /* 筆記体の飾り文字：参考サイトと同じく小さめで、見出しに尾が重なる位置 */
  .secTitle__en02--service{font-size:27vw;left:4vw;top:-72px}
  .secTitle__en02--about{font-size:24vw;left:calc(50% + 28px);top:-22px}
  /* ブログ一覧：行の間の細い区切り線 */
  .blogList01{border-top:1px solid #f6d9dc}
  .blogList01__item{border-bottom:1px solid #f6d9dc}
  /* 採用：スマホでは小見出しを出さない（参考サイトと同じ） */
  .secRecruit__boxTitle{display:none}
  /* ヘッダーのロゴ：参考サイトと同じくらいの大きさ */
  .header .logo__img{width:180px;height:36px}
}
/* ABOUT：参考サイトのメンバーカードと同じ作り（左：写真＋役職・名前のカード／右：あいさつ文のカード） */
.message{display:grid;grid-template-columns:calc((100% - 120px) / 4) 1fr;grid-template-areas:"pic lead" "pic body";column-gap:40px;row-gap:0;margin:0 10px;padding:0;background:none;max-width:none;align-items:start}
.message__pic{grid-area:pic;width:auto;aspect-ratio:auto;background:#fff;position:relative}
.message__pic::before{display:none}
.message__photo{position:relative;aspect-ratio:1/1}
.message__photo .ph{position:absolute;inset:0}
.message__name{text-align:center;padding:20px 0 30px}
.message__namePos{font-size:13px;line-height:1.6}
.message__nameText{font-size:16px;font-weight:500;line-height:1.6}
.message__lead{grid-area:lead;align-self:stretch;background:#fff;margin:0;padding:50px 60px 0}
.message__cont{grid-area:body;max-width:none;background:#fff;padding:24px 60px 50px}
.message__text{max-width:760px}
@media (max-width:767px){
  .message{grid-template-columns:1fr 1fr;grid-template-areas:"pic lead" "body body";column-gap:10px;row-gap:10px;margin:0 10px;padding:0}
  .message__pic{width:auto;max-width:none}
  .message__name{padding:10px}
  .message__namePos{font-size:12px}
  .message__lead{display:flex;align-items:center;padding:20px 16px;font-size:16px;line-height:1.7}
  .message__lead br{display:inline}
  .message__cont{padding:30px}
  .message__text p{font-size:13px;line-height:1.75}
}
/* 筆記体の飾り文字：参考サイトに近い、細く縦長の書体に変更 */
:root{--ff-script:"Mrs Saint Delafield","Corinthia",cursive}
.secTitle__en02{line-height:1}
.secTitle__en02--service{font-size:calc(var(--u)*230);left:calc(50% - var(--u)*200);top:calc(var(--u)*-150)}
.secTitle__en02--about{font-size:calc(var(--u)*170);left:calc(50% + 60px);top:-30px}
.headline__text{font-size:calc(var(--u)*170)}
@media (max-width:767px){
  .secTitle__en02--service{font-size:34vw;left:4vw;top:-62px}
  .secTitle__en02--about{font-size:26vw;left:calc(50% + 30px);top:-26px}
  .headline__text{font-size:36vw}
  .secAbout__boxText{padding:0 calc(8vw + 30px) 40px}
  .message__lead{font-size:15px;padding:18px 14px}
}
.sp-only{display:none}
@media (max-width:767px){
  .message__lead br.sp-only{display:inline}
  .secAbout__boxText br{display:none}
}
@media (max-width:767px){.recJobs .serviceBlock__titleText{font-size:21px}}
/* 見出しの最後の1文字だけが次の行に落ちないための調整 */
@media (min-width:768px) and (max-width:1199px){
  .serviceBlock__titleText{font-size:calc(var(--u)*44)}
  .recJobs .serviceBlock__titleText{font-size:calc(var(--u)*37)}
}
@media (max-width:767px){
  .recFeature__title{font-size:17px}
  .recLead br.sp-only{display:inline}
  .pageMv__ja{font-size:16px}
}
/* 幅340px以下（いちばん小さいスマホ） */
@media (max-width:340px){
  .headline__boxTitle{font-size:21px}
  .serviceBlock__titleText{font-size:21px}
  .recJobs .serviceBlock__titleText{font-size:18px}
  .pageMv--simple .chara{display:none}
  .pageMv--simple .pageMv__title{padding-right:20px}
  .pageMv__en{font-size:28px}
  .pageMv__ja{font-size:14px}
}

/* =========================================================
   スマホのメインビジュアル：参考サイトの実際のスマホ表示（幅375pxで実測）に合わせる
   ・写真は縦長で右下寄せ（左17.3%・上45.6%から右端・下端まで）
   ・写真の上の白い余白に手書きのキャッチ
   ・ピンクは画面幅の107%の位置から下へ、NEWSカードはその上
   ========================================================= */
@media (max-width:767px){
  .mv{height:calc(100vw * 1117 / 750 + 212px);background:none;padding:0;margin:0}
  .mv__pic{position:absolute;left:calc(100vw * 130 / 750);right:0;top:calc(100vw * 342 / 750);bottom:auto;height:calc(100vw * 775 / 750)}
  .mv__pic img{object-position:64% 50%}
  .mv__pink{display:block;left:0;width:100%;top:calc(100vw * 1.072);height:auto;bottom:0}
  .mv__catch{left:8.5vw;top:12vw;font-size:9.4vw;line-height:1.55;transform:rotate(-3deg);text-shadow:none}
  .mv__catch span+span{padding-left:20vw}
  .mv__scroll{display:block;left:20px;top:calc(100vw * 1.163);height:200px}
  .mv__news{position:absolute;left:10px;right:10px;top:calc(100vw * 1117 / 750 + 115px);margin:0}
}
@media (max-width:767px){
  .mv__catch{top:14vw;line-height:1.6}
  /* フッター：参考サイトと同じく、ロゴは小さめで中央、会社情報は左揃え */
  .footerInfo__logo .logo__img{width:150px;height:82px}
  .footerInfo__detail{display:block;text-align:left;padding:0 23px}
}

/* 代表あいさつ：社長の写真を大きく（PCは縦長の大きな写真、スマホは画面幅いっぱい） */
.message{grid-template-columns:calc(var(--u)*460) 1fr}
.message__photo{aspect-ratio:4/5}
.message__name{padding:22px 0 26px}
.message__namePos{font-size:14px}
.message__nameText{font-family:var(--ff-head);font-weight:700;font-size:22px;letter-spacing:.12em}
@media (min-width:768px) and (max-width:1100px){.message{grid-template-columns:38% 1fr}}
@media (max-width:767px){
  .message{grid-template-columns:1fr;grid-template-areas:"pic" "lead" "body";row-gap:10px}
  .message__photo{aspect-ratio:4/5}
  .message__name{padding:16px 0 20px}
  .message__nameText{font-size:20px}
  .message__lead{display:block;padding:28px 30px 0;font-size:19px;line-height:1.7;margin-bottom:-10px}
  .message__lead br.sp-only{display:none}
  .message__cont{padding:20px 30px 40px}
}

/* トップページの会社概要（ブログの代わり） */
.secCompany{padding:90px 20px 100px}
.secCompany .recSec__sub{margin:-30px 0 40px}
.secCompany .secTitle{margin-bottom:46px}
.secCompany__btn{text-align:center;margin-top:50px}
@media (max-width:767px){
  .secCompany{padding:60px 20px 60px}
  .secCompany .secTitle{margin-bottom:40px}
  .secCompany__btn{margin-top:40px;padding:0 20px}
}

/* 公式キャラクターの紹介欄 */
.secChara{background:var(--pink-bg);padding:70px 20px}
.secChara__inner{max-width:900px;margin:0 auto;display:flex;align-items:center;gap:50px;background:#fff;padding:40px 60px;position:relative}
.secChara__inner::before,.secChara__inner::after{content:"";position:absolute;width:60px;height:1px;background:var(--gold);transform:rotate(-45deg)}
.secChara__inner::before{left:-18px;top:12px}
.secChara__inner::after{right:-18px;bottom:12px}
.secChara__pic{flex:none;width:220px;height:220px}
.secChara__pic img{width:100%;height:100%;object-fit:contain}
.secChara__en{font-family:var(--ff-en);color:var(--pink);font-size:16px;letter-spacing:.12em}
.secChara__name{font-family:var(--ff-head);font-weight:700;font-size:26px;letter-spacing:.06em;margin:6px 0 14px}
.secChara__text{font-size:15px;line-height:2}
@media (max-width:767px){
  .secChara{padding:50px 10px}
  .secChara__inner{flex-direction:column;gap:10px;padding:30px 30px 36px;text-align:center}
  .secChara__inner::before,.secChara__inner::after{display:none}
  .secChara__pic{width:170px;height:170px}
  .secChara__name{font-size:22px}
  .secChara__text{font-size:13px;line-height:1.85;text-align:left}
  /* スマホのフッターにもキャラを表示（ロゴの右） */
  .footer .chara{display:block;--cs:72px;left:auto;right:20px;top:-6px}
}
@media (max-width:400px){.footer .chara{display:block;--cs:60px;right:10px}}
@media (min-width:768px){.headline__box .chara{--cs:100px;left:auto;right:20px;top:20px;bottom:auto}}
@media (min-width:768px) and (max-width:1349px){.serviceBlock .chara{display:none}}
/* 下層ページ見出し（スマホ）：PC用の位置ずらしを解除して重なりを防ぐ */
@media (max-width:767px){
  .pageMv--simple .pageMv__title{top:auto;bottom:auto}
  .pageMv--simple .breadcrumb{top:auto;bottom:auto}
  .pageMv--simple .pageMv__en{font-size:26px;line-height:1.35}
  .pageMv--simple .chara{top:50%;bottom:auto;transform:translateY(-62%)}
}
@media (max-width:767px){.pageMv--simple .pageMv__en{white-space:nowrap;font-size:min(26px,6.4vw)}}

/* トップページの「ご依頼の流れ」（会社概要欄の代わり） */
.secFlow{padding:90px 20px 100px}
.secFlow .recFlow li{background:var(--pink-bg)}
.secFlow__btn{text-align:center;margin-top:50px}
.secFlow .chara{--cs:120px;position:absolute;right:-10px;top:-20px}
@media (max-width:767px){
  .secFlow{padding:60px 20px}
  .secFlow__btn{margin-top:40px}
  .secFlow .chara{--cs:80px;right:-6px;top:-20px}
}

/* Instagram：埋め込みが使えない環境で出すリンクカード */
.insta__card{display:flex;flex-direction:column;align-items:center;gap:10px;max-width:1000px;margin:0 auto;padding:56px 20px;border:1px solid #efe4e5;border-radius:4px;background:var(--pink-bg);text-align:center;transition:opacity .3s}
.insta__card[hidden]{display:none}
.insta__card:hover{opacity:.85}
.insta__cardIcon{width:64px;height:64px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:linear-gradient(45deg,#f9a24b,#e8457a 50%,#a24bd8)}
.insta__cardIcon svg{width:36px;height:36px}
.insta__cardName{font-weight:700;font-size:18px}
.insta__cardText{font-size:14px;color:#5b4a50}
.insta__cardBtn{margin-top:8px;display:inline-block;background:#408bd1;color:#fff;font-size:14px;line-height:40px;padding:0 24px;border-radius:20px}

/* ご依頼の流れ：タブレット幅は2列（矢印は非表示） */
@media (min-width:768px) and (max-width:1100px){
  .recFlow{grid-template-columns:repeat(2,1fr)}
  .recFlow li:not(:last-child)::after{display:none}
}

/* 見出しの改行を整える（1文字だけ次の行に落ちないように） */
.serviceBlock__titleText,.message__lead,.recFeature__title,.secChara__name,.legal h2,.pageMv__ja,.recLead,.headline__boxTitle,.recFlow__title{text-wrap:balance}
.serviceBlock__titleText{font-size:calc(var(--u)*48)}
@media (max-width:767px){
  .serviceBlock__titleText{font-size:min(26px,6.4vw)}
  .recJobs .serviceBlock__titleText{font-size:min(21px,5.2vw)}
  .pageMv--simple .pageMv__ja{font-size:min(16px,3.8vw);white-space:nowrap}
  .secChara__name{font-size:min(22px,5.8vw)}
}
@media (min-width:768px) and (max-width:1199px){.serviceBlock__titleText{font-size:calc(var(--u)*44)}}
@media (max-width:767px){.message__lead{font-size:min(19px,5.4vw)}}

/* フッターのリンク：PC・タブレットで項目名が途中で折れないように */
@media (min-width:768px){
  .footerNav__unitItem,.footerNav__unitItem li{white-space:nowrap}
  .footerNav{gap:calc(var(--u)*70);padding-left:calc(var(--u)*90)}
  .footer .chara{left:250px;top:-40px;--cs:96px}
}
@media (min-width:768px) and (max-width:1199px){
  .footer__inner{flex-wrap:wrap;row-gap:40px}
  .footerNav{padding-left:0;width:100%;gap:60px}
}

/* WordPressにログイン中は上に管理バーが出るので、ヘッダーをその下にずらす */
.admin-bar .header{top:32px}
@media (max-width:782px){.admin-bar .header{top:46px}}
@media (max-width:600px){.admin-bar .header{top:0}}

/* =========================================================
   サービス詳細ページ
   ========================================================= */
.recTable--white{background:#fff}
.recTable--white dt{background:#fdf6f6}
.recNote{max-width:1000px;margin:18px auto 0;font-size:13px;line-height:1.85;color:#666}
.recNote a{color:var(--pink);text-decoration:underline}
@media (min-width:768px){.recFeature--2{grid-template-columns:repeat(2,1fr);max-width:760px;margin:0 auto}}
a.recFeature__item{display:block;transition:opacity .3s;border:1px solid #f3dfe1}
a.recFeature__item:hover{opacity:.8}
.recFeature__more{position:relative;display:inline-block;margin-top:6px;padding-right:44px;font-family:var(--ff-head);font-weight:700;font-size:14px;color:var(--pink)}
.recFeature__more::after{content:"";position:absolute;right:0;top:50%;width:32px;height:7px;margin-top:-5px;border-bottom:1px solid var(--pink);border-right:1px solid var(--pink);transform:skewX(45deg);transform-origin:right bottom}
.recEntry__box .btn{margin-top:6px}
@media (max-width:767px){.recNote{font-size:12.5px}}
/* 見出しの改行を整える（サービスページほか） */
.recSec__sub,.recLead,.recFeature__title,.recFlow__title,.recFaq__q{text-wrap:balance}
@media (max-width:767px){
  .pageMv:not(.pageMv--simple) .pageMv__en{white-space:nowrap;font-size:min(34px,7.6vw)}
  .pageMv:not(.pageMv--simple) .pageMv__title{padding:24px 16px}
}
@media (min-width:768px){
  .recSec--msg{padding-bottom:150px}
  .recSec--msg .chara{right:0;top:auto;bottom:-120px}
}
@media (max-width:767px){.recSec__sub br.sp-only{display:inline}}


/* =========================================================
   WordPress：既存のプライバシーポリシー・特商法表記の本文を新デザインに合わせる
   ========================================================= */
.mfwLegal table{width:100%!important;border-collapse:collapse!important;border-top:1px solid #f1dfe1!important;margin:0 0 30px!important;font-size:15px!important;line-height:1.9!important;color:#000!important}
.mfwLegal th,.mfwLegal td{display:table-cell!important;border:0!important;border-bottom:1px solid #f1dfe1!important;padding:20px 24px!important;text-align:left!important;vertical-align:top!important;overflow-wrap:anywhere}
.mfwLegal th{background:var(--pink-bg)!important;color:#000!important;width:220px!important;font-weight:700!important;white-space:normal!important}
.mfwLegal h2,.mfwLegal h3{position:relative;font-family:var(--ff-head);font-weight:700;font-size:19px;line-height:1.6;padding:0 0 10px 18px;margin:44px 0 16px;border-bottom:1px solid #f1dfe1;color:#000}
.mfwLegal h2::before,.mfwLegal h3::before{content:"";position:absolute;left:0;top:6px;width:4px;height:20px;border-radius:2px;background:var(--pink)}
.mfwLegal p,.mfwLegal li{font-size:15px;line-height:2;color:#000}
.mfwLegal ul,.mfwLegal ol{padding-left:1.5em;margin:6px 0 16px}
.mfwLegal ul{list-style:disc}.mfwLegal ol{list-style:decimal}
.mfwLegal a{color:var(--pink);text-decoration:underline}
.mfwLegal [class*="note"]{font-size:13px!important;color:#555!important}
@media (max-width:767px){
  .mfwLegal table,.mfwLegal tbody,.mfwLegal tr{display:block!important;width:100%!important}
  .mfwLegal th,.mfwLegal td{display:block!important;width:auto!important}
  .mfwLegal th{padding:12px 16px!important}
  .mfwLegal td{padding:14px 16px!important}
  .mfwLegal h2,.mfwLegal h3{font-size:17px;margin:34px 0 12px}
  .mfwLegal p,.mfwLegal li,.mfwLegal table{font-size:14.5px!important;line-height:1.95!important}
}
