@charset "UTF-8";
/********************************************************************************

プラグイン Genesis Custom Blocks 専用css

********************************************************************************/
/*============================================================
 リセット
*============================================================*/
/* サイト設定リセット
---------------------------------------- */
.block-post-content [class^="gcb-"] * {
    margin: 0;
}

/* エディタ設定リセット
---------------------------------------- */
.editor-styles-wrapper [class^="gcb-"]:not(.gcb-editor-form) * {
    margin: 0;
}

/*============================================================
 共通
*============================================================*/
/* 内部要素
---------------------------------------- */
.block-post-content [class^="gcb-"] :is(ul, ol) {
    margin-left: 1.5em;
}
.block-post-content [class^="gcb-"] ul li {
    list-style: disc;
}
.block-post-content [class^="gcb-"] ol li {
    list-style: decimal;
}
.block-post-content [class^="gcb-"] a {
    color: #0056ab;
    text-decoration: underline;
}
.block-post-content [class^="gcb-"] .gcb-inner-blocks {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/*============================================================
 ボックス（背景色付）   box-color-〇〇〇
*============================================================*/
/* 共通
---------------------------------------- */
[class^="gcb-box-color-"] {
    padding: 16px;
    border-radius: 8px;
}
[class^="gcb-box-color-"] .textarea {
}

/* 黄色
---------------------------------------- */
.gcb-box-color-yellow {
    background-color: #fff6a3;
    border: solid 1px #f6f422;
}

/* 赤色
---------------------------------------- */
.gcb-box-color-red {
    background-color: #feccd0;
    border: solid 1px #cf3b27;
}

/* 青色
---------------------------------------- */
.gcb-box-color-blue {
    background-color: #d5f2ff;
    border: solid 1px #0056ab;
}

/* オレンジ
---------------------------------------- */
.gcb-box-color-orange {
    background-color: #ffcd9d;
    border: solid 1px #f98829;
}

/*============================================================
 ボタン（2tone）   btn-color-〇〇〇
*============================================================*/
/* 共通
---------------------------------------- */
[class^="gcb-btn-color-"] {
    display: block;
    box-sizing: border-box;
    width: min(400px, 100%);
    min-height: 56px;
    align-content: center;
    padding: 12px;
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 4px;
    text-decoration: unset !important;
    margin: 0 auto;
}
[class^="gcb-btn-color-"]::after {
    display: block;
    content: "";
    width: 24px;
    height: 24px;
    background-image: url(../library/images/common/icon-btn-arrow-white.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 24px auto;
}
[class^="gcb-btn-color-"] .label {
    flex: 1;
    max-width: fit-content;
    font-weight: bold;
    color: #fff;
    text-align: center;
}

/* シアン
---------------------------------------- */
.gcb-btn-color-cyan {
    background-color: #00A0E9;
}

/* 赤色
---------------------------------------- */
.gcb-btn-color-red {
    background-color: #cf3b27;
}

/* 青色
---------------------------------------- */
.gcb-btn-color-blue {
    background-color: #004098;
}

/* オレンジ
---------------------------------------- */
.gcb-btn-color-orange {
    background-color: #f98829;
}

/*============================================================
 ボックス（アイコン付）   box-msg-〇〇〇
*============================================================*/
/* 共通
---------------------------------------- */
[class^="gcb-box-msg-"] {
    padding: 32px 24px;
    border: solid 1px;
    border-radius: 8px;
    --icon-size: 48px;
    --icon-image: url(./images/icon-attention.svg);
    position: relative;
}
[class^="gcb-box-msg-"]::before {
    display: block;
    content: "";
    width: var(--icon-size);
    height: var(--icon-size);
    background-image: var(--icon-image);
    background-repeat: no-repeat;
    background-position: center;
    background-size: var(--icon-size) auto;
    position: absolute;
    top: 0;
    left: 24px;
    transform: translateY(-50%);
}

/* 注意
---------------------------------------- */
.gcb-box-msg-attention {
    border-color: #ff5b5b;
    --icon-image: url(./images/icon-attention.svg);
}

/* ヒント
---------------------------------------- */
.gcb-box-msg-hint {
    border-color: #ffa639;
    --icon-image: url(./images/icon-hint.svg);
}

/* 注意
---------------------------------------- */
.gcb-box-msg-checkpoint {
    border-color: #86D67B;
    --icon-image: url(./images/icon-checkpoint.svg);
}


/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
 Tablet
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
@media screen and (max-width: 1159px) {
}



/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
 SP
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
@media screen and (max-width: 767px) {
}