/* ---- normalize ---- */
body {
  font-family: system-ui, -apple-system, "Segoe UI",
               "Helvetica Neue", Arial,
               "Hiragino Sans", "Hiragino Kaku Gothic ProN",
               "Yu Gothic UI", "Yu Gothic", "Meiryo",
               "Noto Sans JP", "Noto Sans CJK JP",
               sans-serif;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "palt" 1;
}


@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');
:root {
    --orangered:#ec5f60;
    --black:#323232;
    --blue:#16458c;
}

/* ボックスモデルを統一 */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* 余白リセット */
body, h1, h2, h3, h4, h5, h6, p, ul, ol, figure {
  margin: 0;
  padding: 0;
}

/* リストスタイル削除 */
ul, ol {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

ul li, li li {
  margin: 0;
  padding: 0;
}


/* リンク */
a {
  color: inherit;
  text-decoration: none!important;
}

/* 画像が親幅に収まるように */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

/* フォーム要素のフォントを継承 */
input, button, textarea, select {
  font: inherit;
  color: inherit;
}

/* body の基本 */
body {
  line-height: 1.75;
  font-size:20px;
  -webkit-font-smoothing: antialiased;
  background: #fff;
  color: #222;
  font-feature-settings: "palt";
}



/* アクセシビリティ */
a:focus-visible{outline:2px solid var(--orangered);outline-offset:2px}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important}
}



/* ---- 共通 ---- */
.logo-svg {
  color: var(--orangered)!important;
}

/* ---- 基本構造 ---- */
.wrap {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  max-width: 1250px;
  margin:0 auto;
}
.wrap aside {
  flex: 0 0 250px;
  position: sticky;
  top: 20px;
  height: fit-content;

  margin-top:30px;
  /*font-size: 20px;*/
  color:#323232;
  padding-left:0px;
}
.wrap aside a {
  color:#323232;
  font-weight:normal;
  transition: 0.3s;
  display: block;
    width: 100%;
}
.wrap aside a:hover {
  color:var(--orangered);
}
.wrap main {
  order: 2;
  flex: 1;
  min-width: 0; 
  padding-left:40px;
}


.side-logo svg {
  width: 90%;
  height: auto;
}


.nav-side {
    padding-right:20px;
    position: relative;
}
.nav-side .navi-toppage {
  margin-top:30px;
}
.nav-side ul { position: relative; }
.nav-side ul li {
    margin-bottom:20px;
}
.nav-side ul li a img {
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
}

.nav-side .active {
    color:var(--orangered);
}
.nav-side .btn-contact {
    color:#fff!important;
    padding:15px 0px;
    width:100%;
    text-align:center;
    background:var(--blue);
    transition: 0.3s;
    border-radius:4px;
}
.nav-side .btn-contact:hover {
    background:var(--orangered);
}
.nav-side .has-mega { position: relative; }
.nav-side .mega-panel {
  position: absolute;
  top: -6px;
  left: calc(100% + 16px);
  width: min(720px, 62vw);
  max-height: 70vh;
  overflow: auto;
  background: #fff;
  border: 1px solid #e6e6e6;
  box-shadow: 0 8px 28px rgba(0,0,0,.12);
  border-radius: 10px;
  padding: 18px;
  display: none;
  z-index: 9999!important;
  transform: translateX(-90px); /* ← 左に20px移動 */
}


.nav-side .has-mega:hover > .mega-panel,
.nav-side .has-mega:focus-within > .mega-panel,
.nav-side .has-mega.open > .mega-panel { display: block; }

