@charset "UTF-8";
/*-----------------------------------------------------
Reset
----------------------------------------------------- */
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section , main { display: block; }

a:link, a:visited, a:hover, a:active { text-decoration: none; }

html { scroll-behavior:smooth; scrollbar-gutter: stable; }
/*[id] {scroll-margin-top:40px;}*/
body { line-height: 1; text-align: justify; background: #fff; color: #323232; font-family: "Noto Sans JP", sans-serif; font-weight: 400; }
ol, ul { list-style: none; color: #333; }
table { border-collapse: collapse; border-spacing: 0; }

* { margin: 0; padding: 0; }
img { max-width: 100%; width: 100%; height: auto; vertical-align: bottom; flex-shrink: 0; }
picture { display: block; }
h1, h2, h3, h4, h5, h6 { font-feature-settings: "palt"; font-weight: initial; line-height: 1.5; }
p { font-feature-settings: "palt"; line-height: 1.6; }

/*オーバーレイ*/
.overlay { background: #fff; position: fixed; top: 0; left: 0; height: 100%; width: 100%; z-index: 10000; }

/*fade*/
.fade { opacity: 0; transition: opacity 1s, transform 1s; }
.fade.is_inview { opacity: 1; transition-delay: 1s; }

.fade_early { opacity: 0; transition: opacity 1s; }
.fade_early.is_inview { opacity: 1; transition-delay: .1s; }

.fadeup { opacity: 0; transform: translateY(20px); transition: opacity 1s, transform 1s; }
.fadeup.is_inview { opacity: 1; transform: translateY(0); transition-delay: .3s; }

.fadeup02 { opacity: 0; transform: translateY(20px); transition: opacity 2s, transform .8s; }
.fadeup02.is_inview  { opacity: 1; transform: translateY(0); transition-delay: .2s; }

.fadeup03 { opacity: 0; transform: translateY(20px); transition: opacity 2s, transform 1s; }
.fadeup03.is_inview  { opacity: 1; transform: translateY(0); transition-delay: .3s; }

.fadeup04 { opacity: 0; transform: translateY(20px); transition: opacity 2s, transform 1s; }
.fadeup04.is_inview  { opacity: 1; transform: translateY(0); transition-delay: .4s; }

.fadeup05 { opacity: 0; transform: translateY(20px); transition: opacity 2s, transform 1s; }
.fadeup05.is_inview  { opacity: 1; transform: translateY(0); transition-delay: .5s; }

.fadeleft { opacity: 0; transform: translateX(-20px); transition: opacity 1s ease, transform 1s ease; }
.fadeleft.is_inview { opacity: 1; transform: translateX(0); transition-delay: .3s; }

.blur{ opacity: 0; filter: blur(12px); transition: opacity 1.2s ease, filter 1.2s ease; }
.blur.is_inview { opacity: 1; filter: blur(0); transition-delay: .6s; }

.blur02{ opacity: 0; filter: blur(12px); transition: opacity 1.2s ease, filter 1.2s ease; }
.blur02.is_inview { opacity: 1; filter: blur(0); transition-delay: .8s; }

.blur03{ opacity: 0; filter: blur(12px); transition: opacity 1.2s ease, filter 1.2s ease; }
.blur03.is_inview { opacity: 1; filter: blur(0); transition-delay: 1s; }

.pc { display: block; }
.tab { display: none; }
.sp { display: none; }
/*main { padding-bottom: 130px; }*/

[data-size="w750"]{ max-width: 750px; margin: 0 auto; }
[data-size="w800"]{ max-width: 800px; margin: 0 auto; }
[data-size="w900"]{ max-width: 900px; width: 90%; margin: 0 auto; }
[data-size="w1000"]{ max-width: 1000px; width: 90%; margin: 0 auto; }
[data-size="w1200"]{ max-width: 1200px; width: 90%; margin: 0 auto; }
[data-size="w1300"] { max-width: 1300px; width: 90%; margin: 0 auto; }
[data-size="w1440"] { max-width: 1440px; width: 90%; margin: 0 auto; }
[data-size="padding_inner"]{ padding-left: 20px; padding-right: 20px; box-sizing: border-box; margin: 0 auto; }

:root {
	--blue-color: #013396;
  --fixed-header-height: 100px;
  --font-Mincho: "Shippori Mincho", serif;
  --font-Mincho-B1: "Shippori Mincho B1", serif;
}
@media screen and (max-width: 600px) {
    :root {
        --fixed-header-height: 60px;
    }
}

.l-header { position: fixed; top: 0; left: 0; width: 100%; height: var(--fixed-header-height); box-sizing: border-box; z-index: 999; transition: background-color 0.3s; }
.l-header.is-scrolled { background-color: rgba(255,255,255,.4); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
/* iOSで効かない環境のフォールバック */
@supports not ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
  .l-header.is-scrolled { background-color: rgba(255,255,255,.9); }
}
.l-header-container { display: flex; align-items: center; justify-content: space-between; height: 100%; }
.l-header-logo { max-width: none; padding: 0 2% 0 3%; }
.l-header-logo__link img { width: clamp(180px, 20vw, 240px); height: auto; }
@media (hover: hover) and (pointer: fine) { 
  .l-header-logo__link { transition: opacity 0.3s; } 
  .l-header-logo__link:hover { opacity: 0.8; }
}
.l-header-menu { display: flex; align-items: stretch; justify-content: space-between; gap: 0; }
.l-header-menu__container { display: flex; align-items: center; gap: 30px; margin-right: 30px; }
.l-header-nav__list { display: flex; align-items: center; gap: clamp(16px, 2vw, 28px); }
.l-header-nav__link { color: inherit; font-size: clamp(16px, 1.2vw, 16px); }
@media (hover: hover) and (pointer: fine) { 
  .l-header-nav__link { transition: color .2s ease; white-space: nowrap; }
  .l-header-nav__link:hover { color: #39b6b6; }
}
.l-header-nav__item .recruit::after { content: ''; display: inline-block; background: url("../img/common/icon_link.svg") no-repeat; background-size: contain; width: 15px; height: 12px; margin-left: 5px; }
.link_icons { display: flex; align-items: center; flex-wrap: nowrap; }
.link_icons a.eneflenet img { max-width: 180px; height: auto; }
.link_icons a.x { display: flex; align-items: center; border-left: 1px solid #D6D6D6; padding-inline-start: 12px; margin-inline-start: 12px; }
.link_icons a.x img { max-width: 20px; height: auto; }
.link_search { display: flex; align-items: center; justify-content: center; background: var(--blue-color); height: var(--fixed-header-height); border-bottom-left-radius: 20px; padding-inline: clamp(15px, 4vw, 3%); box-sizing: border-box; transition: background-color .3s ease; color: #fff!important; text-decoration: none; white-space: nowrap; gap: 10px; }
.link_search a { color: #fff; display: flex; align-items: center; gap: 10px; white-space: nowrap; width: 100%; height: 100%; }
.link_search img { max-width: 31px; height: auto; transform: scale(1); transition: transform .3s ease; }
@media (hover: hover) and (pointer: fine) {
  .link_search:hover img { transform: scale(1.2); }
  .link_search:hover { background: #323232; }
}

.l-header-menu-button { display: none; }
.l-header-menu-button__lines { position: absolute; width: 30px; height: 20px; transition: transform .35s ease; will-change: transform; right: 10px; top: 7px; }
.l-header-menu-button__line { position: absolute; left: 0; width: 100%; height: 2px; background-color: #013396; border-radius: 1px; transition: transform .35s ease, opacity .2s ease, background-color .2s ease; transform-origin: 50% 50%; }
.l-header-menu-button__line--top { top: 0; }
.l-header-menu-button__line--center { top: 50%; transform: translateY(-50%); }
.l-header-menu-button__line--bottom { bottom: 0; }

.is-menu-opened .l-header-menu-button__lines { transform: rotate(180deg); }
.is-menu-opened .l-header-menu-button__line--top { transform: translateY(9px) rotate(45deg); }
.is-menu-opened .l-header-menu-button__line--center { opacity: 0; }
.is-menu-opened .l-header-menu-button__line--bottom { transform: translateY(-9px) rotate(-45deg); }

.is-menu-opened .l-header-menu-button__line { background-color: #013396; }

@media (prefers-reduced-motion: reduce) {
.l-header-menu-button__lines { transition: none; }
.l-header-menu-button__line { transition: none; }
}

/*-----------------------------------------------------
  MEGAMENU
----------------------------------------------------- */
.has-megamenu { position: relative; }
.megamenu { position: absolute; top: 100%; left: 0; background: #fff; box-shadow: 0 4px 16px rgba(0,0,0,0.1); border-radius: 8px; padding: 24px 32px; opacity: 0; visibility: hidden; transform: translateY(25px); transition: opacity .3s ease, transform .3s ease, visibility .3s; min-width: 260px; z-index: 99; }
.megamenu ul { display: grid; gap: 8px; }
.megamenu a { display: block; font-size: clamp(15px, 1.2vw, 16px); padding: 4px 0; transition: color .2s ease; color: #323232; }
.megamenu a:hover { color: #39b6b6; }
@media (hover: hover) and (pointer: fine) {
  .has-megamenu:hover > .megamenu { opacity: 1; visibility: visible; transform: translateY(15px); }
}

/*-----------------------------------------------------
  MEGAMENU HOVER DECORATION
----------------------------------------------------- */
.megamenu li { position: relative; }
.megamenu li::before { content: ''; position: absolute; left: -16px; top: 50%; transform: translateY(-50%) scale(0); width: 10px; height: 10px; border-radius: 50%; background: linear-gradient(180deg, #41bbb9 0%, #013396 100%); opacity: 0; transition: transform .3s ease, opacity .3s ease; }
.megamenu li:hover::before { opacity: 1; transform: translateY(-50%) scale(1); }

/*-----------------------------------------------------
  BNR LINK
----------------------------------------------------- */
.bnr_link { max-width: 1440px; width: 90%; margin: 0 auto 120px; padding: 0 clamp(16px, 3vw, 40px); display: flex; justify-content: space-between; gap: 30px;}
.bnr_link a { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; max-width: 700px; aspect-ratio: 16 / 6; overflow: hidden; border-radius: 16px; }
.bnr_link a img.bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; transform-origin: center; transition: transform .6s ease; }
.bnr_link a .txt_wrap { position: relative; z-index: 2; }
.bnr_link a.search img.icon { max-width: 55px; height: auto; display: block; margin: 0 auto 10px; }
.bnr_link a.contact img.icon { max-width: 50px; height: auto; display: block; margin: 0 auto 10px; }
.bnr_link a.mail img.icon { max-width: 57px; height: auto; display: block; margin: 0 auto 10px; }
.bnr_link a p { font-size:clamp(14px,3vw, 30px); font-family: var(--font-Mincho); font-weight: 500; color: #fff; margin: 0; letter-spacing: .13em; }
.bnr_link a::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.5); opacity: 0; transition: opacity .6s ease; z-index: 1; }
@media (hover: hover) and (pointer: fine) {
  .bnr_link a:hover img.bg { transform: scale(1.1); }
  .bnr_link a:hover::before { opacity: 1; }
}

/*-----------------------------------------------------
  FOOTER
----------------------------------------------------- */
footer .footer_top { background: #01C6CA; background: linear-gradient(90deg, rgba(1, 198, 202, 1) 0%, rgba(1, 51, 150, 1) 100%); padding: 80px 0; box-sizing: border-box; }
footer .footer_inner { width: 90%; margin: 0 auto; }
footer .footer_flex { display: flex; justify-content: space-between; align-items: center; gap: 50px; }
footer .logo img { max-width: 243px; width: 100%; }

footer .footer_bottom { background: #fff; padding: 30px 0; }
footer .footer_top_nav { display: flex; flex-wrap: wrap; gap: 30px; }
footer .footer_top_nav__block { flex: 1 1 auto; }
footer .footer_top_nav__heading { font-weight: bold; margin: 0 0 20px; font-size: clamp(15px, 1.2vw, 18px); color: #fff; font-weight: 700; }
footer .footer_top_nav li { margin: 0 0 10px;}
footer .footer_top_nav a { font-size: clamp(13px, 1.2vw, 16px); color: #fff; font-weight: 500; transition: color .2s ease; }
footer .footer_bottom_nav { display: flex; flex-wrap: wrap; gap: 15px; margin-bottom: 10px; }
footer .footer_bottom_nav a { margin: 0 0 12px; font-size: clamp(12px, 1.2vw, 16px); font-weight: 500; transition: color .2s ease; color: #323232; }
footer .footer_bottom small { font-size: clamp(10px, 1.2vw, 14px); color: #B2B2B2; text-align: right; display: block; }
@media (hover: hover) and (pointer: fine) {
  footer .footer_top_nav a:hover { color: #8feaff; }
  footer .footer_bottom_nav a:hover { color: #39b6b6; }
}

/*pagetop*/
.l-footer-pagetop { position: sticky; bottom: 0; }
.l-footer-pagetop__btn { position: absolute; bottom: 15px; right: 15px; z-index: 9; visibility: hidden; opacity: 0; transition: 0.5s; max-width: 60px; }
.l-footer-pagetop__btn.is-show { visibility: visible; opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto !important; }
}

@media (hover: hover) and (pointer: fine) {
  .l-footer-pagetop__btn.is-show:hover { opacity: 0.4; }
}

@media print {
  header , footer { display: none!important; }
}

@media screen and (max-width: 1024px) {
  .l-header-nav { margin-bottom: 30px; }
  .l-header-nav__list { display: none; }
  .l-header-menu-button { display: block; position: relative; padding: 15px; border: 0; background: none; cursor: pointer; right: 3%; }
  .l-header-menu { position: fixed; top: var(--fixed-header-height); left: 0; right: 0; width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 35px; padding: 24px; z-index: 998; height: calc(100vh - var(--fixed-header-height)); height: calc(100svh - var(--fixed-header-height)); height: calc(100dvh - var(--fixed-header-height)); max-height: calc(100dvh - var(--fixed-header-height)); overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(6px); transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s; box-sizing: border-box; }
  body.is-menu-opened .l-header-menu { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); transition: opacity .2s ease, transform .2s ease, visibility 0s; }
  body.is-menu-opened { overflow: hidden; }
  body::before { content: ''; position: fixed; inset: 0; background-color: rgba(255,255,255,70%); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); z-index: 997; opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility 0s linear .2s; }
  body.is-menu-opened::before { opacity: 1; visibility: visible; transition: opacity .2s ease, visibility 0s; }
  .l-header-menu__container { width: 100%; margin-right: 0; display: block; }
  body.is-menu-opened .l-header-nav__list { display: flex; flex-direction: column; gap: 8px; width: 100%; }
  .link_search { margin: 0 auto; border-radius: 10px; height: initial; padding: 20px 30px; min-width: 250px; }
  .link_search a { justify-content: center; }
  .l-header-nav__item { width: 100%; }
  .has-megamenu { width: 100%; }
  .has-megamenu > .l-header-nav__link { display: flex !important; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 10px 0; line-height: 1.4; white-space: nowrap; font-weight: 700; }
  .has-megamenu > .l-header-nav__link span, .has-megamenu > .l-header-nav__link strong { overflow: hidden; text-overflow: ellipsis; }
  .has-megamenu > .l-header-nav__link::after { content: '+'; flex: 0 0 auto; font-size: 30px; color: #013396; transform: none; transition: transform .2s ease; line-height: 1; font-weight: 400; }
  .has-megamenu.open > .l-header-nav__link::after { transform: rotate(45deg); }
  .l-header-nav__link.recruit { padding: 10px 0; line-height: 1.4; font-weight: 700; }
  .megamenu { position: static; background: none; box-shadow: none; padding: 0 3%; opacity: 1; visibility: visible; transform: none; display: none; }
  .has-megamenu.open .megamenu { display: block; }
  .has-megamenu:hover > .megamenu { transform: none; }
  .link_icons { width: 100%; justify-content: center; }
  .link_icons a.x { border-left: 1px solid #969494; }
}

@media only screen and (max-width: 980px){
  .tab { display: block }
}

@media only screen and (max-width: 600px){
	.pc { display: none; }
	.sp { display: block; }
  .link_search img { max-width: 20px; }
  .l-footer-pagetop__btn { max-width: 45px; }
  .bnr_link { gap: 20px; flex-direction: column; margin-bottom: 100px; }
  .bnr_link a.search img.icon , .bnr_link a.contact img.icon { max-width: 35px; }
  footer .footer_top { padding: 60px 0; }
  footer .footer_flex { flex-direction: column; gap: 20px; }
  footer .footer_top_nav { flex-direction: column; gap: 16px; }
  footer .footer_top_nav__heading { margin-bottom: 8px; }
  footer .footer_top_nav li { margin-bottom: 5px; }
  footer .logo img { width: 60%; }
  footer .footer_flex .logo { text-align: center; }
  footer .footer_bottom { padding: 20px 0; }
  footer .footer_bottom_nav { gap: 8px; margin-bottom: 20px; justify-content: center;}
  footer .footer_bottom small { text-align: center; }
}

