/* chapter section --------------------------------------------------------*/

/* @group @variables */

/* 白背景・白背景+区切り線・黒背景の時にはクラスを変更（ラジオボタン）
背景色と文字色と区切り線色を変更したらクラスを追加してCSSに書き込む（CSS Variable） */
[class*="o-chapter"] {
--chapter-grid-template-columns: repeat(1, 1fr);
--chapter-gap: 3rem;
--chapter-x-padding-top: var(--section-spacing-top);
--chapter-x-padding-bottom: var(--section-spacing-bottom);
/*--chapter-background-color: inherit;*//* CSSに書き込む */
/*--chapter-text-color: inherit;*//* CSSに書き込む */
/*---chapter-separater-color: ;*//* CSSに書き込む */
}

/* @end @variables */

/* @group @variables */

[class*="o-chapter-primero"] {
--chapter-x-padding-bottom: 0;
}

/* @end @variables */

/* @chapter --------------------------------------------------------*/

/* @group @variables */

[class*="o-chapter-separator-primary"] {
--chapter-separater-width: inset 0 -1px 0;
--chapter-separater-color: var(--color-gainsboro);
}

/* @end @variables */

/* @group @variables */

[class*="o-chapter-separator-proto"] {
--chapter-separater-width: inset 0 -1px 0;
--chapter-separater-color: var(--color-white);
}

/* @end @variables */
/* @chapter --------------------------------------------------------*/

/* @group @variables */

[class*="o-chapter-theme-primary"] {
--chapter-separater-color: var(--color-white);
}

/* @end @variables */

/* @group @variables */

[class*="o-chapter-theme-proto"] {
--chapter-separater-color: hsla(0, 0%, 4%, 1);
}

/* @end @variables */

/* @chapter --------------------------------------------------------*/

/* @group @variables */

/* 白背景 */
[class*="o-chapter"],
[class*="o-chapter-theme-primary"],
[class*="o-chapter-theme-secondary"] {
--chapter-background-color: var(--color-white);
--chapter-text-color: var(--color-text);

--headline-separater-color: var(--color-brand);
--heading-2-color: var(--color-text);
--heading-3-color: var(--color-text);
--chapter-heading-3-color: var(--color-dimgray);

--section-header-border-image-color: var(--color-brand);
--section-header-border-color: var(--color-very-light-gray);
--sezione-link-background-color: var(--color-white);
--sezione-link-color: var(--color-text);

--chapter-headline-catch-color: var(--color-brand);
}

/* @end @variables */

/* @group @variables */

/* 白背景 / 黒ボタン */
[class*="o-chapter"],
[class*="o-chapter-theme-primary"] {

/*--btn-background-color: var(--color-very-dark-gray);
--btn-action-background-color: var(--color-white);
--btn-active-background-color: var(--color-white-active);
--btn-disabled-background-color: var(--color-white-disabled);

--btn-border-color: var(--color-very-dark-gray);
--btn-border-action-color: var(--color-very-dark-gray);
--btn-border-active-color: var(--color-very-dark-gray-active);
--btn-border-active-color: var(--color-very-dark-gray-disabled);

--btn-text-color: var(--color-white);
--btn-action-text-color: var(--color-very-dark-gray);
--btn-active-text-color: var(--color-very-dark-gray-active);
--btn-disabled-text-color: var(---color-very-dark-gray-disabled);*/
}

/* @end @variables */

/* @group @variables */

/* 白背景 / 黒枠ボタン */
[class*="o-chapter-theme-secondary"] {
/*--btn-background-color: var(--color-white);
--btn-action-background-color: var(--color-very-dark-gray);
--btn-active-background-color: var(--color-very-dark-gray-active);
--btn-disabled-background-color: var(--color-very-dark-gray-disabled);

--btn-border-color: var(--color-very-dark-gray);
--btn-border-action-color: var(--color-white);
--btn-border-active-color: var(--color-white-active);
--btn-border-active-color: var(--color-white-disabled);

--btn-text-color: var(--color-very-dark-gray);
--btn-action-text-color: var(--color-white);
--btn-active-text-color: var(--color-white-active);
--btn-disabled-text-color: var(--color-white-disabled);*/
}

/* @end @variables */

