@charset "utf-8";

/*--------------------------------------------------------
目次
--------------------------------------------------------
1. テーマ情報
2. ルート変数
3. タイポグラフィとフォント設定
   -- for Apple
4. for Apple
5. テキスト要素のスタイル
6. ブロックエディタのデフォルト設定とレイアウト・ブレークポイントを合わせる
7. コンテナのスタイル
8. 下層ページメインビジュアル
9. パンクズリストのスタイル
10. 見出しのスタイル
11. オリジナルブロックのスタイル
12. フッターのスタイル
13. SNSリンク
14. トップに戻るボタン
15. モバイルナビボタン
16. モバイルナビ
17. ロゴ
18. サイトヘッダー
19. ブログ関連のスタイル
20.トップページメインビジュアル
21.スマホ用下部固定メニュー
22.スクロールヒント
--------------------------------------------------------*/

/*--------------------------------------------------------
1. テーマ情報
--------------------------------------------------------*/
/*
Theme Name: crese2026
Theme URI:
Template: lightning
Description:
Author:
Tags:
Version: 
*/

/*--------------------------------------------------------
2. ルート変数
--------------------------------------------------------*/
:root {
    /*白は #fff 線は #cccとする*/
    
    --vk-color-text-body: #2e4350;
    --vk-color-text-link: #00acd8;
    --vk-color-text-link-hover: #004283;
    --vk-color-border-hr: #ccc;
    --vk-color-primary: #004283;
    --vk-color-primary-vivid: #00acd8;
    --vk-size-text: 18px;
    --vk-size-radius: 10px;
    
    /*背景色*/
    --bg: #f6fafb;
    --bg-dark: #2e4350;
    --bg-light: #eaeef1;
    
    --gray: #7e869b;
    --orange: #ef8a0a;
    
    /*ヘッダーの高さ*/
    --header-height: 40px;
    /*ボックスシャドウ（ボタン）*/
    --box-shadow: 0 4px 9px rgba(167, 173, 183, 0.7);
    /*トランジション（ボタン）*/
    --transition: all 0.3s ease;
}

@media print, screen and (min-width: 992px) {
    :root {
        /*ヘッダーの高さ*/
        --header-height: 120px;        
    }
}

/*--------------------------------------------------------
3. タイポグラフィとフォント設定
--------------------------------------------------------*/
/*
font-size
color
padding
margin
word-wrap
background-color
overflow-x
*/
body, html {
    font-size: var(--vk-size-text);
}
body {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  font-kerning: normal;
  font-feature-settings: 'palt';
}
/*欧文フォント*/
.latin {
  font-family: "Outfit", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-kerning: normal;
  font-feature-settings: 'kern', 'liga';
  letter-spacing: 0.03em;
  text-transform: capitalize;
}
@media (max-width: 991.98px) {
    body, html {
        font-size: var(--vk-size-text);
    }
}
@media print {
    body, html {
        background-color: transparent;
    }
    body.custom-background {
        background: none!important;
    }
}

body.home {
    background-image: url("img/parts/dot-bg.svg");
}

/*--------------------------------------------------------
-- for Apple
--------------------------------------------------------*/
body {
    -webkit-text-size-adjust: 100%;
}
a[href^="tel:"] {
    color: currentColor;
    text-decoration: none;
}
.device-pc a[href^="tel:"] {
    pointer-events: none;
}

/*--------------------------------------------------------
4. リンクのスタイル
--------------------------------------------------------*/

a, li a, p a {
    text-decoration: none;
}
a:hover, li a:hover, p a:hover {
    text-decoration: none;
}
a:hover {
    opacity: .8;
}

/*▼▼ ターゲットブランク設定*/
/* 外部リンクにアイコンを付ける（基本） */
.entry a[target="_blank"]::after {
    content: "";
    display: inline-block;
    width: 10px;
    height: 15px;
    background-color: currentColor;
    -webkit-mask-image: url("img/parts/mask-blank.svg");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center top;
    -webkit-mask-size: contain;
    mask-image: url("img/parts/mask-blank.svg");
    mask-repeat: no-repeat;
    mask-position: center top;
    mask-size: contain;
    margin-inline-start: 6px; 
}
/* 中身が画像のリンクには付けない（主要ブラウザ対応） */
.entry a[target="_blank"]:has(img)::after {
    content: none;
}
/* PDFなどのファイルリンクは除外 */
.entry a[target="_blank"][href$=".pdf" i]::after,
.entry a[target="_blank"][href$=".doc" i]::after,
.entry a[target="_blank"][href$=".docx" i]::after,
.entry a[target="_blank"][href$=".xls" i]::after,
.entry a[target="_blank"][href$=".xlsx" i]::after,
.entry a[target="_blank"][href$=".ppt" i]::after,
.entry a[target="_blank"][href$=".pptx" i]::after,
.entry a[target="_blank"][href$=".zip" i]::after,
.entry a[target="_blank"][download]::after { 
    content: none;
}
/* メール・電話リンクを除外 */
.entry a[target="_blank"][href^="mailto:"]::after,
.entry a[target="_blank"][href^="tel:"]::after {
    content: none;
}
/* 手動で除外したいとき用 */
.entry a[target="_blank"].no-ext-icon::after {
    content: none;
}
/*▲▲ ターゲットブランク設定*/

/*アンカーリンク調整*/
h1[id], h2[id], h3[id], h4[id], h5[id], h6[id] {
  scroll-margin-top: var(--header-height);
}

/*--------------------------------------------------------
5. テキスト要素のスタイル
--------------------------------------------------------*/
/* フロント用（通常表示） */
b, strong {
  font-weight: 700;
}
/* 管理画面用（WordPress Admin） */
.editor-styles-wrapper p b,
.editor-styles-wrapper p strong {
  font-weight: bold;
}

li {
    line-height: var(--vk-line-height);
}
address {
    font-style: normal;
    line-height: var(--vk-line-height-low);
}

/*--------------------------------------------------------
6. ブロックエディタのデフォルト設定とレイアウト・ブレークポイントを合わせる
--------------------------------------------------------*/

/* カラムブロックのブレイクポイントを992pxにあわせる */
@media screen and (max-width: 991.98px) {
    .wp-block-columns {
        flex-wrap: wrap !important;
    }
    .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
        flex-basis: 100% !important;
    }
}

/* カラムブロック 印刷時は横に並べる */
@media print {
    .wp-block-columns {
        flex-wrap: nowrap;
    }
    .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
        flex-basis:auto;
    }
}

