@charset "UTF-8";
/*
Theme Name: monitan2022
Template: lightning
*/

/* ================================= */
/* ======= 専用CSSファイル ========= */
/* ================================= */

/* ========== TOKENS（色定義） ========== */
:root{
  --mn-primary:#f7bf4f;   /* ブランド基調 */
  --mn-accent:#fdb812;    /* CTAなど強調 */
  --mn-line:#e6e6e6;      /* 枠線の薄色 */
}

/* ========== FAQ（必要最小限） ========== */
.faq-accordion{max-width:880px;margin:0 auto;padding:8px 16px 40px}
.faq-heading{font-size:1.6rem;margin:12px 0 16px}
.faq-item{border:1px solid var(--mn-line);border-radius:8px;background:#fff;margin:10px 0;overflow:hidden}
.faq-q{position:relative;cursor:pointer;list-style:none;font-weight:700;font-size:1.05rem;line-height:1.5;padding:16px 46px 16px 16px}
.faq-q::marker{content:""}
.faq-q:hover{background:#fafafa}
.faq-q::after{content:"\002B";position:absolute;right:14px;top:50%;transform:translateY(-50%);font-weight:700;color:#222}
.faq-item[open]>.faq-q::after{content:"\2212"}
.faq-a{padding:0 16px 16px;color:#333;line-height:1.8}
.faq-a p{margin:10px 0}
.faq-a ul{margin:8px 0 8px 18px}
@media (max-width:599px){
  .faq-heading{font-size:1.4rem}
  .faq-q{font-size:1rem;padding:14px 42px 14px 14px}
  .faq-a{font-size:1rem}
}

/* ========== VK Blocks：参加の流れ（番号） ========== */
.vk_steps_item{display:block;background:#fff;border:1px solid var(--mn-line);border-radius:8px;padding:12px;margin:12px 0;overflow:hidden}
.vk_steps_item_number{
  float:left;width:40px;height:40px;border-radius:50%;
  background:#fff;color:var(--mn-primary);border:2px solid var(--mn-primary);
  text-align:center;line-height:40px;font-weight:700;font-size:16px;margin-right:12px
}
.vk_steps_item_content{overflow:hidden}
.vk_steps_item_content h3{margin:0 0 6px 0;font-size:1.05em}
.vk_steps_item_content p{margin:0}
.vk_steps .vk_steps_item:hover .vk_steps_item_number{border-color:#f3aa00;color:#f3aa00}

/* ========== モニタン：レイアウト/カード/ギャラリー ========== */
.moni-figure{margin:0;border-radius:12px;overflow:hidden;border:1px solid #eee}
.moni-figure img{display:block;width:100%;height:auto}

.moni-grid{display:grid;gap:14px;margin:18px 0}
.moni-grid.cols-3{grid-template-columns:1fr}
.moni-card{background:#fff;border:1px solid #eaeaea;border-radius:12px;padding:14px;text-align:center}
.moni-card h3,.moni-card p{margin:0 0 6px 0;text-align:left}
.moni-card .moni-icon{display:block;margin:0 auto 12px;width:64px;height:64px;object-fit:contain}

/* 旧ギャラリー（残しても悪さしない軽量版） */
.moni-gallery{display:grid;gap:20px;justify-items:center;margin:18px 0}
.moni-gallery.cols-3{grid-template-columns:1fr 1fr 1fr}
.moni-thumb{border:1px solid #eee;border-radius:10px;overflow:hidden;padding:14px 16px;text-align:left;background:#fff}
.moni-thumb img{display:block;margin:0 auto 8px;width:80%;max-width:120px;height:auto}
@media (max-width:768px){ .moni-gallery.cols-3{grid-template-columns:1fr 1fr} }
@media (max-width:480px){ .moni-gallery.cols-3{grid-template-columns:1fr} }

/* ========== 過去のモニター事例：テキスト主体リスト ========== */
.moni-cases{
  list-style:none;margin:18px 0;padding:0;
  display:grid;gap:12px;
}
.case-item{
  display:flex;align-items:flex-start;gap:10px;
  padding:10px 12px;border:1px solid #eee;border-radius:10px;background:#fff;
}
.case-icon{
  width:56px;height:56px;flex:0 0 56px;object-fit:contain;margin-top:2px;
}
.case-item span{font-size:.98rem;line-height:1.7;color:#222;text-align:left}
.case-item strong{font-weight:800}
@media (min-width:960px){ .moni-cases{grid-template-columns:1fr 1fr} }

/* ========== ヒーローのバッジ ========== */
.moni-hero .badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;margin-bottom:1.5rem}
.moni-badge{
  display:inline-block;background:#fff7e1;border:1px solid var(--mn-primary);color:#7a5200;
  padding:4px 8px;border-radius:999px;font-weight:700;font-size:.85rem;
}

/* ========== CTA（下部はPCのみ表示） ========== */
.moni-cta-center{text-align:center;margin:22px 0 8px}
.moni-cta-bottom{text-align:center;margin:2.5rem 0 3rem}
.moni-cta-bottom .btn-primary{
  display:inline-block;padding:14px 24px;border-radius:9999px;
  background:var(--mn-accent);color:#fff;text-decoration:none;font-weight:700;
  box-shadow:0 4px 12px rgba(0,0,0,.08);transition:transform .06s ease,background .2s ease
}
.moni-cta-bottom .btn-primary:hover{transform:translateY(-1px);background:#f3aa00}
.moni-cta-note{margin-top:8px;color:#555;font-size:.92rem}

/* ========== スマホ用スティッキーCTA（既存仕様を保持） ========== */
@media (max-width:768px){
  #cta-sticky{
    position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--mn-line);
    padding:calc(env(safe-area-inset-bottom,0px)+10px) 12px 10px;display:flex;justify-content:center;align-items:center;
    z-index:99999;box-shadow:0 -4px 10px rgba(0,0,0,.06)
  }
  #cta-sticky .btn-wrap{position:relative;display:flex;justify-content:center;width:100%;max-width:260px}
  #cta-sticky .btn{
    display:block;width:100%;padding:14px 18px;background:var(--mn-primary);color:#fff;border-radius:10px;
    text-decoration:none;text-align:center;font-weight:700;font-size:18px;line-height:1.2;transition:background .25s ease
  }
  #cta-sticky .btn:hover{background:var(--mn-accent)}
  #cta-sticky .close{
    position:absolute;top:-12px;right:-12px;width:28px;height:28px;border-radius:50%;background:#fff;border:1px solid #ddd;
    box-shadow:0 2px 8px rgba(0,0,0,.12);color:#666;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0
  }
  body.has-sticky-pad{padding-bottom:86px}
}
/* 白抜きボタン（副CTA用） */
.btn-outline {
  display:inline-block;
  padding:14px 24px;
  border-radius:9999px;
  border:2px solid var(--mn-accent);
  background:#fff;
  color:var(--mn-accent);
  font-weight:700;
  text-decoration:none;
  transition:all .2s ease;
}
.btn-outline:hover {
  background:var(--mn-accent);
  color:#fff;
}
/* スマホでも、TOP以外は下部CTAを表示する */
@media (max-width:768px){
  body:not(.home) .moni-cta-bottom{ display:block; }
}