/* @chapter --------------------------------------------------------*/

/* @group @variables */

/* 白背景 */
[class*="o-chapter-theme-premier"],
[class*="o-chapter-theme-deuxieme"] {
--chapter-background-color: var(--color-white);
--chapter-text-color: var(--color-text);

--headline-separater-color: var(--color-brand);
--heading-2-color: var(--color-black);
--heading-3-color: var(--chapter-heading-3-color);
--chapter-heading-3-color: var(--color-dimgray);

--section-header-border-image-color: var(--color-brand);
--section-header-border-color: var(--color-very-light-gray);
--sezione-link-background-color: var(--color-white);
--sezione-link-color: var(--color-text);
}

/* @end @variables */

/* @group @variables */

/* 白背景 / ブランド色ボタン */
[class*="o-chapter-theme-premier"] {
/*--btn-background-color: var(--color-brand);
--btn-action-background-color: var(--color-white);
--btn-active-background-color: var(--color-white-active);
--btn-disabled-background-color: var(--color-white-disabled);

--btn-border-color: var(--color-brand);
--btn-border-action-color: var(--color-brand);
--btn-border-active-color: var(--color-brand-active);
--btn-border-active-color: var(--color-brand-disabled);

--btn-text-color: var(--color-white);
--btn-action-text-color: var(--color-brand);
--btn-active-text-color: var(--color-brand-active);
--btn-disabled-text-color: var(---color-brand-disabled);*/
}

/* @end @variables */

/* @group @variables */

/* 白背景 / ブランド色枠ボタン */
[class*="o-chapter-theme-deuxieme"] {
/*--btn-background-color: var(--color-white);
--btn-action-background-color: var(--color-brand);
--btn-active-background-color: var(--color-brand-active);
--btn-disabled-background-color: var(--color-brand-disabled);

--btn-border-color: var(--color-brand);
--btn-border-action-color: var(--color-white);
--btn-border-active-color: var(--color-white-active);
--btn-border-active-color: var(--color-white-disabled);

--btn-text-color: var(--color-brand);
--btn-action-text-color: var(--color-white);
--btn-active-text-color: var(--color-white-active);
--btn-disabled-text-color: var(--color-white-disabled);*/
}

/* @end @variables */

/* @chapter --------------------------------------------------------*/

/* @group @variables */

/* 黒背景 */
[class*="o-chapter-theme-proto"],
[class*="o-chapter-theme-deutero"] {
--chapter-background-color: var(--color-very-dark-gray);
--chapter-text-color: var(--color-white);

--headline-separater-color: currentColor;
--heading-2-color: inherit;
--heading-3-color: inherit;
--chapter-heading-3-color: inherit;

--section-header-border-image-color: var(--color-brand);
--sezione-link-background-color: var(--color-dimgray);
--sezione-link-color: var(--color-white);
--chapter-headline-catch-color: var(--color-white);
}

/* @end @variables */

/* @group @variables */

/* 青背景 */
[class*="o-chapter-theme-primo"] {
/*--chapter-background-color: var(--color-brand);*/
--chapter-background-image: radial-gradient(ellipse at center, hsla(212, 100%, 33%, .675) 0%, hsla(212, 100%, 32%, 1) 100%);
--chapter-text-color: var(--color-white);
--chapter-headline-catch-color: var(--color-white);
--headline-separater-color: currentColor;
--heading-2-color: inherit;
--heading-3-color: inherit;
--chapter-heading-3-color: inherit;

--section-header-border-image-color: var(--color-brand);
--sezione-link-background-color: var(--color-dimgray);
--sezione-link-color: var(--color-white);
}

/* @end @variables */

/* @group @variables */

/* 黒背景 / 白ボタン */
[class*="o-chapter-theme-proto"] {
/*--btn-background-color: var(--color-white);
--btn-action-background-color: transparent;
--btn-active-background-color: transparent;
--btn-disabled-background-color: var(--color-white-disabled);

--btn-border-color: transparent;
--btn-border-action-color: var(--color-white);
--btn-border-active-color: var(--color-white-active);
--btn-border-active-color: transparent;

--btn-text-color: var(--color-very-dark-gray);
--btn-action-text-color: var(--color-white);
--btn-active-text-color: var(--color-white);
--btn-disabled-text-color: var(--color-very-dark-gray-disabled);*/
}