/* 不要な左右マージンが入るのを回避 */
.is-layout-constrained > * {
    max-width: none;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 囲み（グループ）内 不要な左右マージンが入るのを回避 */
.wp-block-group h1,
.wp-block-group h2,
.wp-block-group h3,
.wp-block-group h4,
.wp-block-group h5,
.wp-block-group h6 {
    margin-left: 0!important;
    margin-bottom:  var(--vk-margin-headding-bottom)!important;
}

/*--------------------------------------------------------
7. コンテナのスタイル
--------------------------------------------------------*/

/*common*/
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl {
    padding-right: 16px;
    padding-left: 16px;
}
.section-01-bg-inner.container {
    padding-right: 24px;
    padding-left: 24px;
}
@media screen and (max-width: 991.98px) {
    .site-footer.container, .section-01.container {
        padding-left: 0;
        padding-right: 0;
        max-width: none;
    }
}
@media print, screen and (min-width: 992px) {
    .site-footer-inner.container,
    .section-01-bg-inner.container {
        padding-left: 40px;
        padding-right: 40px;
        max-width: calc( 1200px + 40px + 40px );
    }
}

.site-body {
    padding-top: 80px;
    padding-bottom: 120px;
}
.home .site-body {
    padding-top: 0;
    padding-bottom: 0;
}
@media screen and (min-width: 992px) {
    .site-header-container.container,
    .page-header.container,
    .site-footer.container, .section-01.container,
    .page-header-inner.container {
        max-width: none;
        padding-left: min(2.4vw, 56px);
        padding-right: min(2.4vw, 56px);
    }
}
@media screen and (min-width: 1200px) {
    .site-header-container.container,
    .page-header.container,
    .site-footer.container, .section-01.container,
    .page-header-inner.container {
        padding-left: min(3.2vw, 56px);
        padding-right: min(3.2vw, 56px);
    }
}
@media screen and (min-width: 1400px) {
    .container {
        max-width: calc( 1200px + 16px + 16px );
    }
}
@media print {
    .container {
        max-width: none;
    }
}

/*--------------------------------------------------------
8. 下層ページメインビジュアル
--------------------------------------------------------*/

.page-header {
    display: block;
    margin-top: calc( var(--header-height) + 32px );
    text-align: left;
}
.page-header-bg {
    background-color: var(--bg-dark);
    border-radius: 20px;
    min-height: 150px;
    display: flex;
    align-items: center;
}
.page-header-title, h1.page-header-title {
    font-size: 36px;
    font-weight: 700;
    color: #fff;
}

/*--------------------------------------------------------
9. パンクズリストのスタイル
--------------------------------------------------------*/

.breadcrumb {
    display: none;
}

/*.breadcrumb {
    font-size: 16px;
    line-height: var(--vk-line-height);
}
.breadcrumb-list li:first-child i,
.breadcrumb-list__item--home a svg {
    display: none;
}
.breadcrumb-list li:after,
.breadcrumb-list a,
.breadcrumb-list span,
.breadcrumb-list a:hover {
    color: var(--vk-color-text-body);
}
.breadcrumb-list li:after {
    content: "＞";
}*/

/*--------------------------------------------------------
10. 見出しのスタイル
--------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
}
/* 見出しの太字をエディタ側にも反映 */
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6 {
    font-weight: bold !important;
}

h1, h2 {
    font-size: 40px;
}

/*見出し2*/
.is-style-custom-heading-style-2, .entry-title {
    font-size: 32px;
    padding: 24px 16px;
    border-top: 2px solid var(--vk-color-text-body);
    border-bottom: 2px solid var(--vk-color-text-body);
}
/*見出し3*/
.is-style-custom-heading-style-3 {
    font-size: 28px;
    padding: 24px 16px;
    border-bottom: 1px solid var(--vk-color-text-body);
}
/*見出し4*/
.is-style-custom-heading-style-4 {
    font-size: 24px;
    position: relative;
    padding-left: 40px;
}

.is-style-custom-heading-style-4::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 21px;
    height: 37px;
    background-image: url("img/parts/crese-h4.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.is-style-about-1 {
    background-color: var(--vk-color-primary);
    color: #fff;
    font-size: 24px;
    text-align: center;
    border-radius: 5px;
    padding: 11px;
}
.is-style-about-1 span {
    display: inline-block;
}
@media print, screen and (min-width: 992px) {
    .is-style-about-1 {
        margin-left: 22%;
        margin-right: 22%;
    }
}

/*三角スペーサー*/
.wp-block-spacer.is-style-triangle-spacer {
    width: 0 !important;
    height: 0 !important;
    display: block;
    margin: 0 auto;
    border-left: 95px solid transparent;
    border-right: 95px solid transparent;
    border-bottom: 40px solid var(--vk-color-primary);
}

/*--------------------------------------------------------
11. オリジナルブロックのスタイル
--------------------------------------------------------*/

/* 囲み（グループ） */
.is-style-custom-block-wrapper-1,
.is-style-custom-block-wrapper-2 {
    max-width: none;
    padding: 32px;
    border-radius: var(--vk-size-radius);
}
.is-style-custom-block-wrapper-1 {
    background-color: #fff;
    
}
.is-style-custom-block-wrapper-2 {
    border: 1px solid var(--vk-color-text-body);
}
.is-style-custom-block-wrapper-1 p:last-child,
.is-style-custom-block-wrapper-2 p:last-child,
.wp-block-group[class*=wp-container-]>:is(p):last-child {
    margin-bottom: 0;
    margin-block-end: 0;
}

/*aboutのカード*/
[class*="is-style-about-card-"] {
    height: 100%;
    border-radius: var(--vk-size-radius);
    border: 1px solid #02417d;
    background-color: #e7f2f8;
    padding: 32px;
}
.is-style-about-card-02 {
    border-color: #e6881b;
    background-color: #fbe9d4;
}
.is-style-about-card-03 {
    border-color: #7f8599;
    background-color: #f6f7f9;
}
.is-style-about-card-04 {
    border-color: #20a3ca;
    background-color: #e7f2f8;
}
[class*="is-style-about-card-"] h2 {
    border-radius: 99px;
    font-size: 18px;
    color: #fff;
    text-align: center;
    margin-left: -11px!important;
    margin-right: -11px!important;
    padding: 6px;
}
[class*="is-style-about-card-"] li {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 14px;
}

/*大分モデル*/
.is-style-oita-model {
    background-color: #fff;
    height: 100%;
    border-radius: 5px;
}
.is-style-oita-model h2 {
    background-color: var(--vk-color-text-body);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size: 18px;
    color: #fff;
    text-align: center;
    padding: 8px;
}
.is-style-oita-model ul {
    margin-left: 18px!important;
    margin-right: 18px!important;
    padding-bottom: 18px;
}
.is-style-oita-model li {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 14px;
}
@media screen and (min-width: 768px) {
    .column-oita-model:not(.is-not-stacked-on-mobile) > .wp-block-column {
        flex-basis: auto!important;
    }
}
/*印刷に反映しない*/
@media screen and (min-width: 992px) {
    .column-oita-model {
        position: relative;
    }
    .column-oita-model:not(.is-not-stacked-on-mobile) > .wp-block-column:not(:first-child) {
        --oita-model-width: 288px;
        width: var(--oita-model-width);
        position: absolute;
        top: 56px;
    }
    .column-oita-model:not(.is-not-stacked-on-mobile) > .wp-block-column:nth-child(2) {
        left: calc( 50% - (var(--oita-model-width) * 1.68) );
    }
    .column-oita-model:not(.is-not-stacked-on-mobile) > .wp-block-column:nth-child(3) {
        right: calc( 50% - (var(--oita-model-width) * 1.68) );;
    }
}

/* カラム */
.wp-block-columns.is-style-justify {
    justify-content: space-between;
}
.wp-block-columns.is-style-center {
    justify-content: center;
}

/*テーブル デフォルト*/
.wp-block-table tr td:first-child {
    background-color: var(--bg-light);        
}
.wp-block-table td {
    font-size: 1rem;
    padding: 1rem;
    line-height: var(--vk-line-height);
    border: 1px solid #ccc;
    border-left: none;
    border-right: none;
}
.wp-block-table {
    position: relative;
    padding-top: 2rem;
}
.wp-block-table figcaption {
    margin-top: 0;
    text-align: right;
    font-size: 1rem;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
.wp-block-flexible-table-block-table tr th {
    font-weight: 700;
}

/*テーブル 縦積みのときは線を重ねる*/
@media screen and (max-width: 768px) {
    .wp-block-flexible-table-block-table.wp-block-flexible-table-block-table>table.is-stacked-on-mobile tr:not(:last-child) th,
    .wp-block-flexible-table-block-table.wp-block-flexible-table-block-table>table.is-stacked-on-mobile tr:not(:last-child) td,
    .wp-block-flexible-table-block-table.wp-block-flexible-table-block-table>table.is-stacked-on-mobile tr:last-child th:not(:last-child),
    .wp-block-flexible-table-block-table.wp-block-flexible-table-block-table>table.is-stacked-on-mobile tr:last-child td:not(:last-child) {
        border-bottom-color: transparent!important;
    }
}

/* ボタン 共通 */
.wp-block-button__link {
    transition: none;
    font-size: 16px;
}
.wp-block-button__link:hover {
    filter: none!important;
}
@media screen and (max-width: 575.98px) {
    .wp-block-buttons>.wp-block-button {
        display: block;
        width: 100%;
    }
}
.is-style-outline .wp-block-button__link {
    color: var(--vk-color-text-body);
}

/*ボタン オリジナル*/
[class*="is-style-button-"] .wp-block-button__link {
    color: #fff;
    background-color: var(--vk-color-primary);
    border: 1px solid var(--vk-color-primary);
    border-radius: 999px!important;
    font-weight: 400;
    padding: 17px 85px 17px 33px;
    position: relative;
}
[class*="is-style-button-"] .wp-block-button__link:hover {
    opacity: 1;
}
[class*="is-style-button-"] .wp-block-button__link::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: var(--box-shadow);
    mix-blend-mode: multiply;
    pointer-events: none;
    transition: var(--transition);
}
[class*="is-style-button-"] .wp-block-button__link:hover::before {
    box-shadow: 0 6px 14px rgba(167, 173, 183, 0.55);
}

/* 矢印アイコン外枠 */
.wp-block-button:not([class*="is-style-button-"]) .wp-block-button__link .btn-icon-wrap {
    display: none;
}
[class*="is-style-button-"] .wp-block-button__link .btn-icon-wrap {
    display: block;
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    width: 48px;
    height: 28px;
    border-left: 1px solid currentColor;
}
.is-style-button-6 .wp-block-button__link .btn-icon-wrap {
    border-left-color: #ccc;
}
/* 矢印アイコン内枠 */
.wp-block-button__link .btn-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 48px;
    height: 28px;
}

