@charset "utf-8";
/*
Theme Name: GENESIS child
Theme URI:https://tcd-theme.com/tcd103/
Description:WordPressテーマ「GENESIS」の子テーマ
Template:genesis_tcd103
Author:TCD
Author URI:https://tcd-theme.com/
Version:1.0
*/

/*
  ここから下にCSSを追記してください。
*/
:is(.design_header, .tcdce-body .design_header) .large_headline {
    color: #004ea2;
}
:root { --hd-ink:#12294d; --hd-body:#000; }


#header_logo img {
    max-width: 284px;
    height: auto;
}

.cb_free_space .post_content {
	padding: 0;
}

.pale_light_blue_bg {
	position: relative;
    padding: 140px 0;
}
.pale_light_blue_bg:after {
    background: #c3d8fc;
    content: '';
    display: block;
    width: 200vw;
    height: 100%;
    position: absolute;
    top: 0;
    left: -50%;
    z-index: -1;
	opacity: 0.3;
}
.mb120 {
	margin-bottom: 120px!important;
}



p.name {
	font-size: 18px;
	line-height: 1.2;
	font-weight: bold;
}
p.name span {
	font-size: 20px;
}

#footer_banner a {
	max-height: 300px;
}
#footer_logo {
    width: fit-content;
}
#footer_logo img {
    width: 100%;
    max-width: 480px;
    height: auto;
}
#footer_nav ul {
    flex-wrap: wrap;
}
/* ----------------------------------------------------------------------
 役員・理事一覧（PROFILE）
 固定ページ「役員・理事紹介」の member_list / member_card 用
---------------------------------------------------------------------- */
/* .post_row の align-items:flex-start を打ち消して、同じ行のカード高さを揃える */
.member_list { display:grid; grid-template-columns:repeat(4,1fr); gap:25px; margin:0 0 2em; align-items:stretch; }
.member_list .post_col { margin:0; flex:none; }

.member_card {
	display:flex; flex-direction:column;
	background:#fff; border:1px solid #e3e6ea; border-radius:6px;
	padding:10px 10px 22px;
}
.member_photo {
	aspect-ratio:4 / 5; margin:0 0 16px;
	background:#e9ebee; border-radius:4px; overflow:hidden;
}
.member_photo img { width:100%; height:100%; object-fit:cover; display:block; margin:0; }

