/*
Theme Name: 村岡経営労務事務所・行政書士村岡事務所
Theme URI: https://www.muraoka-office.com/
Description: 千葉県成田市の社会保険労務士・行政書士事務所「村岡経営労務事務所・行政書士村岡事務所」のオリジナルWordPressテーマ。コーポレートサイト一式（ホーム／事務所の特長／サービス案内／社労士・行政書士業務／ご依頼の流れ／事務所概要／お問い合わせ）を含みます。
Author: Muraoka Office
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: muraoka-office
*/

/* =========================================================
   設計トークン（ブランドカラー）
   ========================================================= */
:root{
  --navy:#13396b;          /* メインの紺色 */
  --navy-dark:#0d2b52;
  --blue:#2f6fb0;          /* アクセントの青 */
  --sky:#e8f1f9;           /* 淡い水色背景 */
  --gold:#e8a324;          /* CTA等のアクセント */
  --gold-dark:#cf8d12;
  --green:#5fae46;         /* 見出し補助 */
  --bg:#f6f8fa;
  --bg-alt:#eef3f7;
  --text:#333;
  --text-light:#666;
  --line:#d7dde4;
  --white:#fff;
  --wrap:1100px;
  --radius:8px;
  --shadow:0 4px 18px rgba(19,57,107,.10);
}

/* =========================================================
   リセット & ベース
   ========================================================= */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Yu Gothic",Meiryo,sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.9;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;vertical-align:bottom;}
a{color:var(--blue);text-decoration:none;transition:opacity .2s,color .2s,background .2s;}
a:hover{opacity:.8;}
p{margin:0 0 1em;}
ul{margin:0;padding:0;}
h1,h2,h3,h4{line-height:1.5;margin:0;}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px;}
.section{padding:60px 0;}
.section--alt{background:var(--bg-alt);}
.center{text-align:center;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}

/* =========================================================
   ヘッダー
   ========================================================= */
.site-header{
  position:sticky;top:0;z-index:1000;
  background:var(--white);
  box-shadow:0 2px 10px rgba(0,0,0,.06);
}
.header-bar{
  display:flex;align-items:center;justify-content:space-between;
  max-width:1240px;margin:0 auto;padding:10px 20px;gap:16px;
}
.site-logo img{max-height:58px;width:auto;}
.site-logo .tagline{display:block;font-size:11px;color:var(--text-light);margin-top:2px;}

.header-right{display:flex;align-items:center;gap:14px;}
.header-cta{display:flex;gap:10px;}
.header-cta a img{max-height:48px;}

