@charset "utf-8";

@font-face {
  font-family: 'D DIN PRO';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://www.ms-ad-hd.com//resources/sw_lib/d-din-pro/D-DIN-PRO-400-Regular.otf") format('opentype');
}
@font-face {
  font-family: 'D DIN PRO';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("https://www.ms-ad-hd.com/resources/sw_lib/d-din-pro/D-DIN-PRO-500-Medium.otf") format('opentype');
}
@font-face {
  font-family: 'D DIN PRO';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("https://www.ms-ad-hd.com/resources/sw_lib/d-din-pro/D-DIN-PRO-600-SemiBold.otf") format('opentype');
}
@font-face {
  font-family: 'D DIN PRO';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("https://www.ms-ad-hd.com/resources/sw_lib/d-din-pro/D-DIN-PRO-700-Bold.otf") format('opentype');
}
@font-face {
  font-family: 'D DIN PRO';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("https://www.ms-ad-hd.com/resources/sw_lib/d-din-pro/D-DIN-PRO-800-ExtraBold.otf") format('opentype');
}
@font-face {
  font-family: 'D DIN PRO';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("https://www.ms-ad-hd.com/resources/sw_lib/d-din-pro/D-DIN-PRO-900-Heavy.otf") format('opentype');
}

/*-------- デフォルトワイドレイアウト --------*/
html {
	/* PCコンテンツエリア幅 */
	--mainarea-width-pc: 1060px;
	/* SPコンテンツエリア幅 */
	--mainarea-width-sp: 500px;
}

@media print, screen and (min-width: 768px) {
	body {
		--mainarea-base: 1.00;
		--mainarea-width: var(--mainarea-width-pc);
		--column-side-margin: 20px;
	}
}
@media screen and (max-width: 767px) {
	body {
		--mainarea-base: 1.00;
		--mainarea-width: var(--mainarea-width-sp);
		--column-side-margin: 10px;
	}
}


/* カラムレイアウト */
:where([role="main"]) .multiColumn {
	clear: both;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	gap: 0 var(--column-side-margin);
	margin: 0;
}

:where([role="main"]) .multiColumn::before ,
:where([role="main"]) .multiColumn::after {
	content: none;
	position: absolute;
}

:where([role="main"]) .multiColumn .column {
	display: block;
	flex: 0 0 auto;
	--parts-par-column: 1;
	margin: 0;
}