/* 矢印（横棒） */
[class*="is-style-button-"] .wp-block-button__link .btn-icon::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 16px;
  width: 14px;
  height: 1px;
  background-color: currentColor;
  transform: translateY(-50%);
  transition: var(--transition);
}
/* 矢印（三角） */
[class*="is-style-button-"] .wp-block-button__link .btn-icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 27px;
    height: 8px;
    border-right: 1px solid currentColor;
    transform: translateY(calc(-50% - 2px)) rotate(-45deg);
    transition: var(--transition);
}
/* ホバー時に矢印が伸びる */
[class*="is-style-button-"] .wp-block-button__link:hover .btn-icon::before {
    width: 24px;
}
[class*="is-style-button-"] .wp-block-button__link:hover .btn-icon::after {
    left: 37px;
}

/*    name: 'button-1',
      label: '青',
      name: 'button-2',
      label: '黒',
      name: 'button-3',
      label: 'オレンジ',
      name: 'button-4',
      label: '水色',
      name: 'button-5',
      label: '灰色',
      name: 'button-6',
      label: '白',
*/
.is-style-button-2 .wp-block-button__link {
    background-color: var(--vk-color-text-body)!important;
    border-color: var(--vk-color-text-body);
}
.is-style-button-3 .wp-block-button__link {
    background-color: var(--orange)!important;
    border-color: var(--orange);
}
.is-style-button-4 .wp-block-button__link {
    background-color: var(--vk-color-primary-vivid)!important;
    border-color: var(--vk-color-primary-vivid);
}
.is-style-button-5 .wp-block-button__link {
    background-color: var(--gray)!important;
    border-color: var(--gray);
}
.is-style-button-6 .wp-block-button__link {
    background-color: #fff!important;
    border-color: #fff;
    color: var(--vk-color-text-body);
}

/*管理画面のボタンのみ仮アイコンを表示*/
.editor-styles-wrapper .wp-block-buttons [class*="is-style-button-"] .wp-block-button__link {
    padding: 17px 33px;
}
.editor-styles-wrapper .wp-block-buttons [class*="is-style-button-"] .wp-block-button__link::after {
    content: "  |→";
}

/*--------------------------------------------------------
12. フッターのスタイル
--------------------------------------------------------*/
.site-footer {
    font-size: 18px;
}
.site-footer-bg {
    background-color: var(--bg-dark);
    color: #fff;
    padding-top: 56px;
    padding-bottom: 56px;
}
@media print, screen and (min-width: 992px) {
    .site-footer-bg {
        border-radius: 20px;
    }
}

/*トップページのみ*/

