/*
 * 今風のデザイン層(文章・写真・ロゴ・配色・ページの構成は現行のまま、見せ方だけを新しくする)
 * この1ファイルの読み込みを外す(functions.php の sf-modern)と、現行と同じ見た目に戻る。
 * 現行のスタイルの指定が細かいので、上書きに !important を使っている箇所がある。
 */
:root {
	--sf-blue: #3360aa;
	--sf-blue-deep: #274b8c;
	--sf-red: #c70101;
	--sf-red-bright: #e30414;
	--sf-ink: #100707;
	--sf-line: #dde3ee;
	--sf-radius: 16px;
	--sf-radius-s: 10px;
	--sf-shadow: 0 14px 34px -16px rgba(16, 7, 7, .28);
	--sf-shadow-hover: 0 26px 46px -18px rgba(16, 7, 7, .38);
	--sf-ease: cubic-bezier(.22, .61, .36, 1);
}

html { scroll-behavior: smooth; }
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}
::selection { background: var(--sf-blue); color: #fff; }
a { transition: color .25s var(--sf-ease), background-color .25s var(--sf-ease), opacity .25s var(--sf-ease); }

/* ---------------------------------------------------------------
 * ヘッダー: 上に固定・斜めの飾りをやめてすっきり・メニューは丸いタブ
 * ------------------------------------------------------------- */
#masthead {
	position: sticky;
	top: 0;
	z-index: 1000;
	background: transparent;
}
.sf-199 .sf-element.sf-element-3cf3f1fe {
	padding: 6px 0 !important;
	background-color: var(--sf-ink) !important;
	font-size: 12px;
}
.sf-199 .sf-element.sf-element-3cf3f1fe .sf-icon-list-text,
.sf-199 .sf-element.sf-element-3cf3f1fe .sf-icon-list-item > a { font-size: 12px !important; letter-spacing: .06em; opacity: .9; }
.sf-199 .sf-element.sf-element-3cf3f1fe .sf-icon-list-item > a:hover .sf-icon-list-text { opacity: 1; text-decoration: underline; text-underline-offset: 4px; }

.sf-199 .sf-element.sf-element-2108fbb,
.sf-199 .sf-element.sf-element-468a4902 {
	background-image: linear-gradient(110deg, var(--sf-blue-deep) 0%, var(--sf-blue) 55%, #4377c4 100%) !important;
	box-shadow: 0 10px 30px -14px rgba(16, 7, 7, .55) !important;
	border-bottom: 3px solid var(--sf-red);
}
.sf-199 .sf-element.sf-element-2108fbb > .sf-background-overlay,
.sf-199 .sf-element.sf-element-468a4902 > .sf-background-overlay { display: none !important; }
.sf-199 .sf-element.sf-element-eac626e > .sf-element-populated > .sf-widget-wrap { padding-top: 10px !important; padding-bottom: 10px !important; }

/* ロゴ: 少し小さく・影を付けて、ヘッダーから浮かせる */
.sf-199 .sf-element.sf-element-7f74f6d8 img { width: 100px !important; filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .38)); transition: transform .4s var(--sf-ease); }
.sf-199 .sf-element.sf-element-7f74f6d8 > .sf-widget-container { margin-bottom: -76px !important; }
.sf-199 .sf-element.sf-element-7f74f6d8:hover img { transform: translateY(-2px) scale(1.03); }

