@charset "utf-8";
/*------------------------------------------------------------
	interview
	- 1rem = 10px (PC) / SPは374px基準 (style.css)
	- BP: PC=min-width:897px / SP=max-width:896px
	- 寸法はFigma実寸px ÷ 10 = rem
	- color: text #2A2A2A / accent #F05400 / key(green) #12813C
	- 画像は仮プレースホルダー（img/interview/）
------------------------------------------------------------*/

/* このページはヒーローが白背景のため、ヘッダーを白状態(.bg相当)で固定 */
#gHeader { background-color: #fff; }
#gHeader .logo .img { display: none; }
#gHeader .logo .over { display: block; }
#gNavi ul a { color: #2A2A2A; }
#gHeader .menu span { background-color: #2A2A2A; }
#gFooter { margin-top: 0; }


/*----------------------------------------------------
	FV（ヒーロー） 1366 × 768
----------------------------------------------------*/
.ivFv { position: relative; height: 76.8rem; background-color: #fff; }
.ivFv__inner { position: relative; width: 136.6rem; height: 100%; margin: 0 auto; }
/* 人物写真：Figma実測 frame x346 / 1020×768 / 白フィル。画像はフレーム内側の右寄せ（左に白余白→INTERVIEWが被らない） */
.ivFv__photo { position: absolute; top: 0; left: 34.6rem; width: 102rem; height: 76.8rem; z-index: 1; background-color: #fff; overflow: hidden; }
.ivFv__photo img { position: absolute; top: 0; right: 0;  height: 100%; object-fit: cover; object-position: center top; display: block; }
/* 見出し・テキスト（写真より前面） */
.ivFv__ttl { position: absolute; top: 15rem; left: 10.3rem; z-index: 2; color: #12813C; font-size: 9.5rem; font-weight: 700; line-height: 1; }
.ivFv__cat { position: absolute; top: 25.5rem; left: 10.6rem; z-index: 2; font-size: 1.6rem; font-weight: 600; color: #2A2A2A; }
.ivFv__catch { position: absolute; top: 30.5rem; left: 9.6rem; z-index: 2; }
.ivFv__catch span { display: table; padding: 0 1rem; height: 4rem; line-height: 4rem; background-color: #fff; color: #2A2A2A; font-size: 2.2rem; font-weight: 600; }
.ivFv__catch span + span { margin-top: 1rem; }
.ivFv__profile { position: absolute; top: 51.9rem; left: 9.6rem; z-index: 2; width: 42rem; padding: 2rem; background-color: #D9D9D9; }
.ivFv__org { font-size: 1.5rem; font-weight: 700; }
.ivFv__name { margin-top: 0.6rem; font-size: 2.2rem; font-weight: 700; letter-spacing: 0.04em; line-height: 1.2; }
.ivFv__career { margin-top: 1.1rem; font-size: 1.6rem; font-weight: 500; line-height: 1.85; }

/*----------------------------------------------------
	About（リードメッセージ）
----------------------------------------------------*/
.content { margin: 0 auto; max-width: 104rem; padding: 0 2rem; width: 100%; }

/* About：白地＋下寄せグレー帯＋左に写真（帯上端に重なる）＋右に緑文 */
.ivAbout { position: relative; background-color: #fff; overflow: hidden; }
.ivAbout__band { position: relative; margin-top: 24.8rem; min-height: 36rem; background-color: #D9D9D9; }
.ivAbout__inner { position: relative; width: 136.6rem; max-width: 100%; margin: 0 auto; padding: 8rem 8rem 8rem 68rem; box-sizing: border-box; }
.ivAbout__photo { position: absolute; left: 0; top: -8.7rem; width: 60rem; z-index: 2; }
.ivAbout__photo img { width: 100%; display: block; }
.ivAbout__body { color: #12813C; font-size: 2.5rem; font-weight: 900; line-height: 2; letter-spacing: -0.04em; }

/* 共通：写真の角丸（カードのみ） */
.ivCard__photo img { width: 100%; border-radius: 1rem; display: block; }

/*----------------------------------------------------
	Q&A（Card/Question）
	- 見出し：緑ダッシュ＋番号(Qx.)＋タイトル、下線なし
	- 本文：左右インデント13.2rem（Figma X132 / W1102）
	- 画像：本文の下／全幅寄り＋緑の四角アクセント、左右出し分け
----------------------------------------------------*/
.ivQa { position: relative; padding-top: 24.6rem; padding-bottom: 14rem; }
/* Q&A先頭の大透かし（back_INTERVIEW相当：#D9D9D9 / 不透明度30% / 中央） */
.ivQa__wm { position: absolute; top: 0; left: 50%; transform: translate(-50%, -8%); z-index: 0; color: #D9D9D9; opacity: 0.3; font-size: 24.5rem; line-height: 0.78; font-weight: 700; white-space: nowrap; pointer-events: none; }
.ivQa__inner { position: relative; z-index: 1; width: 136.6rem; max-width: 100%; margin: 0 auto; padding: 0 2rem; }
.ivQ { margin-bottom: 14.4rem; }
.ivQ:last-child { margin-bottom: 0; }
.ivQ__ttl { position: relative; display: flex; align-items: center; padding-left: 13.2rem; min-height: 2.9rem; font-family: "Noto Sans JP", sans-serif; font-size: 2.2rem; font-weight: 500; color: #12813C; line-height: 1.4; }
.ivQ__ttl::before { content: ""; position: absolute; left: 0rem; top: 50%; transform: translateY(-50%); width: 11.6rem; height: 0.3rem; background-color: #12813C; }
.ivQ__num { margin-right: 1.6rem; color: #12813C; font-family: "Noto Sans", sans-serif; font-weight: 700; font-size: 2.4rem; }
.ivQ__body { margin-top: 3rem; padding: 0 13.2rem; }
.ivQ__body p { font-size: 1.6rem; font-weight: 500; line-height: 2; }

/* 画像の共通：写真＋背後の四角アクセント（Figma実測 236x236=23.6rem / 緑=#11813B / グレー=#D8D8D8） */
:root { --iv-accent-green: #11813B; --iv-accent-gray: #D8D8D8; }
.ivQ__photo { position: relative; }
.ivQ__photo img { position: relative; z-index: 1; width: 100%; display: block; }
.ivQ__photo::before { content: ""; position: absolute; z-index: 0; width: 23.6rem; height: 23.6rem; }

/* 縦型（本文の下に横長画像 900x400=90x40rem）：vL=画像右寄せ/緑左上 ・ vR=画像左寄せ/緑右下 */
.ivQ--vL .ivQ__body, .ivQ--vR .ivQ__body { display: flex; flex-direction: column; }
.ivQ--vL .ivQ__photo, .ivQ--vR .ivQ__photo { order: 2; margin-top: 6.4rem; width: 90rem; max-width: 100%; }
.ivQ--vL .ivQ__photo img, .ivQ--vR .ivQ__photo img { height: 40rem; object-fit: cover; }
.ivQ--vL .ivQ__photo { margin-left: auto; }
.ivQ--vR .ivQ__photo { margin-right: auto; }
.ivQ--vL .ivQ__photo::before { background-color: var(--iv-accent-green); top: -5rem; left: -5rem; opacity: 0.5; }
.ivQ--vR .ivQ__photo::before { background-color: var(--iv-accent-green); bottom: -5rem; right: -5rem; opacity: 0.5;}

/* 横型（縦長画像 480x600=48x60rem）：hR=テキスト左/画像右 ・ hL=画像左/テキスト右。
   PDF実測：画像はセクション最上部(見出しと同じ高さ)から外側ページ端まで裁ち落とし。
   本文はそれぞれの片側カラム幅に固定。グレー四角(23.6rem)は本文の外側に約10rem重なり、ページ端へ裁ち落とし。
   Q10(hL)は見出しも右カラムの上(番号 x708/ダッシュ x576)へ寄せる。 */
.ivQ--hL, .ivQ--hR { position: relative; min-height: 60rem; }
.ivQ--hL .ivQ__body, .ivQ--hR .ivQ__body { position: relative; margin-top: 7.4rem; }
.ivQ--hL .ivQ__body > p, .ivQ--hR .ivQ__body > p { position: relative; z-index: 1; }
.ivQ--hR .ivQ__body > p { width: 65.8rem; }                    /* PDF Q6 本文 658px（左） */
.ivQ--hL .ivQ__body > p { width: 52.2rem; margin-left: auto; } /* PDF Q10 本文 522px（右寄せ） */
/* 画像：.ivQ最上部から、外側ページ端まで裁ち落とし */
.ivQ--hL .ivQ__photo, .ivQ--hR .ivQ__photo { position: absolute; top: 0; z-index: 0; width: 48rem; margin: 0; }
.ivQ--hR .ivQ__photo { right: -2rem; }   /* 右ページ端まで */
.ivQ--hL .ivQ__photo { left: -2rem; }    /* 左ページ端まで */
.ivQ--hL .ivQ__photo img, .ivQ--hR .ivQ__photo img { height: 60rem; object-fit: cover; }
/* グレー四角：本文側の外側へ裁ち落とし＋本文に重なる */
.ivQ--hR .ivQ__body::before { content: ""; position: absolute; z-index: 0; width: 23.6rem; height: 23.6rem; background-color: var(--iv-accent-gray); left: 0; top: 21.4rem; }
.ivQ--hL .ivQ__body::before { content: ""; position: absolute; z-index: 0; width: 23.6rem; height: 23.6rem; background-color: var(--iv-accent-gray); right: 0; top: 26rem; }
/* Q10(hL)：見出しを右カラムの上へ */
.ivQ--hL .ivQ__ttl { padding-left: 70.8rem; }
.ivQ--hL .ivQ__ttl::before { left: 57.6rem; width: 11.6rem; }

/*----------------------------------------------------
	関連インタビュー一覧
----------------------------------------------------*/
.interviewBox {
    margin-bottom: -59.2rem;
    padding: 16.3rem 0 75.3rem;
    background-color: #eaeaea;
}

@media all and (min-width: 897px) {
	.ivCard a:hover,.ivCard a:hover img { opacity: 0.7; }
}

/*====================================================
	SP (max-width:896px / 374px基準)
====================================================*/
@media all and (max-width: 896px) {
	#main { padding-top: 5.7rem; }
  


	/* FV：SP PDF実測の層構造（全幅写真374×407の上にキャッチ／プロフィールを重ねる） */
	.ivFv { position: relative; height: 61.5rem; padding: 0; overflow: hidden; }
	.ivFv__inner { position: static; width: auto; height: auto; margin: 0; padding: 0; }
	.ivFv__ttl { position: absolute; top: 1rem; left: 2.1rem; right: auto; width: auto; height: auto; z-index: 2; font-size: 4rem; }
	.ivFv__cat { position: absolute; top: 6.3rem; left: 2.1rem; right: auto; width: auto; height: auto; z-index: 2; font-size: 1.4rem; }
	.ivFv__photo { position: absolute; top: 11.9rem; left: 0; right: auto; width: 100%; height: 40.7rem; z-index: 0; margin: 0; background-color: transparent; }
	.ivFv__photo img { position: static; width: 100%; height: 100%; object-fit: cover; object-position: 72% center; border-radius: 0; }
	.ivFv__catch { position: absolute; top: 15rem; left: 2rem; right: auto; width: auto; height: auto; z-index: 2; }
	.ivFv__catch span { padding: 0.3rem 1rem; height: auto; line-height: 1.6; font-size: 1.6rem; }
	.ivFv__catch span + span { margin-top: 0.6rem; }
	.ivFv__profile { position: absolute; top: 39.4rem; left: 2rem; right: 2rem; width: auto; height: auto; z-index: 2; padding: 2rem; }
	.ivFv__org { font-size: 1.2rem; }
	.ivFv__name { font-size: 1.8rem; margin-top: 0.4rem; }
	.ivFv__career { font-size: 1.4rem; margin-top: 1rem; }

	/* About */
	.content { max-width: inherit; padding: 0 1.9rem; }
	.ivAbout__band { margin-top: 17rem; min-height: auto;}
	.ivAbout__inner { width: auto; padding: 3.2rem 1.9rem;}
	.ivAbout__photo { position: relative; top: -16rem; left: 0; width: 100%; margin-bottom: -14rem; }
	.ivAbout__body { font-size: 1.7rem; line-height: 1.9; letter-spacing: 0; }

	/* Q&A */
	.ivQa { padding-top: 11rem; padding-bottom: 6rem; }
	.ivQa__wm { font-size: 7rem; }
	.ivQa__inner { width: auto; padding: 0 1.9rem; }
	.ivQ { margin-bottom: 6rem; }
	/* SP PDF実測：緑ダッシュのみ画面左端(x0)まで、番号・タイトルは2.8remインデント */
	.ivQ__ttl { position: relative; padding-left: 0.9rem; min-height: 0; font-size: 1.6rem; }
	.ivQ__ttl::before { position: absolute; left: -1.9rem; top: 50%; transform: translateY(-50%); width: 2rem; height: 0.2rem; margin: 0; }
	.ivQ__num { margin-right: 0.6rem; font-size: 2rem; }
	.ivQ__body { margin-top: 1.8rem; padding: 0; }
	.ivQ__body p { font-size: 1.5rem; }
	/* 横型のみブロック化。縦型(vL/vR)はPCのflex+orderを維持し「文字→画像」の順を保つ */
	.ivQ--hL .ivQ__body, .ivQ--hR .ivQ__body { display: block; }
	.ivQ--vL .ivQ__body, .ivQ--vR .ivQ__body, .ivQ--hL .ivQ__body, .ivQ--hR .ivQ__body { margin-top: 1.8rem; }
	/* 横型のPC専用値（最小高/本文幅/絶対配置画像/グレー四角/Q10見出し寄せ）をSPで解除 */
	.ivQ--hL, .ivQ--hR { min-height: 0; }
	.ivQ--hL .ivQ__body > p, .ivQ--hR .ivQ__body > p { width: auto; margin-left: 0; }
	.ivQ--hL .ivQ__photo, .ivQ--hR .ivQ__photo { position: static; width: 100%; margin: 3.2rem 0 0; }
	.ivQ--hL .ivQ__body::before, .ivQ--hR .ivQ__body::before { display: none; }
	.ivQ--hL .ivQ__ttl { padding-left: 0.9rem; }
	.ivQ--hL .ivQ__ttl::before { left: -1.9rem; width: 2rem; }
	.ivQ__photo { width: 100%; margin-top: 3.2rem; }
	.ivQ--vL .ivQ__photo, .ivQ--vR .ivQ__photo { order: 2; width: 100%; max-width: 100%; margin: 3.2rem 0 0; }
	.ivQ__photo img { height: auto !important; }
	.ivQ__photo.vertical img { width: 78.6666%; margin: auto;}
	/* SPでは画像横の四角飾りを全て排除（SP PDF実測：装飾なし） */
	.ivQ--vL .ivQ__photo::before, .ivQ--vR .ivQ__photo::before, .ivQ--hL .ivQ__photo::before, .ivQ--hR .ivQ__photo::before { display: none; }

	/* 関連一覧 */
  
  .interviewBox{
    padding: 6.4rem 0 38.6rem;
    margin-bottom: -33rem;
  }
  
	.ivRelated { padding: 4.8rem 0 5.6rem; }
	.ivRelated__ttl { margin-bottom: 3.2rem; }
	.ivRelated__ttl .en { font-size: 4.4rem; }
	.ivRelated__ttl small { font-size: 1.5rem; }
	.ivCardList { gap: 3.2rem 0; }
	.ivCard { width: 100%; }
	.ivCard__photo { margin-bottom: 1.2rem; }
	.ivCard__catch { font-size: 1.8rem; }
}