.mega-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 12px 20px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.mega-grid a {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  background: #fafafa;
  border: 1px solid #f0f0f0;
  text-decoration: none;
  line-height: 1.35;
}
.mega-grid a:hover { background: #fff4ef; border-color: var(--orangered); }

/* 小さめ画面ではドロップダウン化 */
@media (max-width: 1024px) {
  .nav-side .mega-panel {
    position: static;
    width: 100%;
    max-height: none;
    box-shadow: none;
    border-radius: 6px;
    margin-top: 8px;
    display: none;
  }
}







@media (max-width: 768px) {
  .wrap {
    display:block;
    max-width:100%;
    flex-direction: column;
    padding:0 15px;
  }
  .wrap main {
    order: 1;
    padding-left:0px;
  }
  .wrap aside { display:none; }
  .attracts .wrap aside {
    display: block !important;
  }
}


/* ---- h1 NOT スライド ---- */
/*
.tit-header {
  line-height:1.35;
  margin: 0 auto 0px;
  width: 100%;
  text-align: left;
  margin-top:25px;
}
*/

/* ---- フッター ---- */
.footer-inner{
  max-width:1200px; margin:0 auto; padding:32px 16px 40px;
  display:grid; gap:24px 32px;
}


/* 文字系 */
.footer-col p{ margin:0 0 .6rem; }
.footer-col .org-en { font-weight:700; }
.footer-col .org-ja { opacity:.9; margin-top:-10px;}
.footer-col .copyright{ margin-top:.6rem; color:#444; }

.footer-col.nav ul{ list-style:none; padding:0; margin:0; }
.footer-col.nav li+li{ margin-top:.5rem; }
.footer-col.nav a{ color:#222; text-decoration:none; }

/* CTA 列（ボタンは右列で幅オート） */
.footer-col.cta{ display:flex; flex-direction:column; gap:12px; align-items:flex-start; }
.btn-footer-contact{
  display:inline-block; background:var(--blue); color:#fff;
  padding:12px 20px; border-radius:4px; text-decoration:none;
}
.btn-footer-contact:hover{ filter:brightness(1.05); }
.footer-col.cta .legal{ list-style:none; padding:0; margin:.4rem 0 0; }
.footer-col.cta .legal li+li{ margin-top:.4rem; }
.footer-col.cta .legal a{ /*font-size:14px;*/ color:#222; }

/* SNS/言語 */
.footer-col.nav.social a{ display:inline-flex; align-items:center; gap:6px; }
.footer-col.nav.social img{ display:inline-block; vertical-align:middle; }

/* ===== フッター テキストリンク ===== */
.site-footer .footer-col.nav a,
.site-footer .footer-col.cta .legal a {
  color:#323232;
  font-weight:normal;
  transition:0.3s;
}

.site-footer .footer-col.nav a:hover,
.site-footer .footer-col.cta .legal a:hover {
  color:var(--orangered);
  text-decoration:none; /* 必要なら */
}

/* ===== フッター ボタンリンク ===== */
.site-footer .btn-footer-contact {
  color:#fff !important;
  padding:10px 0;
  width:80%;
  text-align:center;
  background:var(--blue);
  border-radius:4px;
  transition:0.3s;
  display:inline-block;
}

.site-footer .btn-footer-contact:hover {
  background:var(--orangered);
}


/* --- PCレイアウト：1行4カラム（1列目を広く） --- */
@media (min-width: 992px){
  .footer-inner{
    grid-template-columns: 2fr 1fr 1fr 1fr;        /* ← 1列目だけ広い */
    grid-template-areas: "org site cta social";    /* ← 1行に固定 */
    align-items:start;
  }
  .footer-col.org    { grid-area: org; }
  .footer-col.site   { grid-area: site; }
  .footer-col.cta    { grid-area: cta; }
  .footer-col.social { grid-area: social; }
}

/* --- モバイル：縦並び --- */
@media (max-width: 991px){
  .footer-inner{
    grid-template-columns: 1fr;
    gap:18px 16px; padding:24px 12px 32px;
  }
  .site-footer .btn-footer-contact {
    width:100%;
  }
}





/* ---- パンくず全体：色を薄く＆サイズ小さく ---- */
.rank-math-breadcrumb {
  /*font-size: 15px;*/          /* 小さめ */
  color: #aaa;           /* 薄めのグレー */
  margin: 20px 0 12px;       /* H1下で少し余白 */
  font-size:.9rem;
  line-height:1.35;
}
.rank-math-breadcrumb a {
  color: #aaa;           /* リンクも薄め */
  text-decoration: none;
}
.rank-math-breadcrumb a:hover { text-decoration: none; }
.rank-math-breadcrumb .separator {
  margin: 0 6px;
  color: #aaa;           /* 区切りはさらに薄め */
}

/* 先頭（ホーム）に家アイコン：a でも span でも当てる／直下子に限定しない */
.rank-math-breadcrumb :is(a, span):first-child::before {
  content: "";
  display: inline-block;
  width: 12px; height: 12px;
  margin-right: 6px;
  translate: 0 1px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 10.5L12 3l9 7.5V21a1 1 0 0 1-1 1h-5v-7H9v7H4a1 1 0 0 1-1-1v-10.5z' fill='%23aaa'/%3E%3C/svg%3E") no-repeat center / contain;
}



/* ---- スマホナビレイアウト ---- */
.block-menu-btn{
  background:#fff;
  position:fixed; top:0; left:0; right:0;
  z-index:9998;
  height:50px;
  border-bottom:1px solid #ccc;
}
.block-menu-btn .menu-label {
  font-size:12px;
}
/* スマホ限定表示（PCで非表示にしたい場合） */
@media (min-width: 992px){
  .block-menu-btn{ display:none; }
}
@media (max-width: 991px){
  body {
    padding-top:50px;
  }
}

/* 全体ラッパー */
.menu-wrapper{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  position:relative;
  height:100%;
}

/* 左のバーガー */
.navi{
  display:flex;
  align-items:center;
  justify-content:center;
  width:56px; height:100%;
}
.menu-btn{
  display:flex; flex-direction:column; align-items:center; line-height:1;
  color:var(--orangered);
}
.menu-btn p{
  /*font-size:10px;*/ font-weight:700; margin:2px 0 0;
}

/* ロゴを中央固定配置 */
.logo{
  position:absolute; left:50%; top:50%;
  transform:translate(-50%,-50%);
  display:flex; align-items:center; height:100%;
}
.logo .logo-svg{ height:24px; width:auto; display:block; }

/* ハンバーガー */
.menu-trigger, .menu-trigger span{
  display:inline-block; transition:all .25s; box-sizing:border-box;
}
.menu-trigger{ position:relative; width:32px; height:20px; }
.menu-trigger span{
  position:absolute; left:0; width:100%; height:3px;
  background:var(--orangered); border-radius:3px;
}
.menu-trigger span:nth-of-type(1){ top:0; }
.menu-trigger span:nth-of-type(2){ top:8.5px; }
.menu-trigger span:nth-of-type(3){ bottom:0; }
.menu-trigger.active span:nth-of-type(1){ transform:translateY(8.5px) rotate(-45deg); }
.menu-trigger.active span:nth-of-type(2){ opacity:0; }
.menu-trigger.active span:nth-of-type(3){ transform:translateY(-8.5px) rotate(45deg); }

.menu-label {
  /*font-size:12px;*/
  font-weight:bold;
  margin-top:5px;
}
/* ハンバーガーのボタンを素の見た目にリセット */
.navi .menu-btn{
  background: none;           /* 灰色の背景を消す */
  border: none;               /* 黒い枠線を消す */
  padding: 0;
  margin: 0;
  cursor: pointer;
  appearance: none;           /* 標準のボタン外観を無効化 */
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-tap-highlight-color: transparent; /* モバイルのタップ時の灰色ハイライト対策 */
}
/* Firefoxの内側ボーダー対策 */
.navi .menu-btn::-moz-focus-inner { border: 0; padding: 0; }

/* フォーカスリングを自前で出す（消したいなら削除） */
.navi .menu-btn:focus-visible{
  outline: 2px solid var(--orangered);
  outline-offset: 2px;
}




/* 開いてる間はスクロール抑止 */
body.nav-open { overflow: hidden; }

/* オーバーレイ（メニュー本体側の余白合わせ） */
.burger-navi .overlay {
  padding-top: 50px;
  position: fixed;
  inset: 0;
  z-index: 9990;
  display: none;
  overflow: auto;
  width: 100%;
  height: 100%;
  background: #fff;
}

.burger-navi .menu {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.burger-navi .nav-sp {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 20px;
  /*font-size: 16px;*/
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,0.3);
  text-decoration: none;
  background: var(--orangered);
}

.burger-navi .nav-sp:hover {
  opacity: .5;
}

.burger-navi .nav-arrow {
  /*font-size: 18px;*/
  margin-left: auto;
}

.burger-navi .sp-cta {
  margin: 40px 20px 20px;
  text-align: center;
}

.burger-navi .btn-sp-contact {
  display: inline-block;
  background: var(--blue);
  color: #fff;
  padding: 14px 0;
  width: 100%;
  /*font-size: 16px;*/
  border-radius: 4px;
  text-align: center;
  text-decoration: none;
}

.burger-navi .btn-sp-contact:hover {
  background: var(--orangered);
}

.burger-navi .sp-legal {
  margin: 20px;
  text-align: center;
}

.burger-navi .sp-legal a {
  /*font-size: 14px;*/
  color: #222;
  text-decoration: none;
}

.burger-navi .sp-legal a:hover {
  text-decoration: underline;
}

.burger-navi .sp-links {
  margin: 40px 0 30px;
  display: flex;
  justify-content: center;
  gap: 30px;
}

.burger-navi .sp-links a {
  color: #222;
  /*font-size: 14px;*/
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 5px;
}

.burger-navi .sp-links a:hover {
  text-decoration: underline;
}




/* ---- CTA ---- */
.sec-cta{
  --cta-max: 1200px;
  --cta-pad: clamp(24px, 4vw, 48px);
  --cta-gap: clamp(20px, 6vw, 48px);

  max-width: var(--cta-max);
  margin: clamp(48px, 8vw, 100px) auto;
  padding: var(--cta-pad);
  border: 1px solid var(--orangered);
  border-radius: 20px;
  text-align: center;
}

.sec-cta h2{
  font-size: clamp(20px, 2.5vw, 30px);
  font-weight: 700;
  line-height: 1.5;
  margin: 0 0 16px;
  color:#323232!important;
}

.sec-cta p {
  font-size: clamp(16px, 1.6vw, 20px);
  line-height: 1.6;
  margin: 0 auto;
  text-align: left;
  max-width: 850px;
}

.sec-cta .cta-logo{
  width:min(760px, 100%);
  height:auto;
  display:block;
  margin:0 auto 12px;color: var(--orangered);
}

/* アイコン行 */
.sec-cta .block-icon{
  display: flex;
  justify-content: center;
  gap: var(--cta-gap);
  margin-top: clamp(24px, 4vw, 45px);
  flex-wrap: wrap;        /* 狭幅で自動折返し */
}

/* クリック領域を十分に */
.sec-cta .click-cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(72px, 10vw, 100px);
  height: clamp(72px, 10vw, 100px);
  border-radius: 14px;
  transition: transform .15s ease, box-shadow .15s ease;
  outline: none;
}

.sec-cta .click-cta img{
  width: 70%;
  height: auto;
}

/* ホバー&フォーカス（アクセシビリティ対応） */
.sec-cta .click-cta:hover{
  transform: translateY(-2px);
  box-shadow: none;
}
.sec-cta .click-cta:focus-visible{
  box-shadow: 0 0 0 3px #000, 0 0 0 6px var(--orangered);
}

@media (max-width: 1024px){
  .sec-cta{ text-align: left; }
  .sec-cta h2{ margin-bottom: 10px; line-height: 1.35; }
  .sec-cta p{ margin-top: 8px; }
}
/* === スマホはアイコン＋テキストを縦積みにする（1列） === */
@media (max-width: 560px){
  .sec-cta {
    margin-left:15px;
    margin-right:15px;
  }
  
  /* 行全体を縦方向へ */
  .sec-cta .block-icon{
    flex-direction: column;   /* ← これで縦積み */
    align-items: stretch;     /* 幅を揃える */
    gap: 16px;                /* すき間はやや小さめでもOK（任意） */
  }

  /* 各ボタンは横幅100%・高さは中身に応じて可変 */
  .sec-cta .click-cta{
    width: 100% !important;   /* 既存のclamp幅を上書き */
    height: auto !important;  /* 正方形固定を解除 */
    padding: 12px 14px;       /* タップ余白を確保 */
  }

  /* アイコンサイズは固定（本文とバランス良く） */
  .sec-cta .click-cta img{
    width: 48px !important;
    height: auto;
  }

  /* テキストは下に（既にcolumn指定済み） */
  .sec-cta .cta-text{
    margin-top: 8px;
    font-size: 15px;          /* ちょい大きめでも可（任意） */
  }
}
@media (prefers-reduced-motion: reduce){
  .sec-cta .click-cta{ transition: none; }
}

/* クリック領域内のテキスト配置（縦並び） */
.sec-cta .click-cta {
  flex-direction: column;
  text-decoration: none;
  color: inherit;
}

/* テキスト部の調整 */
.sec-cta .cta-text {
  font-size: clamp(14px, 1.2vw, 16px);
  font-weight: 600;
  line-height: 1.4;
  margin-top: 8px;
}




/* ---- 下層共通 ---- */
/* ===== ページヘッダー ===== */
.page-header { margin: 24px 0; }
.tit-header {
  margin: 0 0 8px;
  font-size: clamp(1.8rem, 2.6vw + 1rem, 2.6rem);
  line-height: 1.3;
  font-weight: 800;
}

@media only screen and (max-width: 576px) {
  .tit-header, .work .post-title, .single .post-title {
    font-size: 1.4rem!important;
  }
}










/* ---- TOP ---- */
.logo-top { width:1250px; margin:0 auto; padding:10px 0;}
@media (max-width: 991px) {
  .logo-top {
    display:none;
    visibility:hidden;
  }
}
.mask-container {
    max-width: 1000px;
    width: 100%;
    aspect-ratio: 1000 / 465;
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: center;
    border-radius: 30px;
    margin-top: 25px;
}
.images-container {
    display: flex;
    width: 1300px;
    height: 465px;
}
.slide-container {
    width: 800px;
    height: 800px;
    overflow: hidden;
    position: relative;
    transform: rotate(-30deg);
    margin: 0 20px;
    margin-top: -155px;
}
.slide-image {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}



@media only screen and (max-width: 991px) {
  @keyframes slide {
      0% {
          transform: translateX(50%);
      }
      100% {
          transform: translateX(-100%);
      }
  }
  .navi-side {
      display:none;
      visibility: hidden;
  }
  .mask-container {
      max-width: 100%;
      width: 100%;
      border-radius: 10px;
      margin-top:5px;
      height: 450px;
  }
  .images-container {
      width:1100px;
      height:393px;
  }
}
@media only screen and (max-width: 576px) {
  .images-container {
      width:700px;
      height:250px;
  }
  .leadtext h1 {
      font-size:22px!important;
  }
  .leadtext h1 span {
      font-size:18px!important;
      margin-top:10px;
  }
}





.leadtext {
    text-align: left;
    /*font-size: 30px!important;*/
    font-weight: bold;
    margin-top:20px;
    line-height: 1.35;
}
.leadtext h1 {
    color:#ec5f60;
    font-weight:bold;
    font-size:29px;
}
.leadtext h1 span {
    color:#323232;
    display:block;
    /*font-size:20px!important;*/
    font-size:26px;
}
.box-leadbody {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    margin-top:20px;
}
.box-leadbody p {
    column-count: 2;
    column-gap: 30px;
    width: 1000px;
    /*font-size:20px;*/
    font-weight:normal;
    line-height: 1.75;
    margin:0!important;
    padding:0!important;
}
.box-leadbody .left, .box-leadbody .right {
    flex:1;
}

@media only screen and (max-width: 1200px) {
    .box-leadbody {
        display:block;
        width: 100%;
    }
    .box-leadbody p {
        width: 100%;
    }
}
@media only screen and (max-width: 850px) {
    .box-leadbody p {
        column-count: 1;
        column-gap: 0px;
    }
    .leadtext {
      margin-top:5px!important;
    }
    .leadtext h2 {
      /*font-size:24px!important;*/
    }
    .leadtext h2 span {
        margin-top:5px;
        /*font-size:20px!important;*/
    }
}





.sec-works {
    display:flex;
    gap:25px;
    margin-top:140px;
    text-align: left;
    width: 1000px;
  }
  .sec-works div:first-child {
    text-align: left;
    flex: 0 0 250px;
  }
  .sec-works .btn, .sec-attract .btn {
    color: var(--orangered);
    border:1px solid var(--orangered);
    border-radius:50px;
    display:inline-block;
    text-align: center;
    margin-top:25px;
    padding:8px 20px;
    /*font-size:18px;*/
    transition:0.5s ease;
  }
  .sec-work .btn:hover, .sec-attract .btn:hover {
    background:var(--orangered);
    color:#fff;
  }
  .card04 .swiper-slide {
    width:340px;
    margin-right:40px;
  }
  @media only screen and (max-width: 991px) {
    .sec-works {
      display:block;
      gap:25px;
      margin-top:100px;
      width:100%;
    }
    .sec-works div:first-child {
      margin-bottom:20px;
    }
    .sec-works .btn {
      margin-top:15px;
    }
    .card04 .swiper-slide {
      width:100%;
      margin-right:40px;
    }
  }
  .card04 .swiper-button-prev::before, .card04 .swiper-button-next::before {
  background-color: var(--orangered);
}





.sec-service, .sec-attract {
    display:flex;
    gap:25px;
    margin-top:140px;
    text-align: left;
  }
.sec-service h2, .sec-attract h2, .sec-works h2, .sec-blog h2 {
    color: var(--orangered);
  }
  
  .sec-service h2 span, .sec-attract h2 span, .sec-works h2 span, .sec-blog h2 span {
    display:block;
    font-size:18px;
    font-weight:normal;
    color:#323232;
  }
  .sec-service div, .sec-attract div {
    text-align: center;
    flex:1;
  }
  .sec-service div img, .sec-attract div img, .sec-works img, .sec-blog img {
    border-radius: 15px!important;
  }
  .sec-service div:first-child, .sec-attract div:first-child {
    text-align: left;
    flex: 0 0 250px;
  }
  .sec-service h3, .sec-attract h3 {
    /*font-size:20px;*/
    line-height: 1.35;
    margin-top:10px;
    text-align: left;
  }
  .sec-attract h3 {
    font-weight: normal;
    text-align: left;
    font-size:1.5rem;
  }
  
  .sec-service a, .sec-attract a {
    color: var(--black);
    text-decoration: none;
    transition: opacity 0.3s ease;
  }

  .sec-service a img, .sec-attract a img {
    transition: opacity 0.3s ease;
  }

  /*.sec-service a:hover, .sec-service a:hover img
  , .sec-attract a:hover, .sec-attract a:hover img {
    opacity: 0.45;
  }*/

  @media only screen and (max-width: 991px) {
    .sec-service {
      display:block;
      margin-top:0px!important;
    }
    .sec-attract, .sec-works, .sec-blog {
      display:block;
      margin-top:40px!important;
    }
    .sec-service div img, .sec-attract div img {
      width:100%;
    }
    .sec-service div:nth-child(2) , .sec-attract div:nth-child(2) {
      margin-bottom: 40px;
    }
  }




/* 見出しカラム（左）のレイアウトはそのまま */
.sec-service div:first-child { text-align:left; flex:0 0 250px; }

/* ▼サービスのカードをGridで並べる */
.sec-service .service-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr)); /* PC：2列 */
  gap: 28px 36px; /* 行間/列間 */
  align-content: start;
}

