/*@charset "utf-8";*/
/*!**/
/*Theme Name: hiromi-tajima.com*/
/*Theme URI: hiromi-tajima.com*/
/*Author: effata inc.*/
/*Author URI: */
/*Description: tawaman.org */
/*Version: 0.0.1*/
/*License: ---*/
/* *!*/

.font-serif-like { font-family: "Times New Roman", "Georgia", "Noto Serif JP", serif; }
.font-mincho { font-family: "Yu Mincho", "Hiragino Mincho ProN", serif; }
.font-gothic { font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", system-ui, sans-serif; }
.bg-navy { background-color: #0D3874; }

th {
	font-weight: normal;
}

/* lp.css */

/* ========= 基本設計（ここをいじると全体が揃う） ========= */
:root{
	--container: 980px;

	/* 色 */
	--navy:#0C3874;
	--accent:#0272A6;
	--ringblue:#B9C7DD;
	--paper:#F3F4F6;

	/* 文字組み（PDF寄せ） */
	--body-size: 16px;
	--body-lh: 1.95;
	--body-track: 0.02em;

	--title-size: 40px;
	--title-track: 0.22em;

	--h3-size: 32px;
	--h3-track: 0.06em;

	/* 余白（PDF寄せ） */
	--section-top: 48px;
	--section-top-lg: 64px;

	/* 円 */
	--circle: 150px;
	--circle-border: 6px;

	/* 受講生の声枠 */
	--voice-border: 2px;
	--voice-radius: 14px;

	/* CTA */
	--cta-height: 84px;
	--cta-btn-w: 220px;
	--cta-btn-h: 34px;
}

/* ========= 共通 ========= */
html{
	scroll-behavior:smooth;
	font-size: 16px;
}
.lp{ letter-spacing: var(--body-track); }

.lp-container{
	max-width: var(--container);
	margin: 0 auto;
}

.lp-section{ padding-top: var(--section-top); }
@media (min-width: 640px){
	.lp-section{ padding-top: var(--section-top-lg); }
}

/* ========= HERO ========= */
.lp-topbar{ height: 32px; background: var(--navy); }

/* 画像高さをPDFっぽく固定寄りで */
.lp-hero-img{
	height: 220px;
}
@media (min-width: 640px){
	.lp-hero-img{ height: 260px; }
}
@media (min-width: 768px){
	.lp-hero-img{ height: 320px; }
}


/* コピー位置：PDFは「やや上寄せ」感があるので微調整 */
.lp-hero-copy{
	display:flex;
	align-items:center;
	justify-content:center;
}
.lp-hero-copy .lp-container{
	/* ここで上下位置の詰めができる */
	transform: translateY(-2px);
}

.lp-hero-h1{
	font-size: 28px;
	line-height: 1.35;
	letter-spacing: 0.06em;
}
.lp-hero-h2{
	margin-top: 14px;
	font-size: 20px;
	line-height: 1.6;
	letter-spacing: 0.08em;
}
@media (min-width: 640px){
	.lp-hero-h1{ font-size: 36px; }
	.lp-hero-h2{ font-size: 24px; }
}
@media (min-width: 768px){
	.lp-hero-h1{ font-size: 44px; }
	.lp-hero-h2{ font-size: 30px; }
}

/* ========= HRM行 ========= */
.lp-hrm-row{
	display:flex;
	align-items:flex-end;
	justify-content:center;
	gap: 16px;
}
.lp-hrm-logo{
	font-size: 48px;
	letter-spacing: 0.08em;
	line-height: 1;
}
.lp-hrm-sub{
	padding-bottom: 6px;
	font-size: 16px;
	letter-spacing: 0.26em;
	line-height: 1.2;
}

/* ========= 本文 ========= */
.lp-body{
	margin-top: 40px;
	font-size: var(--body-size);
	line-height: var(--body-lh);
	color: #1f2937; /* slate-800 */
}
.lp-body p + p{ margin-top: 18px; }

.lp-body--wide{ margin-top: 24px; }
.lp-block + .lp-block{ margin-top: 60px; }

/* 最後の段落（PDFは余白多め） */
.lp-paragraph-last{ margin-top: 30px; }

/* ========= 見出し ========= */
.lp-title{
	font-size: var(--title-size);
	letter-spacing: var(--title-track);
	line-height: 1.1;
	font-weight: bold;
	margin: 32px 0;
}

.lp-h3{
	font-size: var(--h3-size);
	letter-spacing: var(--h3-track);
	line-height: 1.35;
	margin: 16px 0;
	font-weight: bold;
}

/* ========= 小ダッシュ ========= */
.lp-mini-dash{
	width: 26px;
	height: 2px;
	background: var(--navy);
	opacity: .55;
	margin: 24px auto 0;
}

/* ========= CTA帯 ========= */
.lp-cta{
	background: var(--navy);
	display: flex;
	justify-content: center;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);

	padding: 48px 0;
}



.lp-cta-btn{
	width: var(--cta-btn-w);
	height: var(--cta-btn-h);
	display:flex;
	align-items:center;
	justify-content:center;
	background:#fff;
	color:#1f2937;
	font-size: 18px;
	font-weight: 600;
	border-radius: 2px;
	box-shadow: 0 1px 2px rgba(0,0,0,.15);
	text-decoration:none;
}
.lp-cta-btn:hover{ opacity:.92; }

/* ========= 3つの円 ========= */
.lp-circles{ margin-top: 40px; }

.lp-circle{
	display:flex;
	align-items:center;
	justify-content:center;
}
.lp-circle-inner{
	width: var(--circle);
	height: var(--circle);
	border-radius: 9999px;
	border: var(--circle-border) solid var(--ringblue);
	display:grid;
	place-items:center;
	text-align:center;
	background:#fff;
}
.lp-circle-no{
	font-size: 18px;
	letter-spacing: 0.08em;
	line-height: 1;
}
.lp-circle-txt{
	margin-top: 6px;
	font-size: 12px;
	line-height: 1.45;
	letter-spacing: 0.02em;
	color:#1f2937;
}

/* 円の下の文章はPDFだと少し詰まっているので */
.lp-body--after-circles{ margin-top: 28px; }

/* ========= 受講生の声 ========= */
.lp-voice{
	max-width: 64rem;
	margin: 0 auto;
}

.lp-voice-card{
	background:#fff;
	border: var(--voice-border) solid var(--navy);
	border-radius: var(--voice-radius);
	padding: 22px 24px;
	font-size: 13px;
	line-height: 1.95;
	color:#1f2937;
}
@media (min-width: 640px){
	.lp-voice-card{ font-size: 16px; padding: 24px 26px; }
}
.lp-voice-meta{
	margin-top: 12px;
	font-size: 11px;
	color:#64748b; /* slate-500 */
}

/* ========= プロフィール：見出しの二重ライン ========= */
.lp-title-rule{
	text-align:center;
	margin-top: 10px;
}
.lp-title-rule::before,
.lp-title-rule::after{
	content:"";
	display:block;
	height:2px;
	width: 50%;
	background: var(--navy);
	opacity:.85;
	margin:0 auto;
}
.lp-title-rule::before{ margin-bottom: 14px; }
.lp-title-rule::after{ margin-top: 14px; }

/* プロフ見出し */
.lp-profile-head{ margin-top: 28px; }
.lp-name{
	font-size: 36px;
	letter-spacing: 0.08em;
	color:#1f2937;
}
.lp-role{
	margin-top: 4px;
	font-size: 18px;
	color:#334155;
}

/* 箇条書き（PDFの丸＋インデント詰め） */
.lp-profile-list{
	margin-top: 38px;
	display:grid;
	gap: 18px;
	font-size: 13px;
	line-height: 1.95;
	color:#1f2937;
}
@media (min-width: 640px){
	.lp-profile-list{ font-size: 16px; }
}
.lp-bullet{
	display:flex;
	gap: 12px;
	align-items:flex-start;
}
.lp-dot{
	width: 20px;
	height: 20px;
	border-radius: 9999px;
	background: var(--navy);
	margin-top: 6px; /* ここで高さを合わせる */
	flex: 0 0 auto;
}
.lp-bullet-title{ font-weight: 700; }
.lp-bullet-body{ margin-top: 4px; }

/* ========= 略歴：薄グレー帯 ========= */
.lp-section--book {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-top: 32px;
	background-color: #F5F5F5;
}


.lp-bio-band{
	/* 全幅に見せる（container外へ伸ばす） */
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 48px 8px;
}
.lp-bio-band .lp-title{
	margin:32px auto;
}

.lp-bio-body{
	max-width: var(--container);
	margin: 32px auto 0;
	padding: 0 24px;
	font-size: 16px;
	line-height: 2.05;
	color:#1f2937;
}

.lp-bio-last{ margin-top: 16px; }

/* ========= 資格等 ========= */
.lp-cert{ margin-top: 40px; }
.lp-cert-col{
	font-size: 13px;
	line-height: 2.0;
	color:#1f2937;
}
@media (min-width: 640px){
	.lp-cert-col{ font-size: 16px; }
}

/* ========= フッター帯 ========= */
.lp-footer{
	background: var(--navy);
	padding: 40px 0 28px;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap: 22px;
}
.lp-copyright{
	font-size: 11px;
	color: rgba(255,255,255,.9);
	margin:0;
}

/* ===== Footer (match screenshot) ===== */
.lp-footer { width: 100%; }

/* 画面いっぱいにする定番パターン（親がcontainerでも全幅にできる） */
.lp-footer-band,
.lp-footer-bottom{
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* 濃紺帯 */
.lp-footer-band{
	background: #0C3874;            /* 濃紺 */
	padding: 34px 0;               /* 帯の厚み：画像に寄せて調整 */
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 16px;
}

/* 中央ボタン（白っぽい矩形） */
.lp-footer-btn{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 520px;                  /* 画像の横長感に寄せる */
	max-width: calc(100% - 48px);  /* SPでは左右余白 */
	height: 56px;
	background: #F7F3EA;           /* 生成画像の“少しクリーム色”に寄せる */
	color: #111827;
	font-size: 24px;               /* 画像の大きめ文字 */
	font-weight: 700;
	letter-spacing: 0.06em;
	border-radius: 0;              /* 角は直角 */
	text-decoration: none;
}

/* コピーライト（白背景） */
.lp-footer-bottom{
	background: #ffffff;
	padding: 18px 0;
	text-align: center;
}

.lp-footer-copy{
	margin: 0;
	font-family: "Yu Mincho","Hiragino Mincho ProN","MS Mincho",serif;
	font-size: 20px;               /* 画像の大きめ表記 */
	letter-spacing: 0.08em;
	color: #111827;
}


@media (max-width: 768px) {
	.lp-title-rule::before,
	.lp-title-rule::after{
		width: 100%;
	}
}

.icon-arrow{
	display: inline-block;
	width: 0;
	height: 0;

	/* 三角形（右向き） */
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 8px solid var(--navy);

	/* テキストと並んだ時の位置合わせ */
	transform: translateY(1px);
}

.lp-bio-band-odd {
	background-color: #F5F5F5;
}

.mobile-only {
	display: none;
}

.link-blue a {
	color: #0272A6; /* Light blue color */
	text-decoration: underline; /* Optional: underline for links */
}

.link-blue a:hover {
	color: #005f8c; /* Darker blue for hover effect */
}

@media (max-width: 639px) {
	.mobile-only {
		display: inline;
	}
}

.lp-profile-image {
	width: 180px;
	margin: 16px auto;
}