.home .solid-decoration {
    position: relative;
    z-index: 0;   
}
.home .solid-decoration::before {
    pointer-events: none;
    content: "";
    position: absolute;
    top: 50%;
    left: -3.2vw;
    right: -3.2vw;
    bottom: -50%;
    background-color: var(--bg);
    z-index: -1;
}

.site-footer-bg-illustration {
    height: 208px;
    position: relative;
}
.site-footer-bg-illustration::before {
    pointer-events: none;
    content: "";
    display: block;
    width: 270px;
    height: 240px;
    background-image: url("img/footer/illustr-01.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}
@media screen and (min-width: 768px) {
    .site-footer-bg-illustration::before {
        width: 100%;
        background-position: right 16px top 0;
    }
}

/*Contactボタン*/
.is-style-button-card {
    padding-top: 12px;
    padding-bottom: 12px;
    margin-bottom: 56px;
}
.is-style-button-card .wp-block-button__link {
    background-color: #fff;
    border-color: #fff;
    color: var(--vk-color-text-body);
    padding: 0;
    min-height: 154px;
    width: 100%;
    text-align: left;
    display: flex;
    align-items: center;
}
.is-style-button-card .wp-block-button__link::before {
    transition: none;
}
.button-card {
    max-width: calc( 1112px + 48px + 48px );
    padding-left: 48px;
    padding-right: 48px;
    margin: 0 auto;
    display: flex;
    column-gap: 4.8%;
    align-items: center;
}
.button-card h2 {
    font-size: 32px;
    margin-bottom: 0;
    white-space: nowrap;
    padding-left: 16px;
}
@media print, screen and (min-width: 992px) {
    .button-card h2 {
        padding-left: 40px;
    }
}
.button-card p {
    margin-bottom: 0;
    font-size: min(1.784vw, 18px);
}
@media print, screen and (min-width: 992px) {
    .button-card p {
        font-size: 18px;
    }
}
@media print, screen and (min-width: 992px) {
    .button-card p span {
        display: inline-block;
    }
}
.is-style-button-card .wp-block-button__link .btn-icon-wrap,
.is-style-button-card .wp-block-button__link .btn-icon {
    height: 64px;
}
.is-style-button-card .wp-block-button__link .btn-icon-wrap {
    position: static;
    transform: translateY(0%);
    border-left-color: #ccc;
    width: calc( 48px + 18px );
    padding-left: 18px;
    margin-left: auto;
}
/*スマートフォン時*/
@media screen and (max-width: 767.98px) {
    .is-style-button-card .wp-block-button__link {
        border-radius: 20px!important;
        padding-top: 40px;
        padding-bottom: 24px;
    }
    .button-card {
        padding-left: 40px;
        padding-right: 40px;
        flex-direction: column;
        row-gap: 24px;
    }
    .button-card p {
        font-size: 18px;
        margin-bottom: 10PX;
    }
    .is-style-button-card .wp-block-button__link .btn-icon-wrap {
        width: 100%;
        max-width: 79.04%;
        padding: 0;
        border-left: none;
        border-top: 1px solid #ccc;
    }
    .is-style-button-card .wp-block-button__link .btn-icon-wrap,
    .is-style-button-card .wp-block-button__link .btn-icon {
        margin: 0 auto;
    }
    .is-style-button-card .wp-block-button__link .btn-icon {
        transform: scale(1.3);
        transform-origin: top center;

    }
}

/*レイアウト*/
.crese-layout {
    display: flex;
    flex-direction: column;
    row-gap: 40px;
}
@media print, screen and (min-width: 992px) {
    .crese-layout {
        flex-direction: row;
        column-gap: 6.4%;
    }
    .crese-layout__left {
        width: 32%;
    }
    .crese-layout__right {
        flex: 1;
    }
}

/*ロゴ*/
.footitem__logowrap a {
    display: block;
    padding: 4px;
}
.footitem__logowrap img {
    filter: brightness(0) invert(1);
    max-height: 64px;
}
/*アドレス*/

/*メニュー*/
.site-footer ul li a:hover {
    text-decoration: none;
}
.footer-nav {
    margin-bottom: 32px;
    padding: 0;
}
.footer-nav ul {
    display: flex;
    flex-wrap: wrap;
}
.footer-nav ul li {
    width: 50%;
    padding: 0;
}
@media screen and (min-width: 768px) {
    .footer-nav ul {
        column-gap: 32px;
    }
    .footer-nav ul li {
        width: auto;
    }
}
.footer-nav ul li a {
    font-size: 18px;
    padding: 4px;
    display: block;
    color: #fff;
    text-align: center;
}

/*コピーライト*/
.site-footer-copyright {
    padding: 32px 16px;
    position: relative;
}
.site-footer-copyright ul {
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    column-gap: 10px;
    padding: 0;
    margin: 0;
}
.site-footer-copyright ul li, 
.site-footer-copyright ul li a {
    font-size: 16px;
}
@media screen and (max-width: 767.98px) { 
    .site-footer-copyright ul li {
        width: 100%;
        text-align: center;
    }
    .site-footer-copyright ul li.li-copyright {
        order: 999;
        margin-top: 20px;
    }
    .site-footer-copyright ul li.li-copyright, 
    .site-footer-copyright ul li.li-copyright a {
        font-size: 13px;
    }
}
@media screen and (min-width: 768px) {
    .site-footer-copyright ul li.li-copyright {
        margin-right: min(3vw, 56px);
    }
}

.site-footer-copyright ul li {
    margin: 0;
}
.site-footer-copyright ul li a {
    color: var(--vk-color-text-body);
    position: relative;
}
.site-footer-copyright ul li:not(:last-child) a {
    padding-right: 10px;
}
.site-footer-copyright ul li:not(:last-child) a::after {
    content: "";
    position: absolute;
    top: 6px;
    right: 0;
    width: 1px;
    bottom: 4px;
    background-color:  var(--vk-color-text-body);
}

/*フッターのトップに戻るボタン*/
.site-footer__page_top_btn {
    display: block;
    width: 112px;
    height: 24px;
}
@media screen and (max-width: 991.98px) {
    .site-footer__page_top_btn {
        margin-left: auto;
        margin-right: 16px;
        margin-bottom: 40px;
    }
}
@media print, screen and (min-width: 992px) {
    .site-footer__page_top_btn {
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
    }
}

@media print {
    .site-footer__page_top_btn {
        display: none;
    }   
}

/*バナー*/
.foot-bnr-area {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}
.foot-bnr {
    width: 210px;
    height: 70px;
}
.foot-bnr a, .foot-bnr img {
    display: block;
}
.foot-bnr img {
    border-radius: 5px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media screen and (max-width: 575.98px) {
    .foot-bnr-area {
        justify-content: space-between;
    }
    .foot-bnr {
        width: calc( (100% - 16px ) / 2 );
        height: auto;
    }
}

/*--------------------------------------------------------
13. SNSリンク
--------------------------------------------------------*/
/*なし*/

/*--------------------------------------------------------
14. トップに戻るボタン
--------------------------------------------------------*/
.page_top_btn {
    right: 15px;
    bottom: 15px;
    height: 40px;
    background-color: var(--vk-color-primary);
    box-shadow: none;
    border-radius: 50%;
    
    z-index: 1999;
}
@media screen and (max-width: 991.98px) {
    .page_top_btn {
        right: 5px;
        bottom: 60px;
    }
}

/*--------------------------------------------------------
15. モバイルナビボタン
--------------------------------------------------------*/

/*モバイルナビボタン マル*/
.vk-mobile-nav-menu-btn,
.vk-mobile-nav-menu-btn.menu-open {
    border-radius: 50%;
    width: 34px;
    height: 34px;
    border-color: transparent;
    top: 18px;
    box-shadow: var(--box-shadow);
    background-color: #fff;
    background-image: none;
}
.vk-mobile-nav-menu-btn.position-right {
    right: 18px;
}

/* =====================================
   モバイルメニューボタン（2本線→×）
   ===================================== */
/* 記号（2本線→×） */
#vk-mobile-nav-menu-btn{
  /* 調整後：14px × 1px、間隔3px */
  --len: 14px;      /* 線の長さ */
  --thick: 1px;     /* 線の太さ */
  --gap: 2px;       /* 上下ギャップの半分程度で3px間隔に見える */
  color: var(--vk-color-text-body);
}

#vk-mobile-nav-menu-btn::before,
#vk-mobile-nav-menu-btn::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:var(--len);
  height:var(--thick);
  background: currentColor;
  border-radius: 1px;
  transform-origin:50% 50%;
  transition: transform .35s ease;
  will-change: transform;
}

/* 閉じている時：上下に離した二本線 */
#vk-mobile-nav-menu-btn::before{
  transform: translate(-50%, calc(-50% - var(--gap))) rotate(0);
}
#vk-mobile-nav-menu-btn::after{
  transform: translate(-50%, calc(-50% + var(--gap))) rotate(0);
}