.member_card .member_role {
	margin:0 0 5px; padding:0 8px;
	font-size:13px; line-height:1.5; color:var(--tcd-main-color,#004ea2);
}
.member_card .member_name {
	margin:0 0 12px; padding:0 8px;
	font-size:18px; line-height:1.5; font-weight:500;
}
.member_card .member_org {
	margin:0; padding:0 8px;
	font-size:13px; line-height:1.75; color:#666;
}

@media screen and (max-width:1100px) {
	/* GENESIS は 1100px で .post_row を display:block にするため、ここで打ち消す */
	.member_list { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }
	.member_list .post_col { margin-bottom:0; }
}
@media screen and (max-width:800px) {
	.member_list { grid-template-columns:repeat(2,1fr); gap:12px; }
	.member_card { padding:8px 8px 16px; border-radius:5px; }
	.member_photo { margin-bottom:12px; }
	.member_card .member_role { font-size:12px; padding:0 4px; }
	.member_card .member_name { font-size:16px; margin-bottom:8px; padding:0 4px; }
	.member_card .member_org { font-size:12px; line-height:1.7; padding:0 4px; }
}

/* ----------------------------------------------------------------------
 ADVISORY / NETWORK
---------------------------------------------------------------------- */
.advisory_lead { margin:0 0 45px; }

.advisory_list { display:grid; grid-template-columns:repeat(2,1fr); gap:25px; margin:0; align-items:stretch; }
.advisory_list .post_col { margin:0; flex:none; }

.advisory_card {
	display:flex; align-items:flex-start; gap:20px;
	background:#f0f4fa; border:1px solid #e4eaf4; border-radius:6px;
	padding:28px 30px;
}
.advisory_icon {
	flex:none; width:128px; height:128px; border-radius:100%; background:#fff;
	display:flex; align-items:center; justify-content:center;
	color:var(--tcd-main-color,#004ea2);
	border: solid 1px #004ea2;
}
.advisory_icon img { width:64px; display:block; }
.advisory_card .advisory_title { margin:0 0 10px; font-size:17px; line-height:1.5; font-weight:bold; color: #004ea2; }
.advisory_card .advisory_desc  { margin:0; font-size:14px; line-height:1.9; color:#555; }

/* GENESIS の design_arrow_button を左寄せ・小サイズで使う */
.post_row + .advisory_link { margin-top:22px; }
.advisory_link { text-align:left; margin-bottom:0; }
.advisory_link a { font-size:15px; }
/* テーマ設定のリンク色（.post_content a）が効いてしまうので、ラベルは黒に戻す */
.advisory_link a .label { margin-right:10px; color:#000; }
.advisory_link a .label em { font-style:normal; color:var(--tcd-main-color,#004ea2); }
.advisory_link .arrow_button { width:22px; height:22px; background:var(--tcd-main-color,#004ea2); }
.advisory_link .arrow_button:before,
.advisory_link .arrow_button:after { font-size:7px; top:8px; }

@media screen and (max-width:800px) {
	.advisory_lead { margin-bottom:30px; }
	.advisory_list { grid-template-columns:1fr; gap:12px; }
	.advisory_card { padding:20px; gap:15px; }
	.advisory_icon { width:52px; height:52px; }
	.advisory_icon svg { width:26px; height:26px; }
	.advisory_card .advisory_title { font-size:16px; }
	.advisory_card .advisory_desc { font-size:13px; line-height:1.8; }
	.post_row + .advisory_link { margin-top:18px; }
	/* SP では .design_arrow_button a が右寄せになるので左寄せに戻す */
	.advisory_link a { font-size:14px; width:auto; justify-content:flex-start; }
	.advisory_link a .label { max-width:none; }
}



/* ----------------------------------------------------------------------
 CLASS PROJECT / UNIVERSITY PARTNERSHIP PROJECT ページ
---------------------------------------------------------------------- */

/* テーマの番号付きリスト .q_styled_ol は未定義の var(--main_color) を参照しており、
   このままでは丸数字の背景が透明になる。テーマのメインカラーを流し込んで補う。
   （エディターのクイックタグから番号付きリストを使う場合にも効く） */
:root { --main_color: var(--tcd-main-color, #004ea2); }

/* ページ冒頭の見出し。3 行と長いため、既定の 70px から落とす。
   サイトのインライン CSS が font-size:70px !important を出しているので !important が必要。
   幅も 50% では「UNIVERSITY PARTNERSHIP」が 1 行に収まらないため 57% に広げる。 */
/* テーマ側は :is(.design_header, .tcdce-body .design_header) .title_area で
   詳細度 (0,3,0) を持つため、こちらも 2 クラス + 1 クラスで合わせる */
.design_header.page_intro .title_area { width:57%; }
.design_header.page_intro .desc { width:43%; }
.page_intro .large_headline { font-size:46px !important; }

/* 大学カード ------------------------------------------------------- */
.uni_list { align-items:stretch; margin-bottom:0; }
.uni_card {
	display:flex; flex-direction:column;
	background:#fff; border:1px solid #e3e6ea; border-radius:6px; overflow:hidden;
}
.uni_photo { aspect-ratio:16 / 10; background:#e9ebee; }
.uni_photo img { width:100%; height:100%; object-fit:cover; display:block; margin:0; }

.uni_card .uni_name {
	margin:0; padding:20px 20px 0;
	font-size:18px; line-height:1.4; font-weight:500;
	color:var(--tcd-main-color,#004ea2);
	font-weight: bold;
}
.uni_card .uni_type { margin:0; padding:5px 20px 18px; font-size:13px; line-height:1.5; color:#004ea2; }

.uni_spec {
	display:grid; grid-template-columns:96px 1fr;
	margin:0; padding:0 20px 22px; font-size:12px; line-height:1.7;
}
.uni_spec dt, .uni_spec dd { margin:0; padding:9px 0; border-top:1px solid #edf0f4; }
.uni_spec dt { display:flex; align-items:center; gap:6px; color:var(--tcd-main-color,#004ea2); }
.uni_spec dd { padding-left:12px; color:#000000; }
.uni_spec svg { width:14px; height:14px; flex:none; margin-top:3px; }

/* クラス事業の進め方 ------------------------------------------------ */
.flow_grid {
	display:grid; grid-template-columns:1fr 1fr;
	border-top:1px solid #e0e4ea; border-left:1px solid #e0e4ea;
	margin:70px 0 2em;
}
.flow_cell {
	border-right:1px solid #e0e4ea; border-bottom:1px solid #e0e4ea;
	padding:50px 50px 55px;
}
.flow_intro .flow_title { margin:0 0 20px; font-size:32px; line-height:1.45; font-weight:600; }
.flow_intro .flow_en {
	margin:0 0 28px; font-size:13px; letter-spacing:.12em;
	color:var(--tcd-main-color,#004ea2);
}
.flow_intro p { margin:0; font-size:14px; line-height:2.2; }

.flow_photo { aspect-ratio:16 / 9; background:#e9ebee; margin:0 0 28px; }
.flow_photo img { width:100%; height:100%; object-fit:cover; display:block; margin:0; }
.flow_cell .flow_name { margin:0 0 26px; text-align:center; }
.flow_cell .flow_name b { display:block; font-size:26px; line-height:1.4; font-weight:600; }
.flow_cell .flow_name span { display:block; margin-top:4px; font-size:15px; color: #004ea2; font-weight: bold; }
.flow_cell .flow_caption { display:block; font-size:0.9em; margin-bottom: 1em; }
.flow_cell .q_styled_ol { margin:0; font-size:14px; line-height:1.9; }
.flow_cell .q_styled_ol li { margin-bottom:1.1em; padding-left:2.4em; }
.flow_cell .q_styled_ol li:last-child { margin-bottom:0; }

@media screen and (max-width:1100px) {
	.design_header.page_intro .title_area, .design_header.page_intro .desc { width:auto; }
	.page_intro .large_headline { font-size:40px !important; }
	.uni_list .post_col { margin-bottom:25px; }
	.uni_list .post_col:last-of-type { margin-bottom:0; }
	.flow_grid { grid-template-columns:1fr; margin-top:50px; }
	.flow_cell { padding:40px 35px 45px; }
}
@media screen and (max-width:800px) {
	.page_intro .large_headline { font-size:24px !important; }
	.uni_card .uni_name { font-size:17px; padding-top:18px; }
	.uni_spec { grid-template-columns:88px 1fr; padding-bottom:18px; }
	.flow_cell { padding:30px 22px 35px; }
	.flow_intro .flow_title { font-size:24px; }
	.flow_intro .flow_en { margin-bottom:20px; font-size:12px; }
	.flow_photo { margin-bottom:20px; }
	.flow_cell .flow_name { margin-bottom:20px; }
	.flow_cell .flow_name b { font-size:21px; }
	.flow_cell .flow_name span { font-size:14px; }
	.flow_cell .q_styled_ol { font-size:13px; }
}




/* ----------------------------------------------------------------------
 事業計画・活動報告ページ
 文字サイズは GENESIS の既定値を優先し、該当が無いものはモックの見た目に合わせた。
   --hd-ink   見出し・カードタイトルの濃紺
   --hd-body  本文のグレー
---------------------------------------------------------------------- */

/* PLAN / REPORT ---------------------------------------------------- */
.plan_intro { margin:0 0 90px; }
.plan_row {
	display:grid; grid-template-columns:280px 1fr 240px; gap:40px; align-items:center;
	border:1px solid #e3e8f0; border-radius:6px; padding:38px 45px; margin:0 0 25px;
}
.plan_row:last-child { margin-bottom:0; }
/* .large_headline / .sub_title.colored はテーマ既定（70px / 18px）をそのまま使う。
   色は .design_header 配下でないとメインカラーが乗らないため、ここで明示する。 */
.plan_row_head .large_headline {
	margin:0; line-height:1.1; white-space:nowrap;
	color:var(--tcd-main-color,#004ea2);
}
.plan_row_head .sub_title { margin:8px 0 0; }
.plan_row_desc p { margin:0; font-size:15px; line-height:2.1; color:var(--hd-body); }
.plan_row_fig { text-align:center; }
.plan_row_fig img { width:auto; height:auto; max-height:180px; margin:0; }

/* セクション見出し・リード ------------------------------------------ */
/* テーマは design-plus.css で .post_content h2 を中央寄せ・拡大するため、
   詳細度 (0,2,0) で打ち消す */
.post_content .plan_sec_head {
	margin:0 0 18px; padding:0; border:none; text-align:left;
	font-size:30px; line-height:1.5; font-weight:bold; color:var(--hd-ink);
}
.plan_lead { margin:0 0 40px; font-size:15px; line-height:2.1; color:var(--hd-body); }

/* 重点施策カード ---------------------------------------------------- */
.policy_list { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin:0 0 45px; align-items:stretch; }
.policy_card {
	display:flex; flex-direction:column; align-items:center; text-align:center;
	background:#fff; border:1px solid #e3e8f0; border-radius:6px; padding:26px 24px 30px;
}
.policy_card .policy_num {
	align-self:flex-start; margin:0; width:28px; height:28px; border-radius:50%;
	background:var(--tcd-main-color,#004ea2); color:#fff;
	font-size:13px; line-height:28px; text-align:center;
}
.policy_icon { color:var(--tcd-main-color,#004ea2); margin:6px 0 20px; min-height: 128px; display: flex; align-items: center; }
.policy_icon img { width:128px; display:block; }
.policy_card .policy_name { margin:0 0 12px; font-size:15px; line-height:1.5; font-weight:600; color:var(--hd-ink); }
.policy_card .policy_text { margin:0; font-size:13px; line-height:1.9; color:var(--hd-body); }

/* POINT（テーマの囲み枠 .q_frame をベースに、枠線をメインカラーへ） ---- */
.q_frame.point_box { border-color:var(--tcd-main-color,#004ea2); padding:26px 34px 30px; margin:0 0 90px; }
.point_box .point_label {
	margin:0 0 14px; font-size:14px; font-weight:600; letter-spacing:.06em;
	color:var(--tcd-main-color,#004ea2);
}
.point_body { display:flex; align-items:center; gap:26px; }
.point_icon { flex:none; color:var(--tcd-main-color,#004ea2); }
.point_icon img { width:64px; display:block; }
.point_body p { margin:0; font-size:15px; line-height:2.1; color:var(--hd-body); }

/* 活動の様子 -------------------------------------------------------- */
.gallery_list { align-items:stretch; margin:0 0 90px; }
.gallery_photo { aspect-ratio:16 / 10; border-radius:4px; overflow:hidden; background:#e9ebee; }
.gallery_photo img { width:100%; height:100%; object-fit:cover; display:block; margin:0; }
.gallery_item .gallery_cap {
	margin:16px 0 0; text-align:center;
	font-size:14px; line-height:1.7; color:var(--hd-ink);
}

/* 公開資料ダウンロード ---------------------------------------------- */
.dl_list { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin:0 0 90px; align-items:stretch; }
.dl_card {
	display:flex; flex-direction:column; align-items:center; text-align:center;
	background:#fff; border:1px solid #e3e8f0; border-radius:6px; padding:30px 22px 28px;
}
.dl_icon { color:var(--tcd-main-color,#004ea2); margin:0 0 18px; }
.dl_icon svg { width:46px; height:46px; display:block; }
.dl_card .dl_name { margin:0 0 12px; font-size:15px; line-height:1.5; font-weight:600; color:var(--hd-ink); }
.dl_card .dl_text { margin:0 0 22px; font-size:12px; line-height:1.9; color:var(--hd-body); }

/* ボタン：テーマの .q_custom_button を土台に、モックの白地＋青枠へ */
.dl_card .dl_button {
	margin-top:auto; gap:8px; height:38px; font-size:13px;
	background:#fff; color:var(--tcd-main-color,#004ea2);
	border-color:var(--tcd-main-color,#004ea2);
	transition:background-color .3s ease, color .3s ease;
}
.dl_card .dl_button svg { width:15px; height:15px; flex:none; }
.dl_card .dl_button:hover { background:var(--tcd-main-color,#004ea2); color:#fff; }

/* よくあるご質問（テーマの .faq_list をそのまま利用） ------------------ */
.faq_block { background:#f7f9fc; border:1px solid #e3e8f0; border-radius:6px; padding:34px 38px 38px; }
.faq_block .plan_sec_head { margin-bottom:22px; }
.faq_block .faq_list { margin-bottom:0; }

@media screen and (max-width:1100px) {
	.plan_row { grid-template-columns:240px 1fr; gap:26px 32px; padding:30px 32px; }
	.plan_row_fig { grid-column:1 / -1; }
	.plan_row_fig img { max-width:200px; }
	.policy_list, .dl_list { grid-template-columns:repeat(2,1fr); }
	.gallery_list .post_col { margin-bottom:25px; }
	.gallery_list .post_col:last-of-type { margin-bottom:0; }
}
@media screen and (max-width:800px) {
	.plan_intro { margin-bottom:55px; }
	.plan_row { grid-template-columns:1fr; gap:14px; padding:24px 22px; margin-bottom:15px; text-align:center; }
	.plan_row_desc p { font-size:14px; line-height:2; }
	.plan_row_fig img { max-width:170px; }
	.post_content .plan_sec_head { font-size:20px; }
	.plan_row_head .large_headline { white-space:normal; }
	.plan_lead { margin-bottom:28px; font-size:14px; line-height:2; }
	.policy_list, .dl_list { gap:12px; margin-bottom:55px; }
	.policy_card { padding:20px 16px 24px; }
	.policy_icon svg { width:42px; height:42px; }
	.policy_card .policy_name { font-size:14px; }
	.policy_card .policy_text { font-size:12px; }
	.q_frame.point_box { padding:20px 20px 24px; margin-bottom:55px; }
	.point_body { gap:16px; }
	.point_icon svg { width:34px; height:34px; }
	.point_body p { font-size:14px; line-height:2; }
	.gallery_list { margin-bottom:55px; }
	.dl_card { padding:24px 16px 22px; }
	.dl_card .dl_name { font-size:14px; }
	.faq_block { padding:24px 20px 26px; }
}



/* ----------------------------------------------------------------------
 AI・高度人材育成プロジェクト ページ
---------------------------------------------------------------------- */

/* リード（薄い背景を画面幅いっぱいに） */
.ai_intro { position:relative; padding:60px 0 65px; margin:0 0 75px; }
.ai_intro:before {
	content:''; position:absolute; top:0; left:-50%; z-index:-1;
	width:200vw; height:100%; background:#f6f9fc;
}

/* 左右 2 カラム。テーマ既定の余白（100px）はモックより広いので詰める */
.ai_row { margin-bottom:0; }
.ai_row .post_col-2 { margin-right:26px; width:calc(50% - 13px); }
.ai_row .post_col-2:last-of-type { margin-right:0; }
.ai_row p { margin:0 0 22px; font-size:15px; line-height:2.1; color:var(--hd-body); }
.ai_row p:last-child { margin-bottom:0; }

/* 各ブロック ------------------------------------------------------- */
.ai_block { margin:0 0 75px; }
/* テーマの col2 は 620:450。モックは横長なので 5:3 に上書きする
   （.ai_photos.shutter_image.col2 .item で詳細度 (0,3,1) を確保） */
.ai_photos.shutter_image.col2 .item { aspect-ratio:5 / 3; }
.ai_photos.shutter_image { margin-top:0; margin-bottom:38px !important; }

.ai_row .catch {
	margin:0; padding:0; line-height:1.55; color:#111;
}

/* 締めのメッセージ -------------------------------------------------- */
.ai_quote { margin:0; padding:20px 0 10px; text-align:center; }
.ai_quote p {
	margin:0; font-size:28px; line-height:1.7; font-weight:600; color:var(--hd-ink);
}
.ai_quote .ai_quote_mark {
	color:var(--tcd-main-color,#004ea2); font-size:1.5em; line-height:0;
	vertical-align:-0.2em; margin:0 .2em;
}

@media screen and (max-width:1100px) {
	.ai_hero { margin-bottom:45px; }
	.ai_intro { padding:45px 0 48px; margin-bottom:55px; }
	/* テーマは 1100px で .post_row を display:block にする。それに合わせて余白を戻す */
	.ai_row .post_col-2 { margin-right:0; width:auto; }
	.ai_row .post_col-2:first-of-type { margin-bottom:28px; }
	.ai_block { margin-bottom:55px; }
	.ai_photos.shutter_image { margin-bottom:28px !important; }
	.ai_quote p { font-size:24px; }
}
@media screen and (max-width:800px) {
	.ai_hero { margin-bottom:35px; }
	.ai_hero img { aspect-ratio:16 / 9; }
	.ai_intro { padding:32px 0 35px; margin-bottom:40px; }
	.ai_row p { margin-bottom:16px; font-size:14px; line-height:2; }
	.ai_row .post_col-2:first-of-type { margin-bottom:20px; }
	.ai_block { margin-bottom:40px; }
	.ai_photos.shutter_image { margin-bottom:20px !important; }
	.ai_quote { padding:10px 0 0; }
	.ai_quote p { font-size:18px; line-height:1.8; }
}



/* ----------------------------------------------------------------------
 学生情報・就職実績（STUDENT CAREER）ページ
 ※ 構成は AI・高度人材育成プロジェクトページとほぼ同じ。将来まとめる場合は
   .ai_row / .sc_row をひとつのクラスに統合するとよい。
---------------------------------------------------------------------- */

/* 左右 2 カラム。テーマ既定の余白（100px）はモックより広いので詰める */
.sc_row { margin-bottom:0; }
.sc_row .post_col-2 { margin-right:26px; width:calc(50% - 13px); }
.sc_row .post_col-2:last-of-type { margin-right:0; }
.sc_row p { margin:0 0 22px; font-size:15px; line-height:2.1; color:var(--hd-body); }
.sc_row p:last-child { margin-bottom:0; }
.sc_row .catch { margin:0; padding:0; line-height:1.55; color:#111; }

.sc_intro { margin-top:10px; }

/* セクション区切り線（画面幅いっぱい）
   テーマ自身が .gray_bg:after で使う 200vw / left:-50% と同じ手法。
   html の overflow-x:hidden と #container の overflow:clip で横スクロールは出ない。 */
.sc_divider { position:relative; height:1px; margin:70px 0 75px; }
.sc_divider:before {
	content:''; position:absolute; top:0; left:-50%;
	width:200vw; height:1px; background:#e4e8ee;
}

/* 各ブロック ------------------------------------------------------- */
.sc_block { margin:0 0 80px; }
.sc_block:last-child { margin-bottom:0; }
/* テーマの col2 は 620:450。モックはやや縦長なので 8:7 に上書きする
   （.sc_photos.shutter_image.col2 .item で詳細度 (0,3,1) を確保） */
.sc_photos.shutter_image.col2 .item { aspect-ratio:8 / 7; }
.sc_photos.shutter_image { margin-top:0; margin-bottom:42px !important; }

@media screen and (max-width:1100px) {
	/* テーマは 1100px で .post_row を display:block にする。それに合わせて余白を戻す */
	.sc_row .post_col-2 { margin-right:0; width:auto; }
	.sc_row .post_col-2:first-of-type { margin-bottom:28px; }
	.sc_divider { margin:50px 0 55px; }
	.sc_block { margin-bottom:60px; }
	.sc_photos.shutter_image { margin-bottom:30px !important; }
}
@media screen and (max-width:800px) {
	.sc_row p { margin-bottom:16px; font-size:14px; line-height:2; }
	.sc_row .post_col-2:first-of-type { margin-bottom:20px; }
	.sc_divider { margin:35px 0 40px; }
	.sc_block { margin-bottom:45px; }
	.sc_photos.shutter_image { margin-bottom:22px !important; }
}



/* ----------------------------------------------------------------------
 入会・支援（CONTACT）ページ
---------------------------------------------------------------------- */

/* 白いカードと丸数字つき見出し ---------------------------------------- */
.jn_card { background:#fff; border-radius:8px; padding:34px 38px 40px; margin:0 0 26px; }
/* テーマは .post_content h2 を中央寄せ・拡大するので詳細度 (0,2,0) で打ち消す */
.post_content .jn_head {
	display:flex; align-items:center; gap:14px;
	margin:0 0 26px; padding:0; border:none; text-align:left;
	font-size:22px; line-height:1.5; font-weight:600; color:var(--hd-ink);
}
.jn_num {
	flex:none; width:30px; height:30px; border-radius:50%;
	background:var(--tcd-main-color,#004ea2); color:#fff;
	font-size:14px; line-height:30px; text-align:center; font-weight:600;
}

/* 1 入会規定 --------------------------------------------------------- */
.jn_rule { border:1px solid #e3e8f0; border-radius:6px; margin:0 0 12px; background:#fff; }
.jn_rule:last-child { margin-bottom:0; }
.jn_rule > summary {
	display:flex; align-items:flex-start; gap:18px;
	padding:22px 52px 22px 22px; position:relative; cursor:pointer; list-style:none;
}
.jn_rule > summary::-webkit-details-marker { display:none; }
/* 開閉の山形。開いているときは反転する */
.jn_rule > summary:after {
	content:''; position:absolute; top:32px; right:26px;
	width:9px; height:9px; border-right:2px solid #9aa8bd; border-bottom:2px solid #9aa8bd;
	transform:rotate(45deg); transition:transform .25s ease;
}
.jn_rule[open] > summary:after { transform:rotate(-135deg); top:36px; }
.jn_rule_icon {
	flex:none; width:88px; height:88px; border-radius:50%; background:#eef3fa;
	display:flex; align-items:center; justify-content:center;
	color:var(--tcd-main-color,#004ea2);
}
.jn_rule_icon img { width:52px; height:52px; display:block; }
.jn_rule_body { display:block; padding-top:3px; }
.jn_rule_title {
	display:block; margin:0 0 9px;
	font-size:16px; line-height:1.5; font-weight:600; color:var(--tcd-main-color,#004ea2);
}
.jn_rule_text { display:block; font-size:14px; line-height:1.9; color:var(--hd-body); }
/* テーマの .post_content ul（list-style:circle / margin-left:1.3em）を打ち消す */
.post_content .jn_rule_list {
	margin:0; margin-left:0; padding:0; list-style:none;
	display:flex; flex-wrap:wrap; gap:2px 26px;
}
.jn_rule_list li {
	font-size:14px; line-height:1.9; color:var(--hd-body);
	padding-left:13px; position:relative;
}
.jn_rule_list li:before {
	content:''; position:absolute; left:0; top:.8em;
	width:4px; height:4px; border-radius:50%; background:var(--tcd-main-color,#004ea2);
}

/* 2 入会申込書 ------------------------------------------------------- */
.jn_form { display:flex; align-items:center; gap:34px; }
.jn_form_icon {
	flex:none; width:110px; height:110px; border-radius:50%; background:#eef3fa;
	display:flex; align-items:center; justify-content:center;
	color:var(--tcd-main-color,#004ea2);
}
.jn_form_icon svg { width:54px; height:54px; display:block; }
.jn_form_body p { margin:0 0 22px; font-size:15px; line-height:2; color:var(--hd-body); }

/* ボタン：テーマの .q_custom_button を土台に色だけ差し替える */
.jn_button {
	gap:10px; height:52px; padding:0 34px; font-size:15px;
	background:var(--tcd-main-color,#004ea2); border-color:var(--tcd-main-color,#004ea2); color:#fff!important; font-weight: 600;
	transition:opacity .3s ease, background-color .3s ease, color .3s ease;
}
.jn_button svg { width:18px; height:18px; flex:none; }
.jn_button:hover { opacity:.85; color:#fff; }
.jn_button_outline {
	background:#fff; color:var(--tcd-main-color,#004ea2)!important; height:48px; font-size:14px;
}
.jn_button_outline:hover { background:var(--tcd-main-color,#004ea2); color:#fff; opacity:1; }
.jn_button_arrow { margin-left:6px; font-size:18px; line-height:1; }

/* 3 お申し込み方法 --------------------------------------------------- */
.jn_steps { display:flex; align-items:stretch; gap:14px; }
.jn_step {
	flex:1 1 0%; position:relative; text-align:center;
	background:#f7f9fc; border:1px solid #e3e8f0; border-radius:6px; padding:32px 24px 28px;
}
.jn_step_num {
	position:absolute; top:14px; left:14px;
	width:26px; height:26px; border-radius:50%;
	background:var(--tcd-main-color,#004ea2); color:#fff;
	font-size:12px; line-height:26px; text-align:center;
}
.jn_step_icon { color:var(--tcd-main-color,#004ea2); margin:0 0 18px; display:flex; justify-content:center; }
.jn_step_icon svg { width:52px; height:52px; display:block; }
.jn_step .jn_step_title {
	margin:0 0 12px; font-size:15px; line-height:1.6; font-weight:600;
	color:var(--tcd-main-color,#004ea2);
}
.jn_step .jn_step_text { margin:0; font-size:13px; line-height:1.9; color:var(--hd-body); }
.jn_step_arrow { flex:none; align-self:center; color:#9aa8bd; }
.jn_step_arrow svg { width:20px; height:20px; display:block; }

/* 4 お問い合わせ ----------------------------------------------------- */
.jn_mail { display:flex; align-items:center; gap:40px; }
.jn_mail_icon {
	flex:none; width:150px; height:150px; border-radius:50%; background:#eef3fa;
	display:flex; align-items:center; justify-content:center;
	color:var(--tcd-main-color,#004ea2);
}
.jn_mail_icon svg { width:66px; height:66px; display:block; }
.jn_mail_body > p { margin:0 0 18px; font-size:15px; line-height:2; color:var(--hd-body); }
.jn_mail_address { display:flex; align-items:center; gap:12px; margin:0 0 22px !important; }
.jn_mail_address svg { width:30px; height:30px; flex:none; color:var(--tcd-main-color,#004ea2); }
.jn_mail_address a {
	font-size:26px; line-height:1.3; font-weight:600;
	color:var(--tcd-main-color,#004ea2); text-decoration:none;
}
.q_custom_button:hover {
	color: #FFF!important;
}

/* 5 ご質問やご相談はこちらから ---------------------------------------- */
.jn_cta { background:var(--tcd-main-color,#004ea2); border-radius:8px; padding:28px 38px 34px; color:#fff; }
.jn_cta_head { display:flex; align-items:center; gap:14px; margin:0 0 20px; font-size:19px; font-weight:600; }
.jn_cta_head .jn_num { background:#fff; color:var(--tcd-main-color,#004ea2); }
.jn_cta_body { display:flex; align-items:center; gap:40px; }
.jn_cta_left { display:flex; align-items:center; gap:26px; flex:1 1 auto; }
.jn_cta_icon {
	flex:none; width:78px; height:78px; border-radius:50%; background:#fff;
	display:flex; align-items:center; justify-content:center;
	color:var(--tcd-main-color,#004ea2);
}
.jn_cta_icon svg { width:38px; height:38px; display:block; }
.jn_cta_text b { display:block; font-size:26px; line-height:1.3; font-weight:600; }
.jn_cta_text small { display:block; margin-top:6px; font-size:14px; }
.jn_cta_mail {
	display:flex; align-items:center; gap:12px; margin:0;
	padding-left:40px; border-left:1px solid rgba(255,255,255,.35);
}
.jn_cta_mail svg { width:28px; height:28px; flex:none; }
.jn_cta_mail a { font-size:21px; font-weight:600; color:#fff!important; text-decoration:none; }

@media screen and (max-width:1100px) {
	.jn_card { padding:28px 26px 32px; }
	.jn_steps { flex-wrap:wrap; }
	.jn_step { flex:1 1 100%; }
	.jn_step_arrow { align-self:center; transform:rotate(90deg); width:100%; display:flex; justify-content:center; }
	.jn_mail_icon { width:110px; height:110px; }
	.jn_mail_icon svg { width:50px; height:50px; }
	.jn_cta_body { flex-wrap:wrap; gap:24px; }
	.jn_cta_mail { padding-left:0; border-left:none; }
}
@media screen and (max-width:800px) {
	.jn_page { padding:35px 0 40px; }
	.jn_card { padding:22px 18px 26px; margin-bottom:16px; border-radius:6px; }
	.post_content .jn_head { gap:10px; margin-bottom:18px; font-size:18px; }
	.jn_num { width:26px; height:26px; font-size:13px; line-height:26px; }
	.jn_rule > summary { gap:12px; padding:16px 40px 16px 16px; }
	.jn_rule > summary:after { top:26px; right:18px; }
	.jn_rule[open] > summary:after { top:30px; }
	.jn_rule_icon { width:42px; height:42px; }
	.jn_rule_icon svg { width:21px; height:21px; }
	.jn_rule_title { font-size:15px; }
	.jn_rule_text, .jn_rule_list li { font-size:13px; line-height:1.85; }
	.jn_rule_list { gap:0 16px; }
	.jn_form { flex-direction:column; align-items:flex-start; gap:20px; }
	.jn_form_icon { width:84px; height:84px; }
	.jn_form_icon svg { width:42px; height:42px; }
	.jn_form_body p { margin-bottom:16px; font-size:14px; line-height:1.9; }
	.jn_button { width:100%; height:48px; padding:0 20px; font-size:14px; }
	.jn_step { padding:24px 18px 22px; }
	.jn_mail { flex-direction:column; align-items:flex-start; gap:22px; }
	.jn_mail_body > p { font-size:14px; line-height:1.9; }
	.jn_mail_address a { font-size:21px; }
	.jn_button_outline { width:100%; }
	.jn_cta { padding:22px 20px 26px; border-radius:6px; }
	.jn_cta_head { margin-bottom:16px; font-size:16px; }
	.jn_cta_body { gap:18px; }
	.jn_cta_left { gap:16px; }
	.jn_cta_icon { width:60px; height:60px; }
	.jn_cta_icon svg { width:30px; height:30px; }
	.jn_cta_text b { font-size:21px; }
	.jn_cta_text small { font-size:13px; }
	.jn_cta_mail a { font-size:17px; }
}