@charset "UTF-8";
/* ============================================================
expo-button-reset.css (修正版 2026-09)
------------------------------------------------------------
/share/css/common.css の
.btn-default:hover, input[type="button"]:hover,
button:hover, button:active … {
background: #21364a;
border-bottom: none;
box-shadow: 0 4px 4px rgba(0,0,0,.8) inset;
padding-top: 20px;
}
がLP内のボタン全部に効いてしまうのを打ち消す。
【使い方】
index.html の で、common.css より後ろに読み込む。
expo.css の後ろが確実。
← 追加
------------------------------------------------------------
【今回の修正内容】
旧版は打ち消しに padding-top: inherit !important を使っていた。
inherit は「親要素の padding-top を継承する」ため、親が 0 の場合
ホバー時だけ上パディングが 0 に落ち、ボタンの高さと文字位置が
ガクッとズレる（＝「うにょんうにょん」する）。
例：.ev-btn は expo.css で padding:15px !important だが、
後勝ちで padding-top:inherit(=.ev-slide の 0) が適用され、
ホバー時だけ上15pxが消えていた。
→ inherit を全廃し、各クラスの「本来の padding-top 実値」を明示。
値は expo.css の定義に合わせてある。expo.css 側の padding を
変更したときは、このファイルの対応値も必ず合わせること。
============================================================ */
/* ------------------------------------------------------------
1. LP全体のボタン（イベントモーダル／スライダー／タブ等）
ここでは padding は触らない（下のクラス別指定で個別に固定する）
------------------------------------------------------------ */
#ev-panel button:hover,
#ev-panel button:active,
#ev-panel a:hover,
#ev-panel a:active,
#programModal button:hover,
#programModal button:active,
#programModal a:hover,
#programModal a:active {
background-image: none !important;
border-bottom: none !important;
box-shadow: none !important;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
}
/* ------------------------------------------------------------
2. 影・線の打ち消し（クラス指定・padding は含めない）
------------------------------------------------------------ */
.ev-btn:hover, .ev-btn:active,
.ev-arrow:hover, .ev-arrow:active,
.ev-open:hover, .ev-open:active,
.ev-close:hover, .ev-close:active,
.ev-dot:hover, .ev-dot:active,
.btn:hover, .btn:active,
.btn-primary:hover, .btn-primary:active,
.btn-line:hover, .btn-line:active,
.hd-cta:hover, .hd-cta:active,
.modal-close:hover, .modal-close:active,
.modal-apply:hover, .modal-apply:active,
.tab:hover, .tab:active,
.mini:hover, .mini:active,
.cal-d:hover, .cal-d:active,
.sl-dot:hover, .sl-dot:active,
.sl-btns button:hover, .sl-btns button:active,
.jump-a:hover, .jump-a:active,
.acc-h:hover, .acc-h:active,
.faq-q:hover, .faq-q:active {
background-image: none !important;
border-bottom: none !important;
box-shadow: none !important;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
}
/* ------------------------------------------------------------
3. padding-top の固定（common.css の padding-top:20px 打ち消し）
値は expo.css の通常時の定義と一致させること。
※ inherit は絶対に使わない（高さズレの原因）
------------------------------------------------------------ */
/* padding: 15px … expo.css .ev-btn */
.ev-btn:hover,
.ev-btn:active,
.ev-btn:focus {
padding-top: 15px !important;
}
/* padding: 15px 30px … expo.css .btn / .btn-primary / .btn-ghost / .modal-apply */
.btn:hover, .btn:active,
.btn-primary:hover, .btn-primary:active,
.btn-ghost:hover, .btn-ghost:active,
.modal-apply:hover, .modal-apply:active {
padding-top: 15px !important;
}
/* padding: 16px 26px … expo.css .btn-line */
.btn-line:hover,
.btn-line:active {
padding-top: 16px !important;
}
/* padding: 22px 24px … expo.css .acc-h / .faq-q */
.acc-h:hover, .acc-h:active,
.faq-q:hover, .faq-q:active {
padding-top: 22px !important;
}
/* padding: 11px 22px … expo.css .tab */
.tab:hover,
.tab:active {
padding-top: 11px !important;
}
/* padding: 9px 18px / 9px 16px … expo.css .hd-cta / .jump-a */
.hd-cta:hover, .hd-cta:active,
.jump-a:hover, .jump-a:active {
padding-top: 9px !important;
}
/* padding: 7px 12px … expo.css .mini */
.mini:hover,
.mini:active {
padding-top: 7px !important;
}
/* padding-top: 0 のもの
.ev-arrow(0) / .ev-dot(0) / .ev-open(0 16px) / .ev-close(0)
.cal-d(0) / .sl-dot(0) / .sl-btn(0) / .modal-close(0 2px) */
.ev-arrow:hover, .ev-arrow:active,
.ev-dot:hover, .ev-dot:active,
.ev-open:hover, .ev-open:active,
.ev-close:hover, .ev-close:active,
.cal-d:hover, .cal-d:active,
.sl-dot:hover, .sl-dot:active,
.sl-btns button:hover, .sl-btns button:active,
.modal-close:hover, .modal-close:active {
padding-top: 0 !important;
}
/* ------------------------------------------------------------
4. 背景色の維持
※ 打ち消すだけだと色が変わる／透明になるボタンをここで戻す
※ expo.css の意図は「ホバーで赤 → 黒(--ink)」。
旧版は #DC1414 + opacity:.88 で赤のまま薄くしていたため、
expo.css のデザイン意図に合わせて --ink に戻してある。
赤のまま維持したい場合は下の【赤維持版】に差し替えること。
------------------------------------------------------------ */
.ev-btn:hover,
.ev-btn:active,
.btn-primary:hover,
.btn-primary:active {
background-color: var(--ink, #14161a) !important;
color: #fff !important;
}
/* 【赤維持版】上のブロックを消して、こちらを有効にする
.ev-btn:hover,
.ev-btn:active,
.btn-primary:hover,
.btn-primary:active {
background-color: var(--red, #e01b1b) !important;
color: #fff !important;
opacity: .88;
}
*/
/* ------------------------------------------------------------
5. フォーカスリングは残す（キーボード操作のため消さない）
------------------------------------------------------------ */
#ev-panel button:focus-visible,
#ev-panel a:focus-visible,
.ev-btn:focus-visible,
.btn:focus-visible {
outline: 2px solid var(--red, #e01b1b);
outline-offset: 2px;
}