/*
Theme Name: イベコン
Theme URI: https://ivecon.societa-test.com/
Author: Societa Inc.
Description: イベント・展示会コンパニオン向けマッチングサイト「イベコン.com」専用テーマ。独自コード。
Version: 1.6.8
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: ivecon
*/

:root{ --hero-image:none; }

/* ============================================================
   イベコン.com フロントページ 再現
   Societa Inc. — 独自コード / 画像はプレースホルダー
   ------------------------------------------------------------
   実サイト(demo.matchingcloud.com)の computedStyle 実測値に基づく
     基本フォント  Noto Sans JP 14px / line-height 21px
     本文色 #000 / 背景 #f6f6f6
     プライマリ     #389DD1   青帯 160deg #389DD1 → #15709F
     フッター       #646667
     コンテナ       .container-2xl = max-width 1280 / padding 0 16
                    .container     = max-width 1080 / padding 0 16
     ヒーロー高さ   687px (padding 64 / 48)
     キャッチコピー 42px / 900 / lh 63px
     セクション見出し 20px / 700 / lh 24px
   ============================================================ */

:root{
  --primary:      #389DD1;
  --primary-dark: #15709F;
  --body-bg:      #f6f6f6;
  --footer-bg:    #646667;
  --line:         #dee2e6;
  --muted:        #6c757d;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:"Noto Sans JP",Helvetica,Arial,"Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3",Meiryo,メイリオ,sans-serif;
  font-size:14px;
  line-height:21px;
  color:#000;
  background:var(--body-bg);
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:var(--primary); text-decoration:none; }
a:hover{ text-decoration:underline; }
ul{ margin:0; padding:0; list-style:none; }