/* @end @variables */

/* @group @variables */

/* 黒背景 / 白枠ボタン */
[class*="o-chapter-theme-deutero"] {
/*--btn-background-color: transparent;
--btn-action-background-color: var(--color-white);
--btn-active-background-color: var(--color-white-active);
--btn-disabled-background-color: var(--color-white-disabled);

--btn-border-color: var(--color-white);
--btn-border-action-color: transparent;
--btn-border-active-color: transparent;
--btn-border-active-color: var(--color-white-disabled);

--btn-text-color: var(--color-white);
--btn-action-text-color: var(--color-very-dark-gray);
--btn-active-text-color: var(--color-very-dark-gray-active);
--btn-disabled-text-color: var(--color-very-dark-gray-disabled);*/
}

/* @end @variables */

/* @chapter --------------------------------------------------------*/

/* @group @variables */

/* ブランド色背景 */
[class*="o-chapter-theme-primero"],
[class*="o-chapter-theme-segundo"] {
--chapter-background-color: var(--color-brand);
--chapter-text-color: var(--color-white);

--headline-separater-color: currentColor;
--heading-2-color: inherit;
--heading-3-color: inherit;
--chapter-heading-3-color: inherit;

--section-header-border-image-color: var(--color-white);
--sezione-link-background-color: var(--color-dimgray);
--sezione-link-color: var(--color-white);

--chapter-headline-catch-color: var(--color-white);
}

/* @end @variables */

/* @group @variables */

/* ブランド色背景 / 白ボタン */
[class*="o-chapter-theme-primero"] {
--chapter-background-color: var(--color-brand);
--chapter-text-color: var(--color-white);

--btn-background-color: var(--color-white);
--btn-action-background-color: transparent;
--btn-active-background-color: transparent;
--btn-disabled-background-color: var(--color-white-disabled);

--btn-border-color: transparent;
--btn-border-action-color: var(--color-white);
--btn-border-active-color: var(--color-white-active);
--btn-border-active-color: transparent;

--btn-text-color: var(--color-brand);
--btn-action-text-color: var(--color-white);
--btn-active-text-color: var(--color-white);
--btn-disabled-text-color: var(--color-brand-disabled);

}

/* @end @variables */

/* @group @variables */

/* ブランド色背景 / 白枠ボタン */
[class*="o-chapter-theme-segundo"] {
--btn-background-color: transparent;
--btn-action-background-color: var(--color-white);
--btn-active-background-color: var(--color-white-active);
--btn-disabled-background-color: var(--color-white-disabled);

--btn-border-color: var(--color-white);
--btn-border-action-color: transparent;
--btn-border-active-color: transparent;
--btn-border-active-color: var(--color-white-disabled);

--btn-text-color: var(--color-white);
--btn-action-text-color: var(--color-brand);
--btn-active-text-color: var(--color-brand-active);
--btn-disabled-text-color: var(--color-very-dark-gray-disabled);
}

/* @end @variables */

/* @group @variables */

[class*="o-chapter-theme-cta"] {
--chapter-text-color: var(--color-white);
--heading-2-color: inherit;
--heading-3-color: inherit;

--btn-grid-template-columns: var(--btn-before-after-size) auto 0;
--btn-offer-gap: .75rem;
--btn-text-column: 2;
--btn-text-row: 1;
--btn-before-column: 1;
--btn-before-row: 1;
--btn-before-content: '';
--btn-before-after-size: 1.5rem;
--btn-before-background-color: currentColor;
}

/* @end @variables */

/* @group @variables */

[class*="o-chapter-theme-septenary"] {
--chapter-background-color: hsla(210, 95%, 95%, 1)
}

/* @end @variables */

/* @chapter --------------------------------------------------------*/

/* @group @o-chapter */

