/* ========== Base ========== */
:root{
  --ink-2:#2a324a;
  --muted:#f5f7fb;
  --card:#ffffff;
  --accent:#3c7cff;
  --primary:#BD2626;
  --radius:16px;
  --shadow:0 10px 30px rgba(10,14,30,.1);
}

*{box-sizing:border-box}
html,body{padding:0;margin:0;font-family:-apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Noto Sans JP", Segoe UI, Roboto, "Helvetica Neue", Arial, "メイリオ", Meiryo, sans-serif;color:#1a1f2e;background:#fff;line-height:1.7}

img{max-width:100%;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{opacity:.9}
h1,h2,h3{margin:0 0 .5em}
p{margin:.6em 0}
.container{max-width:1080px;margin:0 auto;padding:0 20px}
.center{text-align:center}
.mt-24{margin-top:24px}

/* ========== Header ========== */
.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #eef0f6}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand-logo{height:44px;width:auto;display:block}
.header-cta .btn{white-space:nowrap;margin:6px 0}
@media (max-width:640px){
  .site-header .container{padding:0 14px}
  .brand-logo{height:32px}
  .header-cta .btn{padding:8px 12px;font-size:14px;margin:8px 0}
}

/* ========== Buttons ========== */
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:10px 18px;font-weight:700;border:1px solid transparent;transition:.2s box-shadow,.2s transform}
.btn:hover{transform:translateY(-1px)}
.btn-sm{padding:6px 12px;font-size:14px}
.btn-lg{padding:14px 22px;font-size:18px}
.btn-primary{background:var(--primary);color:#fff;border-color:transparent;box-shadow:0 8px 20px rgba(189,38,38,.25)}

/* ========== Hero ========== */
.hero{background:#fff;color:#000;padding:0;margin:0}
.hero-image-full{width:100%;height:auto;display:block;margin:0;padding:0}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;padding:28px 0 24px}
.hero-actions.only-primary{margin-top:0}

/* ========== Sections ========== */
.section{padding:32px 0}
.section-muted{background:var(--muted)}
.section-title{text-align:center;font-size:28px;margin-bottom:16px}
.section-lead{max-width:820px;margin:0 auto 22px;text-align:center;color:#495066}

/* ========== Skillmap ========== */
.skillmap-image{max-width:100%;height:auto;border-radius:8px;box-shadow:var(--shadow)}

/* ========== Cards ========== */
.cards{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:16px}
.cards.three{grid-template-columns:repeat(1,minmax(0,1fr))}
.card{background:var(--card);border:1px solid #e7ecf6;border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.logo-skel{width:120px;height:60px;border-radius:12px;background:linear-gradient(90deg,#e6ecf8,#f4f7fd);margin-bottom:8px;border:1px solid #e6ebf6}
.card .meta{color:#6a7287;font-size:14px}

/* ========== Voices (Testimonials) ========== */
.voice{
  display:flex;
  gap:14px;
  align-items:flex-start;
  background:#fff;
  border:1px solid #e7ecf6;
  border-radius:16px;
  padding:16px 18px;
  box-shadow:0 10px 30px rgba(10,14,30,.08);
  margin:0;
}
.voice .avatar{
  flex:0 0 64px;
  width:64px;height:64px;
  
  display:grid;place-items:center;
  font-weight:700;
  font-size:16px;
}
.voice .voice-body{flex:1}
.voice .voice-head{
  display:flex;gap:8px;align-items:center;
  color:#6a7287;font-size:14px;margin-bottom:4px
}
.voice .voice-head .company{font-weight:700}
.voice p{margin:.4em 0 0;line-height:1.8}

/* ========== Flow ========== */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;justify-items:center;padding-inline-start: 0;}
.flow li{list-style:none;background:#fff;border:1px solid #e7ecf6;border-radius:20px;padding:18px;box-shadow:var(--shadow);text-align:center;max-width:420px;margin:0 auto;display:flex;flex-direction:column;align-items:center}
.flow-img{width:120px;height:auto;margin:4px auto 8px}
.flow h3{margin:.4em 0 .2em;font-size:18px}

/* ========== Form ========== */
.narrow{max-width:880px}
.entry-form{background:#fff;border:1px solid #e7ecf6;border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.field label{font-weight:700;font-size:14px}
.field input[type="text"],.field input[type="email"],.field input[type="tel"],.field input[type="number"],.field select,.field textarea{
  width:100%;padding:12px 12px;border:1px solid #cfd8ea;border-radius:12px;background:#fbfcff;outline:none
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#7aa5ff;box-shadow:0 0 0 3px #7aa5ff33}
.field.checkbox{flex-direction:row;align-items:center;gap:10px}
.form-actions{text-align:center;margin-top:10px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

/* ========== Footer ========== */
.site-footer{padding:28px 0;border-top:1px solid transparent;background:rgb(51 51 51 / var(--tw-bg-opacity, 1))}
.footer-inner{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}
.footer-nav{display:flex;gap:18px;align-items:center}
.site-footer, .site-footer a{color:#fff}
.site-footer a{opacity:0.95}
.site-footer a:hover{opacity:1}
.footer-logo {
  height: 36px;
  width: auto;
  display: block;
}


/* ========== Responsive ========== */
@media (max-width:900px){
  .cards.three{grid-template-columns:repeat(2,1fr)}
  .flow{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .cards.three{grid-template-columns:1fr}
  .grid-2{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .flow{grid-template-columns:1fr;justify-items:center}
  .btn-lg{font-size:16px}
  .footer-inner{justify-content:center;text-align:center}
}


/* ========== Carousel (BizDev) ========== */
#bizdev-jobs .section-title{ margin-bottom: 18px; }

.carousel{
  position:relative;
  overflow:hidden;
  max-width: 920px;
  margin: 0 auto;
}
.carousel-track{
  display:flex;
  transition: transform .6s ease;
  will-change: transform;
}
.carousel-item{
  min-width:100%;
  box-sizing:border-box;
  padding: 20px 22px;
  background: var(--card, #fff);
  border: 1px solid #e7ecf6;
  border-radius: 16px;
  box-shadow: var(--shadow, 0 10px 30px rgba(10,14,30,.08));
}
.carousel-head{ margin-bottom: 8px; }
.job-title{ font-size: 18px; margin: 0 0 4px; }
.job-company{ color:#6a7287; margin:0 0 4px; }
.job-meta{ list-style:none; padding:0; margin:8px 0 8px; display:flex; gap:16px; flex-wrap:wrap; }
.job-meta li{ font-size:14px; color:#333; }
.job-desc{ margin: 6px 0 0; }

.carousel-nav{
  position:absolute; top:50%; left:0; right:0;
  display:flex; justify-content:space-between; align-items:center;
  transform: translateY(-50%);
  pointer-events: none; /* 透過クリック防止のためボタンだけ有効化 */
}
.carousel-btn{
  pointer-events: auto;
  background: rgba(0,0,0,.45);
  color:#fff; border:none;
  width:36px; height:36px; border-radius:50%;
  font-size:22px; line-height:36px; text-align:center;
  display:grid; place-items:center; cursor:pointer;
}
.carousel-btn:hover{ background: rgba(0,0,0,.6); }

.carousel-dots{
  display:flex; justify-content:center; gap:8px;
  margin-top: 10px;
}
.carousel-dots .dot{
  width:10px; height:10px; border-radius:50%;
  background:#d8deea; border:0;
  cursor:pointer;
}
.carousel-dots .dot.is-active{ background: var(--primary, #BD2626); }

@media (max-width: 640px){
  .carousel-item{ padding:18px; }
  .job-title{ font-size:17px; }
  .job-meta{ gap:10px; }
}

/* ========== Carousel (shared) ========== */
.carousel{position:relative;overflow:hidden;max-width:920px;margin:0 auto}
.carousel-track{display:flex;transition:transform .6s ease;will-change:transform}
.carousel-item{min-width:100%;box-sizing:border-box;padding:20px 22px;background:var(--card,#fff);border:1px solid #e7ecf6;border-radius:16px;box-shadow:var(--shadow,0 10px 30px rgba(10,14,30,.08))}
.carousel-head{margin-bottom:8px}
.job-title{font-size:18px;margin:0 0 4px}
.job-company{color:#6a7287;margin:0 0 4px}
.job-meta{list-style:none;padding:0;margin:8px 0 8px;display:flex;gap:16px;flex-wrap:wrap}
.job-meta li{font-size:14px;color:#333}
.job-desc{margin:6px 0 0}
.carousel-nav{position:absolute;top:50%;left:0;right:0;display:flex;justify-content:space-between;align-items:center;transform:translateY(-50%);pointer-events:none}
.carousel-btn{pointer-events:auto;background:rgba(0,0,0,.45);color:#fff;border:none;width:36px;height:36px;border-radius:50%;font-size:22px;line-height:36px;text-align:center;display:grid;place-items:center;cursor:pointer}
.carousel-btn:hover{background:rgba(0,0,0,.6)}
.carousel-dots{display:flex;justify-content:center;gap:8px;margin-top:10px}
.carousel-dots .dot{width:10px;height:10px;border-radius:50%;background:#d8deea;border:0;cursor:pointer}
.carousel-dots .dot.is-active{background:var(--primary,#BD2626)}
@media (max-width:640px){
  .carousel-item{padding:18px}
  .job-title{font-size:17px}
  .job-meta{gap:10px}
}

