@charset "utf-8";

/* ========================================
   Hydrogen Inhalation Truth / TB
   769px - 1080px
   Full Replace
======================================== */

.HydrogenInner{
	width: 100%;
	max-width: 100%;
	padding: 0 34px;
	box-sizing: border-box;
}

.HydrogenInhalationDetail{
	overflow: hidden;
}

/* section rhythm */
.HydrogenInhalationDetail .HydrogenSection,
.HydrogenInhalationDetail #summary,
.HydrogenInhalationDetail #sec1,
.HydrogenInhalationDetail #sec2,
.HydrogenInhalationDetail #sec-difference,
.HydrogenInhalationDetail #sec3,
.HydrogenInhalationDetail #sec-risk-cost,
.HydrogenInhalationDetail #sec4,
.HydrogenInhalationDetail #sec-medical-b,
.HydrogenInhalationDetail #sec-market,
.HydrogenInhalationDetail #sec5,
.HydrogenInhalationDetail #sec-positioning,
.HydrogenInhalationDetail #refs,
.HydrogenInhalationDetail #sec-declaration,
.HydrogenInhalationDetail #sec6,
.HydrogenInhalationDetail .HydrogenSection_ReadNext,
.HydrogenInhalationDetail #sec7{
	padding-top: 88px;
	padding-bottom: 88px;
}

.HydrogenInhalationDetail #sec7{
	padding-bottom: 128px;
}

/* hero */
.LowerHero{
	min-height: 520px;
}

.LowerHero_inner{
	padding: 150px 34px 92px;
}

.LowerHero_content{
	width: min(620px, 100%);
}

.LowerHero_title{
	font-size: 42px;
	line-height: 1.42;
	letter-spacing: .07em;
}

.LowerHero_lead{
	margin-top: 18px;
	font-size: 15px;
	line-height: 1.95;
	letter-spacing: .08em;
}

/* meta */
.HydrogenMetaRow{
	grid-template-columns: repeat(2, minmax(0,1fr));
	gap: 18px 0;
	padding: 22px 0;
}

.HydrogenMetaItem{
	padding: 0 20px;
}

.HydrogenMetaItem:nth-child(odd){
	border-left: none;
	padding-left: 0;
}

/* toc */
.HydrogenTocBox{
	max-width: calc(100% - 68px);
	padding: 58px 0;
}

.HydrogenTocList{
	grid-template-columns: 1fr;
	gap: 0;
}

.HydrogenTocList a{
	min-height: 58px;
	font-size: 14px;
}

/* typography */
.HydrogenH2,
.HydrogenSectionIntro .HydrogenH2,
.HydrogenInhalationDetail .HydrogenH2,
.HydrogenInhalationDetail .SfSectionTitle{
	font-size: 34px;
	line-height: 1.5;
}

.HydrogenSummaryTitle{
	font-size: 34px;
	line-height: 1.5;
}

.HydrogenInhalationDetail .SfBlockTitle{
	font-size: 26px;
	line-height: 1.58;
}

.HydrogenInhalationDetail .SfLead,
.HydrogenInhalationDetail .HydrogenLead,
.HydrogenInhalationDetail .HydrogenP,
.HydrogenInhalationDetail .SfText{
	font-size: 14.5px;
	line-height: 2.05;
}

.HydrogenSectionIntro,
.HydrogenInhalationDetail .HydrogenSectionIntro,
.HydrogenInhalationDetail .SfSectionHead.HydrogenSectionIntro{
	margin-bottom: 56px;
}

/* summary */
.HydrogenSummaryJudgement{
	grid-template-columns: 1fr;
	margin-top: 66px;
}

.HydrogenSummaryAxis{
	border-right: none;
	border-bottom: 1px solid rgba(13,11,43,.08);
	padding: 34px 30px;
}

.HydrogenSummaryAxis:last-child{
	border-bottom: none;
}

.HydrogenSummaryConclusion{
	margin-top: 68px;
}

/* statement */
.HydrogenInhalationDetail .SfStatement{
	margin-top: 62px;
	margin-bottom: 0;
	padding-left: 30px;
}

.HydrogenInhalationDetail .SfStatement p{
	font-size: 19px;
	line-height: 2.05;
	letter-spacing: .06em;
}

/* visual */
.HydrogenInhalationDetail .SfVisual,
.HydrogenInhalationDetail .SfVisual-wide,
.HydrogenInhalationDetail .HydrogenMisinformationVisual,
.HydrogenInhalationDetail .HydrogenDifferenceVisual{
	margin-top: 56px;
	margin-bottom: 64px;
}

.HydrogenInhalationDetail .SfVisual img,
.HydrogenInhalationDetail .SfVisual-wide img,
.HydrogenInhalationDetail .HydrogenMisinformationVisual img{
	border-radius: 30px;
}