/* 開いた時（×）— .menu-open が付く */
#vk-mobile-nav-menu-btn.menu-open::before{
  transform: translate(-50%, -50%) rotate(45deg);
}
#vk-mobile-nav-menu-btn.menu-open::after{
  transform: translate(-50%, -50%) rotate(-45deg);
}

/*--------------------------------------------------------
16. モバイルナビ
--------------------------------------------------------*/

/*警告を非表示*/
.veu_adminEdit.alert {
    display: none;
}

/*クリックさせない*/
.pointer-events-none>a {
    pointer-events: none;
}

/*メニューの背景*/
.vk-mobile-nav {
    background-color: rgba(255,255,255,0.9);
    border-bottom: none;
    padding: 75px 20px;
    height: 100%;
}
/*メニュー1個1個*/
.vk-mobile-nav nav>ul, .vk-mobile-nav nav ul li a {
    border: none;
}
.vk-mobile-nav nav ul li a {
    font-size: 25px;
    font-weight: 700;
    padding: .5em;
    color: var(--vk-color-text-body);
}

/*--------------------------------------------------------
17. ロゴ
--------------------------------------------------------*/
.site-header-logo {
    text-align: left; /*消さないで*/
}
.site-header-logo img {
    margin: 0; /*消さないで*/
}

/*--------------------------------------------------------
18. サイトヘッダー
--------------------------------------------------------*/

.site-header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    min-height:var(--header-height);
    background-color: var(--bg);
    box-shadow: none;
    /*お問合せボタン非表示のため*/
    /*padding-right: min(14vw, 200px);*/
}
@media screen and (max-width: 991.98px) {
    .site-header {
        padding-top: 8px;
    }
}
@media screen and (min-width: 992px) {
    .site-header {
        position: fixed;
        
    }
}
@media print, screen and (min-width: 992px) {
    .device-pc .global-nav-list>li>a:hover {
        text-decoration: none;
    }
}

@media print, screen and (min-width: 992px) {
    .site-header-container {
        display: flex;
        justify-content: space-between;
        align-items: center;;
        min-height:var(--header-height);
    }
}

/*タップエリア*/
.device-mobile .global-nav-list>li {
    padding: 0;
}
.device-mobile .global-nav-list>li>a,
.device-mobile .global-nav-list>li.menu-item-has-children>a,
.device-pc .global-nav-list>li>a,
.device-pc .global-nav-list>li.menu-item-has-children>a {
    padding: 14px min(1.5vw, 18px);
}
@media screen and (min-width: 1200px) {
    .device-mobile .global-nav-list>li>a,
    .device-mobile .global-nav-list>li.menu-item-has-children>a,
    .device-pc .global-nav-list>li>a,
    .device-pc .global-nav-list>li.menu-item-has-children>a {
        padding: 14px min(1.5vw, 28px);
    }
}
.device-mobile .global-nav-list>li.menu-item-has-children>a,
.device-pc .global-nav-list>li.menu-item-has-children>a {
    padding-right: 24px;
    margin-right: 24px;
}

/*文字サイズ タブレットとか関係なく強制的に統一*/
.device-mobile .global-nav-list>li .global-nav-name,
.global-nav-list>li .global-nav-name {
    font-size: min(1.412vw, 18px);
    font-weight: 400;
}

/*サブメニューのスクロールバーが気になるのを解決*/
.device-pc .global-nav-list>li:focus-within li:focus-within>.sub-menu, 
.device-pc .global-nav-list>li:focus-within>.sub-menu, 
.device-pc .global-nav-list>li:hover li:focus-within>.sub-menu, 
.device-pc .global-nav-list>li:hover>.sub-menu {
    overflow-y: hidden;
}