.sec-service .service-card{
  display: block;
  text-decoration: none;
  color: var(--black);
  transition: opacity .3s ease;
}

.sec-service .service-card img{
  width: 100%;
  height: auto;
  display: block;
  border-radius: 15px !important; /* 既存ルール踏襲 */
}

.sec-service .service-card h3{
  margin-top: 10px;
  line-height: 1.35;
}

/* Hover（必要ならON） */
/*
.sec-service .service-card:hover,
.sec-service .service-card:hover img{ opacity:.85; }
*/

/* ▼スマホ：1列。DOM順＝表示順（1→2→3→4） */
@media (max-width: 991px){
  .sec-service { display:block; } /* 既存ルール踏襲 */
  .sec-service .service-grid{
    grid-template-columns: 1fr; /* 1列 */
    gap: 24px;
    margin-top: 20px;
  }
  .sec-service div:first-child{ flex:unset; }
  .sec-service .service-card img{ width:100%; }
}



.sec-blog {
    display:flex;
    gap:25px;
    margin-top:140px;
    text-align: left;
  }
  .sec-blog div:first-child {
    text-align: left;
    flex: 0 0 250px;
  }
  .sec-blog .btn {
    color: var(--orangered);
    border:1px solid var(--orangered);
    border-radius:50px;
    display:inline-block;
    text-align: center;
    margin-top:40px;
    padding:8px 20px;
    /*font-size:18px;*/
    transition:0.5s ease;
  }
  .sec-blog .btn:hover {
    background:var(--orangered);
    color:#fff;
  }
  .card02 .swiper-slide img {
    width: 100%;
  }
  .card02 h3, .card04 h3 {
    /*font-size:20px;*/
    line-height:1.45;
    margin-top:10px;
  }

  @media only screen and (max-width: 991px) {
    .sec-blog {
      display:block;
      gap:25px;
      margin-top:0px;
      width:100%;
    }
    .sec-blog div:first-child {
      margin-bottom:20px;
    }
    .sec-blog .btn {
      margin-top:15px;
    }
  }

  .card02 .swiper-slide {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  -webkit-box-shadow:none;
          box-shadow:none;
}
.card02 .slide:hover {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
    -webkit-box-shadow:none;
            box-shadow:none;
  }
  .card02 h3 {
  /*font-size:20px;*/
  font-weight: normal;
}
.card02 time {
  /*font-size:18px;*/
  font-family: "Outfit", sans-serif;
  color: var(--orangered);
}
.card02 .cate {
  /*font-size:18px;*/
  font-family: "Outfit", sans-serif;
  color: var(--orangered);
}
.card02 .swiper-button-prev::before, .card02 .swiper-button-next::before {
  background-color: var(--orangered);
}