@media print, screen and (min-width: 768px) {
	.multiColumn1 > .column {
		width: calc(100% * var(--mainarea-base));
		max-width: var(--mainarea-width);
	}

	.multiColumn2 > .column {
		width: calc((100% * var(--mainarea-base) - var(--column-side-margin)) / 2);
		max-width: calc((var(--mainarea-width) - var(--column-side-margin)) / 2);
	}

	.multiColumn3 > .column {
		width: calc((100% * var(--mainarea-base) - 2 * var(--column-side-margin)) / 3);
		max-width: calc((var(--mainarea-width) - 2 * var(--column-side-margin)) / 3);
	}

	.multiColumn4 > .column {
		width: calc((100% * var(--mainarea-base) - 3 * var(--column-side-margin)) / 4);
		max-width: calc((var(--mainarea-width) - 3 * var(--column-side-margin)) / 4);
	}

	.multiColumn5 > .column {
		width: calc((100% * var(--mainarea-base) - 4 * var(--column-side-margin)) / 5);
		max-width: calc((var(--mainarea-width) - 4 * var(--column-side-margin)) / 5);
	}

	/*== デフォルトワイド・センターワイドモード ==*/
	/* 左右にパディングを入れる */
	:where(#promos3) >*>*> .multiColumn ,
	:where([role="main"]) > .multiColumn {
		padding-left: 20px;
		padding-right: 20px;
	}

	/*== コンテンツエリア＝マルチカラム設定 ==*/
	.lx_mcol_narrow_pc ,
	.lx_mcol_narrow {
		width: calc(100% - 40px);
		max-width: var(--mainarea-width);
		margin-left: auto;
		margin-right: auto;
	}

	.lx_mcol_narrow_pc > .column ,
	.lx_mcol_narrow > .column {
		--mainarea-base: 1;
		--mainarea-width: var(--mainarea-width-pc);
	}

	:where(#promos3) >*>*> .lx_mcol_narrow_pc ,
	:where([role="main"]) > .lx_mcol_narrow_pc ,
	:where(#promos3) >*>*> .lx_mcol_narrow ,
	:where([role="main"]) > .lx_mcol_narrow {
		padding-left: 0;
		padding-right: 0;
	}

	/*== フルワイドモード ==*/
	/* 左右のパディングをなくし、カラムを画面幅いっぱいに */
	:where([role="main"])
	 > :is(.lx_mcol_full_pc,.lx_mcol_full) {
		padding-left: 0;
		padding-right: 0;
	}

	:where([role="main"])
	 > :is(.lx_mcol_full_pc,.lx_mcol_full)
	 > :is(.column1,.column2,.column3,.column4,.column5) {
		max-width: none;
	}

	/*== 別エリア・別パーツ表示 ==*/
	.reuse-main-area ,
	.reuse-component {
		--mainarea-base: 1;
		--mainarea-width: var(--mainarea-width-pc);
	}

	/*== カラム間マージン ==*/
	.lx_col_mr0 ,
	.lx_col_mr0pc {
		--column-side-margin: 0px;
	}

	.lx_col_mr40 ,
	.lx_col_mr40pc {
		--column-side-margin: 40px;
	}

	.lx_col_mr100 ,
	.lx_col_mr100pc {
		--column-side-margin: 100px;
	}

	.lx_col_mr110 ,
	.lx_col_mr110pc {
		--column-side-margin: 110px;
	}
}
@media screen and (max-width: 767px) {
	.multiColumn {
		max-width: 100vw;
	}

	/* 1～3カラムは1カラムに */
	[role="main"] .lx_col_sp100 > .column ,
	.reuse-component .multiColumn1 > .column ,
	.reuse-component .multiColumn2 > .column ,
	.reuse-component .multiColumn3 > .column ,
	.reuse-main-area .multiColumn1 > .column ,
	.reuse-main-area .multiColumn2 > .column ,
	.reuse-main-area .multiColumn3 > .column ,
	.multiColumn1 > .column ,
	.multiColumn2 > .column ,
	.multiColumn3 > .column {
		width: calc(100% * var(--mainarea-base));
		max-width: var(--mainarea-width);
		margin: 0;
	}

	/* 4～5は2カラムに */
	[role="main"] .lx_col_sp50 > .column ,
	.reuse-component .multiColumn4 > .column ,
	.reuse-component .multiColumn5 > .column ,
	.reuse-main-area .multiColumn4 > .column ,
	.reuse-main-area .multiColumn5 > .column ,
	.multiColumn4 > .column ,
	.multiColumn5 > .column {
		width: calc((100% * var(--mainarea-base) - var(--column-side-margin)) / 2);
		max-width: calc((var(--mainarea-width) - var(--column-side-margin)) / 2);
		margin: 0;
	}


	/*== デフォルトワイド・センターワイドモード ==*/
	/* 左右にパディングを入れる */
	:where(#promos3) >*>*> .multiColumn ,
	:where([role="main"]) > .multiColumn {
		padding-left: 15px;
		padding-right: 15px;
	}


	/*== コンテンツエリア＝マルチカラム設定 ==*/
	.lx_mcol_narrow_sp ,
	.lx_mcol_narrow {
		width: calc(100% - 30px);
		max-width: var(--mainarea-width);
		margin-left: auto;
		margin-right: auto;
	}

	.lx_mcol_narrow_sp > .column ,
	.lx_mcol_narrow > .column {
		--mainarea-base: 1;
		--mainarea-width: var(--mainarea-width-pc);
	}

	:where(#promos3) >*>*> .lx_mcol_narrow_sp ,
	:where([role="main"]) > .lx_mcol_narrow_sp ,
	:where(#promos3) >*>*> .lx_mcol_narrow ,
	:where([role="main"]) > .lx_mcol_narrow {
		padding-left: 0;
		padding-right: 0;
	}

	/*== フルワイドモード ==*/
	/* 左右のパディングをなくし、カラムを画面幅いっぱいに */
	:where([role="main"])
	 > :is(.lx_mcol_full_sp,.lx_mcol_full) {
		padding-left: 0;
		padding-right: 0;
		margin-left: 0;
		margin-right: 0;
	}

	:where([role="main"])
	 > :is(.lx_mcol_full_pc,.lx_mcol_full) > .column {
		max-width: none;
	}

	/*== 別エリア・別パーツ表示 ==*/
	.reuse-main-area ,
	.reuse-component {
		--mainarea-base: 1;
		--mainarea-width: var(--mainarea-width-sp);
	}

	/*== カラム間マージン ==*/
	.lx_col_mr0 ,
	.lx_col_mr0sp {
		--column-side-margin: 0px;
	}

}

/* ワイドモード */
@media print, screen and (min-width: 768px) {
	/*body[id=wide]*/ #wrapper-2 ,
	/*body[id=wide]*/ #wrapper-3 {
		padding: 0;
		width: auto;
		min-width: calc(1060px + 40px);
	}

	/*body[id=wide]*/ #page-intro {
		width: 1060px;
		margin-left: auto;
		margin-right: auto;
	}
}
@media screen and (max-width: 767px) {
	/*body[id=wide]*/ #wrapper-3 {
		padding: 0;
	}
}

/* カラム分割比率 ２段 */
/* PCで２・３段のカラム */
/* SPでも上下に並ぶ */
/* ワイドモードで2段にする関係上、上段と下段をの間に区切りが必要なので、区切りとして使われるカラムは実質非表示になる */
@media print, screen and (min-width: 768px) {
	/* カラム分割比率 ２段 3カラム */
	/* カラム分割比率 ３段 5カラム */
	.multiColumn3.lx_mcol3_ratio1on1 > .column1 ,
	.multiColumn3.lx_mcol3_ratio1on1 > .column3 ,
	.multiColumn4.lx_mcol4_ratio1on11 > .column1 ,
	.multiColumn4.lx_mcol4_ratio11on1 > .column4 ,
	.multiColumn4.lx_mcol4_ratio1on12 > .column1 ,
	.multiColumn4.lx_mcol4_ratio12on1 > .column4 ,
	.multiColumn4.lx_mcol4_ratio1on21 > .column1 ,
	.multiColumn4.lx_mcol4_ratio21on1 > .column4 ,
	.multiColumn5.lx_mcol5_ratio1on1on1 > .column1 ,
	.multiColumn5.lx_mcol5_ratio1on1on1 > .column3 ,
	.multiColumn5.lx_mcol5_ratio1on1on1 > .column5 {
		width: calc(100% * var(--mainarea-base));
		max-width: var(--mainarea-width);
	}

	.multiColumn4.lx_mcol4_ratio1on11 > .column3 ,
	.multiColumn4.lx_mcol4_ratio1on11 > .column4 ,
	.multiColumn4.lx_mcol4_ratio11on1 > .column1 ,
	.multiColumn4.lx_mcol4_ratio11on1 > .column2 {
		width: calc((100% * var(--mainarea-base) - var(--column-side-margin)) / 2);
		max-width: calc((var(--mainarea-width) - var(--column-side-margin)) / 2);
	}

	.multiColumn4.lx_mcol4_ratio1on12 > .column3 ,
	.multiColumn4.lx_mcol4_ratio1on21 > .column4 ,
	.multiColumn4.lx_mcol4_ratio12on1 > .column1 ,
	.multiColumn4.lx_mcol4_ratio21on1 > .column2 {
		width: calc((100% * var(--mainarea-base) - 2 * var(--column-side-margin)) / 3);
		max-width: calc((var(--mainarea-width) - 2 * var(--column-side-margin)) / 3);
	}
	.multiColumn4.lx_mcol4_ratio1on12 > .column4 ,
	.multiColumn4.lx_mcol4_ratio1on21 > .column3 ,
	.multiColumn4.lx_mcol4_ratio12on1 > .column2 ,
	.multiColumn4.lx_mcol4_ratio21on1 > .column1 {
		width: calc((100% * var(--mainarea-base) - 2 * var(--column-side-margin)) * 2 / 3 +  var(--column-side-margin));
		max-width: calc((var(--mainarea-width) - 2 * var(--column-side-margin)) * 2 / 3 + var(--column-side-margin));
	}

}

@media screen and (max-width: 767px) {
	.multiColumn3.lx_mcol3_ratio1on1 > .column1 ,
	.multiColumn3.lx_mcol3_ratio1on1 > .column3 ,
	.multiColumn5.lx_mcol5_ratio1on1on1 > .column1 ,
	.multiColumn5.lx_mcol5_ratio1on1on1 > .column3 ,
	.multiColumn5.lx_mcol5_ratio1on1on1 > .column5 {
		width: calc(100% * var(--mainarea-base));
		max-width: calc(var(--mainarea-width));
	}
}


/* 区切りカラム */
.multiColumn3.lx_mcol3_ratio1on1 > .column2 ,
.multiColumn4.lx_mcol4_ratio1on11 > .column2 ,
.multiColumn4.lx_mcol4_ratio11on1 > .column3 ,
.multiColumn4.lx_mcol4_ratio1on12 > .column2 ,
.multiColumn4.lx_mcol4_ratio12on1 > .column3 ,
.multiColumn4.lx_mcol4_ratio1on21 > .column2 ,
.multiColumn4.lx_mcol4_ratio21on1 > .column3 ,
.multiColumn5.lx_mcol5_ratio1on1on1 > .column2 ,
.multiColumn5.lx_mcol5_ratio1on1on1 > .column4 {
	display: block !important;
	width: 100%;
	max-width: none;
	height: 0;
	padding: 0 !important;
	margin: 0;
}

.multiColumn3.lx_mcol3_ratio1on1 > .column2 * ,
.multiColumn4.lx_mcol4_ratio1on11 > .column2 * ,
.multiColumn4.lx_mcol4_ratio11on1 > .column3 * ,
.multiColumn4.lx_mcol4_ratio1on12 > .column2 * ,
.multiColumn4.lx_mcol4_ratio12on1 > .column3 * ,
.multiColumn4.lx_mcol4_ratio1on21 > .column2 * ,
.multiColumn4.lx_mcol4_ratio21on1 > .column3 * ,
.multiColumn5.lx_mcol5_ratio1on1on1 > .column2 * ,
.multiColumn5.lx_mcol5_ratio1on1on1 > .column4 * {
	display: none !important;
	visibility: hidden !important;
}


/* 画像背景 */
#sharewithmain .lx_text_img_lay_under {
	position: relative;
}

.lx_text_img_lay_under .text-section.highlight {
	position: static;
	margin: 0;
	transform: none !important; /* エフェクト対策 */
}

.lx_text_img_lay_under .text-section.highlight > img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	-o-object-fit: cover;
	   object-fit: cover;
}

/* 画像背景化 */
/* lx_text_img_lay_under の拡張ver */
.lx_ex_col_bg_img > .column ,
.lx_ex_col_bg_img_flip > .column ,
.lx_ex_mcol_bg_img ,
.lx_ex_mcol_bg_img_flip {
	position: relative;
}

.lx_ex_col_bg_img > .column .text-section.highlight ,
.lx_ex_col_bg_img_flip > .column .text-section.highlight ,
.lx_ex_mcol_bg_img .text-section.highlight ,
.lx_ex_mcol_bg_img_flip .text-section.highlight {
	position: static;
	margin: 0;
	transform: none !important; /* エフェクト対策 */
}

.lx_ex_col_bg_img > .column .text-section.highlight > img ,
.lx_ex_col_bg_img_flip > .column .text-section.highlight > img ,
.lx_ex_mcol_bg_img .text-section.highlight > img ,
.lx_ex_mcol_bg_img_flip .text-section.highlight > img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	-o-object-fit: cover;
	   object-fit: cover;
    z-index: -1;
}

