@charset "UTF-8";

/* ============================
　z-index: デフォルト設定（覚書）
============================
※ z-index は四桁までにする

0001        : body
0002 - 0050 : 原則未使用（どうしても一番下に置きたい時のみ）
0051        : body>main
0052 - 0150 : 各種コンテンツ [100を基本値として扱う（各要素内での上下関係は 99 - 101 を基本）]
0151        : body>footer [041 に移動の可能性あり]
0155        : body>header [045 に移動の可能性あり]
0156 - 0198 : 各種コンテンツ・ヘッダー・フッターに対して、必ず上に乗せたい要素（原則未使用）
0199        : .modal-overlay [モーダル未使用なら欠番]
0200        : .modal-window [モーダル未使用なら欠番]
9001        : #js_pagetop [152 に移動の可能性あり]
9990        : #js_loader [読み込み画面未使用なら欠番]
9998        : !important
9999 -      : 原則未使用
===== ===== ==== */

/*============================
　共通設定
============================*/
html {
  -webkit-text-size-adjust: 100%;
  /* ↑ iPhone safari が勝手にフォントサイズを変えるのを抑制 */
}

body {
  font-weight: 500;
  font-feature-settings: "halt";
  /* =====
  100	Thin (Hairline)
  200	Extra Light (Ultra Light)
  300	Light
  400	Normal (Regular)
  500	Medium
  600	Semi Bold (Demi Bold)
  700	Bold
  800	Extra Bold (Ultra Bold)
  900	Black (Heavy)
  ===== */
  position: relative;
  z-index: 1;
  color: var(--default_font_color);
  line-height: 1.75;
  font-weight: 400;
  font-size: 16px;
}

img {
  height: auto;
  max-width: 100%;
  width: auto;
}

a:hover {
  opacity: 0.6;
  transition: 0.3s;
}

b,
u,
i,
em {
  font-weight: normal;
  text-decoration: none;
  font-style: normal;
  font-style: normal;
}

/*  */
.look_pc {
  display: block;
}

.look_sp {
  display: none;
}

@media screen and (max-width: 767px) {
  .look_pc {
    display: none;
  }

  .look_sp {
    display: block;
  }

  _::-webkit-full-page-media,
  _:future,
  :root input,
  _::-webkit-full-page-media,
  _:future,
  :root select,
  _::-webkit-full-page-media,
  _:future,
  :root textarea {
    color: initial !important;
    font-size: initial !important;
    /* ↑ iPhone safari の変なスタイルを上書きで無効化 */
  }
}

:root {
  color-scheme: only light;
  /* ↑ ダークモード対策 */

  /* 基本カラー設定 */
  --default01_color-set01: #ff8800;
  --default02_color-set01: #0030b6;
  --default03_color-set01: #016c01;
  --default04_color-set01: #d00f0f;
  --default05_color-set01: #777;

  /*P*/
  --primary_color: #3d62b0;
  /*S*/
  --secondary_color: #5d82b4;
  /*T*/
  --tertiary_color: #1157b6;
  /*bg_a*/
  --background_color_a: #ebeff7;
  /*bg_b*/
  --background_color_b: #e4e9e6;
  /*bg_c*/
  --background_color_c: #222736;
  /*font*/
  --default_font_color: #3c3c3c;
  /*採用関連*/
  --inquiry_color: #00bea6;

  /* 共通角丸設定 */
  --border-radius_default: 10px;

  /* コンテンツ幅 */
  --contents_wide_s: 375px;
  --contents_wide_default: 1240px;
  --contents_wide_L: 1390px;
  --contents_wide_max: 1920px;
  --responsive-change: 767px;

  --wrapper_padding: 20px;

}

/*============================
　コンテンツ関連
============================*/

/* ===== フェイドイン ===== */
.fade_d {
  opacity: 0;
  transform: translate(0px, 60px);
  transition: all 1600ms;
  visibility: hidden;
}

.fade_u {
  opacity: 0;
  transform: translate(0px, -60px);
  transition: all 1600ms;
  visibility: hidden;
}

.fade_l {
  opacity: 0;
  transform: translate(60px, 0px);
  transition: all 1600ms;
  visibility: hidden;
}

.fade_r {
  opacity: 0;
  transform: translate(-60px, 0px);
  transition: all 1600ms;
  visibility: hidden;
}

.fade_in {
  opacity: 0;
  transform: translate(0px, 0px);
  transition: all 2000ms;
  visibility: hidden;
}

.fadeEnd {
  opacity: 1;
  transform: translate(0px, 0px);
  visibility: visible;
}

/* ===== ===== 汎用 ===== ===== */

/* site header */
/* body>header {
}

body>header>.wrapper {
} */

/* site main */
body>main {
  z-index: 51;
  overflow: hidden;
  position: relative;
}

/* site footer */
/* body>footer {
}

body>footer>.wrapper {
} */

/* その他 */
table {
  border-collapse: collapse;
  border-spacing: 0;
  /* ↑ tableのボーダーを被らせる設定 */
}