/* メニュー: 下線をやめて、丸いタブ。今いるページは白いタブ */
.sf-nav-menu--main .sf-item {
	border-radius: 999px;
	padding: 9px 14px !important;
	line-height: 1.2 !important;
	color: #fff !important;
	letter-spacing: .06em !important;
	transition: background-color .25s var(--sf-ease), color .25s var(--sf-ease) !important;
}
.sf-nav-menu--main .sf-item:before,
.sf-nav-menu--main .sf-item:after { display: none !important; }
.sf-nav-menu--main .sf-item:hover,
.sf-nav-menu--main .sf-item:focus { background: rgba(255, 255, 255, .16); color: #fff !important; }
.sf-nav-menu--main .sf-item.sf-item-active { background: #fff; color: var(--sf-blue) !important; font-weight: 700 !important; }
.sf-nav-menu--main .sf-item.sf-item-active:hover { background: #fff; }

/* スマホのヘッダー・メニュー */
.sf-199 .sf-element.sf-element-3964ac2e img { width: 64px !important; filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .35)); }
.sf-199 .sf-element.sf-element-3964ac2e > .sf-widget-container { margin-bottom: -34px !important; }
#sf-popup-modal-1032 .dialog-widget-content { border-radius: 24px 0 0 24px !important; }
#sf-popup-modal-1032 .sf-nav-menu .sf-item { border-radius: 12px; padding: 4px 14px; transition: background-color .2s; }
#sf-popup-modal-1032 .sf-nav-menu .sf-item:hover { background: rgba(255, 255, 255, .14); }
#sf-popup-modal-1032 .sf-nav-menu .sf-item.sf-item-active { background: rgba(255, 255, 255, .22); }

/* ---------------------------------------------------------------
 * ボタン: 丸いピル型・浮き上がる
 * ------------------------------------------------------------- */
.sf-button {
	border-radius: 999px !important;
	padding: 16px 36px !important;
	letter-spacing: .1em;
	box-shadow: 0 12px 24px -12px rgba(16, 7, 7, .55);
	transition: transform .3s var(--sf-ease), box-shadow .3s var(--sf-ease), background-color .3s var(--sf-ease), color .3s var(--sf-ease) !important;
}
.sf-button:hover,
.sf-button:focus { transform: translateY(-3px); box-shadow: 0 20px 30px -14px rgba(16, 7, 7, .6); }
.sf-button:active { transform: translateY(-1px); }

/* ---------------------------------------------------------------
 * トップ: 1画面目
 * ------------------------------------------------------------- */
.sf-32 .sf-element.sf-element-3e56cf2c > .sf-background-overlay {
	background-image: linear-gradient(180deg, rgba(16, 7, 7, .55) 0%, rgba(16, 7, 7, .2) 45%, rgba(16, 7, 7, .72) 100%) !important;
	background-color: transparent !important;
	opacity: 1 !important;
}
.sf-32 .sf-element.sf-element-3e56cf2c .sf-heading-title { text-shadow: 0 4px 28px rgba(0, 0, 0, .55); letter-spacing: .14em; }
.sf-32 .sf-element.sf-element-3e56cf2c .sf-image img { filter: drop-shadow(0 18px 30px rgba(0, 0, 0, .5)); }

/* 写真・カルーセル: 角丸+影 */
.sf-section-boxed .sf-image img,
.sf-carousel__slide img { border-radius: var(--sf-radius); }
.sf-section-boxed .sf-image img { box-shadow: var(--sf-shadow); }
.sf-carousel__slide img { box-shadow: var(--sf-shadow); }
/* ロゴ・QR・ヘッダー/フッターの画像には影を付けない */
.sf-199 .sf-image img,
.sf-224 .sf-image img,
.sf-32 .sf-element-3e56cf2c .sf-image img { box-shadow: none; }
.sf-32 .sf-element.sf-element-f412e20 .sf-image img { border-radius: 0; box-shadow: none; }

/* 帯(後援会/OB会・スタッフ紹介)の背景写真は、そのまま全幅。少し濃淡を付ける */
.sf-section.sf-top-section { transition: none; }

/* ---------------------------------------------------------------
 * 見出し
 * ------------------------------------------------------------- */
.sf-heading-title { letter-spacing: .01em; }
h2.sf-heading-title { text-wrap: balance; }
/* 青い見出し帯: 角丸+左に赤いアクセント */
.sf-widget-heading > .sf-widget-container[style],
.sf-bar { border-radius: 12px; }

/* ---------------------------------------------------------------
 * 記事カード(OB Activity Report)
 * ------------------------------------------------------------- */
.sf-posts--skin-cards .sf-post__card {
	border-radius: 20px !important;
	overflow: hidden;
	border: 1px solid rgba(16, 7, 7, .06);
	box-shadow: 0 8px 24px -14px rgba(16, 7, 7, .25) !important;
	transition: transform .4s var(--sf-ease), box-shadow .4s var(--sf-ease) !important;
}
.sf-posts--skin-cards .sf-post__card:hover { transform: translateY(-8px); box-shadow: var(--sf-shadow-hover) !important; }
.sf-posts--skin-cards .sf-post__thumbnail { overflow: hidden; }
.sf-posts--skin-cards .sf-post__thumbnail img { transition: transform .8s var(--sf-ease); }
.sf-posts--skin-cards .sf-post__card:hover .sf-post__thumbnail img { transform: scale(1.07) !important; }
.sf-post__title a { transition: color .25s; }
.sf-post__title a:hover { color: var(--sf-red) !important; }
.sf-post__read-more { letter-spacing: .08em; }
.sf-posts--skin-cards .sf-post__meta-data { border-top-color: rgba(16, 7, 7, .07); }

/* 記事ページの横のリスト(Recent News / Hot News) */
.sf-posts--skin-classic .sf-post { transition: transform .3s var(--sf-ease); }
.sf-posts--skin-classic .sf-post:hover { transform: translateX(4px); }
.sf-posts--skin-classic .sf-post__title a:hover { color: var(--sf-red); }

/* ページ送り(« Previous / Next ») */
.sf-pagination { display: flex; justify-content: center; gap: 12px; margin-top: 32px; }
.sf-pagination .page-numbers { padding: 10px 22px; border-radius: 999px; background: #fff; border: 1px solid var(--sf-line); color: var(--sf-ink); text-decoration: none; transition: background-color .25s, color .25s, transform .25s var(--sf-ease); }
.sf-pagination a.page-numbers:hover { background: var(--sf-red); color: #fff; transform: translateY(-2px); }
.sf-pagination span.page-numbers { opacity: .45; }

/* 前後の記事 */
.sf-post-navigation__link a { transition: color .25s, transform .3s var(--sf-ease); }
.sf-post-navigation__link a:hover { color: var(--sf-red); }

/* ---------------------------------------------------------------
 * SNS(LINE / Twitter / Instagram)のカード
 * ------------------------------------------------------------- */
.sf-32 .sf-element.sf-element-02afe95 .sf-column > .sf-column-wrap {
	border-radius: 22px;
	overflow: hidden;
	box-shadow: 0 18px 34px -20px rgba(16, 7, 7, .5);
	transition: transform .4s var(--sf-ease), box-shadow .4s var(--sf-ease);
}
.sf-32 .sf-element.sf-element-02afe95 .sf-column:hover > .sf-column-wrap { transform: translateY(-8px); box-shadow: 0 30px 44px -22px rgba(16, 7, 7, .55); }
.sf-32 .sf-element.sf-element-02afe95 .sf-container { gap: 0; }
.sf-32 .sf-element.sf-element-02afe95 .sf-image img { border-radius: 12px; box-shadow: none; }

/* ---------------------------------------------------------------
 * 表・円グラフ(チーム・沿革のページ)
 * ------------------------------------------------------------- */
.sf-659 table.tafe-table {
	border-collapse: separate !important;
	border-spacing: 0;
	border: 1px solid #cfd6e4;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: var(--sf-shadow);
	background: #fff;
}
.sf-659 table.tafe-table td,
.sf-659 table.tafe-table th { border: 0 !important; border-right: 1px solid #e3e8f1 !important; border-bottom: 1px solid #e3e8f1 !important; padding: .8em 1em !important; }
.sf-659 table.tafe-table tr > *:last-child { border-right: 0 !important; }
.sf-659 table.tafe-table tr:last-child > * { border-bottom: 0 !important; }
.sf-659 table.tafe-table thead th,
.sf-659 table.tafe-table .tafe-table-header th { background: #eef2fa; font-weight: 700; }
.sf-659 table.tafe-table tbody tr:hover td { background: #f7f9fd; }

.sf-pie { border-radius: 20px; border-color: var(--sf-line); box-shadow: var(--sf-shadow); }

/* ---------------------------------------------------------------
 * フォーム(お問い合わせ・申込み)
 * ------------------------------------------------------------- */
.wpcf7 label { font-weight: 500; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="number"],
.wpcf7 textarea {
	width: 100%;
	max-width: 560px;
	padding: 12px 16px;
	border: 1px solid #cfd6e4 !important;
	border-radius: var(--sf-radius-s) !important;
	background: #fff;
	font: inherit;
	box-sizing: border-box;
	transition: border-color .25s, box-shadow .25s;
}
.wpcf7 textarea { max-width: 100%; }
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 input[type="url"]:focus,
.wpcf7 input[type="number"]:focus,
.wpcf7 textarea:focus { outline: 0; border-color: var(--sf-blue); box-shadow: 0 0 0 4px rgba(51, 96, 170, .18); }
.wpcf7 input[type="number"] { max-width: 180px; }
.wpcf7 input[type="radio"] { accent-color: var(--sf-red); width: 1.1em; height: 1.1em; vertical-align: -.15em; }
.wpcf7 .wpcf7-list-item { margin: 0 1.2em 0 0; }
.wpcf7 .wpcf7-submit {
	border: 0 !important;
	border-radius: 999px !important;
	padding: 16px 44px !important;
	background: var(--sf-red) !important;
	color: #fff !important;
	letter-spacing: .1em;
	box-shadow: 0 14px 26px -12px rgba(199, 1, 1, .7);
	cursor: pointer;
	transition: transform .3s var(--sf-ease), box-shadow .3s var(--sf-ease), background-color .3s;
}
.wpcf7 .wpcf7-submit:hover { background: var(--sf-red-bright) !important; transform: translateY(-3px); box-shadow: 0 22px 30px -14px rgba(199, 1, 1, .75); }
.wpcf7 .wpcf7-response-output { border-radius: var(--sf-radius-s); padding: 12px 18px !important; }
.sponsorbox { border-radius: 14px; padding: 18px 22px; border-color: #cfd6e4 !important; background: #fafbfe; }

/* ---------------------------------------------------------------
 * 協賛・スポンサー帯とフッター
 * ------------------------------------------------------------- */
.sf-224 .sf-image img { border-radius: 12px; transition: transform .4s var(--sf-ease), box-shadow .4s var(--sf-ease); }
.sf-224 .sf-image a:hover img { transform: translateY(-4px); box-shadow: 0 16px 26px -14px rgba(0, 0, 0, .45); }
.sf-224 .sf-nav-menu a,
.sf-224 a { transition: color .25s, opacity .25s, transform .25s var(--sf-ease); }
.sf-224 .sf-nav-menu a:hover,
.sf-224 .sf-icon-list-item a:hover { color: #fff !important; opacity: 1; transform: translateX(4px); text-decoration: underline; text-decoration-color: var(--sf-red); text-underline-offset: 5px; }
#colophon { position: relative; }
#colophon::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, var(--sf-blue), var(--sf-red)); z-index: 1; }

/* ---------------------------------------------------------------
 * ページの上のタイトル帯(下層ページ)
 * ------------------------------------------------------------- */
.sf-section .sf-shape-bottom svg { filter: drop-shadow(0 -6px 12px rgba(16, 7, 7, .12)); }

/* ---------------------------------------------------------------
 * 表示アニメーション: 少しゆっくり・なめらか
 * ------------------------------------------------------------- */
.animated { animation-duration: .9s; animation-timing-function: var(--sf-ease); }

@media (max-width: 767px) {
	.sf-button { padding: 14px 28px !important; }
	.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 input[type="url"] { max-width: 100%; }
	.sf-posts--skin-cards .sf-post__card:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
	html { scroll-behavior: auto; }
}