@media print, screen and (min-width: 768px) {
	.lx_ex_col_bg_img_flip > .column .text-section.highlight ~.text-section.highlight > img ,
	.lx_ex_mcol_bg_img_flip .text-section.highlight ~.text-section.highlight > img {
		display: none;
	}
}

@media screen and (max-width: 767px) {
	.lx_ex_col_bg_img_flip > .column .text-section.highlight > img ,
	.lx_ex_mcol_bg_img_flip .text-section.highlight > img {
		display: none;
	}

	.lx_ex_col_bg_img_flip > .column .text-section.highlight ~.text-section.highlight > img ,
	.lx_ex_mcol_bg_img_flip .text-section.highlight ~.text-section.highlight > img {
		display: block;
	}
}


/* アイコン付き見出し */
.title2:not(.no-icon) ,
.title3:not(.no-icon) ,
.title4:not(.no-icon) {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	gap: 0 15px;
}

body.in-editor .title2:not(.no-icon) ,
body.in-editor .title3:not(.no-icon) ,
body.in-editor .title4:not(.no-icon) {
	flex-wrap: wrap;
}

.title2 dl ,
.title2 dl ,
.title3 dl {
	flex: 0 0 auto;
}

.title2 dl img ,
.title3 dl img ,
.title4 dl img {
	display: block;
}

/* フッター上マージン */
#site-info {
	margin-top: 0;
}