/* editorial common */
.HydrogenInhalationDetail .SfEditorialList{
	margin-top: 68px;
	gap: 58px;
}

.HydrogenInhalationDetail .SfEditorialItem,
.HydrogenDefinitionEditorialItem,
.HydrogenReasonEditorialItem{
	grid-template-columns: 1fr;
	gap: 34px;
	padding: 10px 0;
}

.HydrogenDefinitionEditorialItem_Reverse{
	grid-template-columns: 1fr;
}

.HydrogenDefinitionEditorialItem_Reverse .HydrogenDefinitionEditorialText,
.HydrogenDefinitionEditorialItem_Reverse .HydrogenDefinitionEditorialVisual{
	order: initial;
}

.HydrogenDefinitionEditorialText{
	max-width: 100%;
}

.HydrogenDefinitionEditorialVisual{
	max-width: 100％;
	margin: 0 auto;
}

/* matrix */
.HydrogenInhalationDetail .SfMatrix{
	margin-top: 64px;
	padding-top: 48px;
}

.HydrogenInhalationDetail .SfMatrixHead{
	grid-template-columns: 1fr;
	gap: 26px;
	margin-bottom: 36px;
}

.HydrogenInhalationDetail .SfMatrixList,
.HydrogenInhalationDetail .HydrogenConditionMatrixList{
	grid-template-columns: repeat(2, minmax(0,1fr));
}

.HydrogenInhalationDetail .SfMatrixItem{
	min-height: auto;
	padding: 30px 28px;
}

/* core split blocks */
.HydrogenDifferenceCore,
.HydrogenSafetyCore,
.HydrogenRiskCore{
	grid-template-columns: 1fr;
	gap: 46px;
	margin: 70px 0 76px;
	padding-bottom: 70px;
}

.HydrogenDifferenceCorePanel,
.HydrogenSafetyCorePanel,
.HydrogenRiskCorePanel{
	max-width: 100%;
	padding: 38px 36px;
}

/* rows */
.HydrogenDifferenceCompareItem,
.HydrogenSafetyCheckItem,
.HydrogenRiskCostItem,
.HydrogenComparisonRow{
	grid-template-columns: 1fr;
	gap: 18px;
	padding: 32px 0;
}

.HydrogenDifferenceCompareContent,
.HydrogenSafetyCheckTitle,
.HydrogenRiskCostTitle,
.HydrogenComparisonRow div strong{
	font-size: 22px;
}

/* misinformation */
.HydrogenMisinformationHero{
	grid-template-columns: 1fr;
	gap: 48px;
	margin: 70px 0 78px;
	padding-bottom: 70px;
}

.HydrogenMisinformationInspector{
	margin-top: 76px;
	padding-top: 64px;
}

.HydrogenMisinformationInspectorItem{
	grid-template-columns: 1fr;
	gap: 20px;
	padding: 36px 0;
}

.HydrogenMisinformationInspectorItem_Important{
	padding: 44px 0;
}

.HydrogenMisinformationTerm strong{
	font-size: 25px;
}

.HydrogenMisinformationClose{
	padding: 44px 42px;
	border-radius: 32px;
}

.HydrogenMisinformationClose h3{
	font-size: 27px;
}

/* rear scenes */
.HydrogenEditorialScene,
.HydrogenMarketScene,
.HydrogenSelectionHero,
.HydrogenBrandScene,
.HydrogenReferenceScene,
.HydrogenFinalScene{
	grid-template-columns: 1fr;
	gap: 48px;
	margin-top: 64px;
	margin-bottom: 68px;
}

.HydrogenMarketScene,
.HydrogenBrandScene{
	display: flex;
	flex-direction: column;
}

.HydrogenMarketText,
.HydrogenBrandText,
.HydrogenEditorialSceneText,
.HydrogenSelectionText,
.HydrogenReferenceSceneText,
.HydrogenFinalSceneText{
	max-width: 760px;
}

.HydrogenEditorialSceneVisual,
.HydrogenMarketVisual,
.HydrogenSelectionVisual,
.HydrogenBrandVisual,
.HydrogenReferenceSceneVisual,
.HydrogenFinalSceneVisual{
	border-radius: 32px;
}

/* evidence */
.HydrogenLensGrid_4{
	grid-template-columns: repeat(2, minmax(0,1fr));
}

.HydrogenLensCard{
	min-height: auto;
	padding: 32px 28px;
	border-radius: 28px;
}

.HydrogenFlowPanel{
	padding: 52px 44px;
	border-radius: 34px;
}

.HydrogenFlowSteps{
	grid-template-columns: repeat(2, minmax(0,1fr));
}

.HydrogenFlowSteps div{
	min-height: 210px;
}