/* 
PCでも開閉ボタンを表示する
1. js内に nav-click-enhancer.js を作成
2. function.php で nav-click-enhancer.js を読み込む
3. 下記CSSを記載する
*/
/* PCでもacc-btnを表示させる */
.device-pc .global-nav-list > li > .acc-btn {
  display: block;
}
/*リンクエリアを広げる*/
.menu-item-has-children {
    position: relative;
}
.vk-menu-acc .acc-btn {
    position: absolute;
    top: 0!important;
    left: 0;
    right: 0!important;
    bottom: 0;
    width: auto!important;
    height: auto!important;
    border: none!important;
    border-radius: 50%;
    background: none!important;
    transition: transform .5s ease-out;
}
/*アイコンデザイン*/
.menu-item-has-children>a {
    position: relative;
}
.menu-item-has-children>a::before {
    content: "";
    width: 17px;
    height: 17px;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    border-radius: 50%;
    background-color: var(--bg-light);
    background-image: url("img/parts/acc-open.svg");
    background-size: auto;
    background-repeat: no-repeat;
    background-position: center
}
.acc-parent-open.menu-item-has-children>a::before{
    background-image: url("img/parts/acc-close.svg");
}
@media (min-width: 992px) {
  /* ホバーでは出さない */
  .device-pc .global-nav-list > li:hover > .sub-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important; /* 保険 */
  }
  /* クリックで開いた時だけ表示（＝標準クラスに追随） */
  .device-pc .global-nav-list > li.acc-parent-open > .sub-menu,
  .device-pc .global-nav-list .acc-child-open {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}
.sub-menu.acc-child-open,
.sub-menu.acc-child-close {
    transition: none !important;
}
/*サブメニューデザイン*/
.global-nav-list li {
    font-size: 16px;
}
.global-nav-list>li>ul.sub-menu {
    background-color: #fff;
    box-shadow: var(--box-shadow);
    margin-left: -84px;
    width: 168px;
    border-radius: var(--vk-size-radius);
    padding: 14px;
}
.global-nav-list .sub-menu li a, .global-nav-list .sub-menu li a:hover {
    color: var(--vk-color-text-body);
}
.global-nav-list .sub-menu li a {
    padding: 4px 14px;
    border: none;
}
.global-nav-list .sub-menu li a:focus-within, .global-nav-list .sub-menu li a:hover {
    background-color: transparent;
}

/*お問い合わせボタン*/
.menu-contact-wrap a {
    background-color: var(--vk-color-primary);
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 999px;
    box-shadow: var(--box-shadow);
    padding: 1.05em 2.66em;
    
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 2px;
}
@media screen and (max-width: 991.98px) {
    .site-header .menu-contact-wrap {
        display: none;
    }
}
@media print, screen and (min-width: 992px) {
    .menu-contact-wrap {                
        position: fixed;
        top: 0;
        right: 0;
        height: var(--header-height);
        display: flex;
        justify-content: flex-end;
        align-items: center;
        padding-right: min(2.4vw, 56px);
    }
    .menu-contact-wrap a {
        font-size: min(1.412vw, 18px);
    }
}
@media screen and (min-width: 1200px) {
    .menu-contact-wrap {
        padding-right: min(3.2vw, 56px);
    }
}

@media print {
    .site-header .menu-contact-wrap {
        display: none;
    }
}

/*--------------------------------------------------------
19.ブログ関連のスタイル
--------------------------------------------------------*/
.vk_posts, .post-list {
    /*基本*/
    margin-left: 0;
    margin-right: 0;
    
    /*レイアウト*/
    display: flex;
    flex-direction: column;
    gap: 0;
}
.vk_post, .postListText {
    /*基本*/
    margin-left: 0;
    margin-right: 0;
    position: relative;
    
    /*レイアウト*/
    display: flex;
    flex-direction: column;
    
    /*スタイル*/
    border-bottom: 1px solid #ccc;
    padding: 18px;
    gap: 14px 40px;
}
@media print, screen and (min-width: 992px) {
    .vk_post, .postListText {
        /*レイアウト*/
        flex-direction: row;
        align-items: center;
        
        /*スタイル*/
        padding: 18px 36px;
    }
}

/*大きなホバー 印刷しない*/
@media screen and (min-width: 992px) {
    .postListText .postListText_title a::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
        border-radius: 10px;
    }
    .postListText:hover .postListText_title a::before {
        background: #FFFFFF;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 8%, rgba(255, 255, 255, 1) 92%, rgba(255, 255, 255, 0) 100%);
        opacity: .8;
    }
    .postListText_date {
        z-index: 1;
    }
    .postListText_singleTermLabel,
    .postListText_title {
        z-index: 0;
    }
}


/*日*/
.postListText_date {
    /*基本*/
    float: none;
    min-width: auto;
    margin-right: 0;
    /*スタイル*/
    font-size: 18px;
    font-weight: 500;
    color: var(--vk-color-primary);
    width: 72px;
    border-right: 1px solid #ccc;
    /*レイアウト*/
    display: flex;
    flex-direction: column;    
}
.single-post .postListText_date {
    border: none;
    width: auto;
    font-size: 14px;
}
@media print, screen and (min-width: 992px) {
    .postListText_date {
        /*スタイル*/
        width: 96px;
    }
}
.postListText_date>span {
    font-size: 14px;
    /*line-height: 1;*/
}
/*カテゴリ*/
.postListText_singleTermLabel {
    display: none;
}
/*.postListText_singleTermLabel {
    float: none;
    margin: 0;
    min-width: inherit;
}
.postListText_singleTermLabel a {
    background-color: transparent!important;
    border: 1px solid var(--vk-color-primary);
    color: var(--vk-color-primary)!important;
    text-decoration: none;
    display: block;
    overflow: hidden;
    font-size: 12px;
    white-space: nowrap;
    padding: 0 1rem;
    line-height: 16px;
    border-radius: 2px;
    text-align: center;
}*/
/*題名*/
.postListText_title {
    font-size: 16px;
    width: 100%;
}
@media print, screen and (min-width: 992px) {
    .postListText_title {
        flex: 1;
    }
}
.postListText_title a,
.postListText_title a:hover {
    text-decoration: none;
}

/*ページネーション*/
nav.pagination {
    margin-top: 48px;
}
ul.page-numbers li,
ul.page-numbers li:first-child>.page-numbers,
ul.page-numbers li:last-child>.page-numbers {
    width: 20px;
    height: 20px;
    border-radius: 3px;
    margin-right: 24px;
    font-size: 14px;
    line-height: 1;
    
    /*欧文フォント*/
    font-family: "Outfit", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
    font-kerning: normal;
    font-feature-settings: 'kern', 'liga';
    letter-spacing: 0.03em;
    text-transform: capitalize;
}
ul.page-numbers li:last-child {
    margin-right: 0;
}
ul.page-numbers li a, ul.page-numbers li span.page-numbers {
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    margin-left: 0;
    width: 100%;
    height: 100%;
}
ul.page-numbers li a:hover {
    background-color: var(--bg-light);
}
ul.page-numbers li span.page-numbers {
    width: 100%;
    height: 100%;
}

img.page-arrow {
    display: block;
}
img.page-arrow.next {
  transform: scaleX(-1);
}

/*詳細記事*/
.entry-header {
    display: flex;
    flex-direction: column-reverse;
    row-gap: 4px;
}
.entry-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 8px 16px;
    line-height: var(--vk-line-height);
}
.next-prev {
    display: none;
}

