/* J PLANNING — 共通CSS（全ページ共通のリセット・ナビゲーション・ボタン・アニメーション） */

/* ---------- ベースリセット ---------- */
*{box-sizing:border-box;}
html{scroll-behavior:smooth; overflow-x:hidden;}
body{max-width:100%;overflow-x:hidden;}
body{margin:0;background:#F7F7F4;color:#1C1F26;font-family:'Noto Sans JP',sans-serif;line-height:1.9;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
input,textarea,select{font-family:'Noto Sans JP',sans-serif;}
:focus-visible{outline:2px solid #3B5590;outline-offset:3px;}

/* ---------- ヘッダー（既定：常に白背景。トップページのみhome.cssで透明→スクロールで変化に上書き） ---------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 5vw;
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(10px);
  box-shadow:0 1px 0 #DADDE3;
  transition:background .5s ease, box-shadow .4s ease;
}
.brand{
  display:flex; align-items:center; gap:12px;
  font-family:'Noto Serif JP',serif; font-size:17px; letter-spacing:0.08em;
  color:#0B1638; white-space:nowrap; flex-shrink:0;
}
.brand-mark{height:26px; width:auto; flex-shrink:0;}
.j-tick{position:relative; top:-0.03em;}
header nav.gnav a{font-size:13px; letter-spacing:0.1em; color:#1C1F26;}
.menu-toggle{color:#1C1F26;}

/* ---------- サブページ共通：見出しバナー ---------- */
.page-banner{background:#0B1638; padding:180px 5vw 90px; color:#fff;}
.page-banner-inner{max-width:1120px; margin:0 auto;}
.page-kicker{font-size:12px; letter-spacing:0.5em; color:#7C93C4; margin-bottom:22px; opacity:0; animation:riseFade .8s .1s ease forwards;}
.page-title{margin:0; font-family:'Noto Serif JP',serif; font-size:clamp(24px,2.6vw,32px); font-weight:500; overflow:hidden;}
.page-title span{display:block; transform:translateY(112%); animation:lineUp 1.1s cubic-bezier(.19,1,.22,1) .3s forwards;}
.page-rule{width:0; height:1px; background:linear-gradient(90deg,#7C93C4,rgba(124,147,196,0)); margin-top:26px; animation:lineDraw 1s cubic-bezier(.19,1,.22,1) 1.05s forwards;}

/* ---------- サブページ共通：セクション枠 ---------- */
.section{padding:150px 5vw;}
.section-white{background:#FFFFFF;}
.section-navy{background:#0B1638; color:#fff;}
.section-ivory{background:#F7F7F4;}
.section-inner{max-width:1120px; margin:0 auto;}
.center{text-align:center;}
.eyebrow{
  display:flex; align-items:center; gap:18px;
  font-size:12px; letter-spacing:0.42em; font-weight:500;
  color:#3B5590; text-transform:uppercase; margin-bottom:30px;
}
.eyebrow::before{content:""; display:block; width:36px; height:1px; background:#7C93C4;}
.eyebrow.center{justify-content:center;}
.section-title{margin:0 0 10px; font-family:'Noto Serif JP',serif; color:#0B1638; font-size:clamp(22px,2.4vw,28px); font-weight:500; line-height:1.9;}
.lead{margin:0 0 40px; font-size:13px; color:#565C6B;}
.license-note{display:block; margin-top:8px; font-size:12px; color:#7C93C4; font-style:italic;}
.text-link-line{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:14px;
  color:#1A2A5E;
  font-size:15px;
  letter-spacing:0.1em;
  text-decoration:none;
}
.text-link-line::after{
  content:"";
  width:28px;
  height:1px;
  background-color:currentColor;
  transition:transform .3s ease;
}
.text-link-line:hover::after{transform:translateX(6px);}
.text-link-line.light{color:#fff;}

/* ---------- サブページ共通：表組み ---------- */
.info-table{width:100%; border-collapse:collapse; font-size:14px;}
.info-table th{text-align:left; padding:22px 20px 22px 8px; width:200px; color:#565C6B; font-weight:500; letter-spacing:0.06em; vertical-align:top;}
.info-table td{padding:22px 24px 22px 0; color:#1C1F26;}
.info-table tr{border-top:1px solid #DADDE3;}
.info-table tbody tr:last-child{border-bottom:1px solid #DADDE3;}
.info-table.on-ivory th, .info-table.on-ivory td{background:#fff;}
.info-table .name-en{display:block; margin-top:4px; font-size:12px; color:#565C6B; letter-spacing:0.05em; font-weight:400;}

@media (max-width:600px){
  .info-table, .info-table tbody, .info-table tr, .info-table th, .info-table td{
    display:block;
    width:100%;
  }
  .info-table th{padding:20px 0 4px 8px;}
  .info-table td{padding:0 12px 20px 8px;}
  .info-table tr{border-top:1px solid #DADDE3;}
}

/* ---------- ナビゲーション・ボタンのホバー ---------- */
.nav-link{position:relative;display:inline-block;padding-bottom:3px;transition:color .4s ease;}
.nav-link::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s cubic-bezier(.19,1,.22,1);}
.nav-link:hover::after,
.nav-link.is-current::after{transform:scaleX(1);transform-origin:left;}

.foot-nav-link{position:relative;display:inline-block;padding-bottom:3px;transition:color .4s ease;}
.foot-nav-link::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s cubic-bezier(.19,1,.22,1);}
.foot-nav-link:hover{color:#fff;}
.foot-nav-link:hover::after,
.foot-nav-link.is-current::after{transform:scaleX(1);transform-origin:left;}
.foot-nav-link.is-current{color:#fff;}

.cta-btn{
  display:inline-block;
  background:#0B1638; color:#fff; border:none;
  font-size:13px; letter-spacing:0.2em; cursor:pointer;
  transition:background .45s ease, transform .45s cubic-bezier(.19,1,.22,1), box-shadow .45s ease;
}
.cta-btn:hover{background:#1A2A5E;transform:translateY(-3px);box-shadow:0 16px 32px rgba(11,22,56,0.32);}

/* ---------- フッター（全ページ共通） ---------- */
footer{background:#0B1638; color:rgba(255,255,255,0.6); padding:70px 5vw 34px; font-size:12.5px;}
.foot-top{
  max-width:1120px; margin:0 auto;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:40px;
  padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,0.14);
}
.foot-brand a{font-family:'Noto Serif JP',serif; color:#fff; font-size:16px; letter-spacing:0.08em;}
.foot-brand small{display:block; margin-top:10px; font-family:'Noto Sans JP',sans-serif; font-size:11.5px; color:rgba(255,255,255,0.45); letter-spacing:0.05em;}
.foot-nav{display:flex; justify-content:flex-start; align-items:baseline; gap:40px; flex-wrap:wrap;}
.foot-nav > *{flex:0 0 auto; text-align:left; white-space:nowrap;}
.foot-bottom{
  max-width:1120px; margin:0 auto; padding-top:26px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:11px; color:rgba(255,255,255,0.35); letter-spacing:0.04em;
}

/* ---------- プライバシーポリシー本文（モーダル内・単独ページ両方で使用） ---------- */
.privacy-content{font-size:14.5px; color:#33363e;}
.privacy-content > p:first-child{margin:0 0 50px; color:#565C6B; font-size:13px;}
.privacy-content h2{margin:44px 0 16px; font-family:'Noto Serif JP',serif; color:#0B1638; font-size:18px; font-weight:500;}
.privacy-content h2:first-of-type{margin-top:0;}
.privacy-content p{margin:0;}
.privacy-content ul{margin:0; padding-left:20px;}
.privacy-content a{color:#1A2A5E; border-bottom:1px solid #1A2A5E; transition:opacity .2s ease;}
.privacy-content a:hover{opacity:0.6;}
.privacy-content .privacy-date{margin:56px 0 0; font-size:12px; color:#565C6B;}

/* ---------- プライバシーポリシー モーダル ---------- */
.privacy-modal{
  position:fixed; inset:0; z-index:200;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
  opacity:0; visibility:hidden;
  transition:opacity .35s ease, visibility 0s linear .35s;
}
.privacy-modal.is-open{
  opacity:1; visibility:visible;
  transition:opacity .35s ease, visibility 0s linear 0s;
}
.privacy-modal-backdrop{
  position:absolute; inset:0;
  background:rgba(11,22,56,0.55);
}
.privacy-modal-panel{
  position:relative;
  background:#fff;
  max-width:760px; width:100%;
  max-height:min(80vh, 720px);
  overflow-y:auto;
  padding:52px 40px 48px;
  box-shadow:0 24px 60px rgba(11,22,56,0.3);
  transform:translateY(16px);
  transition:transform .35s cubic-bezier(.19,1,.22,1);
}
.privacy-modal.is-open .privacy-modal-panel{transform:translateY(0);}
.privacy-modal-close{
  position:absolute; top:14px; right:14px;
  width:36px; height:36px;
  display:flex; align-items:center; justify-content:center;
  border:none; border-radius:50%; background:#F0F1F4; cursor:pointer;
  font-size:20px; line-height:1; color:#3B4250;
}
.privacy-modal-close:hover{background:#E1E4EA; color:#0B1638;}
body.privacy-modal-open{overflow:hidden;}

.privacy-trigger{
  -webkit-appearance:none; appearance:none;
  background:none; border:none; padding:0; margin:0;
  font:inherit; color:inherit; text-decoration:none; cursor:pointer;
}

@media (max-width:640px){
  .privacy-modal{padding:0;}
  .privacy-modal-panel{max-width:100%; max-height:100%; height:100%; padding:56px 24px 40px;}
}

/* ---------- スクロールで表示するアニメーション ---------- */
.reveal{opacity:0; transform:translateY(28px); transition:opacity .9s ease, transform .9s ease;}
.reveal.is-visible{opacity:1; transform:translateY(0);}

/* ---------- 共通アニメーション ---------- */
@keyframes riseFade{from{opacity:0;transform:translateY(22px);} to{opacity:1;transform:translateY(0);}}
@keyframes lineUp{from{transform:translateY(112%);} to{transform:translateY(0);}}
@keyframes lineDraw{from{width:0;} to{width:120px;}}
@keyframes heroFadeIn{from{opacity:0;} to{opacity:1;}}
@keyframes sweepIn{0%{opacity:0;transform:rotate(18deg) translateX(120px);} 35%{opacity:1;} 100%{opacity:0;transform:rotate(18deg) translateX(-120px);}}
@keyframes cueDrop{0%{top:-100%;} 60%{top:100%;} 100%{top:100%;}}

/* ---------- ブラウザの自動入力（オートフィル）で背景が黄色くなるのを防ぐ ---------- */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus{
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
  box-shadow: 0 0 0 1000px #fff inset !important;
  -webkit-text-fill-color: #1C1F26 !important;
  caret-color: #1C1F26;
  transition: background-color 5000s ease-in-out 0s;
}

/* ---------- ハンバーガーメニュー（モバイル） ---------- */
.menu-toggle{
  display:none;
  background:none;
  border:none;
  padding:8px;
  cursor:pointer;
  flex-shrink:0;
  width:32px;
  height:32px;
  position:relative;
}
.menu-toggle span{
  display:block;
  width:24px;
  height:1.5px;
  background:currentColor;
  margin:6px 0;
  transition:transform .4s cubic-bezier(.19,1,.22,1), opacity .3s ease;
}
body.menu-open .menu-toggle span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
body.menu-open .menu-toggle span:nth-child(2){opacity:0; transform:scaleX(0);}
body.menu-open .menu-toggle span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}

.mobile-menu-backdrop{
  position:fixed; inset:0;
  z-index:89;
  background:rgba(11,22,56,0.5);
  opacity:0;
  visibility:hidden;
  transition:opacity .5s ease-in-out, visibility 0s linear .5s;
}
body.menu-open .mobile-menu-backdrop{
  opacity:1;
  visibility:visible;
  transition:opacity .5s ease-in-out, visibility 0s linear 0s;
}

.mobile-menu{
  position:fixed;
  top:0; right:0; bottom:0;
  z-index:90;
  width:min(300px, 78vw);
  background:#0B1638;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:2px;
  padding:104px 32px 40px;
  overflow-y:auto;
  transform:translateX(100%);
  transition:transform .45s ease-in-out;
}
body.menu-open .mobile-menu{
  transform:translateX(0);
}
.mobile-menu a{
  position:relative;
  display:block;
  width:100%;
  font-family:'Noto Sans JP',sans-serif;
  font-size:15px;
  color:#fff;
  letter-spacing:0.02em;
  padding:13px 0;
  border-bottom:1px solid rgba(255,255,255,0.12);
}
.mobile-menu a::after{
  content:"";
  position:absolute; left:0; bottom:-1px;
  width:100%; height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:right;
  transition:transform .4s cubic-bezier(.19,1,.22,1);
}
.mobile-menu a:hover::after,
.mobile-menu a.is-current::after{
  transform:scaleX(1);
  transform-origin:left;
}
body.menu-open{overflow:hidden;}

nav.gnav{display:flex;gap:36px;}

@media (max-width:860px){
  nav.gnav{display:none;}
  .menu-toggle{display:block;}
  .biz-grid,
  .value-list{grid-template-columns:1fr !important;}
  .value-list{gap:44px !important;}
}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important;}
}