/* editorial grids */
.HydrogenIssueEditorialList,
.HydrogenDecisionGrid,
.HydrogenPhilosophyEditorialGrid,
.HydrogenPolicyEditorialGrid,
.HydrogenFinalEditorialGrid{
	grid-template-columns: 1fr;
	gap: 0;
	margin-bottom: 72px;
}

.HydrogenIssueEditorialItem,
.HydrogenDecisionGrid article,
.HydrogenPhilosophyEditorialGrid article,
.HydrogenPolicyEditorialGrid article,
.HydrogenFinalEditorialGrid article{
	padding: 34px 0;
}

.HydrogenIssueEditorialItem_Important,
.HydrogenDecisionGrid article:nth-child(3),
.HydrogenPhilosophyEditorialGrid article:nth-child(2),
.HydrogenPolicyEditorialGrid article:nth-child(1),
.HydrogenFinalEditorialGrid article:nth-child(2){
	padding-left: 28px;
}

/* declaration */
.HydrogenDeclarationScene{
	grid-template-columns: 1fr;
	gap: 44px;
	margin: 70px 0 76px;
	padding-bottom: 70px;
}

.HydrogenDeclarationQuote{
	padding: 42px 38px;
}

.HydrogenDeclarationQuote p{
	font-size: 23px;
}

/* references */
.HydrogenReferenceEditorialGroup{
	margin-top: 70px;
}

.HydrogenReferenceEditorialList li{
	grid-template-columns: 64px 1fr;
	gap: 28px;
	padding: 30px 0;
}

/* FAQ */
.HydrogenFAQIntro{
	padding: 36px 34px;
	border-radius: 30px;
}

.HydrogenFAQIntro h3{
	font-size: 24px;
}

.HydrogenFAQ{
	width: 100%;
	margin-top: 0;
}

.HydrogenFAQSummary{
	padding: 28px 58px 28px 0;
	font-size: 18px;
	line-height: 1.8;
}

.HydrogenFAQBody{
	padding: 0 58px 36px 24px;
}

/* read next */
.HydrogenReadNextList,
.HydrogenReadNextList_Editorial{
	width: 100%;
	grid-template-columns: 1fr;
	gap: 18px;
}

.HydrogenReadNextItem,
.HydrogenReadNextList_Editorial .HydrogenReadNextItem{
	min-height: auto;
	padding: 34px 32px;
	border-right: none;
	border: 1px solid rgba(13,11,43,.07);
	border-radius: 30px;
}

.HydrogenReadNextItem h3{
	font-size: 22px;
}

/* CTA */
.TruthArticleCTA,
.HydrogenInhalationDetail .TruthArticleCTA,
.HydrogenInhalationDetail .TruthArticleCTA_final{
	width: 100%;
	margin-top: 66px;
	padding: 46px 44px;
	border-radius: 34px;
}

.TruthArticleCTA_inner,
.HydrogenInhalationDetail .TruthArticleCTA_final .TruthArticleCTA_inner{
	grid-template-columns: minmax(0,1fr) 220px;
	gap: 38px;
	padding: 0;
	align-items: center;
}

.TruthArticleCTA_title{
	font-size: 25px;
	line-height: 1.48;
}

.TruthArticleCTA_text{
	font-size: 14px;
	line-height: 2;
}

.TruthArticleCTA_actions{
	align-items: stretch;
	padding-top: 0;
}

.TruthArticleCTA_btn{
	min-width: 190px;
	height: 52px;
}

/* notice / note */
.HydrogenNotice{
	padding: 32px 34px;
	border-radius: 28px;
}

.SfNote{
	padding: 40px 36px;
	border-radius: 30px;
}

/* 900px以下 */
@media screen and (max-width: 900px){

	.HydrogenInner{
		padding: 0 28px;
	}

	.HydrogenH2,
	.HydrogenSectionIntro .HydrogenH2,
	.HydrogenInhalationDetail .HydrogenH2,
	.HydrogenInhalationDetail .SfSectionTitle{
		font-size: 31px;
	}

	.LowerHero_title{
		font-size: 38px;
	}

	.HydrogenInhalationDetail .SfMatrixList,
	.HydrogenInhalationDetail .HydrogenConditionMatrixList,
	.HydrogenLensGrid_4,
	.HydrogenFlowSteps{
		grid-template-columns: 1fr;
	}

	.TruthArticleCTA_inner,
	.HydrogenInhalationDetail .TruthArticleCTA_final .TruthArticleCTA_inner{
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.TruthArticleCTA_actions{
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: flex-start;
	}

	.TruthArticleCTA_btn{
		min-width: 180px;
	}

	.HydrogenMetaRow{
		grid-template-columns: 1fr;
	}

	.HydrogenMetaItem{
		border-left: none;
		padding-left: 0;
	}
}