.js-tel a {
  color: #00f;
  text-decoration: underline;
}

/* @media screen and (max-width: 767px) {
  body>header {
    padding: 0;
  }
} */

/*============================
　トップページ
============================*/
/* body.topPage {
  background-color: #fefcf3;
} */

/*  */
.box_slider {
  position: relative;
}

/* input・select スタイリングリセット */
input,
select {
  /* -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 1px solid #000;
  border-radius: 0px; */
  all: unset;
}

/* iOSでのデフォルトアイコンを非表示にする */
details summary {
  list-style: none;
  /* リストスタイルの削除 */
}

/* Safari特有のデフォルトマーカーを非表示にする */
summary::-webkit-details-marker {
  display: none;
}

/*============================
　アクセスレンズ ハック
============================*/
:root:root:root #uni-toolbar:not(.uni-toolbar-disabled) #style_selector .style-toggle {
  top: 20px;
  left: 35px;
}

:root:root:root #uni-toolbar #style_selector .style-toggle {
  -webkit-box-shadow: 1px 1px 4px 0px rgba(0, 0, 0, .22);
  box-shadow: 1px 1px 4px 0px rgba(0, 0, 0, .22);
}

:root:root:root #uni-toolbar #style_selector #style_selector_container {
  background: #1157b6;
}

@media screen and (max-width: 1150px) { /* 767px */
  :root:root:root #uni-toolbar:not(.uni-toolbar-disabled) #style_selector .style-toggle {
    top: 60px;
    left: 5px;
  }
}

/**/
        .pagebottom-banner_kaigai {
            display: flex;
            gap: 15px;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            margin: 120px 0 160px!important;
        }

        .pagebottom-banner_kaigai li {
            width: 100%;
            list-style: none;
        }

        .pagebottom-banner_kaigai li a {
            color: #fff;
            height: 100%;
            padding: 20px 4vw;
            display: grid;
            align-items: center;
            align-content: center;
            gap: 0 40px;
            text-decoration: none;
            width: 100%;
            min-height: 195px;
            grid-template-columns: auto auto;
            justify-items: stretch;
            justify-content: space-between;
            background-image: url(<?php echo get_template_directory_uri(); ?>/assets/image/pagebottom-banner_kaigai_backimg.jpg);
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
        }

        .pagebottom-banner_kaigai li a header {
            display: grid;
            line-height: 1;
            align-items: stretch;
            justify-items: start;
            justify-content: start;
        }

        .pagebottom-banner_kaigai li a header h3 {
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 20px;
            font-weight: 400;
            align-items: center;
            font-family: "Poiret One", sans-serif;
            border: none;
        }

        .pagebottom-banner_kaigai li a header h3::before {
            width: 35px;
            aspect-ratio: 1/.4;
            background-image: url(/include/image/pagebottom-banner_icon03.svg);
            content: "";
            display: inline-block;
            background-position: center;
            background-size: contain;
            background-repeat: no-repeat;
            margin-right: 10px;
        }

        .pagebottom-banner_kaigai li a header p {
            font-size: 26px;
            line-height: 1.4;
            font-weight: 500;
        }

        .pagebottom-banner_kaigai li a p {
            font-size: 16px;
        }

        .pagebottom-banner_kaigai li .arrow {
            margin-bottom: 0;
        }

        .pagebottom-banner_kaigai li .arrow::after {
            content: "";
            display: inline-block;
            background-image: url(/include/image/pagebottom-banner_icon04.svg);
            width: 30px;
            aspect-ratio: 1/.4;
            background-position: center bottom;
            background-size: contain;
            background-repeat: no-repeat;
            margin-left: 10px;
        }

        @media screen and (max-width: 767px) {
            .pagebottom-banner_kaigai {
                margin-top: 40px;
                margin-bottom: 20px;
            }

            .pagebottom-banner_kaigai li {
                width: 100% !important;
            }

            .pagebottom-banner_kaigai li a {
                grid-template-columns: 1fr;
                padding: 20px 35px;
                grid-template-columns: 1fr;
                justify-items: start;
                min-height: 180px;
                padding: 30px;
            }

            .pagebottom-banner_kaigai li a .arrow::after {
                width: 25px;
            }

            .pagebottom-banner_kaigai li a header::before {
                width: 24px;
            }

            .pagebottom-banner_kaigai li a header h3 {
                font-size: 16px;
            }

            .pagebottom-banner_kaigai li a header p {
                font-size: 20px;
            }

            .pagebottom-banner_kaigai li a p {
                font-size: 13px;
            }

            .pagebottom-banner_kaigai li a p:nth-of-type(2) {
                font-size: 14px;
                margin-bottom: 0;
            }

            .pagebottom-banner_kaigai li a header {
                margin-bottom: 10px;
            }

            .pagebottom-banner_kaigai li a h3 {
                font-size: 24px;
            }

            .pagebottom-banner_kaigai li a p {
                margin-bottom: 10px;
            }

        }