@charset "UTF-8";
:root,
[data-bs-theme="light"] {
  --bs-blue: #0092E5;
  --bs-indigo: #0051A4;
  --bs-pink: #FF99A0;
  --bs-red: #CC0000;
  --bs-orange: #FF9900;
  --bs-yellow: #F9F871;
  --bs-green: #00CDDA;
  --bs-teal: #CEEFB9;
  --bs-cyan: #C7DFFF;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #E9E8E9;
  --bs-gray-dark: #555555;
  --bs-gray-100: #F1F1F1;
  --bs-gray-200: #E3ECF5;
  --bs-gray-300: #E9E8E9;
  --bs-gray-400: #C6C6C6;
  --bs-gray-500: #999999;
  --bs-gray-600: #7E7E7E;
  --bs-gray-700: #555555;
  --bs-gray-800: #343a40;
  --bs-gray-900: #333333;
  --bs-primary: #0051A4;
  --bs-secondary: #0092E5;
  --bs-success: #00CDDA;
  --bs-info: #00B2EE;
  --bs-warning: #F9F871;
  --bs-danger: #CC0000;
  --bs-light: #E3ECF5;
  --bs-dark: #000;
  --bs-primary-rgb: 0, 81, 164;
  --bs-secondary-rgb: 0, 146, 229;
  --bs-success-rgb: 0, 205, 218;
  --bs-info-rgb: 0, 178, 238;
  --bs-warning-rgb: 249, 248, 113;
  --bs-danger-rgb: 204, 0, 0;
  --bs-light-rgb: 227, 236, 245;
  --bs-dark-rgb: 0, 0, 0;
  --bs-primary-text-emphasis: #002042;
  --bs-secondary-text-emphasis: #003a5c;
  --bs-success-text-emphasis: #005257;
  --bs-info-text-emphasis: #00475f;
  --bs-warning-text-emphasis: #64632d;
  --bs-danger-text-emphasis: #520000;
  --bs-light-text-emphasis: #555555;
  --bs-dark-text-emphasis: #555555;
  --bs-primary-bg-subtle: #C7DFFF;
  --bs-secondary-bg-subtle: #d9effb;
  --bs-success-bg-subtle: #ccf5f8;
  --bs-info-bg-subtle: #E3F9FB;
  --bs-warning-bg-subtle: #fefee3;
  --bs-danger-bg-subtle: #f5cccc;
  --bs-light-bg-subtle: #f8f8f8;
  --bs-dark-bg-subtle: #C6C6C6;
  --bs-primary-border-subtle: #C7DFFF;
  --bs-secondary-border-subtle: #C7DFFF;
  --bs-success-border-subtle: #99ebf0;
  --bs-info-border-subtle: #99e0f8;
  --bs-warning-border-subtle: #fdfcc6;
  --bs-danger-border-subtle: #eb9999;
  --bs-light-border-subtle: #E3ECF5;
  --bs-dark-border-subtle: #999999;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-root-font-size: 1rem;
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 500;
  --bs-body-line-height: 2;
  --bs-body-color: #333333;
  --bs-body-color-rgb: 51, 51, 51;
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: rgba(51, 51, 51, 0.75);
  --bs-secondary-color-rgb: 51, 51, 51;
  --bs-secondary-bg: #E3ECF5;
  --bs-secondary-bg-rgb: 227, 236, 245;
  --bs-tertiary-color: rgba(51, 51, 51, 0.5);
  --bs-tertiary-color-rgb: 51, 51, 51;
  --bs-tertiary-bg: #F1F1F1;
  --bs-tertiary-bg-rgb: 241, 241, 241;
  --bs-heading-color: inherit;
  --bs-link-color: #000;
  --bs-link-color-rgb: 0, 0, 0;
  --bs-link-decoration: none;
  --bs-link-hover-color: #0051A4;
  --bs-link-hover-color-rgb: 0, 81, 164;
  --bs-code-color: #0051A4;
  --bs-highlight-bg: #fefee3;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #E9E8E9;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 1.5rem;
  --bs-border-radius-sm: 0.5rem;
  --bs-border-radius-lg: 1.5rem;
  --bs-border-radius-xl: 1rem;
  --bs-border-radius-xxl: 2rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 1.5rem;
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 2rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: rgba(0, 81, 164, 0.25);
  --bs-form-valid-color: #00CDDA;
  --bs-form-valid-border-color: #00CDDA;
  --bs-form-invalid-color: #CC0000;
  --bs-form-invalid-border-color: #CC0000; }



/* fadeUpをするアイコンの動き */
/* その場で */
.fadeIn {
  animation-name: fadeInAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

.fadeInLong {
  animation-name: fadeInAnime;
  animation-duration: 2s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeInAnime {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
.fadeUp {
  animation-name: fadeUpAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
/* 上から */
.fadeDown {
  animation-name: fadeDownAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeDownAnime {
  from {
    opacity: 0;
    transform: translateY(-100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
/* 左から */
.fadeLeft {
  animation-name: fadeLeftAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeLeftAnime {
  from {
    opacity: 0;
    transform: translateX(-100px); }
  to {
    opacity: 1;
    transform: translateX(0); } }
/* 右から */
.fadeRight {
  animation-name: fadeRightAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeRightAnime {
  from {
    opacity: 0;
    transform: translateX(100px); }
  to {
    opacity: 1;
    transform: translateX(0); } }






.h_type1 {
    z-index: 1;
    letter-spacing: 0.3rem;
    display: flex;
    flex-direction: column;
    font-size: clamp(5rem, calc(3rem + 8.89vw), 13rem);
}
.h_type1--ja {
    font-family: YakuHanJP, "Zen Kaku Gothic Antique", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    display: inline-flex;
    align-items: center;
    font-size: 20%;
    font-weight: 500;
}

.h_type1--en {
    font-family: "Alumni Sans Pinstripe", sans-serif;
    font-style: italic;
    font-weight: 400;
    line-height: 1;
    margin-bottom: 1rem;
    letter-spacing: 0.10em;
}




.fadeLeft {
    animation-name: fadeLeftAnime;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
    opacity: 0;
}



.text-primary {
    --bs-text-opacity: 1;
    color: rgba(var(--bs-primary-rgb), var(--bs-text-opacity)) !important;
}
.text-secondary {
    --bs-text-opacity: 1;
    color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important;
}



@media (min-width: 768px) {
    .mb-md-5 {
        margin-bottom: 5.5rem !important;
    }
}
.mb-4 {
    margin-bottom: 3rem !important;
}

@media (min-width: 768px) {
    .mb-md-4 {
        margin-bottom: 3rem !important;
    }
}
.mb-3 {
    margin-bottom: 1.5rem !important;
}



h2, .h2 {
    font-size: clamp(1.2rem, calc(0.927rem + 1.16vw), 1.8rem);
}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 700;
    line-height: 1.6;
    color: var(--bs-heading-color);
}



.top-recruit2 {
    position: relative;
    background: #e3ecf5;
    overflow-x: hidden;
    letter-spacing: 0.2em;
}


.top-recruit2 .top-bg-recruit {
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    display: flex;
    justify-content: center;
    align-items: center;
}

    

.main-text-wrapper {
    text-align:left;
}
.recruit-main-text2 {
    width: 45%;
    margin-bottom: 30px;
    font-weight: 500;
    
}

@media (max-width: 1023px) {
    .recruit-main-text2 {
        width: 100%;
    }
}

@media (max-width: 1023px) {
    .top-recruit2 .ipad-block {
        margin-bottom: 30px;
    }
}
@media (max-width: 1023px) {
    .top-recruit2 .top-bg-recruit {
        display: none;
    }
}

.position-relative {
    position: relative !important;
}

.btn-primary {
    color: #fff !important;
    border: none;
}
.btn {
    cursor: pointer;
    position: relative;
    background-color: transparent;
}
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 180px;
    z-index: 1;
}

.btn-primary::before {
    background-image: linear-gradient(90deg, #0092E5 20%, #F9F871 100%);
    transition: all 0.3s ease-in-out;
}


.btn-primary::after {
      content: '';
      display: inline-block;
      position: absolute;
      top: 50%;
      right: -30px;
      width: 56px;
      height: 8px;
      background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 85.21 13.73'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: none; stroke: %2300b2ee; stroke-width: 2px; %7D %3C/style%3E%3C/defs%3E%3Cg%3E%3Cpath class='cls-1' d='M0,12.73h82.67L69.75.73'/%3E%3C/g%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-size: contain;
      background-position: center; }




.btn-primary:hover::before, .btn-primary:active::before {
    background-position: 0;
    background-color: #0092E5;
    transition: all 0.3s ease-in-out;
}
.btn:hover::before, .btn:active::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px;
    right: 10px;
    z-index: -1;
    background-size: 300%;
    background-color: transparent;
    transform: skewX(-8deg);
}




.btn::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px;
    right: 10px;
    z-index: -1;
    background-position: 100%;
    background-size: 130%;
    transform: skewX(-8deg);
}
.recimg img {
    border-radius: 1.5rem;
}

.recimg:hover img {
    opacity: 0.7;
    transition: all 0.3s ease-in-out;
}

.btn-primary:hover, .btn-primary:active {
    color: #fff;
}
.btn:hover, .btn:active {
    background-position: 0;
    background-color: transparent;
    --bs-btn-active-bg: transparent;
}
.btn:hover {
    color: var(--bs-btn-hover-color);
    
    border-color: var(--bs-btn-hover-border-color);
}








.ml-clamp {
    margin-left: clamp(0rem, calc(-3.533rem + 15.7vw), 21rem);
}
.position-relative {
    position: relative !important;
}
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #0051A4;
    --bs-btn-border-color: #0051A4;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #004994;
    --bs-btn-hover-border-color: #004183;
    --bs-btn-focus-shadow-rgb: 38, 107, 178;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #004183;
    --bs-btn-active-border-color: #003d7b;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #0051A4;
    --bs-btn-disabled-border-color: #0051A4;
}
.btn {
    --bs-btn-padding-x: 2rem;
    --bs-btn-padding-y: 1rem;
    --bs-btn-font-family: ;
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 500;
    --bs-btn-line-height: 2;
    --bs-btn-color: var(--bs-body-color);
    --bs-btn-bg: transparent;
    --bs-btn-border-width: var(--bs-border-width);
    --bs-btn-border-color: transparent;
    --bs-btn-border-radius: 0rem;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
    --bs-btn-disabled-opacity: 0.65;
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
    display: inline-block;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    font-family: var(--bs-btn-font-family);
    font-size: var(--bs-btn-font-size);
    font-weight: var(--bs-btn-font-weight);
    line-height: var(--bs-btn-line-height);
    color: var(--bs-btn-color);
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
    border-radius: var(--bs-btn-border-radius);
    background-color: var(--bs-btn-bg);
    transition: all 0.3s ease-in-out;
}
a {
    transition: all .3s ease-in-out !important;
}

a:hover {
    --bs-link-color-rgb: var(--bs-link-hover-color-rgb);
}















/*全共通*/
.bgextend {
  animation-name: bgextendAnimeBase;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  position: relative;
  overflow: hidden;
  /*　はみ出た色要素を隠す　*/
  opacity: 0;
  color: #fff;
  font-family: YakuHanJP, "Zen Kaku Gothic Antique", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  padding: 0.5em 1em 0.5em 1em;
  display: inline-flex;
  line-height: 1.7em;
  font-weight: 700; }

.int_title .bgextend {
  font-size: clamp(0.8rem, calc(-0.1rem + 4vw), 1.1rem); }

.int_title2 .bgextend {
  font-size: clamp(0.8rem, calc(0.5rem + 1.33vw), 2rem); }

@keyframes bgextendAnimeBase {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
/*中の要素*/
.bgappear {
  animation-name: bgextendAnimeSecond;
  animation-duration: 1s;
  animation-delay: 0.6s;
  animation-fill-mode: forwards;
  opacity: 0;
  margin-right: 1em; }

@keyframes bgextendAnimeSecond {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/*左から右*/
.midashi-info .bgLRextend::before {
  background-color: #00B2EE; }

.bgLRextend::before {
  animation-name: bgLRextendAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #0092E5;
  top: -0.25rem;
  left: -1rem; }

.bgextend.acc_yellow {
  -webkit-text-stroke-width: 1px;
  padding: 0 0 0 0.2em;
  -webkit-text-stroke-color: #0092E5;
  font-weight: 900;
  font-style: initial;
  color: #fff; }
  .bgextend.acc_yellow .bgappear {
    background: #F9F871;
    margin-left: -0.1em;
    padding: 0 0.2em; }
  .bgextend.acc_yellow::before {
    background: transparent; }

.bgextend.acc_white .bgappear {
  margin-left: -0.1em; }
.bgextend.acc_white::before {
  background: #fff; }

@keyframes bgLRextendAnime {
  0% {
    transform-origin: left;
    transform: scaleX(0); }
  50% {
    transform-origin: left;
    transform: scaleX(1); }
  50.001% {
    transform-origin: right; }
  100% {
    transform-origin: right; } }
/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.bgappearTrigger,
.bgLRextendTrigger {
  opacity: 0; }