.card02 .swiper-button-disabled {
  pointer-events: none;
  opacity: 0;
}
.card02 .swiper-button-disabled::before {
  -webkit-box-shadow:none;
          box-shadow:none;
}










:root{--swiper-theme-color:#007aff}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}.swiper-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-pointer-events{touch-action:pan-y}.swiper-pointer-events.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d,.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide,.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-horizontal.swiper-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-vertical.swiper-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center}

:root {
  --easing: cubic-bezier(.2, 1, .2, 1);
  --transition: .8s var(--easing);
  --color-gray: #ddd;
  --color-theme: #f5695f;
  --box-shadow: .8rem .8rem 1.2rem rgba(0, 0, 0, .05), -.8rem -.8rem 1.2rem #fff;
  --box-shadow-hover: 1rem 1rem 1.5rem rgba(0, 0, 0, .08), -1rem -1rem 1.5rem #fff;
  --box-shadow-inset: inset .8rem .8rem 1.2rem rgba(0, 0, 0, .05), inset -.8rem -.8rem 1.2rem #fff;
  --box-shadow-dark: .8rem .8rem 1.2rem rgba(0, 0, 0, .1), -.8rem -.8rem 1.2rem rgba(#fff,.2);
}

/*html {
  font-size: 62.5%;
  line-height: 1.8;
  height: 100%;
}*/

.l-inner {
  position: relative;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  max-width: 725px;
  padding: 0;
}

/* slider */
[class*=swiper]:focus {
  outline: none;
}

.slide-media,
.thumb-media {
  position: relative;
  overflow: hidden;
}
.slide-media img,
.thumb-media img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* 前へ / 次へボタン */
.swiper-button-prev, .swiper-button-next {
  display: grid;
  place-content: center;
  width: 2.8rem!important;
  height: 2.8rem!important;
  cursor: pointer;
  -webkit-transition: var(--transition);
  transition: var(--transition);
}
@media only screen and (min-width: 1025px) {
  .swiper-button-prev::before, .swiper-button-next::before {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .swiper-button-prev:hover::before, .swiper-button-next:hover::before {
    -webkit-transform: scale(1.0);
            transform: scale(1.0);
  }
}
.swiper-button-prev::before, .swiper-button-next::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: "";
  border-radius: 50%;
  /*-webkit-box-shadow: var(--box-shadow);
          box-shadow: var(--box-shadow);*/
}
.swiper-button-prev::after, .swiper-button-next::after {
  width: 1.2rem;
  height: 1.2rem;
  content: "";
  border: solid #fff;
  border-width: 3px 3px 0 0;
}
.swiper-button-prev::after {
  margin-left: 0.6rem;
  -webkit-transform: rotate(-135deg);
          transform: rotate(-135deg);
}
.swiper-button-next::after {
  margin-right: 0.6rem;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.swiper-button-disabled {
  pointer-events: none;
  opacity: 0;
}


/* ---- swiperの上書き ---- */
.card02 {
  /* コンテナ */
  overflow: hidden;
  /* コントローラー */
  /* ページネーション */
  /* 前へ / 次へボタン */
  /* スライド */
}
.card02 .swiper {
  overflow: visible;
}
.card02 .swiper-controller {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 1.6rem;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 0px!important;
}
.card02 .swiper-pagination {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  gap: 1.2rem 0.8rem;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin: 0 auto 0 0;
  text-align: center;
}
.card02 .swiper-pagination-bullet {
  width: 1.6rem;
  height: 3px;
  cursor: pointer;
  -webkit-transition: var(--transition);
  transition: var(--transition);
  vertical-align: top;
  background-color: var(--color-gray);
}
.card02 .swiper-pagination-bullet-active {
  width: 4rem;
  background-color: var(--color-theme);
}
.card02 .swiper-button-prev, .card02 .swiper-button-next {
  position: relative;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
  margin: 0;
}
.card02 .swiper-button-disabled {
  pointer-events: none;
  opacity: 0;
}

.card02 .swiper-slide {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  /*-webkit-box-shadow: var(--box-shadow);
          box-shadow: var(--box-shadow);*/
}
.card02 .slide {
  overflow: hidden;
  width: 36rem;
  border-radius: 4px;
}
@media only screen and (max-width: 599px) {
  .card02 .slide {
    width: 24rem;
  }
}
@media only screen and (min-width: 1025px) {
  .card02 .slide {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .card02 .slide img {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .card02 .slide:hover {
    -webkit-transform: translateY(-16px);
            transform: translateY(-16px);
    -webkit-box-shadow: var(--box-shadow-hover);
            box-shadow: var(--box-shadow-hover);
  }
  .card02 .slide:hover img {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
.card02 .slide-media {
  padding-top: 62.5%;
}
.card02 .slide-media img {
  height:100%;

}

.card02 .slide-title {
  line-height: 1.6;
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  /*font-size:24px;*/
}




.card04 {
  overflow: hidden;
}
.card04 .swiper {
  overflow: visible;
}
@media only screen and (max-width: 1024px) {
  .card04 .swiper {
    padding: 0 20px;
  }
}
.card04 .swiper-button-prev, .card04 .swiper-button-next {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 80px;
  margin: auto;
}
.card04 .swiper-button-prev::before, .card04 .swiper-button-next::before {
  background-color: var(--orangered);
  /*-webkit-box-shadow: var(--box-shadow-dark);
          box-shadow: var(--box-shadow-dark);*/
}
.card04 .swiper-button-prev::after, .card04 .swiper-button-next::after {
  border-color: #fff;
}
.card04 .swiper-button-prev {
  right: calc(100% - 1.6rem);
}
@media only screen and (max-width: 1024px) {
  .card04 .swiper-button-prev {
    right: calc(100% - 2.85rem);
  }
}
.card04 .swiper-button-next {
  left: calc(100% - 1.6rem);
}
@media only screen and (max-width: 1024px) {
  .card04 .swiper-button-next {
    left: calc(100% - 2.85rem);
  }
}
.card04 .swiper-a:not(.swiper-initialized) {
  padding: 0;
}
.card04 .swiper-a:not(.swiper-initialized) .swiper-button-prev,
.card04 .swiper-a:not(.swiper-initialized) .swiper-button-next {
  display: none;
}
.card04 .swiper-a:not(.swiper-initialized) .swiper-wrapper {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap:0px;
}
.card04 .swiper-b:not(.swiper-initialized) {
  padding: 0;
}
.card04 .swiper-b:not(.swiper-initialized) .swiper-button-prev,
.card04 .swiper-b:not(.swiper-initialized) .swiper-button-next {
  display: none;
}
.card04 .swiper-b:not(.swiper-initialized) .swiper-wrapper {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .card04 .swiper-b:not(.swiper-initialized) .swiper-wrapper {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
}
@media only screen and (max-width: 599px) {
  .card04 .swiper-b:not(.swiper-initialized) .swiper-wrapper {
    grid-template-columns: repeat(1, 1fr);
  }
}
.card04 .slide {
  height: 100%;
  overflow: hidden;
  border-radius: 4px;
  margin-bottom:40px;
}
.card04 .swiper-slide {
  width:300px;
}
.card04 .slide img {
  width: 100%;
  height: auto;
  border-radius:8px;
}
@media only screen and (min-width: 1025px) {
  .card04 .slide {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .card04 .slide img {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .card04 .slide:hover {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
  }
  .card04 .slide:hover img {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

.card04 h3 {
  /*font-size:20px;*/
  font-weight: normal;
}
.card04 a {
  color:initial;
}



#blog-swiper .swiper-button-prev,
#blog-swiper .swiper-button-next {
  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0;
  padding: 0;
  line-height: 1;
}

#blog-swiper .swiper-button-prev:hover,
#blog-swiper .swiper-button-next:hover,
#blog-swiper .swiper-button-prev:active,
#blog-swiper .swiper-button-next:active,
#blog-swiper .swiper-button-prev:focus,
#blog-swiper .swiper-button-next:focus {
  background: none !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

#blog-swiper .swiper-button-prev:focus-visible,
#blog-swiper .swiper-button-next:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}


/* --- Work swiper: ボタンのベースをまずリセット --- */
#work-swiper .swiper-button-prev,
#work-swiper .swiper-button-next {
  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0;
  appearance: none; /* Safari/iOS含むUAデフォルト対策 */
}

/* Firefoxのボタン内側ボーダー対策 */
#work-swiper .swiper-button-prev::-moz-focus-inner,
#work-swiper .swiper-button-next::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/* 既存の状態別指定（ホバー/アクティブ/フォーカス）も維持 */
#work-swiper .swiper-button-prev:hover,
#work-swiper .swiper-button-next:hover,
#work-swiper .swiper-button-prev:active,
#work-swiper .swiper-button-next:active,
#work-swiper .swiper-button-prev:focus,
#work-swiper .swiper-button-next:focus {
  background: none !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* アクセシビリティのフォーカスリング */
#work-swiper .swiper-button-prev:focus-visible,
#work-swiper .swiper-button-next:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* もし矢印の色付きブロックが出る場合（::afterに背景色やmaskが付与されているケース） */
#work-swiper .swiper-button-prev::after,
#work-swiper .swiper-button-next::after {
  background: none !important;           /* 背景色由来なら無効化 */
  background-color: transparent !important;
  /* ↓デフォルト矢印を残したいなら触らない。矢印ごと消したいなら以下を有効化
  -webkit-mask: none !important;
  mask: none !important;
  content: "" !important;
  */
}

/***********追加分*****************************/
/* ボタンを一番上に（スマホで確実にタップを拾う） */
#work-swiper .swiper-button-prev,
#work-swiper .swiper-button-next,
#blog-swiper .swiper-button-prev,
#blog-swiper .swiper-button-next {
  z-index: 50;            /* 重要 */
  pointer-events: auto;   /* 念のため */
}

/* はみ出したスライドがボタンを覆わないように（特にworks） */
.card04 .swiper { 
  overflow: hidden;       /* ここが効きます。今は visible になっている */
}

/* 念のため、スライドの積層順を下げる（被り事故回避） */
.swiper-slide {
  position: relative;
  z-index: 1;
}

/* 右・左のタップ帯域を広げる（見た目はそのまま） */
#work-swiper .swiper-button-prev,
#work-swiper .swiper-button-next {
  --tap-padding: 24px; /* 好みで */
}

/* 見た目の丸アイコンは 2.8rem のまま、当たり判定だけ広げる */
#work-swiper .swiper-button-prev::before,
#work-swiper .swiper-button-next::before {
  pointer-events: none; /* 見た目レイヤーはタップを奪わない */
}

#work-swiper .swiper-button-prev,
#work-swiper .swiper-button-next {
  padding: var(--tap-padding); /* 透明のヒットエリアを追加 */
}
.card04 .swiper { overflow: visible; }     /* ← これが主犯 */
.card04 .slide:hover { transform: translateY(10px); } /* ← モバイルで不要 */

@media (hover: none) and (pointer: coarse) {
  .card02 .slide:hover,
  .card04 .slide:hover { transform: none; box-shadow: none; }
}

/* GPUレイヤー化でカクつき減らす */
#blog-swiper .swiper-wrapper,
#blog-swiper .swiper-slide,
#work-swiper .swiper-wrapper,
#work-swiper .swiper-slide {
  will-change: transform!important;
}

#work-swiper .swiper-slide,
#blog-swiper .swiper-slide {
  display: block;
  /* 必要なら */
  /* pointer-events: auto; */
}







/* ---- サービス一覧 ---- */
.service .sec-title { position: absolute; left: -9999px; } /* 視覚非表示 */

.service .sec-service {
    margin-top:0px;
  }
.service .sec-service .card-text {
  margin-top:10px;
  text-align:left;
}



/* ---- サービス下層 ---- */
.service .section-content h3 {
  font-size: 2rem;
  margin-top:50px;
  color: var(--orangered);
}

.service .section-content h4 {
  font-size: 1.3rem;
  margin: 1.8em 0 0.5em;
  font-weight: 600;
}

.service .section-content p {
  margin-bottom: 1.4em;
}



/* ----- 図表エリア ----- */
.service .fig-compare,
.service .fig-theory {
  margin: 24px 0 36px;
}

.service .fig-compare img,
.service .fig-theory img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  /*box-shadow: 0 4px 16px rgba(0,0,0,0.1);*/
}

.service .fig-compare figcaption,
.service .fig-theory figcaption {
  font-size: 1.0rem;
  color: #666;
  margin-top: 8px;
}


/* ----- 定義リスト（BtoB/BtoC比較） ----- */
.service .def-compare {
  margin: 16px 0 32px;
  /*border-left: 3px solid var(--orangered);
  padding-left: 1em;*/
}

.service .def-compare dt {
  font-weight: 700;
  margin-top: 12px;
  color: #222;
}

.service .def-compare dd {
  margin: 4px 0 12px 0;
  color: #555;
}

.service .u-visually-hidden, .work .u-visually-hidden{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


/* ----- CTA（シンプルタイプ）----- */
.service .section-cta {
  margin-top: 80px;
}

.service .cta-panel {
  background: none;
  border: none;
  padding: 0;
}

.service .cta-text {
  font-size: 1.05rem;
  line-height: 1.9;
  color: #333;
  margin-bottom: 28px;
}

.service .cta-actions ul {
  list-style-type: disc;
  margin-left:20px;
}
.service .cta-actions a {
  color: var(--orangered);
}

/* ボタン（シンプルリンク風） */
.service .cta-actions .btn {
  padding: 10px 20px;
  display: block;
  background: #fff;
  color: #333;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.service .cta-actions .btn:hover {
  background: var(--orangered);
  border-color: var(--orangered);
  color: #fff;
}

.service .btn.is-current {
  pointer-events: none;
  opacity: 0.6;
  background: #f6f6f6;
  color: #999;
}








/* ---- 弊社の特長と強み ---- */
.attracts .area-main{max-width:1100px;margin:0 auto;}

.attracts .header-visual{margin:12px 0 28px}
.attracts .hero-grid{
  display:grid;
  grid-template-columns: 420fr 580fr; /* だいたい左：右 ≒ 42:58 */
  align-items:center;
  gap:28px;
}
.attracts .hero-media img{width:100%;height:auto;display:block}
.attracts .hero-heading{font-size:1.5rem;line-height:1.6;margin:0}
.attracts .marker_yellow{
  background:linear-gradient(transparent 65%, #fff59d 0); /* マーカー風 */
}

/* ====== section blocks ====== */
.attracts .area-section{margin:40px 0 56px}
.attracts .sec-title{font-size:1.4rem;line-height:1.5;margin:0 0 16px}

/* ====== text-with-side ====== */
/* 「本文を左に固定幅」「右にサイド余白（画像/注釈）」 */
.attracts .content-grid{
  display:grid;
  grid-template-columns: minmax(0, 660px) minmax(0, 1fr); /* 本文は最大680px */
  justify-content:start; /* 左寄せに配置 */
  column-gap:40px;
  row-gap:16px;
  align-items: start;
  /* 右カラムは空でもそのまま白余白が残る */
}

.attracts .content-main{max-width:660px}
.attracts .content-main p{line-height:1.9;margin:0 0 16px;color:#222}
.attracts .content-main blockquote{
  margin:8px 0 18px;
  padding:14px 16px;
  background:#f6f7f8;
  border-left:4px solid #e2e5e9;
  color:#333;
}
.attracts .quote-cite{margin-top:8px;text-align:right;color:#666;font-size:.9rem}

.attracts .content-aside{
  position: static !important; /* sticky / fixed を上書き */
  top: auto !important;
}
.attracts .aside-media{margin:0 0 16px;overflow:hidden;}
.attracts .aside-media img{display:block;width:100%;height:auto}
.attracts .area-main .content-aside figure{ margin-top: -20px; }

/* 画像を縦に2枚置く想定の間隔 */
.attracts .content-aside .aside-media + .aside-media{margin-top:20px}

/* ====== strengths ====== */
.attracts .strength-list{list-style:none;margin:0;padding:0}
.attracts .strength-item{padding:20px 0}
.attracts .strength-title{font-size:1.05rem;margin:0 0 6px}
.attracts .strength-desc{margin:0;color:#333;line-height:1.9}

/* ====== responsive ====== */
@media (max-width: 1024px){
  .attracts .hero-grid{grid-template-columns:1fr;gap:16px}
  .attracts .hero-heading{font-size:1.3rem}
  .attracts .content-grid{
    grid-template-columns: 1fr; /* 縦積み */
  }
  .attracts .content-aside{max-width:100%}
}













/* ---- FAQ よくある質問 ---- */


.faq-nav{ margin-top:20px; }
.faq-nav ul{
  list-style:none;
  margin:0; padding:0;
  display:flex;
  flex-wrap:wrap;      /* ここで折り返す */
  gap:10px;            /* li間の余白 */
}
.faq-nav li{ line-height:1; } /* 必要なら調整 */
.faq-nav a{
  display:inline-block;
  padding:8px 14px;
  border:1px solid var(--orangered);
  border-radius:9999px;
  text-decoration:none;
  color:var(--orangered);
}
.faq-nav a:hover{ background:var(--orangered); color:#fff; }
/*.faq-nav ul li a.none-href {
  color:#fff;
  background:#c83230;
  pointer-events:none;
}*/



/*
.faq h2 {
  color: var(--orangered);
}*/
.faq-category {
  margin-left:10px;
  margin-top:40px;
}
.faq-category .faq {
  margin-bottom:40px;
}
.faq-category .faq:last-child {
  margin-bottom:80px;
}
.faq h3 {
  font-weight: bold;
  /*font-size:26px;*/
}
.faq .faq-answer {
  /*font-size:22px;*/
}
.faq article a {
  color: var(--orangered);
  text-decoration: underline;
}


/* ---- sitemap ---- */
.sitemap ul li ul {
  margin-left:30px;
}



/* ---- company ---- */
/* 定義リストの行レイアウト（スマホ→PCで2列などに） */

/* 見出しまわり（現行踏襲） */
.company h2 {
  margin-top: 50px;
  /*color: var(--orangered);*/
}

/* 代表紹介（現行踏襲） */
.company .my-profile p { margin-bottom: 30px; }
.company .my-profile p a { color: var(--orangered); }
.company .my-profile ul { margin-left: 20px; }

/* 会社概要DL：仕様準拠レイアウト（dt/ddのみ） */
.company-defs {
  display: grid;
  grid-template-columns: 10em 1fr; /* 左ラベル幅は調整可 */
  column-gap: 1rem;
  row-gap: .75rem;
  margin: 1rem 0;
}

.company-defs > dt,
.company-defs > dd {
  margin: 0;
}

/* 行ごとの区切り線/余白（視覚維持用） */
.company-defs > dt,
.company-defs > dd {
  padding-top: .75rem;
  border-top: 1px solid var(--border-color, #e5e7eb);
}

/* 先頭行だけ線なし */
.company-defs > dt:first-of-type,
.company-defs > dd:first-of-type {
  border-top: none;
  padding-top: 0;
}

/* ラベル側の体裁 */
.company-defs > dt { font-weight: 700; }

/* リストの余白整え */
.company-defs dd ul {
  margin: .25rem 0 0;
  padding-left: 1.2em;
}

/* 住所の体裁（インラインstyle撤去前提） */
.profile address {
  font-style: normal;
}

/* 主要取引先の段組み */
.client-list {
  columns: 2;
  column-gap: 2rem;
  margin: .25rem 0 0;
  padding-left: 1.2em;
}

/* 画像（現行踏襲） */
figure { margin: 0 0 1rem; }

/* スマホ：1カラムに落とす */
@media (max-width: 768px) {
  .company-defs {
    grid-template-columns: 1fr;
    row-gap: .25rem;
  }
  .company-defs > dt {
    margin: 0 0 .25rem;
    border-top: none;            /* モバイルは区切りをdd側に集約 */
    padding-top: 0;
  }
  .company-defs > dd {
    margin: 0 0 1rem;
    padding-top: 0;
    border-top: none;
    border-bottom: 1px solid var(--border-color, #e5e7eb);
    padding-bottom: .75rem;
  }
  .company-defs > dd:last-of-type {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
  }
  .client-list { columns: 1; }
}









/* ========== 問い合わせページ ========== */
/*.contact .area-main {
  max-width: 900px;
  margin: 0 auto;
  padding: 2rem 1rem;
}*/

/* 説明部分 */
.contact .form-lead {
  margin-bottom: 2.5rem;
}
.contact .form-lead p {
  margin-bottom: 1rem;
  line-height: 1.7;
}

/* 連絡方法ブロック */
.contact .form-body {
  display: grid;
  gap: 2rem;
}


.block-contact {
  margin-bottom: 3rem;
}
.block-contact h2 {
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: .5rem;
  color: var(--orangered, #c83230);
}

/* 電話番号リスト */
.block-contact ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.block-contact ul li {
  margin-bottom: .5rem;
  font-size: 1.1rem;
}
.block-contact ul li a {
  /*color: var(--orangered, #c83230);*/
  text-decoration: none;
}
.block-contact ul li a:hover {
  text-decoration: underline;
}

/* LINE */
.block-contact p a {
  font-size: 1.2rem;
  font-weight: 600;
  /*color: #06c755; */
  text-decoration: none;
}
.block-contact p a:hover {
  text-decoration: underline;
}

.block-contact-form {
  margin-top: 2rem;
}
.block-contact-form h2 {
  margin-bottom: 1rem;
}

/* 問い合わせフォーム */
/* ========== Contact / Form 基本 ========== */
.wpcf7 form {
  --input-bg: #fff;
  --input-bd: #cfcfcf;
  --input-bd-hover: #b9b9b9;
  --input-bd-focus: #c83230;       /* キーカラーに合わせて */
  --input-radius: 8px;
  --input-pad: .8rem .95rem;
  --shadow-focus: 0 0 0 3px rgba(200,50,48,.15);
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN",
          "Noto Sans JP", "Yu Gothic UI", "Yu Gothic", "Meiryo", sans-serif;
  font-family: var(--font);
}

/* ラベル（CF7は <label>〜</label> で出ます） */
.wpcf7-form label {
  display: block;
  font-weight: 600;
  margin: 1rem 0 .4rem;
}

/* 必須マーク（CF7の .required） */
.wpcf7-form .required { color: var(--input-bd-focus); }

/* テキスト・メール・URL・TEL・日付・数値・テキストエリアの共通 */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="date"],
.wpcf7-form input[type="number"],
.wpcf7-form textarea {
  width: 100%;
  box-sizing: border-box;
  background: var(--input-bg);
  border: 1px solid var(--input-bd);
  border-radius: var(--input-radius);
  padding: var(--input-pad);
  line-height: 1.6;
  font-size: 1rem;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.wpcf7-form input:hover,
.wpcf7-form textarea:hover {
  border-color: var(--input-bd-hover);
}

.wpcf7-form input:focus,
.wpcf7-form textarea:focus {
  outline: none;
  border-color: var(--input-bd-focus);
  box-shadow: var(--shadow-focus);
}

/* ========== セレクト（プルダウン） ========== */
/* ネイティブの矢印を消して、カスタム矢印を背景画像で表示 */
.wpcf7-form select {
  width: 100%;
  box-sizing: border-box;
  appearance: none;           /* 主要ブラウザ */
  -webkit-appearance: none;   /* Safari/iOS */
  -moz-appearance: none;      /* Firefox */
  background-color: var(--input-bg);
  border: 1px solid var(--input-bd);
  border-radius: var(--input-radius);
  padding: var(--input-pad);
  padding-right: 2.5rem;      /* 右にアイコン分の余白 */
  font-size: 1rem;
  line-height: 1.6;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right .7rem center;
  background-size: 22px 22px;
}

.wpcf7-form select:hover { border-color: var(--input-bd-hover); }

.wpcf7-form select:focus {
  outline: none;
  border-color: var(--input-bd-focus);
  box-shadow: var(--shadow-focus);
}

/* iOSの右側余白の微調整（必要時） */
@supports (-webkit-touch-callout: none) {
  .wpcf7-form select { padding-right: 2.2rem; }
}

/* ========== チェックボックス/ラジオ ========== */
.wpcf7-form input[type="checkbox"],
.wpcf7-form input[type="radio"] {
  accent-color: var(--input-bd-focus); /* 近代ブラウザのテーマカラー */
}

/* ========== 送信ボタン ========== */
.wpcf7-form input[type="submit"] {
  display: inline-block;
  border: none;
  border-radius: 9999px;
  background: var(--input-bd-focus);
  color: #fff;
  padding: .85rem 1.6rem;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  transition: transform .06s ease, filter .15s ease, box-shadow .15s ease;
  box-shadow: 0 3px 10px rgba(200,50,48,.25);
}
.wpcf7-form input[type="submit"]:hover { filter: brightness(1.05); }
.wpcf7-form input[type="submit"]:active { transform: translateY(1px); }

/* ========== エラーメッセージ/成功メッセージ（CF7） ========== */
.wpcf7-not-valid-tip {
  color: #b00020;
  font-size: .9rem;
  margin-top: .25rem;
}
.wpcf7-response-output {
  margin-top: 1rem;
  border: 1px solid #e5e5e5;
  border-left: 4px solid var(--input-bd-focus);
  padding: .8rem 1rem;
  background: #fff;
}

/* ========== 細かいUI ========== */
.wpcf7-form ::placeholder { color: #999; }
@media (prefers-reduced-motion: reduce) {
  .wpcf7-form * { transition: none !important; }
}
/* 各入力ブロックの間隔 */
.form-group {
  margin-bottom: 3.0rem; /* 1.5〜2remあたりで調整 */
}

/* 項目名の <p> の余白を整える */
.form-group > p {
  margin: 0 0 .5rem; /* 下だけ少し空ける */
  font-weight: 600;  /* 必須ラベルを見やすく */
}

/* 入力エリア全体を100%幅に */
.form-item p {
  margin: 0;
}

/* Contact Form 7 送信ボタン */
.contact .btn.btn-form {
  display: inline-block;
  background-color: var(--orangered);
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  padding: 12px 40px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.contact .btn.btn-form:hover {
  background-color: var(--orangered);
}

.contact .btn.btn-form:active {
  background-color: #111;
  transform: scale(0.97);
}

/* .hvr-btn のアニメーション（ふんわり浮く感じ） */
.contact .hvr-btn {
  display: inline-block;
  position: relative;
  z-index: 1;
}

.contact .btn.btn-form::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: rgba(255,255,255,0.2);
  transition: all 0.4s ease;
  z-index: 0;
}

.contact .btn.btn-form:hover::before {
  left: 0;
}






/* ========== サンクスページ ========== */
/* 本文メッセージ */
.contacgt .section-confirm p {
  margin-bottom: 1.5rem;
  line-height: 1.7;
  font-size: 1.05rem;
}

/* ===== トップページへ戻るボタン ===== */
.contacgt .section-next {
  margin-top: 2.5rem;
}

.contacgt .btn-back-home {
  display: inline-block;
  padding: 10px 20px;
  border: 1px solid var(--orangered, #c83230);
  border-radius: 9999px; /* pill型 */
  text-decoration: none;
  color: var(--orangered, #c83230);
  font-size: 1rem;
  font-weight: 600;
  transition: background 0.2s, color 0.2s;
}

.contacgt .btn-back-home:hover {
  background: var(--orangered, #c83230);
  color: #fff;
}

/* ===== 補足文（お急ぎの方への案内） ===== */
.contacgt .area-main > p {
  margin-top: 2rem;
  font-size: 0.95rem;
  line-height: 1.6;
}
.contacgt .area-main > p a {
  color: var(--orangered, #c83230);
  text-decoration: none;
  font-weight: 600;
}
.contacgt .area-main > p a:hover {
  text-decoration: underline;
}






/* ========== 個人情報保護方針 ========== */
.privacy-policy h2 {
  color: var(--orangered);
  margin-top:40px;
}
.privacy-policy ol li {
  list-style:disc;
  margin-left:20px;
  margin-top: 10px;
}
.policy-meta {
  margin-top: 30px;
  font-size: 0.98rem;
}



/* ========== ブログ一覧 ========== */
  /* ---- ブログカテゴリナビ ---- */
.nav-cate {
  margin-top: 20px;
  margin-bottom: 40px;
}

.nav-cate ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;   /* 折り返し対応 */
  gap: 10px;         /* li間の余白 */
}

.nav-cate li {
  line-height: 1;
}

.nav-cate a {
  display: inline-block;
  padding: 8px 14px;
  border: 1px solid var(--orangered);
  border-radius: 9999px;   /* pill型 */
  text-decoration: none;
  color: var(--orangered);
  font-size: 0.95rem;      /* 少し小さめで可読性UP */
  transition: background 0.2s, color 0.2s;
}

.nav-cate a:hover {
  background: var(--orangered);
  color: #fff;
}

/* 現在のカテゴリを強調 */
.nav-cate a[aria-current="page"] {
  background: var(--orangered);
  color: #fff;
  pointer-events: none;   /* クリック不可に */
}



/* 一覧グリッド（スマホ1列） */
.post-list{
  display:grid;
  grid-template-columns: 1fr;
  gap: 30px;          /* カード間の余白 */
  list-style:none;
  margin:0;
  padding:0;
}

/* タブレット以上で2列 */
@media (min-width: 640px){
  .post-list{ grid-template-columns: repeat(2, 1fr); }
}

/* カードの均等高さ＆クリック範囲を広く */
.post-card .card{ height:100%; }
.post-card .card-link{
  display:flex; flex-direction:column; height:100%;
  text-decoration:none; color:inherit;
}
.post-card .card-body{ flex:1; display:flex; flex-direction:column; }
.post-card .card-title{ margin:12px 12px 6px; font-size:1.05rem; line-height:1.5; }
.post-card .card-meta{ margin:0 12px 12px; color:#666; font-size:.9rem; }
.post-card .card-excerpt{ margin:0 12px 12px; color:#444; }


.post-card .card-media { overflow: hidden; } /* なくてもOK */
.post-card .card-media img {
  width: 100%;
  height: auto;      /* ← 比率維持 */
  object-fit: contain; /* 任意：余白出したくないなら削除 */
}
/* 角と影（任意） */
.post-card .card{
  border:1px solid #e5e5e5; border-radius:8px; background:#fff;
  transition:box-shadow .2s, transform .2s;
}
.post-card .card:hover{
  box-shadow:0 6px 18px rgba(0,0,0,.08); transform:translateY(-2px);
}


/* ページャー全体のスタイル */
.pagination-wrapper {
    text-align: center;
    margin: 40px 0;
    clear: both;
}

/* ページネーションリスト（ul要素） */
.pagination-wrapper ul.page-numbers {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}

/* リストアイテム */
.pagination-wrapper ul.page-numbers li {
    display: inline-block;
    margin: 0;
    padding: 0;
}

/* 各ページ番号・前へ・次へボタン */
.pagination-wrapper ul.page-numbers li .page-numbers {
    display: inline-block;
    padding: 6px 8px;
    margin: 0;
    text-decoration: none;
    background-color: transparent;
    border: none;
    color: #666;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.2;
    transition: all 0.2s ease;
    min-width: 24px;
    text-align: center;
}

/* 現在のページ（アクティブ） */
.pagination-wrapper ul.page-numbers li .page-numbers.current {
    background-color: var(--orangered);
    color: #fff;
    cursor: default;
    font-weight: bold;
    border-radius: 2px;
}

/* ホバー効果 */
.pagination-wrapper ul.page-numbers li .page-numbers:hover:not(.current):not(.dots) {
    background-color: var(--orangered);
    color: #fff;
}

/* 前へ・次へボタンの調整 */
.pagination-wrapper ul.page-numbers li .page-numbers.prev,
.pagination-wrapper ul.page-numbers li .page-numbers.next {
    font-weight: normal;
}

/* ドット（省略記号） */
.pagination-wrapper ul.page-numbers li .page-numbers.dots {
    background: none;
    border: none;
    color: #6c757d;
    cursor: default;
    padding: 8px 4px;
}

.pagination-wrapper ul.page-numbers li .page-numbers.dots:hover {
    background: none;
    border: none;
    color: #6c757d;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .pagination-wrapper ul.page-numbers li .page-numbers {
        padding: 6px 10px;
        font-size: 13px;
    }
    
    .pagination-wrapper ul.page-numbers {
        gap: 4px;
    }
}








/* ========== ブログ詳細 ========== */
.single .post-title {
  font-size:2.2rem;
  line-height:1.35;
  margin:30px 0px;
}
.single .ez-toc-container-direction {
  margin-top:30px;
}
.single .article-body h2 {
  margin-top:50px;
}
.single ol {
  margin-left:20px;
}
.single .list {list-style-type:disc; margin-top:20px;}
.single .list li {padding-bottom:15px;}
.single .strong {background:yellow; font-weight:bold;}



./* 記事のメタ */
.single .visually-hidden {
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.single .meta-list {
  display:flex; flex-wrap:wrap; gap:.25rem .75rem;
  list-style:none; margin:0; padding:0;
  margin-bottom:30px;
}
.single .meta-item { display:inline-flex; align-items:baseline; color:#666; font-size:.9rem; }
.single .meta-label { font-weight:600; margin-right:.25em; }
.single .meta-item + .meta-item::before {
  content:""; margin:0 .5em; color:#999;
}
.single .meta-item.cate a { text-decoration:underline; text-underline-offset:2px; }

/*　関連記事 */
.single .area-related-post, .work .area-related-post {
  margin-top:6rem;
}
.single .area-related-post h2, .work .area-related-post h2 {
  font-size: 1.5rem;
  margin-bottom: 1.25rem;
}
.single .related-list, .work .related-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 2列並び */
  gap: 1.5rem; /* カードの間隔 */
  list-style: none;
  margin: 0;
  padding: 0;
}
.single .related-item, .work .related-item {
  margin: 0;
}
.single .related-item .card, .work .related-item .card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: .5rem;
  overflow: hidden;
  height: 100%;
  transition: transform .2s ease, box-shadow .2s ease;
}
.single .related-item .card:hover, .work .related-item .card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 12px rgba(0,0,0,.1);
}
.single .card-media img, .work .card-media img {
  display: block;
  width: 100%;
  height: auto;
}
.single .card-title, .work .card-title {
  font-size: 1.1rem;
  font-weight: 600;
  margin: 1rem;
  line-height: 1.4;
}
.single .card-link, .work .card-link {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit;
  text-decoration: none;
}
@media (max-width: 768px) {
  .single .related-list,
  .work .related-list {
    grid-template-columns: 1fr; /* スマホ時は1列表示 */
  }
}

/* ===== 前後記事ナビゲーション ===== */
.post-nav {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap; /* スマホ対応で自動折り返し */
  margin-top: 60px;
  border-top: 1px solid #ddd;
  padding-top: 20px;
  font-size: 1rem;
}

.post-nav-prev,
.post-nav-next {
  flex: 1 1 50%; /* それぞれ幅50%（PC） */
  box-sizing: border-box;
  padding: 10px 20px;
  line-height: 1.4;
}

.post-nav-prev a,
.post-nav-next a {
  display: block;
  color: #333;
  text-decoration: none;
  word-break: break-word;   /* 長い単語で改行可 */
  white-space: normal;      /* 折り返し許可 */
}

.post-nav-prev a:hover,
.post-nav-next a:hover {
  color: #0077cc;
}

.post-nav-prev {
  text-align: left;
}

.post-nav-next {
  text-align: right;
}

/* ===== スマホ対応（幅768px以下） ===== */
@media (max-width: 768px) {
  .post-nav {
    flex-direction: column;
    gap: 10px;
  }

  .post-nav-prev,
  .post-nav-next {
    flex: 1 1 100%;
    text-align: left;
    padding: 8px 0;
    border: none;
  }

  .post-nav-prev a::before {
    content: "« ";
  }
  .post-nav-next a::after {
    content: " »";
  }
}






/* author */
.single .visually-hidden {
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.single .area-author {
  border: 1px solid #e2e2e2;
  border-radius: 4px;
  padding: 10px;
  margin-top: 32px;
  background: #fff;
}
.single .author-inner {
  display: grid;
  grid-template-columns: 180px 1fr; /* 左180pxの画像、右が本文 */
  gap: 16px;
  align-items: start;
}
.single .author-photo {
  display: block;
  width: 180px;
  height: 180px;
  object-fit: cover;
  border-radius: 4px;
}
.single .author-heading {
  font-size: 0.9rem;
  color: #666;
  margin: 0 0 4px;
}
.single .author-name {
  font-weight: 700;
  font-size: 1.1rem;
  margin: 0 0 8px;
}
.single .author-bio {
  line-height: 1.9;
  margin: 0 0 12px;
}
.single .author-sns ul {
  display: flex;
  gap: 14px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.single .author-sns a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: inherit;
}
.single .author-sns svg {
  display: block;
}
@media (max-width: 640px) {
  .single .author-inner {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .single .author-photo {
    width: 120px;
    height: 120px;
  }
}







/* ========== 実績一覧 ========== */
.work .page-header .page-lead{
  margin-top: 10px;
  color:#444;
  line-height:1.8;
}

/* ========== 実績詳細 ========== */
.work .post-title{
  font-size:2.2rem;
  line-height:1.35;
  margin:30px 0px;
}


/* intro */
.work-head{font-weight:600;font-size:1.05rem;margin:0 0 12px}
.work-desc{margin:0 0 20px;color:#333;line-height:1.9}

/* spec table */
.work-table{width:100%;border-collapse:separate;border-spacing:0;margin:16px 0 24px;font-size:.96rem}
.work-table th,
.work-table td{padding:12px 14px;vertical-align:top;border-bottom:1px solid #eee}
.work-table th{width:12em;color:#333;background:#fafafa;text-align:left;font-weight:600}
.work-table a{word-break:break-all}
@media (max-width:640px){
  .work-table th{width:auto;display:block;border-bottom:none;padding-bottom:6px;background:transparent}
  .work-table td{display:block;padding-top:0}
}

/* gallery */
.work-gallery{display:grid;grid-template-columns:1fr;gap:16px;margin:8px 0 28px}
.work-image{margin:0;border:1px solid #eee;border-radius:8px;overflow:hidden;background:#f7f7f7}
.work-image img{width:100%;height:auto;display:block}



/* content */
.work-content{line-height:1.9;color:#222}
.work-content h2,.work-content h3{margin:28px 0 12px}
.work-content p{margin:0 0 16px}