/* グローバルナビ */
.global-nav{background:var(--navy);}
.global-nav .wrap{padding:0 20px;}
.nav-list{
  display:flex;list-style:none;justify-content:center;flex-wrap:wrap;
}
.nav-list > li{position:relative;}
.nav-list > li > a{
  display:block;color:var(--white);padding:16px 22px;font-weight:700;font-size:15px;
  position:relative;
}
.nav-list > li > a .en{display:block;font-size:10px;font-weight:400;color:#aecbe8;letter-spacing:.04em;}
.nav-list > li > a:hover{background:var(--navy-dark);opacity:1;}
.nav-list .has-sub > a::after{content:"▾";margin-left:6px;font-size:11px;}

/* ドロップダウン */
.sub-menu{
  position:absolute;top:100%;left:0;min-width:230px;background:var(--white);
  box-shadow:var(--shadow);list-style:none;border-radius:0 0 6px 6px;overflow:hidden;
  opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;z-index:50;
}
.nav-list .has-sub:hover .sub-menu{opacity:1;visibility:visible;transform:translateY(0);}
.sub-menu li a{display:block;padding:13px 18px;color:var(--navy);font-size:14px;border-bottom:1px solid var(--line);}
.sub-menu li:last-child a{border-bottom:none;}
.sub-menu li a:hover{background:var(--sky);opacity:1;}

/* ハンバーガー */
.nav-toggle{display:none;background:var(--navy);border:none;color:#fff;font-size:14px;
  align-items:center;gap:8px;padding:12px 16px;cursor:pointer;width:100%;justify-content:center;font-weight:700;}
.nav-toggle .bars{display:inline-block;width:22px;height:16px;position:relative;}
.nav-toggle .bars span{position:absolute;left:0;height:2px;width:100%;background:#fff;transition:.3s;}
.nav-toggle .bars span:nth-child(1){top:0;}
.nav-toggle .bars span:nth-child(2){top:7px;}
.nav-toggle .bars span:nth-child(3){top:14px;}
.is-open .nav-toggle .bars span:nth-child(1){top:7px;transform:rotate(45deg);}
.is-open .nav-toggle .bars span:nth-child(2){opacity:0;}
.is-open .nav-toggle .bars span:nth-child(3){top:7px;transform:rotate(-45deg);}

/* =========================================================
   ページ共通：パンくず・ページ見出し
   ========================================================= */
.breadcrumb{background:var(--bg-alt);font-size:13px;color:var(--text-light);}
.breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;padding:10px 20px;max-width:var(--wrap);margin:0 auto;}
.breadcrumb li::after{content:"›";margin-left:6px;color:#aaa;}
.breadcrumb li:last-child::after{content:"";}

.page-head{
  background:linear-gradient(135deg,var(--navy),var(--blue));
  color:var(--white);text-align:center;padding:56px 20px;
}
.page-head h1{font-size:30px;letter-spacing:.05em;}
.page-head .en{display:block;font-size:13px;font-weight:400;color:#bcd6ef;margin-top:8px;letter-spacing:.1em;}

/* =========================================================
   ホーム：ヒーロー
   ========================================================= */
.hero{position:relative;background:var(--navy);}
.hero img{width:100%;display:block;object-fit:cover;max-height:520px;}
.hero-catch{
  background:var(--white);padding:50px 20px;text-align:center;
}
.hero-catch h2{font-size:26px;color:var(--navy);margin-bottom:20px;font-weight:700;letter-spacing:.04em;}
.hero-catch p{max-width:780px;margin:0 auto;color:var(--text);}

/* =========================================================
   ホーム：サービスカード
   ========================================================= */
.svc-block{margin-bottom:50px;}
.svc-block h3.svc-title{
  text-align:center;font-size:22px;color:var(--navy);margin-bottom:6px;
  padding-bottom:14px;position:relative;
}
.svc-block h3.svc-title::after{
  content:"";display:block;width:60px;height:3px;background:var(--gold);margin:14px auto 0;
}
.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:30px;}
.card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:24px 18px;text-align:center;box-shadow:0 2px 8px rgba(0,0,0,.04);
  transition:transform .25s,box-shadow .25s;
}
.card:hover{transform:translateY(-5px);box-shadow:var(--shadow);}
.card .icon{height:80px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;}
.card .icon img{max-height:80px;}
.card h4{font-size:16px;color:var(--navy);margin-bottom:10px;}
.card p{font-size:13.5px;color:var(--text-light);line-height:1.8;margin:0;}

.more-link{text-align:center;margin-top:26px;}
.more-link a{
  display:inline-block;background:var(--navy);color:#fff;padding:14px 40px;border-radius:30px;
  font-weight:700;font-size:15px;
}
.more-link a:hover{background:var(--gold);opacity:1;}

/* お知らせ */
.news-list{max-width:820px;margin:0 auto;}
.news-list li{display:flex;gap:18px;padding:14px 4px;border-bottom:1px dashed var(--line);flex-wrap:wrap;}
.news-list time{color:var(--text-light);font-size:14px;min-width:120px;}

/* =========================================================
   事務所の特長（about）
   ========================================================= */
.feature{
  display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;margin-bottom:48px;
}
.feature:nth-child(even) .feature-txt{order:2;}
.feature-img img{border-radius:var(--radius);box-shadow:var(--shadow);width:100%;}
.feature-no{
  display:inline-block;background:var(--gold);color:#fff;font-weight:700;border-radius:4px;
  padding:2px 12px;margin-bottom:10px;font-size:14px;
}
.feature h3{font-size:21px;color:var(--navy);margin-bottom:14px;line-height:1.5;}
.feature strong{color:var(--navy);}

/* =========================================================
   サービス紹介ページ
   ========================================================= */
.service-intro{max-width:860px;margin:0 auto 40px;}
.svc-col{
  display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-bottom:30px;
}
.svc-col .panel{
  background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
  padding:30px;box-shadow:0 2px 8px rgba(0,0,0,.04);
}
.svc-col .panel h3{color:var(--navy);font-size:20px;margin-bottom:14px;border-left:5px solid var(--gold);padding-left:12px;}
.tag-links{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0;}
.tag-links a{
  background:var(--sky);color:var(--navy);font-size:13px;padding:6px 14px;border-radius:20px;
}
.tag-links a:hover{background:var(--navy);color:#fff;opacity:1;}

/* 詳細ページ（社労士・行政書士） */
.detail-nav{
  display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:0 auto 50px;max-width:900px;
}
.detail-nav a{
  background:var(--navy);color:#fff;padding:10px 22px;border-radius:30px;font-size:14px;font-weight:700;
}
.detail-nav a:hover{background:var(--gold);opacity:1;}

.detail-block{margin-bottom:60px;scroll-margin-top:120px;}
.detail-block .dh{display:flex;align-items:center;gap:18px;margin-bottom:18px;flex-wrap:wrap;}
.detail-block .dh .ic img{max-height:70px;}
.detail-block .dh h2{font-size:24px;color:var(--navy);}
.detail-block .dh .en{display:block;font-size:13px;color:var(--blue);font-style:italic;font-weight:400;margin-top:2px;}
.lead{font-size:17px;font-weight:700;color:var(--navy);background:var(--sky);padding:14px 18px;border-radius:6px;margin-bottom:18px;}
.detail-block h4{
  color:var(--navy);font-size:17px;margin:24px 0 10px;padding-bottom:6px;border-bottom:2px solid var(--line);
}
.detail-block ul.bullet{list-style:none;margin:0 0 16px;}
.detail-block ul.bullet li{position:relative;padding-left:22px;margin-bottom:6px;}
.detail-block ul.bullet li::before{content:"●";color:var(--gold);position:absolute;left:0;font-size:11px;top:6px;}
.detail-block ol{margin:0 0 16px 1.4em;}
.detail-block ol li{margin-bottom:6px;}

/* 報酬表 */
.fee-table{width:100%;border-collapse:collapse;margin:18px 0;font-size:14.5px;background:#fff;}
.fee-table caption{font-weight:700;color:var(--navy);text-align:left;margin-bottom:8px;font-size:16px;}
.fee-table th,.fee-table td{border:1px solid var(--line);padding:10px 14px;text-align:left;}
.fee-table thead th{background:var(--navy);color:#fff;}
.fee-table td:last-child{text-align:right;white-space:nowrap;font-weight:700;color:var(--navy);}
.note{font-size:13px;color:var(--text-light);}

.svc-cta{margin-top:16px;}
.svc-cta a{
  display:inline-block;background:var(--gold);color:#fff;font-weight:700;padding:12px 30px;border-radius:30px;font-size:14px;
}
.svc-cta a:hover{background:var(--gold-dark);opacity:1;}

/* =========================================================
   ご依頼の流れ
   ========================================================= */
.flow-step{
  display:flex;gap:24px;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);padding:26px;margin-bottom:22px;box-shadow:0 2px 8px rgba(0,0,0,.04);position:relative;
}
.flow-step .num{
  flex:0 0 auto;width:64px;height:64px;border-radius:50%;background:var(--navy);color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700;
}
.flow-step .num small{font-size:10px;font-weight:400;}
.flow-step .num b{font-size:24px;line-height:1;}
.flow-step .txt h3{color:var(--navy);font-size:19px;margin-bottom:8px;}
.flow-step:not(:last-child)::after{
  content:"";position:absolute;left:51px;bottom:-22px;width:2px;height:22px;background:var(--gold);
}

/* =========================================================
   事務所概要
   ========================================================= */
.info-table{width:100%;border-collapse:collapse;background:#fff;margin-bottom:40px;}
.info-table th,.info-table td{border:1px solid var(--line);padding:14px 18px;text-align:left;vertical-align:top;}
.info-table th{background:var(--bg-alt);color:var(--navy);width:160px;white-space:nowrap;}

.profile{display:grid;grid-template-columns:1fr 280px;gap:30px;align-items:start;background:#fff;
  border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:0 2px 8px rgba(0,0,0,.04);}
.profile .role{color:var(--blue);font-weight:700;margin-bottom:6px;}
.profile .name{font-size:24px;color:var(--navy);font-weight:700;margin-bottom:4px;}
.profile .name .en{font-size:14px;color:var(--text-light);font-weight:400;margin-left:8px;}
.profile dl{margin:16px 0 0;}
.profile dl div{display:flex;gap:10px;padding:4px 0;border-bottom:1px dashed var(--line);flex-wrap:wrap;}
.profile dt{font-weight:700;color:var(--navy);min-width:78px;}
.profile dd{margin:0;}
.profile .photo img{border-radius:var(--radius);width:100%;}

.map-embed{margin-top:20px;}
.map-embed iframe{width:100%;height:380px;border:0;border-radius:var(--radius);}

/* =========================================================
   お問い合わせフォーム
   ========================================================= */
.contact-form{max-width:760px;margin:0 auto;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);padding:34px;box-shadow:0 2px 8px rgba(0,0,0,.04);}
.contact-form .row{margin-bottom:20px;}
.contact-form label{display:block;font-weight:700;color:var(--navy);margin-bottom:6px;}
.contact-form .req{background:var(--gold);color:#fff;font-size:11px;padding:2px 8px;border-radius:3px;margin-left:8px;}
.contact-form input[type=text],
.contact-form input[type=email],
.contact-form textarea{
  width:100%;border:1px solid var(--line);border-radius:6px;padding:12px 14px;font-size:15px;font-family:inherit;
}
.contact-form textarea{min-height:140px;resize:vertical;}
.contact-form .radio-group{display:flex;gap:18px;flex-wrap:wrap;}
.contact-form .privacy{font-size:13px;color:var(--text-light);margin:18px 0;}
.contact-form .submit{text-align:center;}
.contact-form .submit button{
  background:var(--gold);color:#fff;border:none;padding:15px 60px;border-radius:30px;font-size:16px;
  font-weight:700;cursor:pointer;transition:.2s;
}
.contact-form .submit button:hover{background:var(--gold-dark);}

/* =========================================================
   グローバルCTAバンド
   ========================================================= */
.cta-band{
  background:linear-gradient(135deg,var(--navy),var(--blue));color:#fff;text-align:center;padding:46px 20px;
}
.cta-band .ttl{font-size:22px;font-weight:700;letter-spacing:.2em;margin-bottom:8px;}
.cta-band .tel{font-size:38px;font-weight:700;letter-spacing:.04em;display:inline-block;margin:6px 0;color:#fff;}
.cta-band .tel:hover{opacity:.85;}
.cta-band small{display:block;font-size:14px;color:#cfe0f1;}
.cta-band .web{font-weight:700;margin-bottom:6px;}

/* =========================================================
   フッター
   ========================================================= */
.site-footer{background:var(--navy-dark);color:#cdd8e6;padding:50px 20px 30px;}
.footer-inner{display:grid;grid-template-columns:1fr 1fr;gap:40px;max-width:var(--wrap);margin:0 auto;align-items:start;}
.footer-info .flogo{margin-bottom:18px;}
.footer-info .flogo img{max-width:340px;background:#fff;padding:10px 14px;border-radius:6px;}
.footer-info address{font-style:normal;line-height:2;font-size:14px;}
.footer-map iframe{width:100%;height:220px;border:0;border-radius:6px;}
.footer-bottom{text-align:center;font-size:12px;color:#8ea4bf;margin-top:34px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12);}
.footer-bottom a{color:#8ea4bf;}

/* ページトップ */
.to-top{position:fixed;right:20px;bottom:20px;width:48px;height:48px;border-radius:50%;
  background:var(--gold);color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:20px;box-shadow:var(--shadow);opacity:0;visibility:hidden;transition:.3s;z-index:900;}
.to-top.show{opacity:1;visibility:visible;}
.to-top:hover{background:var(--gold-dark);opacity:1;}

/* =========================================================
   レスポンシブ
   ========================================================= */
@media(max-width:900px){
  .card-grid{grid-template-columns:repeat(2,1fr);}
  .feature,.svc-col,.profile,.footer-inner{grid-template-columns:1fr;}
  .feature:nth-child(even) .feature-txt{order:0;}
  .profile .photo{max-width:280px;margin:0 auto;}
}
@media(max-width:768px){
  .header-cta{display:none;}
  .nav-toggle{display:flex;}
  .global-nav .nav-list{display:none;flex-direction:column;}
  .is-open .global-nav .nav-list{display:flex;}
  .nav-list > li > a{border-bottom:1px solid rgba(255,255,255,.12);}
  .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    background:var(--navy-dark);border-radius:0;}
  .sub-menu li a{color:#cdd8e6;border-bottom:1px solid rgba(255,255,255,.08);}
  .sub-menu li a:hover{background:rgba(255,255,255,.06);color:#fff;}
  .nav-list .has-sub > a::after{display:none;}
  .page-head h1{font-size:24px;}
  .cta-band .tel{font-size:30px;}
}
@media(max-width:520px){
  .card-grid{grid-template-columns:1fr;}
  .section{padding:40px 0;}
  .hero-catch h2{font-size:20px;}
}