/*トップページの記事*/

h2.latin + .vk_posts {
    margin-top: -16px;
}
.home .vk_posts .vk_post:nth-child(n+7) {
    display: none;
}
.is-style-button-more {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
}

.is-style-button-more .wp-block-button__link {
    color: var(--vk-color-text-body);
    background: none;
    border: none;
    font-size: 14px;
    padding-right: 33px;
}
.is-style-button-more .wp-block-button__link:hover {
    opacity: .8;
}
.is-style-button-more .wp-block-button__link::before {
    content: none;
}
.is-style-button-more .wp-block-button__link .btn-icon-wrap {
    right: 0;
    border: none;
}
.is-style-button-more .wp-block-button__link .btn-icon-wrap,
.is-style-button-more .wp-block-button__link .btn-icon {
    width: 32px;
}

/*--------------------------------------------------------
20.トップページメインビジュアル
--------------------------------------------------------*/
section.mainvisual {
    margin-top: var(--header-height);
    padding-top: 32px;
    padding-bottom: 72px;
    background-color: var(--bg);
}
@media print, screen and (min-width: 992px) {
    section.mainvisual {
        padding-bottom: 144px;
    }
}

.lightning_swiper {
    overflow: visible;
}
@media screen and (min-width: 992px) {
     .lightning_swiper .swiper-slide {
        padding-left: min(2.4vw, 56px);
        padding-right: min(2.4vw, 56px);
    }
    .lightning_swiper .swiper-slide picture img {
        border-radius: var(--vk-size-radius);
    }
}
@media screen and (min-width: 1200px) {
     .lightning_swiper .swiper-slide {
        padding-left: min(3.2vw, 56px);
        padding-right: min(3.2vw, 56px);
    }
}

/*印刷のみ設定*/
@media print {
    .lightning_swiper .swiper-wrapper {
        transform: none !important; /* スライド位置を固定 */
        transition: none !important; /* アニメーションを無効化 */
      }
    .lightning_swiper .swiper-slide {
        width: 100%!important;
    }
    .lightning_swiper .swiper-slide picture img {
        /*height: 40vh;*/
    } 
}

/* ページャー 基本*/
.swiper-button-next, 
.swiper-button-prev {
    color: var(--vk-color-text-body);
    width: 48px;
    height: 48px;
}
.swiper-button-next::after,
.swiper-button-prev::after {
    content: "";
    width: 48px;
    height: 48px;
    background-image: url("img/parts/swiper-button.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.swiper-button-next:after {
    transform: scaleX(-1);
}
.swiper-button-next:hover::after,
.swiper-button-prev:hover::after {
    opacity: .8;
}
@media screen and (max-width: 991.98px) {
    .swiper-button-next, 
    .swiper-button-prev,
    .swiper-button-next::after,
    .swiper-button-prev::after {
        display: none;
    }
}
/* ページャー メインビジュアル*/
.lightning_swiper .swiper-button-next, 
.lightning_swiper .swiper-button-prev {
    top: auto;
    bottom: -79px;
    margin: 0;
}
.lightning_swiper .swiper-button-next {
    right: 52px;
}
.lightning_swiper .swiper-button-prev {
    left: auto;
    right: 120px;
}
.lightning_swiper .swiper-button-prev::before {
    content: "";
    width: 1px;
    background-color: var(--vk-color-text-body);
    position: absolute;
    right: -11px;
    top: 0;
    bottom: 0;
}
@media screen and (max-width: 991.98px) {
    .lightning_swiper .swiper-button-prev::before {
        display: none;
    }
}
/* ページャー バナー */
.top-section-slide__swiper .swiper-button-next, 
.top-section-slide__swiper .swiper-button-prev {
    top: calc( 60px - 16px );
    bottom: calc( 84px - 16px );
    margin: 0;
    height: auto;
    background-color: #fff;
    width: calc( 48px + 8px + 8px );
    padding: 0 8px;
}
.top-section-slide__swiper .swiper-button-next {
    right: 0;
}
.top-section-slide__swiper .swiper-button-prev {
    left: 0;
}
.top-section-slide__swiper .swiper-button-next::before,
.top-section-slide__swiper .swiper-button-prev::before {
    pointer-events: none;
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: -1;
    width: 4px;
}
.top-section-slide__swiper .swiper-button-next::before {
    left: 0;
    background: linear-gradient(90deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 0, 1) 85%, rgba(0, 0, 0, 1) 100%);
}
.top-section-slide__swiper .swiper-button-prev::before {
    right: 0;
    background: linear-gradient(270deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 85%, rgba(0, 0, 0, 1) 85%, rgba(0, 0, 0, 1) 100%);
}

/* ページネーション 基本 */
.swiper-pagination-bullets {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    column-gap: 10px;
}
.swiper-pagination-bullet {
    border-radius: 50%;
    width: 10px;
    height: 10px;
    outline: none;
    display: inline-block;
    margin: 0!important;
    background-color: var(--vk-color-text-body);
}
.swiper-pagination-bullet-active {
    background-color: var(--vk-color-text-body);
}
/* ページネーション メインビジュアル */
.lightning_swiper .swiper-pagination-bullets {
    top: auto;
    left: auto;
    right: 16px;
    bottom: -30px!important;
    width: auto!important;
}
@media print, screen and (min-width: 992px) {
    .lightning_swiper .swiper-pagination-bullets {
        right: 216px;
        bottom: -60px!important;
    }
}
/* ページネーション バナー */
.top-section-slide__swiper .swiper-pagination-bullets {
    bottom: 35px;
    justify-content: center;
}

/*--------------------------------------------------------
21.スマホ用下部固定メニュー
--------------------------------------------------------*/
/*なし*/

/*--------------------------------------------------------
22.スクロールヒント
--------------------------------------------------------*/
.scroll-hint-icon {
    border-radius: var(--vk-size-radius);
    background: var(--vk-color-primary);
}
.scroll-hint-text {
    margin-top: 5px;
    margin-bottom: 5px;
    line-height: 1;
}
.c-scrollHint {
    -webkit-animation: FloatHorizontal 2s ease-in-out infinite alternate;
    animation: FloatHorizontal 2s ease-in-out infinite alternate;
    margin-bottom: 2px!important;
    margin-top: 3em;
    text-align: right;
}
.c-scrollHint span {
    align-items: center;
    display: inline-flex;
    font-size: 12px;
    line-height: 1;
    opacity: .75;
    vertical-align: middle;
}
@media (min-width: 768px){
    .sp_, .sp_only {
        display: none!important;
    }
}
.c-scrollHint span i {
    font-size: 16px;
    margin-left: 4px;
}

