/**
 * Flexible 固定ページ
 */

.page-flexible-header {z-index: 2; padding: 120px 30px; text-align: center; background-size: cover; background-position: 50% 50%; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.page-flexible-header-title {padding: 0.5em 2em; font-size: 3em; font-weight: bold; background: linear-gradient(to right, transparent 0%, rgba(255,255,255,0.7) 10%, rgba(255,255,255,0.7) 90%, transparent 100%);}
.page-flexible-header-title span {display: inline-block;}
.page-flexible-header-subtitle-wrap {margin-top: 3em;}
.page-flexible-header-subtitle {display: inline-block; padding: 1em 3em; font-size: 2em; font-weight: bold; color: #0082a9; background: linear-gradient(to right, transparent 0%, rgba(255,255,255,0.8) 10%, rgba(255,255,255,0.8) 90%, transparent 100%); text-shadow: 0px 0px 2px #FFF,0px 0px 2px #FFF,0px 0px 2px #FFF,0px 0px 2px #FFF;}
.page-flexible-header-keyphrases {display: flex; justify-content: space-around; max-width: 1200px; height: 80px; margin: 3em auto 0; gap: 1.5rem;}
.page-flexible-header-keyphrases-item {display: flex; justify-content: center; align-items: center; width: 240px; height: 240px; background: #66ABC1; font-size: 2em; font-weight: bold; color: #FFF !important; line-height: 2.4rem; font-size: 1.7em; letter-spacing: .07rem; border-radius: 50%;}

.page-flexible-header-height-66vw {min-height: 66vw;}
.page-flexible-header-height-50vw {min-height: 50vw;}
.page-flexible-header-height-40vw {min-height: 40vw;}
.page-flexible-header-height-33vw {min-height: 33vw;}
.page-flexible-header-height-25vw {min-height: 25vw;}
.page-flexible-header-height-20vw {min-height: 20vw;}

.page-flexible-body {margin-bottom: 50px; font-size: 16px; line-height: 1.8;}

.page-flexible-button-color a { display: inline-block; color: #fff; font-size: .9rem; text-align: center; text-decoration: none; padding: .3rem .5rem; }
.page-flexible-button-color a:hover {background-color: #D70;}
.page-flexible-button-color a i {padding-top: .1rem;}

@media (max-width: 639px) {
    .content-header {max-height: none; padding: 50px 0;}
    .page-flexible-header {background-repeat: no-repeat; background-position: 0 0;} /* background-size: contain; */
    .page-flexible-header-title {line-height: 1.3em; padding: 0.3em 0.8em; font-size: 2.2em; min-height: 2.5em; /*background: rgb(255 255 255 / 80%);*/ display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
    .page-flexible-header-subtitle-wrap {padding-left: 15px; padding-right: 15px;}
    .page-flexible-header-subtitle {padding: 1em 0; font-size: 1.5em; line-height: 1.2em;}
    .page-flexible-header-keyphrases {display: block; width: 90%; height: auto;}
    .page-flexible-header-keyphrases-item { width: 100%; height: auto; padding: 1rem; margin-bottom: 0.5rem; }
    .page-flexible-header-keyphrases-item br {display: none;}

    .page-flexible-header-height-66vw,
    .page-flexible-header-height-50vw,
    .page-flexible-header-height-40vw,
    .page-flexible-header-height-33vw,
    .page-flexible-header-height-25vw,
    .page-flexible-header-height-20vw {min-height: auto;}
}

/**
 * カラー
 */
.page-flexible-bg-black {background: #66ABC1; border-radius: 5px;}
.page-flexible-bg-gray {background: #777;}

/**
 * ボタン
 */
.page-flexible-block-item-button {display: flex; justify-content: flex-end; margin-top: .2rem;}
.page-flexible-block-item-button a {display: inline-block; color: #fff; font-size: .9rem; text-decoration: none; padding: .3rem .5rem; transition: .3s;}
.page-flexible-block-item-button a:hover {background-color: #D70;}

/**
 * フレキシブルコンテンツ
 */
.page-flexible-section {padding: 40px 10px; font-size: 1.1rem;}
.page-flexible-section.page-flexible-section-connect {padding-top: 0; margin-top: -20px;} /* 連結セクションのみ */
.page-flexible-section-odd {background: #FFF;}
.page-flexible-section-even {background: #ebebeb;}
.x-padding-top .page-flexible-section:first-child {padding-top: 80px;}

.page-flexible-block {width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; border: 1px solid transparent;}
.page-flexible-block-title {margin-bottom: 1.6em; text-align: center; font-size: 1.66em; font-weight: bold; line-height: 1.4em;}

@media (max-width: 639px) {
    .page-flexible-block-title {line-height: 1.4em;}
    .page-flexible-section {font-size: 1rem;}
}

/**
 * LAYOUT シンプル (simple)
 */
.page-flexible-block-simple-image {text-align: center;}
.page-flexible-block-simple-image img {max-width: 100%;}

.page-flexible-block-simple-inner.x-position-left,
.page-flexible-block-simple-inner.x-position-right {
    display: flex; justify-content: space-between; align-items: center;
}
.page-flexible-block-simple-inner.x-position-left {flex-direction: row-reverse;}
.page-flexible-block-simple-inner.x-position-right {flex-direction: row;}

.page-flexible-block-simple-inner.x-position-left .page-flexible-block-simple-description,
.page-flexible-block-simple-inner.x-position-right .page-flexible-block-simple-description {flex-basis: 60%; flex-grow: 1;}

.page-flexible-block-simple-inner.x-position-left .page-flexible-block-simple-image,
.page-flexible-block-simple-inner.x-position-right .page-flexible-block-simple-image {flex-basis: 35%; flex-grow: 1;}
.page-flexible-block-simple-inner.x-position-left .page-flexible-block-simple-image:nth-child(2) {margin-right: 50px;}
.page-flexible-block-simple-inner.x-position-right .page-flexible-block-simple-image:nth-child(2) {margin-left: 50px;}

.page-flexible-block-simple-inner.x-position-top {display: flex; flex-wrap: wrap; flex-direction: column-reverse;}
.page-flexible-block-simple-inner.x-position-top .page-flexible-block-simple-description {}
.page-flexible-block-simple-inner.x-position-top .page-flexible-block-simple-image {margin-bottom: 2em;}
.page-flexible-block-simple-inner.x-position-top .page-flexible-block-simple-image-sub-images {justify-content: space-around;}
.page-flexible-block-simple-inner.x-position-top .page-flexible-block-simple-image-sub-images img {margin-right: none !important; }
.page-flexible-block-simple-inner.x-position-top .page-flexible-block-simple-image-sub-images img {width: auto;}

.page-flexible-block-simple-image-main-image {margin-bottom: 1rem;}
.page-flexible-block-simple-image-sub-images {display: flex; flex-wrap: wrap; align-items: center; justify-content: center;}
.page-flexible-block-simple-image-sub-images img {width: 48%; margin-bottom: 1rem;}
.page-flexible-block-simple-image-sub-images img:nth-child(odd) { margin-right: 4%; }

@media (max-width: 639px) {
    .page-flexible-block-simple-inner.x-position-left .page-flexible-block-simple-image:nth-child(2),
    .page-flexible-block-simple-inner.x-position-right .page-flexible-block-simple-image:nth-child(2) {margin: 0;}
    .page-flexible-block-simple-inner.x-position-left,.page-flexible-block-simple-inner.x-position-right {flex-wrap: wrap;}
    .page-flexible-block-simple-inner.x-position-left .page-flexible-block-simple-image,
    .page-flexible-block-simple-inner.x-position-left .page-flexible-block-simple-description,
    .page-flexible-block-simple-inner.x-position-right .page-flexible-block-simple-image,
    .page-flexible-block-simple-inner.x-position-right .page-flexible-block-simple-description { flex-basis: 100%; }
}

/**
 * LAYOUT アイキャッチ (eyecatch)
 */
.page-flexible-block-eyecatch {display: flex; width: calc(100% + 20px); margin: 0 auto -40px;} /* max-width: calc(100% + 20px); height: 30vw; テキストが長いときに、テキストがBOXからはみ出てしまうので一旦削除*/ /* margin: 0 -20px -40px; ブロックが真ん中に来ないので変更*/ /* 採用ページのトップメッセージでこれらを変更 */
.page-flexible-block-eyecatch-image {height: 100%; flex-basis: 35%; flex-grow: 1;}
.page-flexible-block-eyecatch-image img {width: 100%; height: 100%; object-fit: cover;}
.page-flexible-block-eyecatch-body {display: flex; flex-direction: column; justify-content: center; height: 100%; padding: 20px 50px; flex-basis: 65%; flex-grow: 1;}
.page-flexible-block-eyecatch-title {width: 100%; font-size: 2em;}
.page-flexible-block-eyecatch-description {width: 100%;}
.page-flexible-block-eyecatch-title + .page-flexible-block-eyecatch-description {margin-top: 1em;}

@media (max-width: 615px) {
    .page-flexible-block-eyecatch {flex-wrap: wrap; height: auto; margin: -40px -10px;}
    .page-flexible-block-eyecatch-image, .page-flexible-block-eyecatch-body {flex-basis: 100%;}
    .page-flexible-block-eyecatch-body {padding: 20px 40px;}
    .page-flexible-block-eyecatch-title {font-size: 1.66rem;}
}

/**
 * LAYOUT サークルリスト (circles)
 */
.page-flexible-block-circles {}
.page-flexible-block-circles-lead {max-width: 900px ; margin: 0 auto;}
.page-flexible-block-circles-items {display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; margin: 2rem 0;}
.page-flexible-block-circles-item {display: flex; justify-content: center; align-items: center; font-size: 1.2rem; font-weight: 600; text-align: center; margin: .5rem 1rem; position: relative;}
.page-flexible-block-circles-cols-3 .page-flexible-block-circles-item {flex-basis: 27%; margin: 1rem 1.5rem;}
.page-flexible-block-circles-cols-4 .page-flexible-block-circles-item {flex-basis: 25%; margin: 1rem 1.5rem;}
.page-flexible-block-circles-cols-5 .page-flexible-block-circles-item {flex-basis: 20%;}
.page-flexible-block-circles-cols-6 .page-flexible-block-circles-item {flex-basis: 15%;}
.page-flexible-block-circles-item .item-inwrap {width: 100%; padding-top: 100%; background: #34738C; border-radius: 50%; transition: .3s;}
.page-flexible-block-circles-item.target .item-inwrap {background: #d70;}
.page-flexible-block-circles-item a.item-inwrap:hover {background-color: #d70;}
.page-flexible-block-circles-item.target a.item-inwrap:hover {opacity: .8;}
.page-flexible-block-circles-item .page-flexible-block-circles-item-text {position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: flex; align-items: center; justify-content: center; color: #FFF; font-size: 1.7rem; line-height: 2.2rem; letter-spacing: .07rem; word-break: break-word; padding: 0 1rem;}
.page-flexible-block-circles-note {max-width: 900px ; margin-top: 1em; margin-left: auto; margin-right: auto; font-size: 1rem;}

@media (max-width: 1200px) {
    .page-flexible-block-circles-items {flex-wrap: wrap;}
    .page-flexible-block-circles-cols-3 .page-flexible-block-circles-item {flex-basis: 25%;}
    .page-flexible-block-circles-cols-4 .page-flexible-block-circles-item {flex-basis: 25%;}
    .page-flexible-block-circles-cols-5 .page-flexible-block-circles-item {flex-basis: 20%;}
    .page-flexible-block-circles-cols-6 .page-flexible-block-circles-item {flex-basis: 20%;}
}
@media (max-width: 900px) {
    .page-flexible-block-circles-cols-3 .page-flexible-block-circles-item {flex-basis: 25%; font-size: .9rem; margin: .5rem 1rem;}
    .page-flexible-block-circles-cols-4 .page-flexible-block-circles-item {flex-basis: 25%; font-size: .9rem; margin: .5rem 1rem;}
    .page-flexible-block-circles-cols-5 .page-flexible-block-circles-item {flex-basis: 25%; font-size: 1rem;}
    .page-flexible-block-circles-cols-6 .page-flexible-block-circles-item {flex-basis: 25%; font-size: 1rem;}
}
@media (max-width: 615px) {
    .page-flexible-block-circles-items {flex-wrap: wrap;}
    .page-flexible-block-circles-cols-3 .page-flexible-block-circles-item {flex-basis: 40%;}
    .page-flexible-block-circles-cols-4 .page-flexible-block-circles-item {flex-basis: 40%;}
    .page-flexible-block-circles-cols-5 .page-flexible-block-circles-item {flex-basis: 40%;}
    .page-flexible-block-circles-cols-6 .page-flexible-block-circles-item {flex-basis: 40%;}
}

/**
 * LAYOUT タブリスト (tabs)
 */
.page-flexible-block-tabs {}
.page-flexible-block-tabs-lead {max-width: 900px ; margin: 0 auto;}
.page-flexible-block-tabs-items {display: flex; align-items: center; justify-content: center;}
.page-flexible-block-tabs-item {display: flex; justify-content: center; align-items: center; font-size: 1.2rem; font-weight: 600; text-align: center; margin: .5rem 1rem; position: relative;}
.page-flexible-block-tabs-cols-3 .page-flexible-block-tabs-item {flex-basis: 38%; margin: 1rem 1.5rem;}
.page-flexible-block-tabs-cols-4 .page-flexible-block-tabs-item {flex-basis: 36%; margin: 1rem 1.5rem;}
.page-flexible-block-tabs-cols-5 .page-flexible-block-tabs-item {flex-basis: 34%;}
.page-flexible-block-tabs-cols-6 .page-flexible-block-tabs-item {flex-basis: 32%;}
.page-flexible-block-tabs-item .item-inwrap {width: 100%; color: #34738C; text-decoration: none;}
.page-flexible-block-tabs-item.target .item-inwrap {color: #d70;}
.page-flexible-block-tabs-item a.item-inwrap:hover {color: #d70;}
.page-flexible-block-tabs-item.target a.item-inwrap:hover {opacity: .8;}
.page-flexible-block-tabs-item .page-flexible-block-tabs-item-text {position:relative; text-align: left; border-bottom: 1px solid #e6e6e6;}
.page-flexible-block-tabs-item .page-flexible-block-tabs-item-text > i {position: absolute; top: 50%; right: 2%; transform: translateY(-50%);}
.page-flexible-block-tabs-note {max-width: 900px ; margin-top: 1em; margin-left: auto; margin-right: auto; font-size: 1rem;}
.is-none {display: none;}
@media (max-width: 1200px) {
    .page-flexible-block-tabs-items {flex-wrap: wrap;}
    .page-flexible-block-tabs-cols-3 .page-flexible-block-tabs-item {flex-basis: 25%;}
    .page-flexible-block-tabs-cols-4 .page-flexible-block-tabs-item {flex-basis: 25%;}
    .page-flexible-block-tabs-cols-5 .page-flexible-block-tabs-item {flex-basis: 20%;}
    .page-flexible-block-tabs-cols-6 .page-flexible-block-tabs-item {flex-basis: 20%;}
}
@media (max-width: 900px) {
    .page-flexible-block-tabs-cols-3 .page-flexible-block-tabs-item {flex-basis: 25%; font-size: .9rem; margin: .5rem 1rem;}
    .page-flexible-block-tabs-cols-4 .page-flexible-block-tabs-item {flex-basis: 25%; font-size: .9rem; margin: .5rem 1rem;}
    .page-flexible-block-tabs-cols-5 .page-flexible-block-tabs-item {flex-basis: 25%; font-size: 1rem;}
    .page-flexible-block-tabs-cols-6 .page-flexible-block-tabs-item {flex-basis: 25%; font-size: 1rem;}
}
@media (max-width: 615px) {
    .page-flexible-block-tabs-items {flex-wrap: wrap;}
    .page-flexible-block-tabs-cols-3 .page-flexible-block-tabs-item {flex-basis: 40%;}
    .page-flexible-block-tabs-cols-4 .page-flexible-block-tabs-item {flex-basis: 40%;}
    .page-flexible-block-tabs-cols-5 .page-flexible-block-tabs-item {flex-basis: 40%;}
    .page-flexible-block-tabs-cols-6 .page-flexible-block-tabs-item {flex-basis: 40%;}
}

/**
 * LAYOUT カードリスト (cards)
 */
.page-flexible-block-cards-lead {max-width: 900px; margin-bottom: 1rem; margin-left: auto; margin-right: auto;}
.page-flexible-block-cards-items {display: flex; flex-wrap: wrap; justify-content: flex-start;}
.page-flexible-block-cards-item {width: 100%; background: #EEE; margin: 0 20px 20px; flex-basis: 45%;}
.page-flexible-block-cards-item > a {width: 100%; height: 100%; display: block; text-decoration: none !important; color: inherit; position: relative;}
.page-flexible-block-cards-item > a:hover {opacity: .6;}
.page-flexible-block-cards-item > a > i {position: absolute; top: .5rem ; right: .5rem ; color: #585858; background: rgb(255 255 255 / 60%); padding: .3rem ; border: 1px solid #b1b1b1; border-radius: 5px ;}

    /* １行に並ぶitem数 */
    .page-flexible-block-cards-cols-3 .page-flexible-block-cards-item { flex-basis: 29%; }
    .page-flexible-block-cards-cols-4 .page-flexible-block-cards-item { flex-basis: 21%; }
.page-flexible-block-cards-item-image {background: #FFF;}
.page-flexible-block-cards-item-image img {width: 100%; height: auto; max-height: 300px; object-fit: contain;}
.page-flexible-block-cards-item-title {padding: 1rem; font-size: 1.3rem; font-weight: bold; text-align: center;}
.page-flexible-block-cards-item-description {padding: 1rem;}
.page-flexible-block-cards-item-title + .page-flexible-block-cards-item-description {margin-top: -1rem;}
.page-flexible-block-cards-note {max-width: 900px; margin-top: 1em; margin-left: auto; margin-right: auto; font-size: 1rem;}

.page-flexible-section-even .page-flexible-block-cards-item {background: #FFF;}
.page-flexible-section-even .page-flexible-block-cards-item-image {/* background: #EEE; */}

@media (max-width: 900px) {
    .page-flexible-block-cards-items {display: block;}
    .page-flexible-block-cards-item {max-width: 600px; margin: 0 auto 20px;}
    .page-flexible-block-cards-item > a {height: auto;}
}

@media (max-width: 639px) {
    .page-flexible-block-cards-item {max-width: 85%;}
}

/**
 * LAYOUT 段落リスト（画像） (paragraph)
 */
.page-flexible-block-paragraph-items {max-width: 900px; margin-left: auto; margin-right: auto;}
.page-flexible-block-paragraph-item {margin-bottom: 5em;}
.page-flexible-block-paragraph-item:last-child {margin-bottom: 0;}
.page-flexible-block-paragraph-item-title {margin-bottom: 1.6em; text-align: center; font-size: 1.3rem; font-weight: bold; line-height: 1.4em;}
.page-flexible-block-paragraph-item-image {margin-bottom: 1em; text-align: center;}
.page-flexible-block-paragraph-item-image img {max-width: 90%; height: auto;}
.page-flexible-block-paragraph-item-image-twin {margin-bottom: 1em; text-align: center;}
.page-flexible-block-paragraph-item-image-twin img {max-width: 44%; height: auto;}
.page-flexible-block-paragraph-item-description {margin-bottom: 1em;}

@media (max-width: 639px) {
    .page-flexible-block-paragraph-item-image-twin img {max-width: 90%;}
    .page-flexible-block-paragraph-item-image-twin img:first-child {margin-bottom: 1em;}
}

/**
 * LAYOUT 段落リスト （横組み）(paragraph-horizontal)
 */
.page-flexible-block-paragraph-horizontal-items {max-width: 900px; margin-left: auto; margin-right: auto;}
.page-flexible-block-paragraph-horizontal-item {margin-bottom: 3em;}
.page-flexible-block-paragraph-horizontal-item:last-child {margin-bottom: 0;}
.page-flexible-block-paragraph-horizontal-item-row {display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; gap: 1.5rem;}
/* 各行タイトル */
.page-flexible-block-paragraph-horizontal-item-row-title {border-bottom: 1px solid #555; font-size: 1.2rem; color: #333; padding: 0.5rem 1rem 0 0; margin-bottom: .5rem; position: relative;}
/* 小見出しタイプ */
.type-text .page-flexible-block-paragraph-horizontal-item-row {gap: 3; align-items: center;}
.type-text .page-flexible-block-paragraph-horizontal-item-title-wrap {flex: 1; position: relative; overflow: hidden;}
.type-text .page-flexible-block-paragraph-horizontal-item-title-wrap::before {content: ""; padding-top: 100%; display: block;}
.type-text .page-flexible-block-paragraph-horizontal-item-title {position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: #EEE; border-radius: 50%; font-size: 1.2rem; text-align: center; line-height: 1.4em; padding: 0 0.5rem; margin: 0; }
.type-text .page-flexible-block-paragraph-horizontal-item-description {flex: 3;}
.page-flexible-section-even .type-text .page-flexible-block-paragraph-horizontal-item-title {background: #fff;}
/* 画像タイプ */
.type-image .page-flexible-block-paragraph-horizontal-item-row {gap: 4rem; align-items: center;}
.type-image .page-flexible-block-paragraph-horizontal-item-title-wrap {flex: 1; margin: 0.5rem 0; overflow: hidden; position: relative;}
.type-image .page-flexible-block-paragraph-horizontal-item-title-wrap::before { content: ""; padding-top: 100%; display: block; }
.type-image .page-flexible-block-paragraph-horizontal-item-title { width: 100%; height: 100%; position: absolute; top: 0; left: 0; object-fit: cover; border-radius: 50%; overflow: hidden; }
.type-image .page-flexible-block-paragraph-horizontal-item-title img { height: 100%; width: 100%; object-fit: cover; }
.type-image .page-flexible-block-paragraph-horizontal-item-description-wrap {flex: 2; display: flex; align-items: center;}
/* 画像+注釈タイプ */
.type-annotation .page-flexible-block-paragraph-horizontal-item-title-wrap {flex: 1; position: relative; display: flex; align-items: center;}
.type-annotation .page-flexible-block-paragraph-horizontal-item-title img {width: 100%; height: auto;}
.type-annotation .page-flexible-block-paragraph-horizontal-item-description-wrap {flex: 2;}
.page-flexible-block-paragraph-horizontal-item-description-wrap .page-flexible-block-paragraph-horizontal-item-description {width: 100%;}
.page-flexible-block-paragraph-horizontal-item-annotations.has_description {padding-top: 0.5rem; border-top: 1px solid #bbb;}
.page-flexible-block-paragraph-horizontal-item-annotation-row {margin-bottom: 0.4rem; font-size: .85rem; display: flex;}
.page-flexible-block-paragraph-horizontal-item-annotation-row-title {display: flex; align-items: center; justify-content: center; background-color: #666; border-radius: 5px; color: #fff; padding: 0.15rem; margin-right: 0.5rem; min-width: 15%; text-align: center; font-size: .75rem;}

@media (max-width: 930px) {
    /* 小見出しタイプ */
    .type-text .page-flexible-block-paragraph-horizontal-item-title {font-size: 1.1rem;}
    /* 画像タイプ */
    .type-image .page-flexible-block-paragraph-horizontal-item-row {gap: 3rem;}
}
@media (max-width: 680px) {
    .page-flexible-block-paragraph-horizontal-item {display: block;}
    .page-flexible-block-paragraph-horizontal-item-description-wrap {width: 100%;}
    .page-flexible-block-paragraph-horizontal-item-description {width: 90%;}
    /* 小見出しタイプ */
    .type-text .page-flexible-block-paragraph-horizontal-item-row {flex-direction: column; gap: 1.5rem;}
    .type-text .page-flexible-block-paragraph-horizontal-item-title-wrap {width: 33%; min-width: 150px;}
    .type-text .page-flexible-block-paragraph-horizontal-item-title {font-size: 1rem;}
    /* 画像タイプ */
    .type-image .page-flexible-block-paragraph-horizontal-item-row {flex-direction: column; align-items: center; gap: .5rem;}
    .type-image .page-flexible-block-paragraph-horizontal-item-title-wrap {width: 40%; min-width: 200px;}
    /* 画像+注釈タイプ */
    .type-annotation .page-flexible-block-paragraph-horizontal-item-row {flex-direction: column; gap: .5rem;}
    .type-annotation .page-flexible-block-paragraph-horizontal-item-title-wrap {width: 100%;}
    .type-annotation .page-flexible-block-paragraph-horizontal-item-title {width: 80%; margin: 0 auto;}
    .page-flexible-block-paragraph-horizontal-item-annotation-row-title {min-width: 30%;}
}
@media (max-width: 480px) {
    /* 小見出しタイプ */
    .type-text .page-flexible-block-paragraph-horizontal-item-title {font-size: 1rem;}
    /* 画像+注釈タイプ */
    .type-annotation .page-flexible-block-paragraph-horizontal-item-title {width: 100%;}

}

/**
 * LAYOUT 表 （縦組み）(table-vertical)
 */
.page-flexible-block-table-vertical-rows {max-width: 900px; margin-left: auto; margin-right: auto; border-top: 1px solid #CCC;}
.page-flexible-block-table-vertical-rows-width-100p {width: 100%;}
.page-flexible-block-table-vertical-rows-width-80p {width: 80%;}
.page-flexible-block-table-vertical-rows-width-70p {width: 70%;}
.page-flexible-block-table-vertical-rows-width-60p {width: 60%;}
.page-flexible-block-table-vertical-rows-width-50p {width: 50%;}
.page-flexible-block-table-vertical-rows-width-40p {width: 40%;}
.page-flexible-block-table-vertical-row {display: flex; flex-wrap: wrap; align-items: stretch;}
.page-flexible-block-table-vertical-row-head {display: flex; align-items: center; flex-basis: 30%; padding: 15px; background: #000; color: #FFF; border-bottom: 1px solid #CCC; border-right: 1px solid #CCC;}
.page-flexible-block-table-vertical-row-body {display: flex; align-items: center; flex-basis: 70%; padding: 15px; border-bottom: 1px solid #CCC; border-right: 1px solid #CCC;}
.page-flexible-block-table-vertical-note { font-size: .95rem; margin: 1rem 0; }
.page-flexible-section-even .page-flexible-block-table-vertical-row-body {background-color: #fff;}

@media (max-width: 680px) {
    .page-flexible-block-table-vertical-row-head {flex-basis: 100%;}
    .page-flexible-block-table-vertical-row-body {flex-basis: 100%;}
}

/**
 * LAYOUT 動画 (movie)
 */

.page-flexible-block-movie-inner {display: flex;}
.page-flexible-block-movie-main {flex-basis: 60%; flex-grow: 1; max-width: 80%; margin: 0 auto;}
.page-flexible-block-movie-main.w100p {max-width: 100%;}
.page-flexible-block-movie-main.w75p {max-width: 75%;}
.page-flexible-block-movie-main.w50p {max-width: 50%;}
.page-flexible-block-movie-main-frame {position: relative; width: 100%; height: 0; margin: 0 auto; padding-top: 56.25%; box-sizing: content-box;}
.page-flexible-block-movie-main-frame iframe {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.page-flexible-block-movie-chapters {flex-basis: 35%; flex-grow: 1; padding: 20px;}
.page-flexible-block-movie-chapter a {color: #0082a9;}
.page-flexible-block-movie-chapter a:hover {color: #D70;}

@media (max-width: 639px) {
    .page-flexible-block-movie-inner {display: block;}
    .page-flexible-block-movie-main { max-width: 100%; }
    .page-flexible-block-movie-main.w100p, .page-flexible-block-movie-main.w75p, .page-flexible-block-movie-main.w50p {max-width: 100%;}
}

/**
 * LAYOUT 複数動画 (movies)
 */

.page-flexible-block-movies-inner {display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem 2%;}
.page-flexible-block-movies-inner .page-flexible-block-movie-main {margin: 0;}
.page-flexible-block-movies-inner .page-flexible-block-movie-main.w50p {max-width: 49%;}
.page-flexible-block-movies-inner .page-flexible-block-movie-title {color: #333; margin-top: 0.5rem; text-align: center; font-size: 1rem; font-weight: bold; line-height: 1.4em;}

@media (max-width: 639px) {
    .page-flexible-block-movie-inner {display: block;}
    .page-flexible-block-movies-inner .page-flexible-block-movie-main { max-width: 100%; margin: 0 auto; };
    .page-flexible-block-movies-inner .page-flexible-block-movie-main.w50p,
    .page-flexible-block-movies-inner .page-flexible-block-movie-main.w75p {max-width: 100%;}
}

/*
 * フロー図 ※productと同じHTML・CSS構造
 */
.page-flexible-block-flow-lead { max-width: 900px ; margin-bottom: 1rem ; margin-left: auto; margin-right: auto; }
.page-flexible-block-flow-items, .page-flexible-block-flow-note { max-width: 900px ; margin-left: auto; margin-right: auto; }
.page-flexible-block-flow-item { display: flex; align-items: stretch; margin-bottom: 3rem ; position: relative; }
.page-flexible-block-flow-item::after { position: absolute; bottom: -6rem ; left: 0; right: 0; margin: auto; content: ""; vertical-align: middle; box-sizing: border-box; width: 60px ; border: 60px solid transparent; border-top: 25px solid #0082a9; }
.page-flexible-block-flow-item:last-child {margin-bottom: 0;}
.page-flexible-block-flow-item:last-child::after {content: none;}
.page-flexible-block-flow-item-title { flex-basis: 25%; color: #fff; background: #0082a9; padding: 1rem; display: flex; align-items: center; justify-content: center; }
.page-flexible-block-flow-item-title.has_badge {min-height: 6rem;}
.page-flexible-block-flow-item-title-badge { position: absolute; top: .5rem ; left: .5rem ; border: 1px solid #fff; font-size: .8rem; font-weight: normal; line-height: 1.4rem; padding: 0 .3rem ; }
.page-flexible-block-flow-item-text-wrap { font-size: 1rem; line-height: 1.5rem; flex-basis: 75%; position: relative; padding: 1rem 1rem 1rem 5%; display: flex; flex-wrap: wrap; align-items: center; background-color: #f2f6f7; }
.page-flexible-block-flow-item-text-wrap::before {content: ''; display: block; position: absolute; left: 0; bottom: 0; width: 5%; height: 100%; background-image: linear-gradient(to top left, transparent, transparent 50%, #0082a9 50%, #0082a9); }
.page-flexible-block-flow-item-text, .page-flexible-block-flow-item-link {flex-basis: 100%;}
.page-flexible-block-flow-item-link {text-align: right; margin-top: .5rem;}
.page-flexible-block-flow-note {font-size: .95rem; margin-top: 1rem;}
.page-flexible-block-flow-note a {transition: .3s;}
.page-flexible-block-flow-note a:hover {color: #D70;}

/*
 * リスト ※productと同じHTML・CSS構造
 */
.page-flexible-block-list {max-width: 900px;}
.page-flexible-list { counter-reset: list; }
/*.page-flexible-list ul, .page-flexible-list ol { margin: 0 0 0 1.5rem; }*/
/* .page-flexible-list-title { font-size: 17px; font-weight: 800; display: inline-block; line-height: 1.2rem; margin: 0 0 .5rem; padding: 10px 20px; background: #eee; } */
.page-flexible-list-item-wrap {margin: 1.5rem 0;}
.page-flexible-list-item-content { display: flex; justify-content: space-between; align-items: flex-start; padding: 0; }
.page-flexible-list-item-text { display: flex; align-items: center; margin-right: .5rem; }
.page-flexible-list-item-button { min-width: 140px; max-width: 250px; margin: 0 0 0 1rem; text-align: right; }
.page-flexible-list-item { position: relative; display: flex; flex-direction: column; }
.page-flexible-list-item-title { font-size: 1.2rem; font-weight: 700; display: flex; flex: 1; align-items: center; }
/* list 番号なしul */
    /* 1 */
    .page-flexible-list.x-pattern-1 ul .page-flexible-list-item { padding: .5rem 0 .5rem 2rem; border-bottom: dashed 1px #333; }
    .page-flexible-list.x-pattern-1 ul .page-flexible-list-item:before { content: ""; display: block; position: absolute; display: inline-block; background: #333; border-radius: 50%; left: .5rem; width: .5rem; height: .5rem; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
    /* 2 */
    .page-flexible-list.x-pattern-2 ul .page-flexible-list-item { border-left: 6px solid #0082a9; background: #eee; padding: 15px 15px 20px; margin: 0 0 .5rem; min-height: 3rem; display: flex; flex-direction: column; }
    .page-flexible-section-even .page-flexible-list.x-pattern-2 ul .page-flexible-list-item { background: #fff; }
    .page-flexible-list.x-pattern-2 ul .page-flexible-list-item-title {color: #0082a9; margin: 0 0 .5rem; font-weight: 800; letter-spacing: .1rem;}
    /* 3 */
    .page-flexible-list.x-pattern-3 ul .page-flexible-list-item { padding-left: 2rem; margin-bottom: 2rem; }
    .page-flexible-list.x-pattern-3 ul .page-flexible-list-item:before { content: ""; display: block; position: absolute; left: 0; height: 1.3rem; width: 1.3rem; background: #0082a9; top: 50%; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

/* list 番号付きol */
.page-flexible-list ol .page-flexible-list-item:before { counter-increment: list; content: counter(list); }
    /* 1 */
    .page-flexible-list.x-pattern-1 ol .page-flexible-list-item { padding: .5rem 0 .5rem 2.5rem; border-bottom: dashed 1px #333;}
    .page-flexible-list.x-pattern-1 ol .page-flexible-list-item:before { position: absolute; font-size: 1.3rem; font-weight: bold; margin: 0 auto 0; left: .5rem; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
    /* 2 */
    .page-flexible-list.x-pattern-2 ol .page-flexible-list-item { background: #eee; margin: 0 0 .5rem; min-height: 3rem; display: flex; justify-content: center; border: none; padding: 1rem 1rem 1rem 3rem;}
    .page-flexible-section-even .page-flexible-list.x-pattern-2 ol .page-flexible-list-item { background: #fff; }
    .page-flexible-list.x-pattern-2 ol .page-flexible-list-item:before { position: absolute; color: #fff; top: 0; bottom: 0; left: 0; width: 2.5rem; margin: 0 auto 0; font-weight: bold; background: #0082a9; display: flex; align-items: center; justify-content: center; }
    .page-flexible-list.x-pattern-2 ol .page-flexible-list-item-content {align-items: center;}
    .page-flexible-list-item-title + .page-flexible-list-item-content {}
    /* 3 */
    .page-flexible-list.x-pattern-3 ol .page-flexible-list-item { padding-left: 2.5rem; margin-bottom: 2rem; }
    .page-flexible-list.x-pattern-3 ol .page-flexible-list-item:before { position: absolute; display: inline-block; background: #66ABC1; color: #fff; font-weight: bold; font-size: 1rem; border-radius: 50%; left: 0; width: 1.8rem; height: 1.8rem; line-height: 1.8rem; text-align: center; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
/* リスト行に一つでもタイトルがあれば */
.page-flexible-list-has-titles{ /*padding-left: 25px; */}
.page-flexible-list-has-titles .page-flexible-list-item { flex-direction: row; }
/* .page-flexible-list-has-titles.page-flexible-list.x-pattern-2 .page-flexible-list-item { justify-content: center; } */
.page-flexible-list-has-titles .page-flexible-list-item-content { flex: 3; }

@media (max-width: 800px) {
    .page-flexible-list-item-content { flex-direction: column; }
    .page-flexible-list .page-flexible-list-item-button { max-width: 100%; width: 100%; margin: .2rem 0 0; }
    .page-flexible-list-title { margin: 0 0 1rem; }
    .page-flexible-list ul, .page-flexible-list ol { margin: 0 1rem; }
    /* 2 */
    .page-flexible-list.x-pattern-2 .page-flexible-list-item-button a { margin-right: .2rem; }
}
@media (max-width: 480px) {
    .page-flexible-list ul, .page-flexible-list ol { margin: 0; padding: 0; }
    .page-flexible-list-item-title { flex: 2; }
    /* 1 */
    .page-flexible-list.x-pattern-1 ul .page-flexible-list-item,
    .page-flexible-list.x-pattern-1 ol .page-flexible-list-item { padding-left: 1rem; }
    .page-flexible-list.x-pattern-1 ul .page-flexible-list-item:before,
    .page-flexible-list.x-pattern-1 ol .page-flexible-list-item:before { left: 0; }
    /* 2 */
    .page-flexible-list.x-pattern-2 .page-flexible-list-item { padding-left: .5rem; }
    .page-flexible-list.x-pattern-2 ol .page-flexible-list-item { padding-left: 2.5rem; }
    .page-flexible-list.x-pattern-2 ol .page-flexible-list-item:before { width: 2rem; }
    /* 3 */
    .page-flexible-list.x-pattern-3 ul .page-flexible-list-item { padding-left: 1.5rem; }
    .page-flexible-list.x-pattern-3 ul .page-flexible-list-item:before { height: 1rem; width: 1rem; }
    .page-flexible-list.x-pattern-3 ol .page-flexible-list-item { padding-left: 2rem; }
    .page-flexible-list.x-pattern-3 ol .page-flexible-list-item:before { font-size: .95rem; width: 1.4rem; height: 1.4rem; line-height: 1.4rem; }
}

/*
 * link button  ※productと同じHTML・CSS構造
 */
.page-flexible-link-button-buttons { display: flex; flex-wrap: nowrap; margin-right: -1rem; }
.page-flexible-link-button-align-left { justify-content: flex-start; }
.page-flexible-link-button-align-right { justify-content: flex-end; }
.page-flexible-link-button-align-center { justify-content: center; }
.page-flexible-link-button-align-space-between { justify-content: space-between; }
.page-flexible-link-button-align-space-around { justify-content: space-around; }
.page-flexible-link-button-item { margin-right: 1rem; }
/*.page-flexible-link-button-item a { display: inline-block; color: #fff; font-size: .9rem; text-decoration: none; text-align: center; padding: .7rem 1.2rem; }*/
.page-flexible-link-button-item a {
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
    padding: 15px 30px;
    transition: .3s;
    text-align: center;
    background: #66ABC1;
    text-decoration: none;
    color: #FFF;
    border-radius: 5px;
}
.page-flexible-link-button-item a:hover{
	background: #d70;
    cursor: pointer;
}
@media (max-width: 600px) {
    .page-flexible-link-button-buttons { flex-wrap: wrap; }
    .page-flexible-link-button-item { margin: 0 1rem 1rem 0; }
}

/**
 * LAYOUT フリーエディタ (free)
 */
.page-flexible-block-free-html {width: 100%; max-width: 900px; margin-left: auto; margin-right: auto;}

/**
 * LAYOUT レスポンスデバイス (response)
 */

.page-flexible-block-response-lead {margin: 2rem 0 1rem; text-align: center;}
.page-flexible-block-response-lead-box {position: relative; display: inline-block; margin: 0 40px; padding: 0 50px; font-size: 2em;}
.page-flexible-block-response-lead-box::before {content: ""; display: block; position: absolute; left: 0; top: 0; width: 3px; height: 100%; background: #333; transform: rotate(-45deg);}
.page-flexible-block-response-lead-box::after {content: ""; display: block; position: absolute; right: 0; top: 0; width: 3px; height: 100%; background: #333; transform: rotate(45deg);}

.page-flexible-block-response-buttons {display: flex; flex-wrap: wrap; justify-content: space-around;}
.page-flexible-block-response-button {display: block; text-align: center; background: #001; text-decoration: none; color: #FFF; font-size: 1.5em; border-radius: 5px; transition: all .3s;}
.page-flexible-block-response-buttons.x-buttons-1 a {width: 70%; padding: 30px;}
.page-flexible-block-response-buttons.x-buttons-2 a {width: 40%; padding: 20px;}
.page-flexible-block-response-buttons.x-buttons-3 a {width: 30%; padding: 15px;}
.page-flexible-block-response-buttons.x-buttons-4 a {width: 22%; padding: 15px 10px;}
.page-flexible-block-response-buttons a:hover {cursor: pointer;}
.page-flexible-block-response-button.x-button-black {background: #001;}
.page-flexible-block-response-button.x-button-orange {background: #D70;}
.page-flexible-block-response-button.x-button-orange:hover {background: #000;}
.page-flexible-block-response-button.x-button-blue {background: #66ABC1;}
.page-flexible-block-response-button.x-button-blue:hover {background: #000;}
.page-flexible-block-response-note {max-width: 900px; margin-top: 1.5em; margin-left: auto; margin-right: auto; text-align: center;}

@media (max-width: 639px) {
    .page-flexible-block-response-buttons.x-buttons-1 a,
    .page-flexible-block-response-buttons.x-buttons-2 a,
    .page-flexible-block-response-buttons.x-buttons-3 a,
    .page-flexible-block-response-buttons.x-buttons-4 a {width: 80%; margin-bottom: 15px; padding: 15px;}
}

/**
 * PART : Wysiwyg
 */
.page-flexible-part-wysiwyg h2 {font-size: 2em; margin-top: 1.5em; margin-bottom: 0.5em;}
.page-flexible-part-wysiwyg h3 {font-size: 1.5em; margin-top: 1.5em; margin-bottom: 0.5em;}
.page-flexible-part-wysiwyg h4 {font-size: 1.2em; margin-top: 1.5em; margin-bottom: 0.5em;}
.page-flexible-part-wysiwyg h2:first-child,
.page-flexible-part-wysiwyg h3:first-child,
.page-flexible-part-wysiwyg h4:first-child {margin-top: 0;}
.page-flexible-part-wysiwyg p {margin-bottom: 0.5em; clear: both;}
.page-flexible-part-wysiwyg strong {font-weight: 600;}
.page-flexible-part-wysiwyg img {max-width: 100%; height: auto;}
.page-flexible-part-wysiwyg .aligncenter {display: block; margin: auto;}
.page-flexible-part-wysiwyg .alignleft {float: left; margin-right: 1em;}
.page-flexible-part-wysiwyg .alignright {float: right; margin-left: 1em;}
.page-flexible-part-wysiwyg::after {content: ""; display: block; clear: both;}
.page-flexible-part-wysiwyg ul, .page-flexible-part-wysiwyg ol {font-size: 1.1rem; padding: 0; margin: 0 0 20px ; list-style: none; }
.page-flexible-part-wysiwyg ul li, .page-flexible-part-wysiwyg ol li { padding: 0.5rem 0; position: relative; }
.page-flexible-part-wysiwyg ul li {padding-left: 1.2rem; text-indent: -1.2rem;}
.page-flexible-part-wysiwyg ul li::before {font-family: 'FontAwesome'; content: "\f111"; font-size: 18px; line-height: 1.8; color: #0082a9; margin-right: 0.3rem; top: 0; left: 0; position: relative;}
.page-flexible-part-wysiwyg ol li { padding-left: 2rem; counter-increment: li; }
.page-flexible-part-wysiwyg ol li::before { content: counter(li); position: absolute; top: .7rem ; left: 0; width: 25px ; height: 25px ; line-height: 25px; background: #000; border-radius: 4px ; color: #fff; text-align: center; font-size: 15px; }
.page-flexible-part-wysiwyg a {color: #0082a9;}
.page-flexible-part-wysiwyg a:hover {color: #D70;}
.page-flexible-part-wysiwyg a:hover img {opacity: .75;}

/* 下記はeditor-style.css, product.css, style.cssも変更要 */
.wysiwyg-h4 {color: #0082a9; font-size: 1.2rem; font-weight: 600; margin-top: 1.5em; margin-bottom: 0.5em;}
.wysiwyg-uppercase {font-size: 1.4rem;}
.wysiwyg-primary {color: #df3400; font-weight: 500; }
.wysiwyg-small {font-size: .9rem; }

@media screen and (max-width: 680px) {
    .page-flexible-part-wysiwyg .alignleft {float: none; display: block; margin: auto;}
    .page-flexible-part-wysiwyg .alignright {float: none; display: block; margin: auto;}
    .page-flexible-part-wysiwyg p {text-align: left;}
    li .wysiwyg-uppercase {
        font-size: 1rem !important;
        line-height: 1.5rem;
    }
}

@media (max-width: 770px) {
    .page-flexible-block-response-lead-box {padding: 0 20px !important; font-size: 1em !important;}
}