[class*="o-chapter"] {
position: relative;
overflow: hidden;
z-index: 5;
display: grid;
align-content: var(--chapter-grid-align-content);
grid-template-columns: var(--chapter-grid-template-columns);
/*grid-template-rows: var(--chapter-grid-template-rows);*/
gap: var(--chapter-gap);
min-height: var(--chapter-min-height);
padding-top: var(--chapter-x-padding-top);
padding-bottom: var(--chapter-x-padding-bottom);
box-shadow: var(--chapter-separater-width) var(--chapter-separater-color);
background-color: var(--chapter-background-color);
background-image: var(--chapter-background-image);
background-repeat: var(--chapter-background-repeat);
background-size: var(--chapter-background-size);
background-position: var(--chapter-background-position);
color: var(--chapter-text-color);
}

/* @end @o-chapter */

/* layout section with media --------------------------------------------------------*/

/* @group @variables */

/* 画像の位置変更でクラス変更 */
[class*="a-chapter-media"] {
--object-fit: cover;
--object-position: var(--object-position-novenary);
}

[class*="a-chapter-media-primary"] img {
--object-position: var(--object-position-primary);
}

[class*="a-chapter-media-secondary"] img {
--object-position: var(--object-position-secondary);
}

[class*="a-chapter-media-tertiary"] img {
--object-position: var(--object-position-tertiary);
}

[class*="a-chapter-media-quaternary"] img {
--object-position: var(--object-position-quaternary);
}

[class*="a-chapter-media-quinary"] img {
--object-position: var(--object-position-quinary);
}

[class*="a-chapter-media-senary"] img {
--object-position: var(--object-position-senary);
}

[class*="a-chapter-media-septenary"] img {
--object-position: var(--object-position-septenary);
}

[class*="a-chapter-media-octonary"] img {
--object-position: var(--object-position-octonary);
}

[class*="a-chapter-media-novenary"] img {
--object-position: var(--object-position-novenary);
}

/* @end @variables */

/* @group @o-chapter */

[class*="a-chapter-media"] {
position: absolute;
overflow: hidden;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
}

[class*="a-chapter-media"] {
z-index: -3;
}

[class*="a-chapter-media"],
[class*="a-chapter-media"] img {
width: 100%;
height: 100%;
object-fit: var(--object-fit);
object-position: var(--object-position);
}

[class*="a-chapter-media"] img {
position: relative;
z-index: -1;
}

/* @end @o-chapter */

/* @chapter --------------------------------------------------------*/

/* @group @variables */

/* グラデーションサンプル。クラスを作る */
[class*="o-chapter-theme-cta"] {
/*--chapter-overlay-background-color: hsla(212, 100%, 33%, .8125);*/
--chapter-overlay-background-image: radial-gradient(ellipse at center, hsla(212, 100%, 33%, .75) 0%, hsla(212, 100%, 32%, .875) 100%);
}

[class*="a-chapter-overlay-primary"]:before {
--chapter-overlay-background-color: hsla(0, 0%, 100%, .75);/* CSSに書き込む */
}

[class*="a-chapter-overlay-secondary"]:before {
--chapter-overlay-background-color: hsla(0, 0%, 0%, .75);/* CSSに書き込む */
}

/* @end @variables */

/* @group @o-chapter */

[class*="a-chapter-overlay"]:before {
content: '';
position: absolute;
overflow: hidden;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: var(--chapter-overlay-background-color);
background-image: var(--chapter-overlay-background-image);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
-webkit-backdrop-filter: blur(.25rem);
backdrop-filter: blur(.25rem);
}

/* @end @o-chapter */

/* @chapter-padding --------------------------------------------------------*/

/* chapter-header / chapter-intro / chapter-body / chapter-footer それぞれに指定 */

/* @group @variables */

/* 横幅選択（ラジオボタンでクラス変更） */
[class*="m-chapter-padding"] {
--chapter-padding-right: var(--body-x-padding-right);
--chapter-padding-left: var(--body-x-padding-left);
}

[class*="m-chapter-padding-secondary"] {
--chapter-padding-right: var(--body-x-padding-secondary-right);
--chapter-padding-left: var(--body-x-padding-secondary-left);
}

[class*="m-chapter-padding-tertiary"] {
--chapter-padding-right: var(--body-x-padding-tertiary-right);
--chapter-padding-left: var(--body-x-padding-tertiary-left);
}

[class*="m-chapter-padding-quaternary"] {
--chapter-padding-right: var(--body-x-padding-quaternary-right);
--chapter-padding-left: var(--body-x-padding-quaternary-left);
}