/*--------------------------------------------------------
トップコンテンツ
--------------------------------------------------------*/

/*------------------------
背景設定
--------------------------*/
.flat-bg {
    background-color: var(--bg);
}
.dot-bg {
    background-image: url("img/parts/dot-bg.svg");
}

/*------------------------
見出し設定
--------------------------*/
/* crese-heading */
.crese-heading {
    
}
h2.crese-heading__title, .crese-heading__title {
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: 26px;
}
.crese-heading__title__line1,
.crese-heading__title__line2 {
    display: block;
}
.crese-heading__title__line1 {
    font-size: 24px; 
}
.crese-heading__title__line2 {
    font-size: 32px; 
}
.full-width-number {
    display: inline-flex;
    transform: translateX(-0.16em);
    letter-spacing: -0.24em;
}
.crese-heading__text-medium {
    font-size: 18px;
}
.crese-heading__text-medium p {
    margin-bottom: 14px;
}
.crese-heading__text-medium p span {
    display: inline-block;
}
.crese-heading__text-small {
    font-size: 14px;
}
.crese-heading__text-small p {
    margin-bottom: 32px;
}

/*------------------------
お知らせバナー スライドショー
--------------------------*/
section.top-section-slide {
    margin-bottom: 72px;
    background-color: var(--bg);
}

@media screen and (max-width: 991.98px) {
    .top-section-slide>.container {
        padding-left: 0;
        padding-right: 0;
    }
}
.top-section-slide__bg {
    background-color: #fff;
}
@media screen and (min-width: 576px) {
    .top-section-slide__bg {
        border-radius: var(--vk-size-radius);
    }
}

@media screen and (max-width: 767.98px) {
    .top-section-slide__inner {
        width: 362px;
        margin: 0 auto;
    }
}
@media screen and (min-width: 768px) {
    .top-section-slide__inner {
        max-width: 1100px;
        margin: 0 auto;
        overflow: hidden;
    }
}
.top-section-slide__swiper {
    padding-top: 60px;
    padding-bottom: 84px;
}
.top-section-slide__swiper .swiper-slide {
    width: auto !important;
    margin: 0 16px;
}
.top-section-slide__swiper .top-section-slide__item img {
    display: block;
    width: 330px;
    height: 184px;
    object-fit: cover;
    border-radius: 10px;
    box-shadow: var(--box-shadow);
}

/*------------------------
セクション トップページニュース
--------------------------*/
.top-section-news {
    padding-bottom: 64px;
}

/*------------------------
セクション 01 ４部門による教育開発
--------------------------*/
section.section-01 {
    margin-bottom: 80px;
}
.section-01-bg {
    background-color: #fff;
    padding-top: 96px;
    padding-bottom: 96px;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}
@media print, screen and (min-width: 992px) {
    .section-01-bg {
        border-radius: 20px;
    }
}
.section-01-bg-illustration {
    height: 88px;
    position: relative;
}
.section-01-bg-illustration::before {
    pointer-events: none;
    content: "";
    display: block;
    width: 288px;
    height: 160px;
    background-image: url("img/top/illustr-02.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: -24px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}
@media screen and (min-width: 768px) {
    .section-01-bg-illustration::before {
        width: 100%;
        background-position: right 16px top 0;
    }
}

/* イラスト */
.top-img-01 picture,
.top-img-01 picture img {
    display: block;
}
@media screen and (min-width: 768px) {
    .top-img-01 {
        max-width: 272px;
        margin-left: auto;
    }
}
@media print, screen and (min-width: 992px) {
    .top-img-01 {
        max-width: 100%;
        margin-left: 0;
    }
}

/* レイアウト 1to1 */
.crese-layout-1to1ratio {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    row-gap: 64px;
}
@media print, screen and (min-width: 992px) {
    .crese-layout-1to1ratio {
        flex-direction: row;
        column-gap: 32px;
    }
    .crese-layout-1to1ratio__left,
    .crese-layout-1to1ratio__right {
        flex-basis: calc( (100% - 32px) / 2 );
    }
    .crese-layout-1to1ratio__left {
        padding-right: 32px;
    }
}

/* レイアウト 1to1 派生（four-item） */
.crese-layout-1to1ratio.four-item {
    row-gap: 32px;
}
.four-item__item {
    max-width: 248px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
@media screen and (max-width: 767.98px) {
    .crese-layout-1to1ratio.four-item {
        align-items: center;
    }
}
@media print, screen and (min-width: 768px) {
    .crese-layout-1to1ratio.four-item {
        flex-direction: row;
        flex-wrap: wrap;
        column-gap: 8%;
        max-width: 584px;
        margin-left: auto;
        margin-right: auto;
    }
    .four-item__item {
        flex-basis: calc( (100% - 8%) / 2 );
    }
}

/* ４部門カード */
.four-item__item__img {
    position: relative;
    display: flex;
    justify-content: center;
}
.four-item__item__img picture,
.four-item__item__img picture img {
    display: block;
}
.four-item__item__title {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}
.four-item__item__title h2 {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    background-color: var(--vk-color-primary);
    border-radius: 999px;
    min-height: 30px;
    line-height: 1.1;
    padding: 4px 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
}
@media print, screen and (min-width: 992px) {
    .four-item__item__title h2 {
        font-size: min(1.44vw, 18px);
    }
}
.four-item__itemB .four-item__item__title h2 {
    background-color: var(--orange);
}
.four-item__itemC .four-item__item__title h2 {
    background-color: var(--gray);
}
.four-item__itemD .four-item__item__title h2 {
    background-color: var(--vk-color-primary-vivid);
}
.four-item__item__text p {
    font-size: 14px;
    margin-bottom: 0;
}

/*------------------------
セクション 02 取り組み事例
--------------------------*/
section.section-02 {
    margin-bottom: 24px;
}

/* レイアウト projects */
.crese-layout-top-projects {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    row-gap: 64px;
}
@media screen and (max-width: 991.98px) {
    .crese-layout-top-projects__left {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        order: 999;
    }
}
@media print, screen and (min-width: 992px) {
    .crese-layout-top-projects {
        flex-direction: row;
        column-gap: 7.2%;
    }
    .crese-layout-top-projects__left {
        flex-basis: 55%;
        padding-top: 8px;
        padding-bottom: 8px;
    }
    .crese-layout-top-projects__right {
        flex-basis: calc( 100% - 55% - 7.2% );
    }
}

/* スライドショー top-cards-swiper */
.js-top-cards-swiper .swiper-wrapper {
  transition-timing-function: linear !important;
}
.top-cards-swiper {
  overflow: hidden;
}
.top-cards-swiper .swiper-slide {
  width: auto !important;
}
.top-cards-swiper .top-card img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 16px;
}