.container-2xl{ max-width:1280px; margin:0 auto; padding:0 16px; }
.container{     max-width:1080px; margin:0 auto; padding:0 16px; }
.bg-white{ background:#fff; }

/* --- 画像プレースホルダー --- */
.ph{ position:relative; overflow:hidden; background:#c9d1d8;
     background-image:linear-gradient(135deg,#c6ced6 0%,#dfe5ea 50%,#c9d1d8 100%); }
.ph > img{ width:100%; height:100%; object-fit:cover; display:block; }
.ph.has-img::after{ content:none; }
.ph::after{ content:attr(data-ph); position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  font-size:10px; letter-spacing:.08em; font-weight:700;
  color:rgba(255,255,255,.9); text-shadow:0 1px 2px rgba(0,0,0,.25); }
.ph-photo{ background-image:linear-gradient(135deg,#8fa6b8,#b9c8d4 45%,#7e93a6); }
.ph-warm{  background-image:linear-gradient(135deg,#d9c3b0,#efe0d4 50%,#cbb2a0); }
.ph-blue{  background-image:linear-gradient(135deg,#2b6f9e,#4c9cc9 55%,#1f5c86); }
.ph-illust{ background:#eef4f9; background-image:linear-gradient(135deg,#eaf3fa,#dbe9f4); }
.ph-illust::after{ color:#8fadc4; text-shadow:none; font-size:8px; }

.text-shadow{ text-shadow:0 1px 3px rgba(0,0,0,.5); }

/* ============================================================
   ヘッダー (fixed-top / 高さ53px)
   ============================================================ */
.site-header{
  position:absolute; top:0; left:0; right:0; z-index:1030;
  height:53px; display:flex; align-items:center;
}
.site-header .container-2xl{ display:flex; align-items:center; gap:28px; width:100%; }
.brand{ font-size:19px; font-weight:700; color:#fff; white-space:nowrap;
        text-shadow:0 1px 3px rgba(0,0,0,.5); }
.brand .dot{ color:#a9dcf7; }
.gnav{ display:flex; gap:24px; }
.gnav > a{
  color:#fff; font-size:13px; font-weight:400;
  text-shadow:0 1px 3px rgba(0,0,0,.5);
  display:inline-flex; align-items:center; gap:6px;
}
.caret{ width:0; height:0; border-left:4px solid transparent;
        border-right:4px solid transparent; border-top:5px solid #fff; }
.header-right{ margin-left:auto; display:flex; align-items:center; gap:28px; }
.header-right a{ color:#fff; font-size:13px; display:inline-flex; align-items:center; gap:7px;
                 text-shadow:0 1px 3px rgba(0,0,0,.5); }
.ico-user{ width:13px; height:13px; border:1.4px solid #fff; border-radius:50%; position:relative; flex:0 0 auto; }
.ico-user::after{ content:''; position:absolute; left:50%; top:2.4px; transform:translateX(-50%);
                  width:4px; height:4px; border-radius:50%; background:#fff; }

/* ============================================================
   ヒーロー  高さ687 / padding 64px 16px 48px
   ============================================================ */
.firstview{
  position:relative; min-height:687px;
  background-color:var(--primary);
  background-image:var(--hero-image);
  background-size:cover; background-position:center right;
  overflow:hidden;
}
/* 左半分の暗幕。写真の明るい部分に白文字が乗ると読めなくなるため。
   濃さは実測して決めている(説明文 5.07:1 / 見出し 5.27:1 = WCAG AA を満たす)。
   人物の顔が写る右側には掛からないよう、80%で完全に透明にしている。 */
.firstview-photo{ position:absolute; inset:0; background:linear-gradient(90deg,rgba(2,32,52,.68) 0%,rgba(2,32,52,.63) 30%,rgba(2,32,52,.52) 50%,rgba(2,32,52,.16) 66%,rgba(2,32,52,0) 80%); }

.firstview-inner{ position:relative; z-index:2; padding-top:64px; padding-bottom:48px; }

.fv-description{ font-size:18px; line-height:27px; color:#fff; margin:0 0 8px; }
.fv-catchcopy{
  font-size:42px; font-weight:900; line-height:1.35; color:#fff; margin:0 0 32px;
  border-left:4px solid #6ee7ff; padding-left:20px;
}
.fv-copy-line{ display:block; }
.fv-copy-line--1{ font-size:.78em; font-weight:800; letter-spacing:.045em; }
.fv-copy-line--2{ display:table; margin:.08em 0; font-size:1.12em; font-weight:900; color:#ffe68a; line-height:1.28; }
.fv-copy-line--3{ font-size:.86em; font-weight:800; letter-spacing:.09em; }

/* --- 実績バッジ (実測 407×150) --- */
.fv-badges{ display:flex; gap:16px; width:407px; height:150px; align-items:center; margin-bottom:32px; }
.rosette{
  position:relative; width:125px; height:125px; flex:0 0 auto;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  border-radius:50%; color:#fff; text-align:center; line-height:1.2;
  background:radial-gradient(circle at 50% 28%,#f4642c,#dd3d0d 78%);
  box-shadow:0 3px 9px rgba(0,0,0,.28);
}
.rosette::before{
  content:''; position:absolute; z-index:-1; left:-10px; top:-10px;
  width:145px; height:145px; border-radius:50%;
  background:repeating-conic-gradient(from 3.75deg,#dd3d0d 0deg 7.5deg,transparent 7.5deg 15deg);
}
.rosette.is-orange{ background:radial-gradient(circle at 50% 28%,#ffab26,#f5871f 78%); }
.rosette.is-orange::before{
  background:repeating-conic-gradient(from 3.75deg,#f5871f 0deg 7.5deg,transparent 7.5deg 15deg);
}
.rosette .r-top{ font-size:9.5px; }
.rosette .r-main{ font-size:40px; font-weight:900; letter-spacing:-.02em; line-height:1.05; }
.rosette .r-main small{ font-size:19px; font-weight:900; }
.rosette .r-btm{ font-size:9.5px; }

/* --- 検索バー (高さ50 / カテゴリ478・キーワード480・ボタン90) --- */
.range-search{ display:flex; height:50px; max-width:1048px; }
.range-search_input,
.range-search_inner{
  display:flex; align-items:center; gap:9px;
  background:#fff; height:50px; padding:0 16px;
}
.range-search_input{ flex:0 0 478px; border-right:1px solid var(--line); border-radius:4px 0 0 4px; }
.range-search_inner{ flex:0 0 480px; }
.range-search input{
  flex:1 1 auto; border:0; outline:0; background:transparent;
  font-family:inherit; font-size:14px; color:#000;
}
.range-search input::placeholder{ color:#adb5bd; }
.mc-btn-primary{
  flex:0 0 90px; border:0; cursor:pointer;
  background:var(--primary); color:#fff;
  font-family:inherit; font-size:15px; font-weight:700; line-height:22.5px;
  border-radius:0 4px 4px 0;
}
.mc-btn-primary:hover{ background:var(--primary-dark); }

/* ============================================================
   バナー 3枚 (y=711 / 396×230)
   ============================================================ */
/* 背景はグレー(body)ではなく白。下のロゴ帯まで白が続くようにする。 */
.banner-section{ padding-top:24px; padding-bottom:32px; background:#fff; }
.slick-track{ display:flex; gap:12px; max-width:1188px; margin:0 auto; }
.slick-item{
  position:relative; flex:1 1 0; height:230px;
  border-radius:3px; overflow:hidden; display:block;
  box-shadow:0 1px 4px rgba(0,0,0,.16);
}
.slick-item .ph{ position:absolute; inset:0; }
.slick-shade{ position:absolute; inset:0;
  background:linear-gradient(0deg,rgba(0,0,0,.58) 0%,rgba(0,0,0,.12) 40%,rgba(0,0,0,0) 66%); }
.slick-caption{ position:absolute; left:18px; bottom:16px; z-index:3; color:#fff; }
.slick-caption .sc-main{ font-size:21px; font-weight:700; line-height:1.3; text-shadow:0 1px 4px rgba(0,0,0,.6); }
.slick-caption .sc-sub{ display:inline-block; margin-top:7px; font-size:11px;
  background:rgba(0,0,0,.55); padding:2px 9px; border-radius:2px; }
.slick-flag{
  position:absolute; top:0; right:0; z-index:4; color:#fff;
  font-size:10px; font-weight:700; padding:4px 11px 4px 15px;
  background:#e8420f; clip-path:polygon(8px 0,100% 0,100% 100%,0 100%);
}
.slick-flag.is-green{ background:#2fa06b; }
.slick-flag.is-blue{ background:var(--primary); }

/* ============================================================
   導入企業ロゴ (白 / 高さ184)
   ============================================================ */
.lp-logos{ background:#fff; height:184px; display:flex; align-items:center; margin-top:0; overflow:hidden; }
.logo-row{ display:flex; align-items:center; justify-content:space-around; gap:26px; width:100%; padding:0 24px; }

/* ---- ロゴ帯を途切れずに流す ------------------------------------
   JSが .logo-row を .ivecon-marquee で包み、同じ並びをもう一組つなぐ。
   半分(=元の一組ぶん)動いたところで先頭に戻るので、継ぎ目が見えない。
   JSが動かない環境では、これまでどおり並んで止まったまま。 */
.ivecon-marquee{ width:100%; overflow:hidden; }
.ivecon-marquee .logo-row{
  width:max-content;
  justify-content:flex-start;
  gap:64px;
  /* 左は0・右はgapと同じ値。こうすると全体幅のちょうど半分が
     「元の一組ぶん」になり、折り返しで継ぎ目がずれない。 */
  padding:0 64px 0 0;
  will-change:transform;
  animation:ivecon-marquee var(--marquee-duration,40s) linear infinite;
}
/* 読んでいる間は止める */
.ivecon-marquee:hover .logo-row,
.ivecon-marquee:focus-within .logo-row{ animation-play-state:paused; }
/* 視差効果を減らす設定のときは流さない(横スクロールで見られるようにする) */
.ivecon-marquee.is-static{ overflow-x:auto; scrollbar-width:none; }
.ivecon-marquee.is-static::-webkit-scrollbar{ width:0; height:0; display:none; }
.ivecon-marquee.is-static .logo-row{ animation:none; }
@media (prefers-reduced-motion:reduce){
  .ivecon-marquee .logo-row{ animation:none; }
}
@keyframes ivecon-marquee{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}
.client-logo{ flex:0 0 auto; font-size:19px; font-weight:700; color:#6d6d6d; white-space:nowrap; line-height:1.25; opacity:.9; }
.client-logo .lg-sub{ display:block; font-size:7.5px; font-weight:400; letter-spacing:.16em; color:#9a9a9a; }
.client-logo .mk{ color:var(--primary); }

/* ============================================================
   セクション見出し (20px / 700 / lh24 / ブロック高78)
   ============================================================ */
.heading-block{
  height:78px; display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.mc-heading_title{ font-size:20px; font-weight:700; line-height:24px; margin:0; }
.more-link{ font-size:13px; white-space:nowrap; }

/* --- おすすめ特集 (カード列 高さ174) --- */
.feature-row{ display:flex; gap:16px; overflow:hidden; }
.feature-card{ flex:0 0 246px; color:#000; }
.feature-card:hover{ text-decoration:none; }
.feature-card .ph{ aspect-ratio:16/9; border-radius:3px; }
.feature-card .fc-cap{ font-size:11px; color:var(--muted); margin-top:5px; line-height:1.3; }
.feature-card .fc-title{ font-size:14px; font-weight:700; line-height:1.35; }

/* --- 新着のコンパニオン (カード 180×232) --- */
.seller-row{ display:flex; gap:0; flex-wrap:wrap; }
.seller-card{ flex:0 0 174px; margin:0 12px 32px 0; color:#000; }
.seller-card:hover{ text-decoration:none; }
.seller-card .ph{ aspect-ratio:1/1; border-radius:3px; }
.seller-card .s-name{ font-size:14px; font-weight:700; margin-top:10px; line-height:1.4; }
.seller-card .s-meta{ font-size:12px; color:var(--muted); line-height:1.4; }
.avatar-blank{ background:#e4e4e4; display:flex; align-items:flex-end; justify-content:center; }
.avatar-blank svg{ width:64%; }

/* ============================================================
   グレー帯 (136) + 青帯 (304)
   ============================================================ */
.lp-gap{ height:136px; }
.lp-gradation{
  height:304px; display:flex; align-items:center; color:#fff;
  background-image:linear-gradient(160deg,var(--primary),var(--primary-dark));
}
.lp-gradation .container{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; width:100%; }
.gradation-title{ font-size:26px; font-weight:700; line-height:1.6; margin:0; }
.gradation-text{ font-size:13px; line-height:2; margin:0; }

/* ============================================================
   下部 (白 / container-2xl / サイドバー左 + 本文右960)
   ============================================================ */
.lower{ background:#fff; padding-bottom:48px; }
.lower-row{ display:grid; grid-template-columns:288px minmax(0,960px); gap:0; align-items:start; }
.lower-side{ padding-right:24px; padding-top:24px; }
.lower-main{ min-width:0; }

.side-box{ margin-bottom:24px; }
.side-head{ background:#f1f3f5; font-size:14px; font-weight:700; padding:11px 16px; }
.cat-list li{ border-bottom:1px solid var(--line); }
.cat-list a{ display:block; padding:11px 16px; font-size:13px; color:#000; }
.cat-list a:hover{ background:#fafafa; color:var(--primary); text-decoration:none; }

.promo-banner{
  display:block; position:relative; overflow:hidden; border-radius:4px;
  aspect-ratio:4/3; border:1px solid #bcdff3;
  background:linear-gradient(160deg,#eaf6fd,#cfeaf9);
}
.promo-ribbon{ position:absolute; top:10px; left:-3px; background:var(--primary); color:#fff;
  font-size:12px; font-weight:700; padding:3px 16px 3px 11px; transform:rotate(-1.4deg);
  box-shadow:0 1px 3px rgba(0,0,0,.18); }
.promo-body{ position:absolute; inset:44px 10px 10px; text-align:center; color:#0e5f92; }
.promo-body .p-lead{ font-size:11px; font-weight:700; }
.promo-body .p-amount{ font-size:44px; font-weight:900; line-height:1.05; color:#e0400f; letter-spacing:-.03em; }
.promo-body .p-amount small{ font-size:18px; }
.promo-body .p-note{ font-size:11px; font-weight:700; }
.promo-pills{ display:flex; gap:6px; justify-content:center; margin-top:8px; }
.promo-pills span{ background:#fff; border:1px solid #9fd0ec; color:var(--primary);
  font-size:10px; font-weight:700; border-radius:10px; padding:1px 9px; }

/* --- 新着の案件 (カード 283×229) --- */
/* ---- 横スライダー(自動送り＋矢印) ----------------------------
   .request-row / .feature-row / .slick-track をJSがこのラッパーで包む。
   矢印は送れる余地があるときだけ出す(has-nav)。 */
.ivecon-slider{ position:relative; }
.ivecon-slider-nav{
  display:none; position:absolute; top:50%; transform:translateY(-50%);
  width:38px; height:38px; padding:0; z-index:5;
  align-items:center; justify-content:center;
  border:1px solid var(--line); border-radius:50%;
  background:#fff; color:var(--primary-dark); cursor:pointer;
  box-shadow:0 2px 10px rgba(0,0,0,.14);
  transition:background .15s, color .15s, opacity .15s, box-shadow .15s;
}
.ivecon-slider.has-nav .ivecon-slider-nav{ display:flex; }
.ivecon-slider-nav svg{ width:19px; height:19px; }
.ivecon-slider-nav.is-prev{ left:-12px; }
.ivecon-slider-nav.is-next{ right:-12px; }
.ivecon-slider-nav:hover:not(:disabled){ background:var(--primary); color:#fff; box-shadow:0 4px 14px rgba(21,112,159,.32); }
.ivecon-slider-nav:focus-visible{ outline:2px solid var(--primary); outline-offset:2px; }
.ivecon-slider-nav:disabled{ opacity:.32; cursor:default; }

/* スクロールバーは矢印で操作できるので隠す。
   非表示にしてもスワイプ・矢印・キー操作でのスクロールは効く。 */
.ivecon-slider .request-row,
.ivecon-slider .feature-row,
.ivecon-slider .slick-track,
.request-row,
.feature-row,
.slick-track{ scrollbar-width:none; -ms-overflow-style:none; scroll-behavior:smooth; }
.ivecon-slider .request-row::-webkit-scrollbar,
.ivecon-slider .feature-row::-webkit-scrollbar,
.ivecon-slider .slick-track::-webkit-scrollbar,
.request-row::-webkit-scrollbar,
.feature-row::-webkit-scrollbar,
.slick-track::-webkit-scrollbar{ width:0; height:0; display:none; }

/* おすすめ特集はPCでも送れるようにする(以前は overflow:hidden で
   2枚目以降が切れたまま、どうやっても見られなかった) */
.feature-row{ overflow-x:auto; overflow-y:hidden; }
.feature-card{ flex:0 0 236px; }
.slick-track{ overflow-x:auto; }
.slick-item{ flex:0 0 388px; }

@media (max-width:760px){
  .ivecon-slider-nav{ width:34px; height:34px; }
  .ivecon-slider-nav.is-prev{ left:2px; }
  .ivecon-slider-nav.is-next{ right:2px; }
}

/* ---- 新着の案件カード ----------------------------------------
   1枚のカードで「どの職種か・いくらか・いつどこか」が一目で分かる順に置く。
   以前はタイトルと掲載元に同じ文字列が2回出ていたため、
   見出し=会場名 / 最下部=掲載企業 と役割を分けている。 */
.request-row{ display:flex; gap:16px; overflow-x:auto; padding:4px 4px 10px; }
.request-card{
  flex:0 0 264px; display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--line); border-radius:10px;
  padding:16px 18px 14px; color:inherit; text-decoration:none;
  transition:box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.request-card:hover{
  text-decoration:none; border-color:#bcdcef;
  box-shadow:0 8px 20px rgba(21,112,159,.13); transform:translateY(-2px);
}
.rc-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; }
.rc-status{
  flex:0 0 auto; font-size:11px; font-weight:700; color:var(--primary-dark);
  background:#eaf5fb; border-radius:999px; padding:3px 9px; white-space:nowrap;
}
.request-title{
  font-size:15px; font-weight:700; line-height:1.5; color:#212529; margin:0 0 12px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  min-height:calc(1.5em * 2);
}
.rc-wage{
  display:flex; align-items:baseline; gap:6px; margin:0 0 12px;
  padding-bottom:12px; border-bottom:1px dashed var(--line);
  font-size:12px; color:var(--muted);
}
.rc-wage strong{ font-size:26px; font-weight:800; line-height:1; color:var(--primary-dark); letter-spacing:-.01em; }
.rc-meta{ list-style:none; margin:0; padding:0; display:grid; gap:7px; }
.rc-meta li{ display:flex; align-items:flex-start; gap:7px; font-size:12.5px; line-height:1.5; color:#495057; }
.rc-meta svg{
  flex:0 0 auto; width:14px; height:14px; margin-top:1px;
  fill:none; stroke:#9bb4c4; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
}
.rc-meta li span{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.rc-flags{ display:flex; flex-wrap:wrap; gap:5px; margin-top:11px; }
.rc-flags span{
  font-size:10.5px; font-weight:700; color:#a8630a; background:#fff5e6;
  border-radius:3px; padding:3px 7px; white-space:nowrap;
}
.rc-owner{
  margin-top:auto; padding-top:12px; font-size:11.5px; color:var(--muted);
  border-top:1px solid var(--line);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.rc-owner::before{ content:'掲載: '; color:#adb5bd; }

.merit-row{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.merit-card{
  min-width:0; height:100%; padding:18px;
  border:1px solid #e5edf2; border-radius:10px; background:#fff;
  box-shadow:0 4px 14px rgba(13,63,99,.06);
}
.merit-head{ display:flex; align-items:flex-start; gap:12px; margin-bottom:14px; }
.point-badge{
  flex:0 0 auto; width:44px; height:48px; background:var(--primary); color:#fff;
  clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
  display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1;
}
.point-badge .pb-l{ font-size:8px; font-weight:700; letter-spacing:.05em; }
.point-badge .pb-n{ font-size:18px; font-weight:700; margin-top:2px; }
.merit-title{ font-size:16px; font-weight:700; line-height:1.45; margin:4px 0 0; min-height:2.9em; }
.merit-body{ display:grid; grid-template-columns:96px 1fr; gap:14px; }
.merit-body .ph{ aspect-ratio:1/1; border-radius:3px; }
.merit-body p{ margin:0; font-size:13px; line-height:1.85; }

/* --- よくあるご質問 --- */
.faq-list{ border-top:1px solid var(--line); }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-item summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:16px;
  padding:12px 8px; font-size:14px; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-q{ flex:0 0 auto; width:14px; text-align:center; font-size:14px; font-weight:700; color:var(--primary); }
.faq-mark{ margin-left:auto; position:relative; width:14px; height:14px; color:#adb5bd; flex:0 0 auto; }
.faq-mark::before,.faq-mark::after{ content:''; position:absolute; background:currentColor;
  left:50%; top:50%; transform:translate(-50%,-50%); }
.faq-mark::before{ width:14px; height:1.5px; }
.faq-mark::after{ width:1.5px; height:14px; transition:opacity .15s; }
.faq-item[open] .faq-mark::after{ opacity:0; }
.faq-body{ padding:0 8px 18px 46px; font-size:13px; line-height:1.9; color:#333; }

/* --- ピックアップ --- */
.pickup-row{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.pickup-card{ position:relative; display:grid; grid-template-columns:110px 1fr; gap:14px;
  border:1px solid var(--line); border-radius:3px; padding:12px; background:#fff; }
.pickup-card:hover{ box-shadow:0 2px 8px rgba(0,0,0,.07); text-decoration:none; }
.pickup-card .ph{ aspect-ratio:4/3; border-radius:3px; }
.pickup-title{ font-size:15px; font-weight:700; color:var(--primary); margin:2px 0 6px; line-height:1.45; }
.pickup-desc{ font-size:12px; line-height:1.8; color:#333; margin:0;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.pickup-flag{ position:absolute; top:0; left:0; z-index:3; background:#e8420f; color:#fff;
  font-size:9px; font-weight:700; padding:2px 9px 2px 8px;
  clip-path:polygon(0 0,100% 0,calc(100% - 7px) 100%,0 100%); }

.mt-section{ margin-top:40px; }

/* ============================================================
   フッター (#646667 / 高さ347 / pt-5)
   ============================================================ */
.mc-footer{ background:var(--footer-bg); color:#fff; padding-top:48px; }
.footer-brand{ font-size:19px; font-weight:700; margin-bottom:28px; }
.footer-brand .dot{ color:#a9dcf7; }
.footer-cols{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; padding-bottom:56px; }
.footer-cols h3{ font-size:14px; font-weight:700; margin:0 0 14px; }
.footer-cols li{ font-size:12px; line-height:2.1; padding-left:14px; position:relative; }
.footer-cols li::before{ content:''; position:absolute; left:0; top:.9em;
  width:4px; height:4px; border-radius:50%; background:#fff; }
.footer-cols a{ color:#fff; }
.footer-copy{ text-align:center; font-size:12px; padding:20px 0 30px; }

/* ============================================================
   レスポンシブ
   ============================================================ */
/* ------------------------------------------------------------------
   トップページ以外のヘッダー

   .site-header は position:absolute でヒーロー写真の上に重ねる前提。
   ヒーローが無い下層ページではそのまま本文に重なり、白文字も白背景に溶けて
   見出しと衝突する。下層では通常の帯(青背景)として流し込む。
------------------------------------------------------------------- */
body:not(.home) .site-header{
  position:relative; background:var(--primary);
}
body:not(.home) .brand,
body:not(.home) .gnav > a,
body:not(.home) .header-right a{ text-shadow:none; }
body:not(.home) .lower{ padding-top:32px; }

/* ---- スマホ専用パーツの既定値(PCでは出さない) ----
   ※ 必ずメディアクエリより前に置くこと。後ろに置くと同じ詳細度で上書きしてしまう。 */
.fv-photo-sp{ display:none; }
.nav-toggle{ position:absolute; opacity:0; width:1px; height:1px; margin:-1px; overflow:hidden; }
.nav-burger{ display:none; }
.nav-drawer{ display:none; }
.nav-scrim{ display:none; }

@media (max-width:1100px){
  .lower-row{ grid-template-columns:1fr; }
  .lower-side{ padding-right:0; display:grid; grid-template-columns:1fr 260px; gap:24px; align-items:start; }
  .merit-row{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
  .merit-body{ grid-template-columns:1fr; }
  .merit-body .ph{ width:100%; max-width:156px; margin:0 auto; }
  .pickup-row{ grid-template-columns:1fr; }
  .lp-gradation{ height:auto; padding:48px 0; }
  .lp-gradation .container{ grid-template-columns:1fr; gap:20px; }
  .logo-row{ flex-wrap:wrap; justify-content:center; gap:20px 30px; }
  .lp-logos{ height:auto; padding:36px 0; }
  .seller-card{ flex:0 0 25%; }
}
/* ============================================================
   スマートフォン (〜760px)

   設計方針:
   - ヒーローは背景画像をやめ、写真を上部バナー＋コピーは白背景に分離する。
     390px幅では background-size:cover が効きすぎて人物が画面外に出るため。
   - グローバルナビはハンバーガーのドロワーに格納する(PCと同じ項目)。
   - 本文とサイドバーの並び順を入れ替え、本文を先に読ませる。
   - 横に並ぶカード列は「はみ出して切れる」のではなく横スクロールで全部見せる。
   ============================================================ */
@media (max-width:760px){

  /* ---- ヘッダー / ハンバーガー ---- */
  .gnav{ display:none; }
  .site-header{ height:56px; }
  .site-header .container-2xl{ gap:12px; }
  .brand{ font-size:17px; }
  /* アカウント系リンクはドロワーへ集約する */
  .header-right{ display:none; }
  .nav-burger{
    margin-left:auto; display:flex; flex-direction:column; justify-content:center;
    gap:5px; width:44px; height:44px; padding:10px; cursor:pointer; flex:0 0 auto;
  }
  .nav-burger span{
    display:block; height:2px; width:100%; background:#fff; border-radius:2px;
    box-shadow:0 1px 2px rgba(0,0,0,.4); transition:transform .2s, opacity .2s;
  }
  .nav-toggle:checked ~ .container-2xl .nav-burger span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .nav-toggle:checked ~ .container-2xl .nav-burger span:nth-child(2){ opacity:0; }
  .nav-toggle:checked ~ .container-2xl .nav-burger span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

  /* position:fixed にしているのは意図的。absolute のまま画面外へ transform すると
     閉じている間もドキュメントの横幅を押し広げ、ページ全体が横スクロールしてしまう。 */
  .nav-drawer{
    display:block; position:fixed; top:56px; right:0;
    width:min(280px,86vw); background:#fff; border-radius:0 0 0 8px;
    box-shadow:0 12px 32px rgba(0,0,0,.22);
    transform:translateX(105%); transition:transform .22s ease;
    visibility:hidden; pointer-events:none;
    padding:8px 0; z-index:1031;
  }
  .nav-toggle:checked ~ .nav-drawer{ transform:translateX(0); visibility:visible; pointer-events:auto; }
  .nav-drawer a{
    display:block; padding:14px 20px; font-size:15px; color:#212529;
    border-bottom:1px solid var(--line); text-shadow:none;
  }
  .nav-drawer a:last-child{ border-bottom:none; }
  .nav-drawer a.is-primary{ color:var(--primary); font-weight:700; }
  /* ドロワーの外側をタップすると閉じる */
  .nav-scrim{ display:none; position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:1029; }
  .nav-toggle:checked ~ .nav-scrim{ display:block; }

  /* ---- ヒーロー ---- */
  .firstview{
    min-height:0;
    background-image:none;      /* 拡大されすぎるので背景画像は使わない */
    background-color:#fff;
    padding-bottom:8px;
  }
  .firstview-photo{ display:none; }          /* PC用の左スクリムは不要 */
  .fv-photo-sp{ display:block; position:relative; width:100%; height:230px; overflow:hidden; }
  .fv-photo-sp img{ width:100%; height:100%; object-fit:cover; object-position:72% 32%; }
  /* ヘッダーの白文字が写真の明るい部分に重ならないよう、上部だけ暗く落とす */
  .fv-photo-sp::after{
    content:''; position:absolute; inset:0 0 auto 0; height:90px;
    background:linear-gradient(180deg,rgba(2,32,52,.55),rgba(2,32,52,0));
  }
  .firstview-inner{ padding-top:24px; padding-bottom:24px; }
  .fv-description{ font-size:14px; color:var(--muted); }
  .fv-catchcopy{ font-size:24px; line-height:38px; color:#212529; margin-bottom:24px; }
  .text-shadow{ text-shadow:none; }

  .fv-badges{ width:auto; height:auto; gap:8px; justify-content:space-between; margin-bottom:24px; }
  .rosette{ width:clamp(88px,28vw,104px); height:clamp(88px,28vw,104px); }
  .rosette::before{ width:calc(100% + 16px); height:calc(100% + 16px); left:-8px; top:-8px; }
  .rosette .r-main{ font-size:26px; }
  .rosette .r-top,.rosette .r-btm{ font-size:9px; line-height:1.25; }

  .range-search{ flex-wrap:wrap; height:auto; }
  .range-search_input,.range-search_inner{ flex:1 1 100%; border-radius:4px 4px 0 0; }
  .mc-btn-primary{ flex:1 1 100%; padding:14px 0; border-radius:0 0 4px 4px; font-size:15px; }

  /* ---- 横並びカード列は横スクロールで全部見せる ---- */
  .slick-track{ flex-direction:column; }
  .slick-item{ height:200px; }
  .feature-row{
    overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch; padding-bottom:8px; margin:0 -16px; padding-left:16px; padding-right:16px;
  }
  .feature-card{ flex:0 0 232px; scroll-snap-align:start; }
  .request-row{ margin:0 -16px; padding-left:16px; padding-right:16px; scroll-snap-type:x mandatory; }
  .request-card{ flex:0 0 272px; scroll-snap-align:start; }
  .seller-card{ flex:0 0 50%; }

  /* ---- 本文を先に、サイドバーを後に ---- */
  .lower-row{ grid-template-columns:1fr; }
  .lower-main{ order:1; }
  .lower-side{ order:2; grid-template-columns:1fr; margin-top:40px; }

  /* ---- そのほか ---- */
  .lp-logos{ padding:28px 0; }
  .logo-row{ padding:0 16px; gap:16px 24px; }
  .merit-body{ grid-template-columns:1fr; gap:10px; }
  .merit-body .ph{ width:100%; max-width:180px; margin-left:auto; margin-right:auto; }
  .merit-row{ grid-template-columns:1fr; gap:16px; }
  .merit-card{ padding:16px; }
  .merit-title{ min-height:0; }
  .pickup-card{ grid-template-columns:92px 1fr; gap:12px; }
  .footer-cols{ grid-template-columns:1fr; }
  .lp-gap{ height:48px; }
  .heading-block{ height:auto; flex-wrap:wrap; gap:6px; padding:14px 0; }
  .mc-heading_title{ font-size:18px; }
}

/* ---- 小型スマホ (〜360px) ---- */
@media (max-width:360px){
  .fv-catchcopy{ font-size:21px; line-height:33px; }
  .rosette .r-main{ font-size:23px; }
  .rosette .r-top,.rosette .r-btm{ font-size:8px; }
  .feature-card{ flex:0 0 200px; }
  .request-card{ flex:0 0 240px; }
  .pickup-card{ grid-template-columns:1fr; }
}

/* ===== プラグイン(イベコン マッチング)との併用調整 ===== */

/* グローバルナビの「企業登録」ボタン。文字リンクの中で埋もれないよう枠付きにする。 */
.gnav > a.gnav-cta{
  border:1px solid rgba(255,255,255,.85);
  border-radius:999px;
  padding:5px 15px;
  font-weight:700;
  text-shadow:none;
  background:rgba(255,255,255,.10);
  transition:background .15s, color .15s, border-color .15s;
}
.gnav > a.gnav-cta:hover{ background:#fff; color:var(--primary); border-color:#fff; }

/* ヘッダーのロゴ画像。文字のロゴから画像に差し替えたときの見た目。 */
.brand .custom-logo-link{ display:block; line-height:0; }
.brand img{ height:34px; width:auto; display:block; }
@media (max-width:640px){ .brand img{ height:28px; } }

/* -------------------------------------------------------------
 * TOPページのサイドナビを常時表示にする。
 *
 * 右の本文が長いため、これまではスクロールするとカテゴリ一覧と
 * 紹介キャンペーンが画面外へ流れて見えなくなっていた。追従させて、
 * どこまで読んでも職種から探せる状態にする。
 *
 * 1100px以下では1カラムになりサイドが横並びに変わるので、
 * その場合は追従させない(画面を覆ってしまうため)。
 * ----------------------------------------------------------- */
@media (min-width: 1101px) {
	.lower-side {
		position: sticky;
		top: 24px;
		align-self: start;
		/* 画面より背が高いときは中だけスクロールさせる(下が切れないように) */
		max-height: calc(100vh - 48px);
		overflow-y: auto;
		scrollbar-width: thin;
	}
}

/* body の overflow-x:hidden が position:sticky を無効にしていたため上書きする。
   hidden はスクロール領域を作ってしまい、その中では sticky が効かない。
   clip は横のはみ出しを切るだけでスクロール領域を作らないので sticky が生きる。
   clip 未対応のブラウザではこの宣言が無視され、従来どおり hidden のままになる。 */
body { overflow-x: clip; }

/* ══════════════════════════════════════════════════════════════════
   ヘッダーの常時表示 / トップページの並び替え (v1.4.0)
   ══════════════════════════════════════════════════════════════════ */

/* ---- ナビを画面上部に貼り付ける ----------------------------------
   .site-header が position:absolute だったため、少しスクロールするだけで
   ナビが流れ、「案件を探す」やログインへの導線が無くなっていた。
   fixed に戻し、どこまで送っても画面上部に残るようにする。
------------------------------------------------------------------ */
.site-header{
  position:fixed;
  transition:background-color .25s ease, box-shadow .25s ease;
}

/* トップページのヘッダーは、これまでヒーロー写真に透明で重ねていた。
   貼り付けたままにすると白い本文の上に白文字が乗って読めなくなるので、
   濃紺の半透明の帯を常に敷く。写真の上ではうっすら暗くなるだけで、
   帯の下を本文が通るので、文字が透けない濃さにしている。 */
.home .site-header{
  background:#022034;
  box-shadow:0 1px 10px rgba(0,0,0,.14);
}

/* 下層ページは元から青帯なので、そのまま貼り付ける。
   本文がヘッダーの下に潜らないよう、高さぶんの余白を足す。 */
body:not(.home) .site-header{ position:fixed; }
body:not(.home){ padding-top:53px; }

/* 見出しへのアンカーがヘッダーの下に隠れないように */
html{ scroll-padding-top:64px; }

/* 管理バーぶん下げる(ログイン中のみ) */
body.admin-bar .site-header{ top:32px; }
@media screen and (max-width:782px){
  body.admin-bar .site-header{ top:46px; }
}

/* ---- 新着の案件 / メリットを上段へ移したぶんの余白 ---------------
   これまでは青帯のすぐ下にあったため上余白が不要だったが、
   バナーの直下・青帯の直下に置くので、それぞれに余白を持たせる。 */
.lower-top{ padding-top:44px; }
.lower-bottom{ padding-top:44px; }
.lower-bottom .container-2xl > .mt-section:first-child{ margin-top:0; }

@media (max-width:767px){
  body:not(.home){ padding-top:56px; }
  .lower-top{ padding-top:28px; }
  .lower-bottom{ padding-top:28px; }
}

/* ============================================================
   トップの検索: 自由入力からプルダウンへ (v1.5.0)
   入力欄と同じ高さ・同じ幅で並ぶように、select にも同じ見た目を与える。
   ============================================================ */
.range-search select{
  flex:1 1 auto; width:100%; min-width:0; border:0; outline:0; background:transparent;
  font-family:inherit; font-size:14px; color:#000; cursor:pointer;
  appearance:none; -webkit-appearance:none;
  padding:0 22px 0 0;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23adb5bd' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 2px center; background-size:12px 8px;
}
/* 未選択のあいだは、入力欄のプレースホルダと同じ薄さで出す */
.range-search select:invalid,
.range-search select option[value='']{ color:#adb5bd; }
@media (max-width:760px){
  .range-search{ flex-wrap:wrap; height:auto; }
  .range-search_input,
  .range-search_inner{ flex:1 1 100%; border-right:0; border-radius:4px; margin-bottom:8px; }
  .mc-btn-primary{ flex:1 1 100%; height:48px; border-radius:4px; }
}

/* 案件カード: 日給とその内訳 (v1.5.0) */
.rc-wage-sub{ margin:2px 0 0; font-size:12px; color:#74807e; line-height:1.5; }
.request-card .rc-meta li span{ word-break:break-word; }


/* PICK UP WORKER を横に流す (v1.5.1) — 折り返しをやめて1列にし、スライダーで送れるようにする */
.seller-row{ flex-wrap:nowrap; overflow-x:auto; scroll-behavior:smooth; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.seller-row::-webkit-scrollbar{ display:none; }
.seller-row .seller-card{ flex:0 0 174px; margin-bottom:12px; }

/* ============================================================
   スマホでの改行位置 (v1.5.2)

   キャッチコピーや青帯の見出しが、書いた改行に加えて画面の幅でも
   折り返され、「イベントコンパ / ニオンを」「…お仕事 / を、」のように
   語の途中や助詞だけで行が変わっていた。

   ・文字サイズを画面幅から決めて、書いた改行のとおりに収まるようにする
     (いちばん長い行の文字数で割った大きさ。小さい端末では自動で縮む)
   ・それでも折り返すときは、語の途中ではなく文節の切れ目で折る
   ============================================================ */
@media (max-width:760px){
  /* いちばん長い行は16文字(イベントコンパニオンを直接つなぐ) */
  .fv-catchcopy{ font-size:clamp(16px, calc((100vw - 48px) / 16), 21px); line-height:1.6; }
  /* いちばん長い行は14文字(イベント・展示会のお仕事を、) */
  .gradation-title{ font-size:clamp(17px, calc((100vw - 48px) / 14), 26px); }

  .fv-catchcopy,
  .fv-description,
  .gradation-title,
  .gradation-text,
  .request-title,
  .mc-heading_title,
  .fc-title,
  .fc-cap{
    word-break:auto-phrase;  /* 対応していないブラウザでは今までどおり */
    line-break:strict;
    text-wrap:pretty;
  }
}

/* ============================================================
   サイドのバナー: ケイプロモーション(イベント課) (v1.5.5)

   画像を用意しなくても1枚の広告として成立するように組む。
   中身の量で高さが決まるようにして、リボンと見出しが重なったり
   ボタンが切れたりしないようにする。
   カスタマイザーでバナー画像を設定した場合は、そちらが優先される。
   ============================================================ */
.promo-banner{
  aspect-ratio:auto; border:0; color:#fff;
  padding:14px 14px 18px; text-align:center;
  background:linear-gradient(150deg,#0d3f63 0%,#15709f 52%,#2f93c9 100%);
  box-shadow:0 2px 10px rgba(13,63,99,.18);
}
.promo-banner.is-image{
  width:100%; max-width:264px; aspect-ratio:1/1; margin-inline:auto; padding:0;
  border-color:#d8e7ef; background:#fff;
}
.promo-banner.is-image::after{ content:none; }
.promo-banner.is-image img{ width:100%; height:100%; object-fit:cover; display:block; }
/* 斜めの帯を一本入れて、のっぺりした面にしない */
.promo-banner::after{
  content:''; position:absolute; right:-30%; top:-40%; width:90%; height:180%;
  background:rgba(255,255,255,.07); transform:rotate(18deg); pointer-events:none;
}
.promo-banner:hover{ box-shadow:0 6px 18px rgba(13,63,99,.28); }

/* リボンは流れの中に置く(重ならないように) */
.promo-banner .promo-ribbon{
  position:static; display:inline-block; transform:none; box-shadow:none;
  background:#fff; color:#0d3f63; border-radius:999px;
  font-size:10.5px; font-weight:800; letter-spacing:.02em; padding:3px 12px;
}

.promo-banner .promo-body{
  position:static; inset:auto; margin-top:12px; text-align:center; color:#fff;
}
.promo-banner .p-brand{
  font-size:20px; font-weight:900; line-height:1.25; letter-spacing:.01em;
  text-shadow:0 1px 2px rgba(0,0,0,.18);
}
.promo-banner .p-dept{
  margin-top:6px; display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:.08em;
  padding:2px 10px; border:1px solid rgba(255,255,255,.6); border-radius:999px;
}
.promo-banner .p-note{
  margin-top:10px; font-size:11.5px; line-height:1.7; color:rgba(255,255,255,.92);
}
.promo-banner .promo-pills{
  margin-top:10px; display:flex; gap:5px; justify-content:center; flex-wrap:wrap;
}
.promo-banner .promo-pills span{
  background:rgba(255,255,255,.16); border:0; color:#fff;
  font-size:10.5px; font-weight:700; padding:2px 9px; border-radius:999px;
}
.promo-banner .promo-cta{
  margin-top:14px; display:inline-flex; align-items:center; gap:5px;
  background:#fff; color:#0d3f63; font-size:12px; font-weight:800;
  padding:8px 20px; border-radius:999px;
}
.promo-banner .promo-cta::after{ content:'\2192'; font-weight:900; }
.promo-banner:hover .promo-cta{ background:#eaf6fd; }

/* 現場写真を先に配置し、おすすめ特集はFAQ直後へ移動 (v1.6.2) */
.top-photo-scene{ padding:44px 0 28px; }
.top-photo-scene .ivc-photo-slider-section{ margin-top:0; }
.ivecon-feature-after-faq > .container{ max-width:none; padding:0; }
@media (max-width:760px){
  .top-photo-scene{ padding:28px 0 18px; }
}

/* ============================================================
   スマホFV: コピーを写真左側へ重ねる (v1.6.3)

   人物が写る右側を避け、写真左側の余白へ説明文と見出しを移す。
   検索フォームは写真の直後に残し、PCレイアウトには影響させない。
   ============================================================ */
@media (max-width:760px){
  .firstview{ position:relative; }
  .firstview-inner{
    position:static;
    padding-top:20px;
    padding-bottom:24px;
  }
  .fv-photo-sp::after{
    inset:0;
    height:auto;
    background:linear-gradient(90deg,rgba(2,32,52,.58) 0%,rgba(2,32,52,.38) 38%,rgba(2,32,52,.12) 58%,rgba(2,32,52,0) 72%);
  }
  .firstview .fv-description,
  .firstview .fv-catchcopy{
    position:absolute;
    left:20px;
    z-index:3;
    width:54vw;
    max-width:218px;
    color:#fff;
    margin:0;
    text-shadow:0 2px 12px rgba(2,32,52,.78),0 1px 2px rgba(2,32,52,.9);
  }
  .firstview .fv-description{
    top:112px;
    width:auto;
    max-width:218px;
    padding:4px 10px;
    border:1px solid rgba(255,255,255,.34);
    border-radius:999px;
    background:rgba(2,32,52,.38);
    font-size:12px;
    font-weight:700;
    line-height:1.6;
  }
  .firstview .fv-catchcopy{
    top:151px;
    font-size:clamp(17px,4.8vw,19px);
    line-height:1.35;
    padding-left:13px;
    border-left-width:3px;
    word-break:auto-phrase;
    text-wrap:balance;
  }
  .firstview .fv-copy-line--1{ font-size:.82em; letter-spacing:.02em; }
  .firstview .fv-copy-line--2{ font-size:1.13em; margin:.16em 0; }
  .firstview .fv-copy-line--3{ font-size:.9em; letter-spacing:.08em; }
}

/* ==========================================================
   フッター (ココミル準拠のレイアウト)  v1.5.7
   ========================================================== */
.mc-footer{ background:#022034; color:rgba(255,255,255,.78); padding-top:48px; }
.mc-footer .footer-cols{ display:grid; grid-template-columns:1.35fr repeat(4,1fr); gap:32px; padding-bottom:0; align-items:start; }
.mc-footer .footer-brand{ font-size:19px; font-weight:800; color:#fff; margin:0 0 8px; }
.mc-footer .footer-brand .dot{ color:#a9dcf7; }
.mc-footer .footer-tagline{ margin:0; font-size:12.5px; line-height:1.75; color:rgba(255,255,255,.6); }
.mc-footer .footer-cols h3{ font-size:14px; font-weight:700; color:#fff; margin:0 0 14px; }
.mc-footer .footer-cols ul{ list-style:none; margin:0; padding:0; }
.mc-footer .footer-cols li{ font-size:13.5px; line-height:1.7; padding:0 0 8px; }
.mc-footer .footer-cols li::before{ content:none; }
.mc-footer .footer-cols a{ color:rgba(255,255,255,.78); text-decoration:none; transition:color .15s ease; }
.mc-footer .footer-cols a:hover{ color:#fff; text-decoration:underline; }
.mc-footer .footer-cols h3 .footer-heading-link{ color:#fff; font-size:inherit; font-weight:inherit; }
.mc-footer .footer-copy{ text-align:left; font-size:12px; color:rgba(255,255,255,.55); border-top:1px solid rgba(255,255,255,.1); margin-top:32px; padding:20px 0 30px; }
@media (max-width:900px){
  .mc-footer .footer-cols{ grid-template-columns:1fr 1fr; gap:24px 20px; }
  .mc-footer .footer-brand-col{ grid-column:1 / -1; }
}
@media (max-width:480px){
  .mc-footer{ padding-top:36px; }
  .mc-footer .footer-cols{ gap:20px 16px; }
  .mc-footer .footer-copy{ text-align:center; }
}


/* ============================================================
   FVのコピーと検索フォームを上下中央に置く (2026-09-25)
   実績バッジ(150px)を外したぶん下に余白が残っていたため、
   .firstview を flex にして .firstview-inner を垂直中央へ。
   .firstview-photo は position:absolute なので影響を受けない。
   スマホ(760px以下)は min-height:0 の別レイアウトなので対象外。
   ============================================================ */
@media (min-width:761px){
  .firstview{ display:flex; align-items:center; }
  .firstview-inner{ width:100%; padding-top:48px; padding-bottom:48px; }
}

/* ============================================================
   FVキャッチコピー: ポップなカード表現とブランドサイン (v1.6.6)

   3行それぞれに色と動きを持たせ、最後にロゴを思わせる
   「イベコン.com」のブランドサインを添える。
   ============================================================ */
.firstview .fv-catchcopy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:.12em;
  border-left:0;
  padding-left:0;
}
.firstview .fv-copy-line{
  width:max-content;
  max-width:100%;
  padding:.08em .38em .12em;
  border:1px solid rgba(255,255,255,.5);
  border-radius:.42em;
  box-shadow:0 .12em .3em rgba(2,32,52,.2);
  text-shadow:none;
}
.firstview .fv-copy-line--1{
  color:#07324d;
  background:rgba(255,255,255,.94);
  transform:rotate(-.45deg);
}
.firstview .fv-copy-line--2{
  color:#07324d;
  background:linear-gradient(135deg,#fff07a 0%,#ffc857 100%);
  border-color:rgba(255,244,176,.9);
  transform:rotate(.55deg);
}
.firstview .fv-copy-line--3{
  color:#fff;
  background:linear-gradient(135deg,rgba(7,87,133,.96),rgba(36,164,205,.94));
  transform:rotate(-.25deg);
}
.fv-copy-brand{
  display:inline-flex;
  align-items:baseline;
  margin-top:.2em;
  padding:.1em .55em .16em;
  border:2px solid rgba(255,255,255,.9);
  border-radius:999px;
  background:#fff;
  box-shadow:0 .18em .42em rgba(2,32,52,.26);
  font-size:.58em;
  font-weight:900;
  line-height:1.35;
  letter-spacing:.025em;
  text-shadow:none;
  transform:rotate(-1.1deg);
}
.fv-copy-brand::before{
  content:'✦';
  margin-right:.32em;
  color:#ffb52e;
  font-size:.82em;
}
.fv-copy-brand-main{ color:#07324d; }
.fv-copy-brand-dot{ color:#ff9b42; }
.fv-copy-brand-com{ color:#20a7cf; }

@media (max-width:760px){
  .firstview .fv-catchcopy{
    gap:.16em;
    width:57vw;
    max-width:224px;
  }
  .firstview .fv-copy-line{
    padding:.1em .4em .14em;
    border-radius:.48em;
    box-shadow:0 4px 12px rgba(2,32,52,.28);
  }
  .firstview .fv-copy-line--2{ margin:.02em 0; }
  .firstview .fv-copy-brand{
    margin-top:.28em;
    font-size:.7em;
    box-shadow:0 4px 12px rgba(2,32,52,.28);
  }
}

/* ============================================================
   スマホFV: 3案目のイベントポスター調 (v1.6.7)

   PCはv1.6.6のカード表現を維持。760px以下だけ、水色の斜め帯と
   黄色のキーフレーズ、下線、ロゴ風サインに切り替える。
   ============================================================ */
@media (max-width:760px){
  .firstview .fv-description{
    top:105px;
    left:16px;
    width:auto;
    max-width:245px;
    padding:5px 14px 6px;
    border:1px solid rgba(111,239,255,.92);
    border-radius:2px;
    background:linear-gradient(135deg,rgba(0,122,190,.96),rgba(10,203,230,.94));
    box-shadow:0 4px 14px rgba(0,33,65,.38),inset 0 1px 0 rgba(255,255,255,.3);
    clip-path:polygon(5% 0,100% 0,95% 100%,0 100%);
    color:#fff;
    font-size:12px;
    font-weight:900;
    line-height:1.5;
    letter-spacing:.015em;
    text-shadow:0 2px 4px rgba(0,31,61,.7);
    transform:rotate(-1.2deg);
  }

  .firstview .fv-catchcopy{
    top:150px;
    left:16px;
    width:62vw;
    max-width:244px;
    gap:.07em;
    padding:0;
    border:0;
    font-size:clamp(17px,4.85vw,19px);
    line-height:1.14;
    text-shadow:none;
  }

  .firstview .fv-copy-line{
    position:relative;
    width:max-content;
    max-width:100%;
    padding:.09em .12em .12em;
    border:0;
    border-bottom-style:solid;
    border-radius:0;
    background:none;
    box-shadow:none;
    color:#fff;
    line-height:1.13;
    text-shadow:0 3px 0 rgba(0,37,67,.38),0 4px 12px rgba(0,24,48,.78);
  }

  .firstview .fv-copy-line--1{
    border-bottom-width:3px;
    border-bottom-color:#32ddff;
    font-size:.88em;
    font-weight:900;
    letter-spacing:-.015em;
    transform:rotate(-1deg);
  }

  .firstview .fv-copy-line--2{
    margin:.08em 0 .02em;
    border-bottom-width:5px;
    border-bottom-color:#ffd51f;
    color:#ffd51f;
    font-size:1.43em;
    font-weight:900;
    letter-spacing:-.07em;
    text-shadow:0 3px 0 rgba(90,61,0,.36),0 4px 12px rgba(0,24,48,.84);
    transform:rotate(-1.1deg);
  }

  .firstview .fv-copy-line--2::after{
    content:'';
    position:absolute;
    top:-.25em;
    right:-.72em;
    width:.5em;
    height:.82em;
    border-left:.13em solid #ffd51f;
    border-right:.13em solid #32ddff;
    transform:rotate(24deg) skewX(-8deg);
    filter:drop-shadow(0 2px 2px rgba(0,31,61,.45));
  }

  .firstview .fv-copy-line--3{
    margin-top:.08em;
    margin-left:.18em;
    border-bottom-width:3px;
    border-bottom-color:#32ddff;
    font-size:1.05em;
    font-weight:900;
    letter-spacing:.025em;
    transform:rotate(-.8deg);
  }

  .firstview .fv-copy-brand{
    position:relative;
    margin-top:.38em;
    margin-left:.18em;
    padding:.18em .72em .24em;
    border:2px solid rgba(255,255,255,.94);
    border-radius:999px;
    background:#fff;
    box-shadow:0 5px 15px rgba(0,30,58,.42);
    font-size:.72em;
    line-height:1.35;
    transform:rotate(-1.5deg);
  }

  .firstview .fv-copy-brand::before{
    margin-right:.36em;
    color:#ffae16;
    font-size:1.15em;
  }

  .firstview .fv-copy-brand::after{
    content:'\2726';
    position:absolute;
    top:-.45em;
    right:-1.25em;
    color:#32ddff;
    font-size:.9em;
    text-shadow:0 2px 4px rgba(0,31,61,.55);
  }
}

/* ============================================================
   PC FV: 3案目のイベントポスター調 (v1.6.8)

   v1.6.7でスマホへ反映したデザインをPCにも展開。
   PCでは読みやすさと写真とのバランスに合わせて装飾を拡大する。
   ============================================================ */
@media (min-width:761px){
  .firstview .fv-description{
    display:inline-block;
    margin:0 0 16px;
    padding:8px 24px 9px;
    border:2px solid rgba(111,239,255,.92);
    border-radius:3px;
    background:linear-gradient(135deg,rgba(0,122,190,.96),rgba(10,203,230,.94));
    box-shadow:0 6px 20px rgba(0,33,65,.4),inset 0 1px 0 rgba(255,255,255,.32);
    clip-path:polygon(4% 0,100% 0,96% 100%,0 100%);
    color:#fff;
    font-size:17px;
    font-weight:900;
    line-height:1.5;
    letter-spacing:.025em;
    text-shadow:0 2px 5px rgba(0,31,61,.72);
    transform:rotate(-1deg);
  }

  .firstview .fv-catchcopy{
    gap:.06em;
    margin-bottom:30px;
    font-size:42px;
    line-height:1.1;
  }

  .firstview .fv-copy-line{
    position:relative;
    width:max-content;
    max-width:100%;
    padding:.06em .12em .12em;
    border:0;
    border-bottom-style:solid;
    border-radius:0;
    background:none;
    box-shadow:none;
    color:#fff;
    line-height:1.12;
    text-shadow:0 4px 0 rgba(0,37,67,.4),0 7px 20px rgba(0,24,48,.76);
  }

  .firstview .fv-copy-line--1{
    border-bottom-width:5px;
    border-bottom-color:#32ddff;
    font-size:.82em;
    font-weight:900;
    letter-spacing:-.01em;
    transform:rotate(-.8deg);
  }

  .firstview .fv-copy-line--2{
    margin:.08em 0 .02em;
    border-bottom-width:8px;
    border-bottom-color:#ffd51f;
    color:#ffd51f;
    font-size:1.24em;
    font-weight:900;
    letter-spacing:-.065em;
    text-shadow:0 4px 0 rgba(90,61,0,.38),0 7px 20px rgba(0,24,48,.82);
    transform:rotate(-.9deg);
  }

  .firstview .fv-copy-line--2::after{
    content:'';
    position:absolute;
    top:-.18em;
    right:-.75em;
    width:.52em;
    height:.9em;
    border-left:.14em solid #ffd51f;
    border-right:.14em solid #32ddff;
    transform:rotate(24deg) skewX(-8deg);
    filter:drop-shadow(0 3px 3px rgba(0,31,61,.48));
  }

  .firstview .fv-copy-line--3{
    margin-top:.07em;
    margin-left:.18em;
    border-bottom-width:5px;
    border-bottom-color:#32ddff;
    font-size:.96em;
    font-weight:900;
    letter-spacing:.035em;
    transform:rotate(-.7deg);
  }

  .firstview .fv-copy-brand{
    position:relative;
    margin-top:.34em;
    margin-left:.18em;
    padding:.15em .72em .2em;
    border:3px solid rgba(255,255,255,.94);
    border-radius:999px;
    background:#fff;
    box-shadow:0 7px 20px rgba(0,30,58,.42);
    font-size:.58em;
    line-height:1.35;
    transform:rotate(-1.3deg);
  }

  .firstview .fv-copy-brand::before{
    margin-right:.36em;
    color:#ffae16;
    font-size:1.15em;
  }

  .firstview .fv-copy-brand::after{
    content:'\2726';
    position:absolute;
    top:-.5em;
    right:-1.35em;
    color:#32ddff;
    font-size:.95em;
    text-shadow:0 2px 5px rgba(0,31,61,.55);
  }
}