[class*="m-chapter-padding-proto"] {
--chapter-display: table;
--chapter-width: fit-content;
--chapter-push: auto;
--chapter-padding-right: var(--body-x-padding-proto-right);
--chapter-padding-left: var(--body-x-padding-proto-left);
}

/* @end @variables */

/* @group @m-chapter-padding */

[class*="m-chapter-padding"] {
box-sizing: border-box;
display: var(--chapter-display);
width: var(--chapter-width);
max-width: var(--chapter-max-width);
margin-right: var(--chapter-push);
margin-left: var(--chapter-push);
padding-right: var(--chapter-padding-right);
padding-left: var(--chapter-padding-left);
}

/* @end @m-chapter-padding */

/* headline --------------------------------------------------------*/

/* h2要素は必須 / h3要素は任意
h2 / h3要素は改行が発生（タグは<br><wbr><strong><em>以外は排除）
h2 / h3要素はカスタムフィールド
（今回実装なし）ラジオボタンでスタイル変更できるようにする
 */

/* @group @variables */

[class*="m-chapter-headline"] {
--headline-template-columns: repeat(1, 1fr);
--headline-place-items: var(--place-items-center-primary);
--headline-text-position: center;
--headline-gap: 1.125rem;
--headline-after-width: 4.5rem;
--headline-separater-width: 3px;
--headline-separater-margin-top: calc(1.125rem - var(--headline-separater-width));
--heading-2-margin-bottom: 0;
--heading-2-font-family: var(--font-family-default);
--heading-2-font-size: 1.5rem;
--heading-2-line-height: 1.5;
--heading-2-font-weight: var(--text-font-weight-bold);
--heading-2-word-break: keep-all;
--heading-2-text-align: center;

--heading-3-font-family: var(--font-family-default);
--heading-3-font-size: 1.25rem;
--heading-3-line-height: 1.5;
--heading-3-font-weight: var(--text-font-weight);
--heading-3-word-break: keep-all;
--heading-3-text-align: center;

--text-block-margin-bottom: 0;
--chapter-headline-catch-font-size: 2.625rem;
}

[class*="o-chapter-theme-cta"] [class*="m-chapter-headline"] {
--heading-2-font-size: 1.875rem;
--heading-2-line-height: 1.4;
}

@media all and (min-width: 30em) {

[class*="m-chapter-headline"] {
--heading-2-font-size: 1.875rem;
--heading-2-line-height: 1.333333333;
--heading-3-font-size: 1.5rem;
--heading-3-line-height: 1.4;
--chapter-headline-catch-font-size: 3.375rem;
}

[class*="o-chapter-theme-cta"] [class*="m-chapter-headline"] {
--heading-2-font-size: 2.25rem;
--heading-2-line-height: 1.5;
}

}

@media all and (min-width: 48em) {

[class*="m-chapter-headline"] {
/*--heading-2-font-size: 2.625rem;
--heading-2-line-height: 1.428571429;
--heading-3-font-size: 1.875rem;
--heading-3-line-height: 1.2;
--chapter-headline-catch-font-size: 3.75rem;*/
}

}

[class*="o-chapter-theme-deutero"] [class*="m-chapter-headline"] {
--heading-2-font-size: 1.25rem;
--heading-2-line-height: 1.2;
--heading-3-font-size: 1.125rem;
--heading-3-line-height: 1.33333333;
--chapter-headline-catch-font-size: 1.875rem;
}

/* @end @variables */

/* @group @m-chapter-headline */

[class*="m-chapter-headline"] {
position: relative;
z-index: 3;
display: grid;
place-items: var(--headline-place-items);
grid-template-columns: var(--headline-template-columns);
gap:var(--headline-gap);
color: var(--headline-color);
}

[class*="m-chapter-headline"] p>span {
grid-column: 1 /4;
grid-row: 1;
display: block;
text-align: center;
white-space: nowrap;
}

[class*="m-chapter-headline"] p {
position: relative;
display: grid;
place-items: center center;
grid-template-columns: 1fr 4.5rem 1fr;
font-family: var(--font-family-brand-en);
font-size: var(--chapter-headline-catch-font-size);
font-weight: 200;
color: var(--chapter-headline-catch-color);
}

/* @end @m-chapter-headline */

/* @chapter-intro --------------------------------------------------------*/

/* @group @variables */

/* WysiWygエディタ
<p><ul><ol><strong><em><a>だけ利用 */
[class*="m-chapter-intro"] {
--text-block-margin-bottom: 0;
--chapter-intro-gap: .75rem;
}

[class*="m-chapter-intro-primary"] {
--chapter-word-break: keep-all;
}

[class*="m-chapter-intro-secondary"] {
--chapter-intro-text-position: center;
--chapter-word-break: keep-all;
}

[class*="m-chapter-intro-deutero"] {
--chapter-intro-text-position: var(--text-align-deutero);
--chapter-word-break: keep-all;
--content-block-gap-primary:1.5rem;
}

/* @end @variables */

/* @group @m-chapter-intro */

[class*="m-chapter-intro"] {
box-sizing: border-box;
display: grid;
align-content: start;
grid-template-columns: repeat(1, 1fr);
gap: var(--chapter-intro-gap);
text-align: var(--chapter-intro-text-position);
word-break: var(--chapter-word-brea);
}

/* @end @m-chapter-intro */

/* @chapter-nav --------------------------------------------------------*/

/* @group @variables */

/* **今回実装なし
カラム数（ラジオボタンでクラス変更・モバイルは1カラムまたは2カラム / タブレット以上は2〜5カラム）

ずっと2カラム [class*="m-chapter-nav-secondary"]
モバイル2カラム / タブレット3以上カラム [class*="m-chapter-nav-quatrieme"]
モバイル2カラム / タブレット4以上カラム [class*="m-chapter-nav-cinquieme"]
モバイル2カラム / タブレット5以上カラム [class*="m-chapter-nav-sixieme"]
タブレット以上2カラム [class*="m-chapter-nav-deutero"]
タブレット以上3カラム [class*="m-chapter-nav-trito"]
タブレット以上4カラム [class*="m-chapter-nav-tetarto"]
タブレット以上5カラム [class*="m-chapter-nav-pempto"]
 */
[class*="m-chapter-nav"] {
--chapter-nav-columns: repeat(1, 1fr);
/*--chapter-nav-rows: ;*/
--chapter-nav-gap: 1px;
--chapter-link-background-color: var();
--chapter-link-color: var();
--chapter-link-action-background-color: var();
--chapter-link-action-color: var();
--chapter-link-active-background-color: var();
--chapter-active-link-color: var();
}

[class*="m-chapter-nav-secondary"],
[class*="m-chapter-nav-quatrieme"],
[class*="m-chapter-nav-cinquieme"],
[class*="m-chapter-nav-sixieme"]  {
--chapter-nav-columns: repeat(2, 1fr);
}

@media all and (min-width: 48em) {

[class*="m-chapter-nav-deutero"] {
--chapter-nav-columns: repeat(2, 1fr);
}

[class*="m-chapter-nav-trito"],
[class*="m-chapter-nav-quatrieme"] {
--chapter-nav-columns: repeat(3, 1fr);
}

[class*="m-chapter-nav-tetarto"],
[class*="m-chapter-nav-cinquieme"] {
--chapter-nav-columns: repeat(4, 1fr);
}

[class*="m-chapter-nav-pempto"],
[class*="m-chapter-nav-sixieme"] {
--chapter-nav-columns: repeat(5, 1fr);
}

}

/* @end @variables */

/* @group @m-chapter-nav */

[class*="m-chapter-nav"] {
box-sizing: border-box;
display: grid;
grid-template-columns: var(--chapter-nav-columns);
grid-template-rows: var(--chapter-nav-rows);
gap: var(--chapter-nav-gap);
}



[class*="m-chapter-nav"] li {
display: contents;
}

[class*="m-chapter-nav"] a {
display: grid;
justify-content: center;
align-items: center;
background-color: var(--chapter-link-background-color);
padding: var(--chapter-link-padding);
color: var(--chapter-link-color);
text-align: center;
}

[class*="m-chapter-nav"] a:hover,
[class*="m-chapter-nav"] a:focus {
background-color: var(--chapter-link-action-background-color);
color: var(--chapter-link-action-color);
}


[class*="m-chapter-nav"] a:active {
background-color: var(--chapter-link-active-background-color);
color: var(--chapter-active-link-color);
}
/* @end @m-chapter-nav */

/* @chapter-body --------------------------------------------------------*/

/* 間隔指定（ラジオボタンでクラス変更）
Gudenburgモジュールをドラッグ&ドロップできるようにする */

/* @group @variables */

[class*="m-chapter-body"] {
--chapter-body-gap: 3.75rem;
}

[class*="m-chapter-body-secondary"] {
--text-block-margin-bottom: 0;
--chapter-body-gap: .75rem;
}

[class*="m-chapter-body-tertiary"] {
--text-block-margin-bottom: 0;
--chapter-body-gap: 1.125rem;
}

[class*="m-chapter-body-quaternary"] {
--text-block-margin-bottom: 0;
--chapter-body-gap: 1.5rem;
}

[class*="m-chapter-body-senary"] {
--chapter-body-gap: 2.25rem;
}

[class*="m-chapter-body-octonary"] {
--chapter-body-gap: 3rem;
}

[class*="m-chapter-body-decenary"] {
--chapter-body-gap: 3.75rem;
}

/* @end @variables */

/* @group @m-chapter-body */

[class*="m-chapter-body"] {
box-sizing: border-box;
position: relative;
z-index: 3;
display: grid;
align-self: start;
align-content: start;
grid-template-columns: repeat(1, 1fr);
gap: var(--chapter-body-gap);
}

/* @end @m-chapter-body */

/* @m-chapter-footer --------------------------------------------------------*/

/* リンク最大2つまで指定（カスタムフィールド） / ボタンのテーマをラジオボタンで指定 */
/* @group @variables */

[class*="m-chapter-footer"] {
--chapter-footer-columns: repeat(1, 1fr);
--chapter-footer-max-size: 33rem;/* CSSで変更 */
--chapter-footer-gap: 1.5rem;
--chapter-padding-right: var(--body-x-padding-proto-right);
--chapter-padding-left: var(--body-x-padding-proto-left);
--chapter-footer-push: auto;
--text-block-margin-bottom: 0;
}

.m-chapter-footer-proto {
--text-block-margin-right: auto;
--text-block-margin-left: auto;
}

@media all and (min-width: 48em) {

.m-chapter-footer-secodnary {
--chapter-footer-columns: repeat(2, 1fr);
--chapter-footer-max-size: 50rem;
}

}

/* @end @variables */

/* @group @m-chapter-footer */

[class*="m-chapter-footer"] {
box-sizing: border-box;
position: relative;
z-index: 3;
display: grid;
justify-content: center;
grid-template-columns: var(--chapter-footer-columns);
gap: var(--chapter-footer-gap);
width: 100%;
max-width: var(--chapter-footer-max-size);
margin-right: var(--chapter-footer-push);
margin-left: var(--chapter-footer-push);
padding-right: var(--chapter-padding-right);
padding-left: var(--chapter-padding-left);
}

/* @end @m-chapter-footer */

/* hidden --------------------------------------------------------*/

/* @group @variables */

.a-offscreen-primary {
--offscreen-position: absolute;
--offscreen-left: -999em;
}

.a-offscreen-proto {
--offscreen-position: fixed;
--offscreen-left: -999em;
}

@media all and (min-width:48em) {

.a-offscreen-tertiary {
--offscreen-position: absolute;
--offscreen-left: -999em;
}

}

@media all and (max-width:47.9375em) {

.a-offscreen-trito {
--offscreen-position: absolute;
--offscreen-left: -999em;
}

}

/* @end @variables */

/* @group @a-offscreen */

[class*="a-offscreen"] {
position: var(--offscreen-position);
left: var(--offscreen-left);
}

/* @end @a-offscreen */

/* hidden --------------------------------------------------------*/

/* @group @a-hidden */

.a-hidden-primary {
display: none;
}

.a-offscreen-proto {
position: fixed;
left: -999em;
}

@media all and (min-width:48em) {

.a-hidden-tertiary {
display: none;
}

}

@media all and (max-width:47.9375em) {

.a-hidden-trito {
display: none;
}

}

/* @end @a-hidden */