@charset "UTF-8";
/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */
/* Reset box-model and set borders */
/* ============================================ */
*,
::before,
::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-style: solid;
  border-width: 0;
}

/* Document */
/* ============================================ */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 * 3. Remove gray overlay on links for iOS.
 */
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -webkit-tap-highlight-color: transparent; /* 3*/
}

/* Sections */
/* ============================================ */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
  display: block;
}

/* Vertical rhythm */
/* ============================================ */
p,
table,
blockquote,
address,
pre,
iframe,
form,
figure,
dl {
  margin: 0;
}

/* Headings */
/* ============================================ */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}

/* Lists (enumeration) */
/* ============================================ */
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Lists (definition) */
/* ============================================ */
dt {
  font-weight: bold;
}

dd {
  margin-left: 0;
}

/* Grouping content */
/* ============================================ */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}

address {
  font-style: inherit;
}

/* Text-level semantics */
/* ============================================ */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Replaced content */
/* ============================================ */
/**
 * Prevent vertical alignment issues.
 */
svg,
img,
embed,
object,
iframe {
  vertical-align: bottom;
}

/* Forms */
/* ============================================ */
/**
 * Reset form fields to make them styleable.
 * 1. Make form elements stylable across systems iOS especially.
 * 2. Inherit text-transform from parent.
 */
button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none; /* 1 */
  -moz-appearance: none;
       appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  border-radius: 0;
  text-align: inherit;
  text-transform: inherit; /* 2 */
}

/**
 * Correct cursors for clickable elements.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  cursor: pointer;
}

button:disabled,
[type=button]:disabled,
[type=reset]:disabled,
[type=submit]:disabled {
  cursor: default;
}

/**
 * Improve outlines for Firefox and unify style with input elements & buttons.
 */
:-moz-focusring {
  outline: auto;
}

select:disabled {
  opacity: inherit;
}

/**
 * Remove padding
 */
option {
  padding: 0;
}

/**
 * Reset to invisible
 */
fieldset {
  margin: 0;
  padding: 0;
  min-width: 0;
}

legend {
  padding: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * Correct the outline style in Safari.
 */
[type=search] {
  outline-offset: -2px; /* 1 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Fix font inheritance.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/**
 * Fix appearance for Firefox
 */
[type=number] {
  -moz-appearance: textfield;
}

/**
 * Clickable labels
 */
label[for] {
  cursor: pointer;
}

/* Interactive */
/* ============================================ */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/*
 * Remove outline for editable content.
 */
[contenteditable]:focus {
  outline: auto;
}

/* Tables */
/* ============================================ */
/**
1. Correct table border color inheritance in all Chrome and Safari.
*/
table {
  border-color: inherit; /* 1 */
  border-collapse: collapse;
}

caption {
  text-align: left;
}

td,
th {
  vertical-align: top;
  padding: 0;
}

th {
  text-align: left;
  font-weight: bold;
}

/* ============================================ */
/* function */
/* ============================================ */
/*------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------*/
/* ============================================ */
/* px → rem */
/* ============================================ */
/* ============================================ */
/* variable */
/* ============================================ */
/* @use 'mixins'; */
/* ============================================ */
/* breakpoint */
/* ============================================ */
/*
360
430 iphone
768 tablet
1024
1280
1281
*/
/* ============================================ */
/* mixin/*
/* ============================================ */
/* ============================================ */
/* base*/
/* ============================================ */
html {
  overflow-x: hidden;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.6;
  /* letter-spacing: 0.05em; */
  letter-spacing: 0;
  color: #000;
  scroll-behavior: smooth;
}
@media (max-width: 1399px) {
  html {
    font-size: 16px;
  }
}
@media screen and (max-width: 768px) {
  html {
    line-height: 1.6;
  }
}

body {
  overflow-x: hidden;
  position: relative;
}
p, h1, h2, h3, h4 {
  margin: 0;
}

a {
  -webkit-transition: 0.3s;
  transition: 0.3s;
  color: #333;
}

a:active, a:hover {
  color: #333;
  text-decoration: underline;
}

ul, li {
  margin: 0;
  padding: 0;
}

ul, li, a {
  text-decoration: none !important;
  list-style: none;
}

img {
  vertical-align: middle;
  image-rendering: auto;
  width: 100%;
  height: auto;
}

.indent {
  padding-left: 1em;
  text-indent: -1em;
}

.indent span {
  padding-left: 1em;
}

.red {
  color: #E63B1D;
}

a[href^="tel:"] {
  cursor: default;
}

@media screen and (min-width: 1025px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}
/* アンカーリンク anchor_link */
@media (max-width: 767px) {
  [id] {
    scroll-margin-top: 64px;
  }
}
/*========================
  text
========================*/
.text.list {
  padding-left: 1em;
  position: relative;
}
.text.list::before {
  content: "・";
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
}

.text.list.kome::before {
  content: "※";
}

.text.right {
  text-align: right;
}

/* ============================================ */
/* utility */
/* ============================================ */
.u-visuallyHidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.c-pageLink {
  color: #AC0000;
  display: inline-block;
  position: relative;
  text-decoration: none !important;
}
.c-pageLink::after {
  content: "";
  position: absolute;
  bottom: 2px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #AC0000;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transform-origin: left;
          transform-origin: left;
  -webkit-transition: -webkit-transform 0.3s ease-out;
  transition: -webkit-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.c-pageLink:hover {
  color: #AC0000;
}
.c-pageLink:hover::after {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
}

/* 改行 */
.u-ib {
  display: inline-block;
}
@media (max-width: 599px) {
  .u-ib {
    display: inline;
  }
}

.u-ib-all {
  display: inline-block;
}

.u-block {
  display: block;
}

.u-nobr {
  white-space: nowrap;
}

@media (min-width: 799px) {
  .u-br80 {
    display: none;
  }
}

/* pcは非表示 */
.u-br-pcno {
  display: none;
}
@media screen and (max-width: 430px) {
  .u-br-pcno {
    display: block;
  }
}

/* spは非表示 */
.u-br-spno {
  display: block;
}
@media screen and (max-width: 430px) {
  .u-br-spno {
    display: none;
  }
}

/* pcとspは非表示 */
.u-br-pcsspno {
  display: block;
}
@media (min-width: 769px) and (max-width: 1290px) {
  .u-br-pcsspno {
    display: none;
  }
}
@media (max-width: 600px) {
  .u-br-pcsspno {
    display: none;
  }
}

/* grid */
.u-grid {
  width: 100%;
  display: grid;
  grid-template-rows: repeat(auto-fit, 1fr);
  grid-template-columns: repeat(2, 1fr); /* 2列レイアウト */
  /* 1920-800__38-20 */
  gap: 20px clamp(1.25rem, 0.446rem + 1.607vw, 2.375rem); /*上下　左右*/
}
.u-grid.--grid1 {
  grid-template-columns: repeat(1, 1fr);
}
.u-grid.--grid3 {
  grid-template-columns: repeat(3, 1fr);
  gap: 20px clamp(0.9375rem, 0.652rem + 0.893vw, 1.875rem); /* 30px→15px */
}
@media (max-width: 699px) {
  .u-grid.--grid3 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 499px) {
  .u-grid.--grid3 {
    grid-template-columns: repeat(1, 1fr);
  }
}
.u-grid.--grid5 {
  grid-template-columns: repeat(5, 1fr);
  gap: 15px 15px; /*上下　左右*/
}
@media (max-width: 1699px) {
  .u-grid.--grid5 {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 1399px) {
  .u-grid.--grid5 {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 1199px) {
  .u-grid.--grid5 {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 999px) {
  .u-grid.--grid5 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 767px) {
  .u-grid.--grid5 {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 599px) {
  .u-grid.--grid5 {
    grid-template-columns: repeat(2, 1fr);
  }
}

.u-grid2 {
  width: 100%;
  display: grid;
  grid-template-rows: repeat(auto-fit, 1fr);
  grid-template-columns: repeat(3, 1fr);
  /* 1920-375__70-15 */
  gap: clamp(0.938rem, 0.103rem + 3.56vw, 4.375rem);
}
@media (max-width: 599px) {
  .u-grid2 {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* flexbox */
.u-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.u-inline-flex {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.u-column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.u-flex-half {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 50%;
          flex: 1 1 50%;
  max-width: 50%;
}
@media screen and (max-width: 430px) {
  .u-flex-half {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 100%;
            flex: 1 1 100%;
    max-width: 100%;
  }
}

/* fix */
.u-fixed {
  height: 100vh;
  position: fixed;
  top: 0;
}

/* 配置 */
.u-txt-c {
  text-align: center !important;
}
@media screen and (max-width: 430px) {
  .u-txt-c {
    text-align: left !important;
  }
}

.u-txt-r {
  text-align: right !important;
}
@media screen and (max-width: 430px) {
  .u-txt-r {
    text-align: left !important;
  }
}

/* フォント */
.u-f16 {
  font-size: 16px;
}
@media screen and (max-width: 768px) {
  .u-f16 {
    font-size: 14px;
  }
}

/* 下線 */
.u-border {
  border: 1px solid #333;
  padding: 1rem;
  border-radius: 10px;
}
@media screen and (max-width: 768px) {
  .u-border {
    margin-bottom: 1.5rem !important;
  }
}

/* 背景 */
.u-bg {
  background: #aaa;
  padding: 1rem 50px;
  border-radius: 10px;
  display: inline-block;
}

/* 余白 */
.u-pt1 {
  padding-top: 1rem;
}

.u-ptpb-50 {
  padding-top: 50px;
  padding-bottom: 50px;
}

.u-ptpb-80 {
  /* 1920-800__80-40 */
  padding-top: clamp(2.5rem, 0.714rem + 3.571vw, 5rem);
  padding-bottom: clamp(2.5rem, 0.714rem + 3.571vw, 5rem);
}
@media (max-width: 399px) {
  .u-ptpb-80 {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}

.u-ptpb-100 {
  /* 1440-375(100-50) */
  padding-top: clamp(3.125rem, 2.025rem + 4.695vw, 6.25rem);
  padding-bottom: clamp(3.125rem, 2.025rem + 4.695vw, 6.25rem);
}

.u-mb80 {
  /* 1440-375(80-40) */
  margin-bottom: clamp(2.5rem, 1.62rem + 3.756vw, 5rem);
}

.u-mt2 {
  margin-top: clamp(1.25rem, calc(0.7712765957rem + 2.1276595745vw), 2.5rem);
}

.u-mb0 {
  margin-bottom: 0 !important;
}

.u-mb1 {
  margin-bottom: 1rem !important;
}

.u-mb100 {
  margin-bottom: clamp(3.75rem, calc(3.0319148936rem + 3.1914893617vw), 5.625rem);
}

.u-mb80 {
  margin-bottom: clamp(2.5rem, calc(2.2606382979rem + 1.0638297872vw), 3.125rem) !important;
}

.u-mb3 {
  margin-bottom: 3rem !important;
}
@media screen and (max-width: 768px) {
  .u-mb3 {
    margin-bottom: 1rem;
  }
}

/* position */
.u-relative {
  position: relative;
}

/*
---------------------------------------------------------------------------------------------*/
.--right {
  text-align: right;
}

.--wht {
  color: #fff;
}

/* ============================================ */
/* animation */
/* ============================================ */
/* GSAPアニメーション前の初期状態 */
/* .js-utop,
.js-img-lr,
.js-fade-up,
.js-fade-upn,
.js-fade-up01,
.js-fade-up02,
.js-fade-up03,
.js-fade-up04 {
  opacity: 0;
}

.js-utop,
.js-fade-up,
.js-fade-upn,
.js-fade-up01,
.js-fade-up02,
.js-fade-up03,
.js-fade-up04 {
  transform: translateY(30px);
}

.js-img-lr {
  clip-path: inset(0 90% 0 0);
  transform: scale(1.5);
} */
/* ============================================ */
/*  カラムレイアウト*/
/* ============================================ */
/* --- 大枠計算用のスタイル
------------------------------------------------------------------------------------------ */
:root {
  /* 中央カラムの幅を定義 1919pxから1100px（762px→480px） */
  --center-width: clamp(30rem, 6.328rem + 34.432vw, 47.625rem);
  /* 右カラムの幅を定義 1919pxから1200px（350px→160px） */
  --right-width: clamp(10rem, -9.819rem + 26.426vw, 21.875rem);
  /* 左カラムの幅を定義 1919pxから1200px（808px→530px） */
  --left-width: calc(100% - var(--center-width) - var(--right-width));
  /* 左カラムの幅を定義 1099pxから800px（614px→320px） */
  --left-width2: clamp(20rem, -29.164rem + 98.328vw, 38.375rem);
}

/* --- ●左カラム（固定） --- */
.column-left {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: var(--left-width);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  /* .c-logoPc を上下中央にしないため、justify-contentを変更 */
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* --- ●右カラム（固定） --- */
.column-right {
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;
  width: var(--right-width);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* --- ●中央カラム（スクロール対象） --- */
.column-center {
  margin-right: var(--right-width);
  margin-left: var(--left-width);
  width: var(--center-width);
  -webkit-box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.16);
          box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.16);
}

/* --- 1099px以下 --- */
@media (max-width: 1099px) {
  /* 左カラム幅変更 */
  .column-left {
    width: var(--left-width2);
  }
  /* 右カラム非表示 */
  .column-right {
    width: 0;
    display: none;
  }
  /* 中央カラムの左マージン変更 */
  .column-center {
    margin-left: var(--left-width2);
  }
}
/* --- 768px以下：全カラム縦積み --- */
@media (max-width: 768px) {
  .column-left,
  .column-center,
  .column-right {
    position: static; /* 固定解除 */
    width: 100%;
    height: auto;
    margin: 0;
  }
  /* 右カラムのボーダーを上側に変更（横線になる） */
  .column-right {
    display: none;
  }
  /* メインコンテンツ余白リセット */
}
/* ---カラム内の内容
	------------------------------------------------------------------------------------------ */
/* --- 左カラム（固定） --- */
.column-left {
  background-image: url("../images/common/column-left.webp");
  background-size: cover;
  background-position: bottom right;
}

@media (min-width: 1921px) {
  .column-left {
    background-image: url("../images/common/column-left-l.webp");
    background-position: bottom;
  }
}
@media (max-width: 1199px) {
  .column-left {
    background-position: bottom right 25%;
  }
}
@media (max-width: 768px) {
  .column-left {
    display: none;
  }
}
.c-logoPc {
  max-width: 638px;
  margin-top: 50px;
  margin-right: auto;
  margin-left: auto;
  padding: 0 50px;
  text-align: center;
}
@media (max-width: 768px) {
  .c-logoPc {
    display: none;
  }
}

/* 左メニュー */
.right-menuContact {
  max-width: 638px;
  width: 100%;
  /* flex-growで空いてる領域を埋めて真ん中に */
  margin: auto;
}

.right-menu,
.p-sidebarContact {
  padding: 0 50px;
}
@media (min-width: 1420px) {
  .right-menu,
  .p-sidebarContact {
    padding: 0 70px;
  }
}

/* --- 右カラム（固定） --- */
.column-right {
  /* background-image: url('../images/column-right.webp');
  background-size: cover;
  background-position: center; */
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /*初期値非表示*/
  opacity: 0;
  -webkit-transform: translateY(100px);
          transform: translateY(100px);
}

.c-txt__vertical {
  display: block;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  margin-bottom: 50px;
}

/*--------------------------------------------------------------------
	 簡易的なコピー・キャプチャ防止
--------------------------------------------------------------------*/
/* ===================================================================
//  l- (レイアウト要素)
// =================================================================== */
/* 下層ページ */
.lowerPage {
  background: #efefef;
}
.lowerPage.recruit {
  background-color: #fff;
}

/* ヘッダー
---------------------------------------------------------------------------------------------*/
.l-header {
  position: fixed;
  top: 15px;
  left: 0;
  right: 0;
  z-index: 999;
  isolation: isolate;
  /* height: clamp(4.375rem, 2.292rem + 2.778vw, 5.625rem); */ /* 1920-1200(90-70) */
  width: 96.8%;
  /* padding: clamp(0.938rem, 0.417rem + 0.694vw, 1.25rem); */ /*20-15*/
  padding: 15px 15px;
  margin: 0 auto;
  background: #fff;
  border-radius: 20px;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  will-change: auto; /* 不要な will-change を避ける */
  -webkit-transform: translateZ(0);
          transform: translateZ(0); /* 独立したレイヤーを作成 */
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden; /* 裏面の描画を無効化 */
  -webkit-transition: padding 0.3s ease;
  transition: padding 0.3s ease;
}
.l-header.is-scrolled {
  padding: 8px 15px;
}
.l-header.is-scrolled .c-global-nav__link::after,
.l-header.is-scrolled .c-global-nav__item.is-active .c-global-nav__link::after {
  bottom: -9px;
}

@media (max-width: 539px) {
  .l-header {
    height: clamp(3.125rem, 0.284rem + 12.121vw, 4.375rem); /* 540-375(70-50) */
    border-radius: 10px;
  }
}
.l-header__inner {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 auto;
  height: 100%;
}
.l-header__inner.u-flex {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}

/* セクション
---------------------------------------------------------------------------------------------*/
.l-section {
  position: relative;
}

/* コンテンツ幅
---------------------------------------------------------------------------------------------*/
/* コンテンツ幅　下層ヘッダー */
.l-container172 {
  position: relative;
  /* border: 2px dashed limegreen; */
  width: 89.6%;
  /* 1920-800__100-40 */
  /* 1920-375__100-30 */
  margin: -1.5% 0 clamp(1.875rem, 0.813rem + 4.531vw, 6.25rem) auto;
  /* 1920-800__160-110 */
  padding-top: clamp(6.875rem, 4.643rem + 4.464vw, 10rem);
  /* 1920-800__120-50 */
  /* padding-left:clamp(3.125rem, 0.000rem + 6.25vw, 7.5rem); */
  padding-left: 8.6%;
}
.l-container172 .l-container152b {
  width: 88.3%;
}
@media (max-width: 1399px) {
  .l-container172 {
    /* width: 95%; */
    width: 92.6%;
    /* padding-left: 10.1%; */
    padding-left: 7.4%;
  }
  .l-container172 .l-container152b {
    width: 91.7%;
  }
}
@media (max-width: 767px) {
  .l-container172 {
    padding-top: clamp(5rem, 3.346rem + 7.059vw, 6.875rem);
  }
}

/* コンテンツ幅　トップページ・下層 ページ*/
.l-container152 {
  /* border: 1px dotted magenta; */
  width: 79.1%;
  margin: 0 auto;
}
.l-container152.--bg-wht {
  background: #fff;
  /* 1920-800_650-30 */
  border-radius: clamp(1.875rem, 0.536rem + 2.679vw, 3.75rem);
}
.l-container152.--bg-blue {
  background: #083783;
  /* 1920-800_650-30 */
  border-radius: clamp(1.875rem, 0.536rem + 2.679vw, 3.75rem);
}
@media (max-width: 1399px) {
  .l-container152 {
    width: 85%;
  }
}
@media (max-width: 799px) {
  .l-container152 {
    /* width: 85%; */
  }
  .l-container152.--release {
    width: 100%;
  }
}
@media (max-width: 799px) and (max-width: 699px) {
  .l-container152.--release {
    width: 85%;
  }
}
.l-container152 .l-container128 {
  /* border: 1px dotted green; */
  width: 78.9%;
  margin: 0 auto;
}
@media (max-width: 1399px) {
  .l-container152 .l-container128 {
    width: 82.3%;
  }
}
@media (max-width: 799px) {
  .l-container152 .l-container128.--release {
    width: 100%;
  }
}
@media (max-width: 549px) {
  .l-container152 .l-container128 {
    width: 90%;
  }
}

/* 親要素からはみ出て全幅 */
.l-full {
  /* border: 1px solid red; */
  position: relative;
  margin: 0 calc(50% - 50vw);
  margin-top: 1rem;
  margin-bottom: 1rem;
  width: 100vw;
}

.l-full.--innerParent {
  /* 画面いっぱいにして親要素の幅に戻す */
  padding: 4px calc(50vw - 50% + 8px);
}

/* フッター
----------------------------------------------------------------------------------------*/
.l-footer {
  background: #083783;
  color: #fff;
}
.l-footer a {
  color: #fff;
}

/* 下層ページ　ヘッダー下
 ----------------------------------------------------------------------------------------*/
/* ============================================ */
/* nav */
/* ============================================ */
.c-global-nav {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  opacity: 1;
  pointer-events: auto;
  /* 1199px以下ではPC用グローバルナビを非表示（モバイルはc-sp-navで対応） */
}
@media (max-width: 1199px) {
  .c-global-nav {
    display: none;
  }
}

.c-global-nav__list {
  list-style: none;
  padding: 0;
  margin: 0;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.c-global-nav__list.u-flex {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
@media (max-width: 1199px) {
  .c-global-nav__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    /* モバイルでは左寄せに戻す */
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}

.c-global-nav__item {
  /* 1920-1200(12-8): 広い幅まで対応し突き出しを防ぐ */
  padding: 0 clamp(0.5rem, 0.083rem + 0.556vw, 0.75rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-width: 1199px) {
  .c-global-nav__item {
    padding: 0;
  }
}

.c-global-nav__link {
  position: relative;
  text-decoration: none !important;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  -webkit-transition: color 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: color 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
  transition: color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; /* トランジションを拡張 */
  -webkit-transform: translateZ(0);
          transform: translateZ(0); /* 独立したレイヤーを作成 */
  will-change: transform, box-shadow; /* パフォーマンス向上 */
  cursor: pointer; /* インタラクティブさを強調 */
}
.c-global-nav__link::after {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 9px;
  background: #083783;
  bottom: -16px;
  -webkit-transform-origin: right top;
          transform-origin: right top;
  -webkit-transform: scale(0, 1);
          transform: scale(0, 1);
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  will-change: transform;
}
.c-global-nav__link {
  /* ホバー時: 下線アニメーション + スケールアップと影で浮き上がり効果 */
}
.c-global-nav__link:hover {
  color: #0a4b9e;
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}
.c-global-nav__link:hover::after {
  -webkit-transform: scale(1, 1);
          transform: scale(1, 1);
  -webkit-transform-origin: left top;
          transform-origin: left top;
}
.c-global-nav__link {
  /* アクティブ時: 押し込み効果（アクティブクラスは親のliに付与されるので、セレクタを調整） */
}
.c-global-nav__link:active {
  color: #063166; /* 少し暗くして押し込んだ印象 */
  -webkit-transform: translateY(1px);
          transform: translateY(1px);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); /* 影を弱めて平坦に */
}
.c-global-nav__link {
  /* 1650px未満ではフォントを16pxに抑えてヘッダー内に収める */
}
@media (max-width: 1649px) {
  .c-global-nav__link {
    font-size: 16px;
  }
}
@media (max-width: 1399px) {
  .c-global-nav__link {
    font-size: 16px;
  }
}
@media (max-width: 1199px) {
  .c-global-nav__link {
    padding: 15px 20px;
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    border-bottom: 1px solid #eee;
    border-bottom-color: #eee;
  }
}

/* アクティブなアイテム（元のスタイルを基に拡張） */
.c-global-nav__item.is-active .c-global-nav__link {
  position: relative;
  color: #063166; /* アクティブ時のテキスト色を少し暗く（視覚強調） */
  -webkit-transform: translateY(1px);
          transform: translateY(1px); /* 軽い押し込み効果を追加 */
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); /* 影を弱めて */
}
.c-global-nav__item.is-active .c-global-nav__link::after {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 9px;
  background: #083783;
  bottom: -16px;
  -webkit-transform: scale(1, 1);
          transform: scale(1, 1);
}

/* ===================================================================
//  c-global-nav の末尾2つのアイテム（ダウンロード/お問い合わせ）のスタイル調整
※down-contact
// =================================================================== */
/* 追加: li要素に疑似要素分の余裕を入れる */
.c-global-nav__list li:nth-child(8),
.c-global-nav__list li:nth-child(9) {
  /* padding-bottom: 20px; */
  position: relative;
  z-index: 10;
}

/* 例外：8番目と9番目のliのリンクには下線を表示しない（疑似要素非表示） */
.c-global-nav__list li:nth-child(8) .c-global-nav__link.is-active::after,
.c-global-nav__list li:nth-child(9) .c-global-nav__link.is-active::after,
.c-global-nav__list li:nth-child(8) .c-global-nav__link::after,
.c-global-nav__list li:nth-child(9) .c-global-nav__link::after {
  content: none;
}

.c-global-nav__list li:nth-child(8),
.c-global-nav__list li:nth-child(9) {
  padding-right: 0;
  /* height: 80px; */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.c-global-nav__list li:nth-child(8) {
  /* margin-left: 36px;  */
  /* ダウンロードボタンの左側の間隔 */
}

.c-global-nav__list li:nth-child(9) {
  /* margin-left: 10px; */
  /* お問い合わせボタンの左側の間隔 (ダウンロードとの間隔) */
}
@media (max-width: 1199px) {
  .c-global-nav__list li:nth-child(9) {
    margin-left: 0; /* モバイルでのリセット */
  }
}

.c-global-nav__list li:nth-child(8) .c-global-nav__link,
.c-global-nav__list li:nth-child(9) .c-global-nav__link,
.c-header-buttons__link {
  text-decoration: none !important;
  border: 1px solid #083783;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 20px 34px;
  /* 1440-1200(20-11)(34-7) */
  padding: clamp(0.688rem, -2.125rem + 3.75vw, 1.25rem) clamp(0.438rem, -5.188rem + 7.5vw, 1.563rem);
  /* 1440-1200(20-11)(25-7) */
  font-weight: 600;
  border-radius: 10px;
  text-align: center;
  -webkit-transition: background-color 0.3s ease, color 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: background-color 0.3s ease, color 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; /* トランジションを拡張 */
  white-space: nowrap;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  cursor: pointer; /* カーソルを追加してインタラクティブさを強調 */
}

/* 1199px以下でボタンサイズを小さく */
@media (max-width: 1199px) {
  .c-global-nav__list li:nth-child(8) .c-global-nav__link,
  .c-global-nav__list li:nth-child(9) .c-global-nav__link,
  .c-header-buttons__link {
    padding: 8px 16px;
    font-size: 14px;
    border-radius: 6px;
  }
}
/* 8番目のアイテム：ダウンロードボタン（個別スタイル） */
.c-global-nav__list li:nth-child(8) .c-global-nav__link,
.c-header-buttons__link--download {
  /* 【個別】通常スタイル */
  color: #083783;
  background-color: #fff;
  /* 【個別】ホバー時: 背景を薄青に変更、影を強くして浮き上がり効果 */
}
.c-global-nav__list li:nth-child(8) .c-global-nav__link:hover,
.c-header-buttons__link--download:hover {
  color: #fff;
  background-color: #0a4b9e; /* 明るい青でコントラストアップ */
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.c-global-nav__list li:nth-child(8) .c-global-nav__link,
.c-header-buttons__link--download {
  /* 【個別】アクティブ時: 押し込み効果 */
}
.c-global-nav__list li:nth-child(8) .c-global-nav__link:active, .c-global-nav__list li:nth-child(8) .c-global-nav__link.is-active, .c-global-nav__item:nth-child(8).is-active .c-global-nav__list li:nth-child(8) .c-global-nav__link,
.c-header-buttons__link--download:active,
.c-header-buttons__link--download.is-active,
.c-global-nav__item:nth-child(8).is-active .c-header-buttons__link--download {
  color: #fff;
  background-color: #083783; /* 通常の青に戻すが、押し込みで区別 */
  -webkit-transform: translateY(2px);
          transform: translateY(2px);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* 9番目のアイテム：お問い合わせボタン（個別スタイル） */
.c-global-nav__list li:nth-child(9) .c-global-nav__link,
.c-header-buttons__link--contact {
  /* 【個別】通常スタイル */
  color: #fff;
  background-color: #083783;
  /* 【個別】ホバー時: 背景を明るく変更、影を強くして浮き上がり効果 */
}
.c-global-nav__list li:nth-child(9) .c-global-nav__link:hover,
.c-header-buttons__link--contact:hover {
  color: #fff;
  background-color: #0a4b9e;
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* 影を強めて */
}
.c-global-nav__list li:nth-child(9) .c-global-nav__link,
.c-header-buttons__link--contact {
  /* 【個別】アクティブ時: 押し込み効果 */
}
.c-global-nav__list li:nth-child(9) .c-global-nav__link:active, .c-global-nav__list li:nth-child(9) .c-global-nav__link.is-active, .c-global-nav__item:nth-child(8).is-active .c-global-nav__list li:nth-child(9) .c-global-nav__link,
.c-header-buttons__link--contact:active,
.c-header-buttons__link--contact.is-active,
.c-global-nav__item:nth-child(8).is-active .c-header-buttons__link--contact {
  color: #fff;
  background-color: #063166; /* 少し暗い青で押し込んだ印象 */
  -webkit-transform: translateY(2px);
          transform: translateY(2px);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); /* 影を弱めて */
}

/* ===================================================================
//  c-global-nav の外のアイテム（ダウンロード/お問い合わせ）
※soto-down-contact
// =================================================================== */
/* ===================================================================
//  メガメニュー
// =================================================================== */
/* ===================================================================
// Project: p-megamenu (メガメニュー)
// =================================================================== */
.p-megamenu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  padding-top: 10px;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s, visibility 0.3s;
  transition: opacity 0.3s, visibility 0.3s;
  z-index: 90;
}

@media (max-width: 1199px) {
  .p-megamenu {
    display: none;
  }
}
.p-megamenu__container {
  background-color: #fff;
  border-radius: 20px;
  padding: 40px 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /* 1920-1200__85-50 */
  gap: 0 clamp(3.125rem, -0.521rem + 4.861vw, 5.313rem);
  -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
          box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  /* min-height: 400px;
  max-width: 100%; */
  margin: 0 auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.p-megamenu__left {
  /* 1920-1200__380-160 */
  width: clamp(10rem, -12.917rem + 30.556vw, 23.75rem);
}

.p-megamenu__right {
  /* flex-grow: 1; */
  /* flex: 1; */
  width: 920px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  /* 1920-1200__45-30 */
  gap: 20px clamp(1.875rem, 0.313rem + 2.083vw, 2.813rem);
}

/* ===================================================================
// Component: c-service-card (サービスカード)
// =================================================================== */
.c-service-card {
  display: block;
  text-decoration: none;
  text-align: center;
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
}

.c-service-card:hover .c-service-card__img img {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

.c-service-card__img {
  border-radius: 20px;
  margin-bottom: 0.5rem;
  position: relative;
  overflow: hidden;
}

.c-service-card__img img {
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

.c-service-card__text {
  font-size: 16px;
  line-height: 1.4;
  margin: 0;
}

/* ===================================================================
// Component: c-overlay (オーバーレイ)
// =================================================================== */
.c-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 40;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s, visibility 0.3s;
  transition: opacity 0.3s, visibility 0.3s;
  pointer-events: none;
}

.c-overlay.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* ===================================================================
// Utility: u-global-nav (グローバルナビゲーション関連のユーティリティ)
// =================================================================== */
@media (min-width: 1200px) {
  .c-global-nav__item.u-has-megamenu:hover .p-megamenu {
    opacity: 1;
    visibility: visible;
  }
  .c-global-nav__item.u-has-megamenu:hover .c-global-nav__link::after {
    -webkit-transform: scale(1, 1);
            transform: scale(1, 1);
    -webkit-transform-origin: left top;
            transform-origin: left top;
  }
}
.p-service__ttl-box {
  display: grid;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
}

.p-service__ttl {
  /* 1920-1200__50-35 */
  font-size: clamp(2.188rem, 0.625rem + 2.083vw, 3.125rem);
  color: #083783;
  margin-bottom: 10px;
  font-weight: 800;
  font-family: "Albert Sans", sans-serif;
  line-height: 1;
  margin-top: 0;
  margin-bottom: 1rem;
}

.p-service__ttl-sub {
  /* 1920-1200__26-18 */
  font-size: clamp(1.125rem, 0.292rem + 1.111vw, 1.625rem);
  font-weight: 700;
  line-height: 1;
  margin: 0;
}

/* ===================================================================
// Component: c-sp-nav（スマートフォン用全画面オーバーレイメニュー）
// 1199px以下で表示。ハンバーガーボタンで開閉する。
// =================================================================== */
/* メニュー全体: 非表示状態（デフォルト）
   z-index: 998 = l-header(999)の下に配置し、l-headerが自然に上に浮かぶ */
.c-sp-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 998;
  opacity: 0;
  pointer-events: none;
  -webkit-transform: translateY(-8px);
          transform: translateY(-8px);
  -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
  transition: opacity 0.3s ease, transform 0.3s ease;
  transition: opacity 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease;
  /* 1200px以上では完全に非表示 */
}
@media (min-width: 1200px) {
  .c-sp-nav {
    display: none;
  }
}

/* メニュー表示状態 */
.c-sp-nav.is-open {
  opacity: 1;
  pointer-events: auto;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

/* ナビエリア: 紺色背景、全体に広がる（l-headerはz-indexで上に浮かぶ）
   padding-top でl-headerの高さ分(top:15px + 高さ~60px)を避ける */
.c-sp-nav__body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  background-color: #083783;
  overflow-y: auto;
  padding-top: 85px;
  padding-bottom: 40px;
}
@media (max-width: 539px) {
  .c-sp-nav__body {
    padding-top: 75px;
  }
}

/* ナビリスト */
.c-sp-nav__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* 各ナビアイテム */
.c-sp-nav__item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

/* ナビリンク: 白文字、左にpadding */
.c-sp-nav__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 22px 20px 22px 30px;
  color: #fff;
  text-decoration: none;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  -webkit-transition: background-color 0.2s ease;
  transition: background-color 0.2s ease;
}

.c-sp-nav__link:hover {
  background-color: rgba(255, 255, 255, 0.08);
  color: #fff; /* ホバー時も白文字を維持 */
}

/* アコーディオントグルボタン: リンクと同じ見た目 */
.c-sp-nav__link--toggle {
  background: none;
  border: none;
  cursor: pointer;
  width: 100%;
  text-align: left;
  font-family: inherit;
}

/* サブリスト: デフォルト非表示 */
.c-sp-nav__sub-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: none;
}

/* アコーディオン展開時 */
.c-sp-nav__sub-list.is-open {
  display: block;
}

/* サブアイテムのリンク: 白文字・深めのインデント */
.c-sp-nav__sub-link {
  display: block;
  padding: 14px 20px 14px 50px;
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.4;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  -webkit-transition: background-color 0.2s ease, color 0.2s ease;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.c-sp-nav__sub-link:hover {
  background-color: rgba(255, 255, 255, 0.08);
  color: #fff;
}

/* 「事業内容」の右側にある「+」マーク */
.c-sp-nav__plus {
  margin-left: 8px;
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
}

/* お問い合わせボタンエリア: 下部に余白を持たせて配置 */
.c-sp-nav__contact {
  margin-top: 40px;
  padding: 0 20px;
}

/* お問い合わせリンク: 白枠ゴーストボタン */
.c-sp-nav__contact-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  padding: 18px 20px;
  border: 1px solid #fff;
  border-radius: 6px;
  color: #fff;
  text-decoration: none;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: background-color 0.2s ease;
  transition: background-color 0.2s ease;
}

.c-sp-nav__contact-link:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

/* ============================================ */
/* hamburger */
/* ============================================ */
/* ハンバーガーメニューボタン */
.c-hamburger {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 30px;
  height: 24px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  z-index: 100;
}

@media (max-width: 767px) {
  .c-hamburger {
    width: 30px;
    height: 20px;
  }
}
.c-hamburger__bar {
  display: block;
  width: 100%;
  height: 2px;
  background-color: #083783;
  border-radius: 2px;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -webkit-transform-origin: center;
          transform-origin: center;
}

/* ハンバーガーが開いた時のバツの形
   バー高さ2px、コンテナ24px の場合: 上バー中心1px, 下バー中心23px → 差22px → 半分11px */
.c-hamburger.is-active .c-hamburger__bar:nth-child(1) {
  -webkit-transform: translateY(11px) rotate(45deg);
          transform: translateY(11px) rotate(45deg);
}

.c-hamburger.is-active .c-hamburger__bar:nth-child(2) {
  opacity: 0;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
}

.c-hamburger.is-active .c-hamburger__bar:nth-child(3) {
  -webkit-transform: translateY(-11px) rotate(-45deg);
          transform: translateY(-11px) rotate(-45deg);
}

/* モバイル(~767px): コンテナ20px の場合 → 差18px → 半分9px */
@media (max-width: 767px) {
  .c-hamburger.is-active .c-hamburger__bar:nth-child(1) {
    -webkit-transform: translateY(9px) rotate(45deg);
            transform: translateY(9px) rotate(45deg);
  }
  .c-hamburger.is-active .c-hamburger__bar:nth-child(3) {
    -webkit-transform: translateY(-9px) rotate(-45deg);
            transform: translateY(-9px) rotate(-45deg);
  }
}
/* PCでは非表示（デフォルト） */
@media (min-width: 1200px) {
  .c-hamburger {
    display: none;
  }
}
/* ============================================ */
/* header right (ハンバーガーとボタンのコンテナ) */
/* ============================================ */
.l-header__right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 12px;
}

/* ============================================ */
/* header actions (新規追加のダウンロードとお問い合わせボタン) */
/* ============================================ */
/* デフォルトで非表示 */
.l-header__actions.u-flex {
  display: none;
}
@media (max-width: 1199px) {
  .l-header__actions.u-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 10px;
  }
}
@media (max-width: 767px) {
  .l-header__actions.u-flex {
    display: none;
  }
}

/* ============================================ */
/* title */
/* ============================================ */
.c-section__ttl-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  margin-bottom: 2.5rem;
}
@media (max-width: 799px) {
  .c-section__ttl-block {
    margin-bottom: 2rem;
  }
}
@media (max-width: 499px) {
  .c-section__ttl-block {
    margin-bottom: 1.5rem;
  }
}

.c-section__ttl {
  /* 1920-375(80-36) */
  font-size: clamp(2.25rem, 1.583rem + 2.848vw, 5rem);
  font-weight: 800;
  font-family: "Albert Sans", sans-serif;
  line-height: 1;
  color: #083783;
  /* margin-bottom: 0.5rem; */
  margin-bottom: 0.5rem;
}
.c-section__ttl.--wht {
  color: #fff;
}

.c-section__ttl-sub {
  /* 1920-375(24-18) */
  font-size: clamp(1.125rem, 1.034rem + 0.388vw, 1.5rem);
  line-height: 1;
}

.c-section__catch {
  /* 1920-375(50-22) */
  font-size: clamp(1.375rem, 0.95rem + 1.812vw, 3.125rem);
  font-weight: 700;
  /* line-height: 1.4; */
  line-height: 1.2;
  margin-bottom: 2.5rem;
}
@media (max-width: 1199px) {
  .c-section__catch {
    margin-bottom: 2rem;
  }
}
@media (max-width: 999px) {
  .c-section__catch {
    margin-bottom: 1.5rem;
  }
}

/* アニメーション用スタイル */
.animate-text {
  opacity: 0;
  overflow: hidden;
  display: inline-block;
}

.animate-text span {
  display: inline-block;
  opacity: 0;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
}

@-webkit-keyframes fadeInUp {
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes fadeInUp {
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
/* 1920-800(18-16) */
/* 背景の大きなCOMPANYテキスト */
.infiniteScrollText {
  position: absolute;
  top: 0px;
  /* bottom: -50px; */
  left: 54%;
  z-index: -1;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  /* 1920-375(250-70) */
  font-size: clamp(4.375rem, 1.644rem + 11.65vw, 15.625rem);
  font-weight: 800;
  font-family: "Albert Sans", sans-serif;
  line-height: 1;
  color: #F8F8F8;
  pointer-events: none; /* テキストがクリックできないように */
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; /* テキストが選択できないように */
  white-space: nowrap; /* テキストが改行されないように */
  will-change: transform, opacity; /* パフォーマンス最適化 */
}

/* 下層ページ　タイトル */
.c-lowerPage__ttl {
  color: #083783;
  /* 1920-800__26-20 */
  font-size: clamp(1.25rem, 0.982rem + 0.536vw, 1.625rem);
  font-weight: 700;
  line-height: 1.2;
}
@media (max-width: 399px) {
  .c-lowerPage__ttl {
    font-size: 18px;
  }
}

.c-lowerPage__ttl3 {
  /* 1920-800__24-18 */
  font-size: clamp(1.125rem, 0.946rem + 0.357vw, 1.375rem);
  font-weight: 500;
  margin-bottom: 1rem;
  padding: 0.1em 0.7em;
  border-left: 4px solid #083783;
}
.c-lowerPage__ttl3.--nodeco {
  padding: 0;
  border-left: none;
}
@media (max-width: 399px) {
  .c-lowerPage__ttl3 {
    font-size: 18px;
    padding-left: 0.8rem;
  }
}

.c-lowerPage__ttl4 {
  /* 1920-800__24-18 */
  font-weight: 700;
  margin-bottom: 0;
}

.c-lowerPage__txt {
  margin-bottom: 1rem;
}

/* ============================================ */
/* btn */
/* ============================================ */
/* ===================================================================
//  c- (コンポーネント要素: c-btn内にc-btn-linkを実装)
// =================================================================== */
/* 外側ラッパー */
.c-btn {
  display: inline-block;
  width: 100%;
  max-width: 381px;
  border-radius: 9999px;
  -webkit-box-shadow: 0 12px 30px -10px rgba(0, 0, 0, 0.4);
          box-shadow: 0 12px 30px -10px rgba(0, 0, 0, 0.4);
  overflow: hidden;
  -ms-flex-item-align: start;
      align-self: flex-start; /* flexコンテナ内での縦伸び防止 */
}

.c-btn-link {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  text-decoration: none !important;
  color: #083783;
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease;
  cursor: pointer;
}

.c-btn-link__text {
  position: relative;
  line-height: 1;
  padding-bottom: 5px;
  margin-right: 1.5rem;
}
.c-btn-link__text::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: #083783;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transform-origin: left center;
          transform-origin: left center;
  -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: -webkit-transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: transform;
}
@media (max-width: 480px) {
  .c-btn-link__text {
    font-size: 14px;
    margin-right: 1rem;
  }
}
@media (max-width: 360px) {
  .c-btn-link__text {
    font-size: 14px;
    margin-right: 0.5rem;
  }
}

:root {
  /* ボタンサイズ定義 */ /* 1440-375(100-60) */
  --button-width: clamp(3.75rem, 2.870rem + 3.756vw, 6.25rem);
}

.c-btn-link__button-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: var(--button-width);
  height: var(--button-width);
  border-radius: 50%;
  -webkit-transition: -webkit-transform 0.4s ease-out, -webkit-box-shadow 0.4s ease-out;
  transition: -webkit-transform 0.4s ease-out, -webkit-box-shadow 0.4s ease-out;
  transition: transform 0.4s ease-out, box-shadow 0.4s ease-out;
  transition: transform 0.4s ease-out, box-shadow 0.4s ease-out, -webkit-transform 0.4s ease-out, -webkit-box-shadow 0.4s ease-out;
  will-change: transform, box-shadow;
}

/* 円 */
.c-btn-link__button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: var(--button-width);
  height: var(--button-width);
  border-radius: 50%;
  background-color: #083783;
}

/* 円の中 */
.c-btn-link__icon {
  /* 1440-375(40-20) */
  width: clamp(1.563rem, 1.232rem + 1.408vw, 2.5rem);
  height: clamp(1.563rem, 1.232rem + 1.408vw, 2.5rem);
  -webkit-transform: translateX(3px);
          transform: translateX(3px);
}
@media (max-width: 499px) {
  .c-btn-link__icon {
    -webkit-transform: translateX(2px);
            transform: translateX(2px);
  }
}
@media (max-width: 399px) {
  .c-btn-link__icon {
    -webkit-transform: translateX(1px);
            transform: translateX(1px);
  }
}

/* ホバーアニメーション */
.c-btn-link:hover {
  color: #0a4b9e;
}

/* 1. テキスト下線が伸びるアニメーション */
.c-btn-link:hover .c-btn-link__text::after {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
  -webkit-transform-origin: left center;
          transform-origin: left center;
}

/* 2. ボタンが拡大・浮き上がるアニメーション */
.c-btn-link:hover .c-btn-link__button-wrap {
  -webkit-transform: scale(1.08) translateY(-2px);
          transform: scale(1.08) translateY(-2px);
  -webkit-box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
          box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
}

/* 白ボタン */
.c-btn.--wht {
  /* background-color: tan ; */
}
.c-btn.--wht .c-btn-link {
  color: #fff;
}
.c-btn.--wht .c-btn-link__text::after {
  background-color: #fff;
}
.c-btn.--wht {
  /* 円 */
}
.c-btn.--wht .c-btn-link__button {
  background-color: #fff;
}
.c-btn.--wht {
  /* 円の中 */
  /* ホバーアニメーション */
}
.c-btn.--wht .c-btn-link:hover {
  color: #fff;
}

/* ============================================ */
/* ピルボタン (c-btn-link--pill) */
/* ============================================ */
/* 三角：左→右に流れる無限アニメーション */
@-webkit-keyframes triangle-sequential {
  0% {
    -webkit-transform: translateX(-150%);
            transform: translateX(-150%);
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  80% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(150%);
            transform: translateX(150%);
    opacity: 0;
  }
}
@keyframes triangle-sequential {
  0% {
    -webkit-transform: translateX(-150%);
            transform: translateX(-150%);
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  80% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(150%);
            transform: translateX(150%);
    opacity: 0;
  }
}
.c-btn-link--pill {
  background-color: #083783;
  color: #fff;
  height: 80px;
  width: 100%; /* u-inline-flex による幅縮みを防ぐ */
  padding: 0 16px 0 54px;
}
@media (max-width: 1000px) {
  .c-btn-link--pill {
    height: 60px;
    padding: 0 12px 0 30px;
  }
}
.c-btn-link--pill {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  text-decoration: none !important;
  -webkit-transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  position: relative;
  /* テキスト */
}
.c-btn-link--pill .c-btn-link__text {
  position: relative;
  font-size: 1.125rem; /* 18px */
  letter-spacing: 0.1em;
  white-space: nowrap;
  color: #fff;
  padding-bottom: 0;
  margin-right: 0;
}
@media (max-width: 1399px) {
  .c-btn-link--pill .c-btn-link__text {
    font-size: 1rem; /* 16px */
  }
}
.c-btn-link--pill .c-btn-link__text::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 0;
  height: 1px;
  background-color: #fff;
  -webkit-transform: scaleX(1);
          transform: scaleX(1); /* ベースのscaleX(0)を打ち消す */
  -webkit-transition: width 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: width 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}
.c-btn-link--pill {
  /* button-wrap：ラッパーのみ（見た目なし） */
}
.c-btn-link--pill .c-btn-link__button-wrap {
  background-color: transparent !important;
  width: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
  -webkit-transform: none !important;
          transform: none !important;
  -webkit-transition: none !important;
  transition: none !important;
  will-change: auto !important;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.c-btn-link--pill {
  /* 白丸 */
}
.c-btn-link--pill .c-btn-link__button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 54px !important;
  height: 54px !important;
  background-color: #fff !important;
  border-radius: 50%;
  overflow: hidden;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}
@media (max-width: 1000px) {
  .c-btn-link--pill .c-btn-link__button {
    width: 40px !important;
    height: 40px !important;
  }
}
.c-btn-link--pill {
  /* 三角アイコン */
}
.c-btn-link--pill .c-btn-link__icon {
  width: 20px !important;
  height: 20px !important;
  -webkit-transform: none;
          transform: none;
}
.c-btn-link--pill .c-btn-link__icon path {
  fill: #083783;
}
.c-btn-link--pill {
  /* ホバー */
}
.c-btn-link--pill:hover {
  background-color: #0a46a3;
  color: #fff !important;
}
.c-btn-link--pill:hover .c-btn-link__text::after {
  width: 100%;
}
.c-btn-link--pill:hover .c-btn-link__button-wrap {
  -webkit-transform: none !important;
          transform: none !important;
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
}
.c-btn-link--pill:hover .c-btn-link__button {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}
.c-btn-link--pill:hover .c-btn-link__icon {
  -webkit-animation: triangle-sequential 0.8s infinite linear;
          animation: triangle-sequential 0.8s infinite linear;
}
.c-btn-link--pill {
  /* クリック */
}
.c-btn-link--pill:active {
  -webkit-transform: scale(0.98);
          transform: scale(0.98);
}

/* --wht ピルボタン（ダーク背景用：白地・紺文字・紺丸・白三角） */
.c-btn.--wht .c-btn-link--pill {
  background-color: #fff;
}
.c-btn.--wht .c-btn-link--pill .c-btn-link__text {
  color: #083783;
}
.c-btn.--wht .c-btn-link--pill .c-btn-link__text::after {
  background-color: #083783;
}
.c-btn.--wht .c-btn-link--pill .c-btn-link__button {
  background-color: #083783 !important;
}
.c-btn.--wht .c-btn-link--pill .c-btn-link__icon path {
  fill: #fff;
}
.c-btn.--wht .c-btn-link--pill:hover {
  background-color: #e8eef8;
  color: #083783 !important;
}

/* --ghost ピルボタン（透明背景・白枠） */
.c-btn.--ghost {
  border: 2px solid #fff; /* 外側のラッパーに枠線を持たせることでclipされない */
}

.c-btn.--ghost .c-btn-link--pill {
  background-color: transparent;
}
.c-btn.--ghost .c-btn-link--pill .c-btn-link__text {
  color: #fff;
}
.c-btn.--ghost .c-btn-link--pill .c-btn-link__button {
  background-color: #fff !important;
}
.c-btn.--ghost .c-btn-link--pill .c-btn-link__icon path {
  fill: #083783;
}
.c-btn.--ghost .c-btn-link--pill:hover {
  background-color: rgba(255, 255, 255, 0.1);
  color: #fff !important;
}

/* ============================================ */
/* cta */
/* ============================================ */
/* CTAセクション全体の内側コンテナ */
.c-cta__inner {
  background-color: #083783;
  color: #fff;
  border-radius: 40px;
  /* 1440-375(40-10) */
  padding: clamp(0.625rem, -0.035rem + 2.817vw, 2.5rem) 0;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media (max-width: 699px) {
  .c-cta__inner {
    border-radius: 20px;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
  }
  .c-cta__inner.u-flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media (max-width: 399px) {
  .c-cta__inner {
    border-radius: 20px;
  }
}

/* 各CTAアイテム（PC: 横3列 / モバイル: 縦積み横並び行） */
.c-cta__item {
  -ms-flex-preferred-size: 33.33%;
      flex-basis: 33.33%;
  text-align: center;
  /* 1440-375(30-10) */
  padding: clamp(1.25rem, 1.03rem + 0.939vw, 1.875rem) 0;
  position: relative;
  /* PC: 縦の区切り線 */
}
.c-cta__item:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 2px;
  background-color: rgba(255, 255, 255, 0.8);
}
.c-cta__item {
  /* モバイル: アイコン左・テキスト右の横並びレイアウト、全体を中央寄せ */
}
@media (max-width: 699px) {
  .c-cta__item {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    text-align: left;
    padding: 22px 24px;
    /* 横の区切り線（全幅） */
  }
  .c-cta__item:not(:last-child)::after {
    height: 1px;
    width: 100%;
    top: auto;
    bottom: 0;
    right: 0;
    left: 0;
  }
}

/* アイコンラッパー */
.c-cta__icon-wrapper {
  width: 64px;
  height: 64px;
  margin: 0 auto 20px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  /* モバイル: 右側に余白、縦マージンなし */
}
@media (max-width: 699px) {
  .c-cta__icon-wrapper {
    width: 56px;
    height: 56px;
    margin: 0 20px 0 0;
  }
}

/* テキスト・番号のラッパー（PC: なし / モバイル: 右側コンテンツ）
   固定幅を設定することで、全行のアイコン位置を揃える */
@media (max-width: 699px) {
  .c-cta__content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    width: 200px;
  }
}

/* ラベルテキスト */
.c-cta__text {
  font-size: 17px;
  font-weight: 500;
  margin: 0 0 5px;
  line-height: 1;
}
@media (max-width: 799px) {
  .c-cta__text {
    font-size: 16px;
  }
}
@media (max-width: 699px) {
  .c-cta__text {
    font-size: 14px;
    margin-bottom: 6px;
  }
}

/* 電話・FAX番号 */
.c-cta__number {
  font-size: 34px;
  margin: 0;
  font-weight: 700;
  font-family: "Albert Sans", sans-serif;
  line-height: 2;
}
.c-cta__number a {
  color: #fff;
  text-decoration: none;
}
@media (max-width: 999px) {
  .c-cta__number {
    font-size: 30px;
  }
}
@media (max-width: 699px) {
  .c-cta__number {
    font-size: 26px;
    line-height: 1.2;
  }
}

/* お問い合わせボタン（メール用） */
.c-cta__button {
  display: inline-block;
  color: #083783;
  background-color: #fff;
  text-decoration: none;
  padding: 10px 38px;
  border-radius: 50px;
  font-weight: 700;
  margin-top: 10px;
  -webkit-transition: background-color 0.3s ease, color 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: background-color 0.3s ease, color 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  white-space: nowrap;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  cursor: pointer;
}
.c-cta__button:hover {
  color: #083783;
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.c-cta__button:active {
  -webkit-transform: translateY(2px);
          transform: translateY(2px);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.c-cta__button {
  /* モバイル: マージンリセット */
}
@media (max-width: 699px) {
  .c-cta__button {
    margin-top: 0;
    padding: 10px 30px;
  }
}

/* ============================================ */
/* 下層ページ　lowerPage */
/* ============================================ */
.c-lowerPage {
  gap: 0 30px;
}
.c-lowerPage {
  /* 最後の要素 */
}
.c-lowerPage:last-of-type {
  margin-bottom: 0;
}
.c-lowerPage:last-of-type .c-lowerPage__list:last-of-type {
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .c-lowerPage {
    margin-bottom: 2rem;
  }
}

.c-lowerPage__left {
  /* border: 1px dashed aqua; */
  /* 1920-800__290-180 */
  width: clamp(11.25rem, 6.339rem + 9.821vw, 18.125rem);
}
@media (max-width: 767px) {
  .c-lowerPage__left {
    width: 100%;
    margin-bottom: 1rem;
  }
}

.c-lowerPage__right {
  /* border: 1px dashed lime; */
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.c-lowerPage__content {
  /* background: tan; */
  margin-bottom: 50px;
}

.c-lowerPage__list {
  /* 1920-800__60-30 */
  margin-bottom: clamp(1.875rem, 0.536rem + 2.679vw, 3.75rem);
}
.c-lowerPage__list-img {
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 0.4rem;
}
@media (max-width: 399px) {
  .c-lowerPage__list-img {
    border-radius: 10px;
  }
}

.c-lowerPage__list-noitem {
  position: relative;
  border: 1px solid #083783;
  background: #fff;
  border-radius: 10px;
  padding-bottom: 10px;
}
.c-lowerPage__list-noitem.--double {
  grid-column: span 2; /* 幅を2倍分確保 */
}

.c-lowerPage__list-no {
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 40px;
  background: #083783;
  border-radius: 10px;
  color: #fff;
  font-size: 25px;
  font-weight: 600;
  font-family: "Albert Sans", sans-serif;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-width: 499px) {
  .c-lowerPage__list-no {
    width: 35px;
    height: 35px;
    font-size: 20px;
  }
}

.c-lowerPage__list-coment {
  position: absolute;
  top: 0;
  right: 0;
  padding: 5px 10px;
  background: #083783;
  border-radius: 10px;
  color: #fff;
  font-size: 16px;
  line-height: 1;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-width: 399px) {
  .c-lowerPage__list-coment {
    padding: 5px 3px;
    font-size: 14px;
  }
}

.c-lowerPage__list-noimg {
  border-radius: 10px 10px 0 0;
  overflow: hidden;
  margin-bottom: 6px;
}

.c-lowerPage__list-notxt {
  color: #083783;
  font-size: 16px;
  line-height: 1.2;
  text-align: center;
  margin-right: 10px;
  margin-left: 10px;
}

.c-lowerPage__list2-item {
  padding-left: 1.1em;
  position: relative;
}
.c-lowerPage__list2-item::before {
  content: "〇";
  position: absolute;
  left: 0em;
  font-size: 1em;
}

.c-lowerPage__list3-item {
  padding-left: 1.1em;
  position: relative;
  margin-bottom: 2rem;
}
.c-lowerPage__list3-item::before {
  content: "●";
  position: absolute;
  left: 0em;
  font-size: 1em;
}

.c-lowerPage__list3-link {
  position: relative;
  top: -2px;
  display: inline-block;
  width: 35px;
  margin-left: 1rem;
}
@media (max-width: 1399px) {
  .c-lowerPage__list3-link {
    top: 0;
  }
}

.c-lowerPage__list-txt {
  line-height: 1.6;
}

/* ============================================ */
/* subpage */
/* ============================================ */
/* ============================================ */
/* card */
/* ============================================ */
/* ============================================ */
/* list */
/* ============================================ */
/* ============================================ */
/* bread-crumb */
/* ============================================ */
.bread-crumb {
  position: absolute;
  bottom: 20px;
  right: 30px;
}

.crumb {
  font-size: 14px;
  margin-right: 30px;
  position: relative;
}
.crumb::after {
  content: "";
  width: 10px;
  height: 10px;
  border-top: 2px solid #222;
  border-right: 2px solid #222;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  position: absolute;
  top: 9px;
  right: -16px;
  border-radius: 2px;
}
.crumb.last::after {
  content: none;
}

@media screen and (max-width: 767px) {
  .bread-crumb {
    right: 0;
    bottom: 10px;
  }
  .crumb {
    margin-right: 20px;
  }
}
/* ============================================ */
/* form */
/* ============================================ */
/* ============================================ */
/* wiget */
/* ============================================ */
/* ============================================ */
/* ============================================ */
/* ===================================================================
//  p- (プロジェクト要素: ヘッダー固有)
// =================================================================== */
.p-header__logo {
  margin-right: 0;
}

/* 1440-1200(355-222) */
.p-header__logo--link {
  display: block;
  max-width: 355px;
  width: clamp(13.875rem, -27.688rem + 55.417vw, 22.188rem);
}
@media (max-width: 499px) {
  .p-header__logo--link {
    width: 70%;
  }
}

/* ============================================ */
/* mobile*/
/* ============================================ */
/* ============================================ */
/* トップnews */
/* ============================================ */
/* ============================================ */
/* ============================================ */
/* ============================================ */
/* hero */
/* ============================================ */
.p-topHero {
  position: relative;
  height: 100vh;
  background-image: url("../images/common/hero-bg.webp");
  background-blend-mode: multiply; /* overlayなども可 */
  background-size: cover;
  background-position: top right;
  background-repeat: no-repeat;
  padding-top: 1.5%;
  overflow: hidden; /*  はみ出た要素を隠す */
  width: 100%;
}
@media (max-width: 599px) {
  .p-topHero {
    height: 80vh;
  }
}

/* 動画 */
.p-topHero__video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -1;
}

/* すりガラスフィルター */
.glass-shape {
  position: absolute;
  z-index: 0;
  left: -15%;
  top: 56%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  /* 1920-375(1149-305)
  1920-375(912-242) */
  width: clamp(19.063rem, 6.259rem + 54.628vw, 71.813rem);
  height: clamp(15.125rem, 4.961rem + 43.366vw, 57rem);
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
  mask-image: url("../images/common/blur-logo.svg");
  -webkit-mask-image: url("../images/common/blur-logo.svg");
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  backdrop-filter: blur(10px); /* ぼかし度 */
  background-color: rgba(255, 255, 255, 0.1); /* 透過 度*/
  /* will-change: transform;  */ /* GPU アクセラレーションを有効化 */
  will-change: transform, opacity, filter, clip-path;
  contain: layout style paint; /* レイアウト計算を分離 */
  pointer-events: none; /* マウスイベントを無視 */
  /* ★ 光の反射用グラデーション */
}
.glass-shape::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(rgba(255, 255, 255, 0.2)), color-stop(rgba(255, 255, 255, 0.4)), color-stop(rgba(255, 255, 255, 0.2)), to(transparent));
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.2), transparent);
  -webkit-transform: translateX(var(--gradient-position, -100%));
          transform: translateX(var(--gradient-position, -100%));
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

/* ★ パフォーマンス最適化 */
@media (prefers-reduced-motion: reduce) {
  .glass-shape {
    -webkit-animation: none;
            animation: none;
    -webkit-transition: none;
    transition: none;
  }
  .glass-shape::before {
    display: none;
  }
}
/* キャッチ */
.p-topMv__catch--box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 100%;
  position: relative;
}

/* font */
/* トップmvキャッチ */
/* 1920-800 (68-48)*/
.topMv_catch {
  font-family: "Zen Old Mincho", serif;
  font-size: clamp(3rem, 2.107rem + 1.786vw, 4.25rem);
  /* line-height: 1.4; */
  line-height: 1.3;
  font-weight: 400;
  color: #fff;
}
@media (max-width: 799px) {
  .topMv_catch {
    /* 767-375(48-38) */
    font-size: clamp(2.375rem, 1.777rem + 2.551vw, 3rem);
  }
}

.topMv_catch-sub {
  position: relative;
  z-index: 1;
  font-family: "Albert Sans", sans-serif;
  font-size: clamp(1.25rem, 0.357rem + 1.786vw, 2.5rem);
  /* line-height: 1.2; */
  line-height: 1;
  font-weight: 300;
  color: #fff;
}
/* ============================================ */
/* hero 下層ページ */
/* ============================================ */
.p-subHero {
  position: relative;
  z-index: 2;
  background: #efefef;
  padding-top: 1.5%;
  overflow: hidden; /*  はみ出た要素を隠す */
  overflow: visible;
  width: 100%;
}
.p-subMv__bg {
  position: absolute;
  background: #083783;
  z-index: -1;
  top: 0;
  right: 0;
  width: 100%;
  height: 75%;
  /* 1920-800__50-30 */
  border-bottom-left-radius: clamp(1.875rem, 0.982rem + 1.786vw, 3.125rem);
}

.p-subMv__bg-logo {
  position: absolute;
  /*右下のロゴ*/
  z-index: -2;
  bottom: -7vw;
  right: -20vw;
  /* 1920-375(1027/821-321/256) */
  width: clamp(20.063rem, 9.353rem + 45.696vw, 64.188rem);
  height: clamp(16rem, 7.429rem + 36.57vw, 51.313rem);
  background-image: url("../images/common/logo3.svg");
  background-size: contain;
  background-position: center; /* または right bottom */
  background-repeat: no-repeat;
  /*  アニメーション */
  opacity: var(--logo-opacity);
  -webkit-transform: translateX(var(--logo-x)) rotate(var(--logo-rotation));
          transform: translateX(var(--logo-x)) rotate(var(--logo-rotation));
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease; /*  フォールバック用 */
  will-change: transform, opacity;
}
@media (max-width: 1399px) {
  .p-subMv__bg-logo {
    right: -26vw;
  }
}
@media (max-width: 767px) {
  .p-subMv__bg-logo {
    bottom: -3vw;
    bottom: -10vw;
  }
}
@media (max-width: 499px) {
  .p-subMv__bg-logo {
    right: -39vw;
    bottom: -5vw;
    bottom: -12vw;
  }
}
@media (max-width: 399px) {
  .p-subMv__bg-logo {
    right: -42vw;
    bottom: -6vw;
    bottom: -14vw;
  }
}

.p-subMv {
  /* 1920-800__360-160 */
  min-height: clamp(10rem, 1.071rem + 17.857vw, 22.5rem);
  /* 1920-800__40-30 */
  gap: 0 clamp(1.875rem, 1.429rem + 0.893vw, 2.5rem);
}
.p-subMv.u-flex {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
@media (max-width: 767px) {
  .p-subMv.u-flex {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 50px;
  }
}
@media (max-width: 399px) {
  .p-subMv.u-flex {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 40px;
  }
}

.p-subMv__left {
  color: #fff;
  /* 1920-800__280-150 */
  width: clamp(9.375rem, 3.571rem + 11.607vw, 17.5rem);
}
@media (max-width: 767px) {
  .p-subMv__left {
    width: 100%;
  }
}

.p-subMv__content {
  margin-top: 7vw;
}
@media (max-width: 899px) {
  .p-subMv__content {
    margin-top: 5vw;
  }
}
@media (max-width: 767px) {
  .p-subMv__content {
    margin-top: auto;
  }
}

.p-subMv__ttl {
  /* 1920-800__45-26 */
  font-size: clamp(1.625rem, 0.777rem + 1.696vw, 2.813rem);
  font-weight: 800;
  font-family: "Albert Sans", sans-serif;
  line-height: 1;
  margin-bottom: 0.5rem;
  display: block;
}

.p-subMv__ttl-sub {
  /* 1920-800__26-18 */
  font-size: clamp(1.125rem, 0.768rem + 0.714vw, 1.625rem);
  line-height: 1;
}

.p-subMv__right {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
@media (max-width: 767px) {
  .p-subMv__right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    margin-top: -30px;
  }
}

.p-subMv__img {
  max-width: 1080px;
  border-radius: 20px;
  overflow: hidden;
}
@media (max-width: 767px) {
  .p-subMv__img {
    width: 92%;
    height: 40vw;
  }
  .p-subMv__img img {
    -webkit-transform-origin: top center;
            transform-origin: top center;
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
  }
}

/* ============================================ */
/* サービス一覧　スライダー */
/* ============================================ */
.p-topService__slider {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.swiper-slide {
  background: transparent;
  width: calc((100% - 120px) / 5);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.p-topService__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.p-topService__item:hover {
  -webkit-transform: translateY(-5px);
          transform: translateY(-5px);
}

.p-topService__imageArea {
  width: 100%;
  border-radius: 20px;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-bottom: 1rem;
}
@media (max-width: 499px) {
  .p-topService__imageArea {
    margin-bottom: 0.5rem;
  }
}
@media (max-width: 399px) {
  .p-topService__imageArea {
    border-radius: 10px;
  }
}

.p-topService__image {
  display: block;
  width: 100%;
  height: auto;
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
}

.p-topService__item:hover .p-topService__image {
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}

.p-topService__item--bottom {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 30px;
}
.p-topService__item--bottom.u-flex {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
@media (max-width: 767px) {
  .p-topService__item--bottom {
    gap: 0 15px;
  }
}

.p-topService__text {
  line-height: 1.4;
  text-align: center;
}
@media (max-width: 339px) {
  .p-topService__text {
    font-size: 14px;
  }
}

.p-topService__button {
  -ms-flex-negative: 0;
      flex-shrink: 0; /* 縮小させない */
  text-align: right;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #083783;
  color: #fff;
  font-size: 14px;
  -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  will-change: transform, box-shadow;
}
@media (max-width: 767px) {
  .p-topService__button {
    width: 40px;
    height: 40px;
  }
}
@media (max-width: 699px) {
  .p-topService__button {
    width: 35px;
    height: 35px;
  }
}

/* ============================================ */
/* section */
/* ============================================ */
/* ============================================ */
/* footer */
/* ============================================ */
.p-footer__top {
  margin-bottom: 20px;
}

.p-footer__logo {
  display: block;
  /* 1440-800(347-297) */
  width: clamp(18.563rem, 14.656rem + 7.813vw, 21.688rem);
  margin-bottom: 10px;
}
@media (max-width: 399px) {
  .p-footer__logo {
    width: 80%;
  }
}

.p-footer__bottom {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  /* 1920-1400(100-50) */
  gap: 0 clamp(3.125rem, -5.288rem + 9.615vw, 6.25rem);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.p-footer__bottom.u-flex {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
@media (max-width: 767px) {
  .p-footer__bottom.u-flex {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}
@media (max-width: 767px) {
  .p-footer__bottom {
    gap: 50px 0;
  }
}

.p-footer__bottom-left {
  max-width: 320px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.p-footer__campany {
  font-family: "Albert Sans", sans-serif;
  font-weight: 500;
  /* 1440-800(28-24) */
  font-size: clamp(1.5rem, 1.188rem + 0.625vw, 1.75rem);
  line-height: 1;
}
@media (max-width: 399px) {
  .p-footer__campany {
    font-size: 22px;
  }
}

.p-footer__address {
  font-size: 16px;
  font-weight: 500;
}
@media (max-width: 767px) {
  .p-footer__address {
    font-size: 14px;
  }
}

.p-footer__bottom-right {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  max-width: 63.1578947368%;
  border-top: 1px solid #fff;
  padding-top: 1rem;
}
@media (max-width: 767px) {
  .p-footer__bottom-right {
    max-width: 100%;
  }
}

.p-footer__nav-sns {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  /* 1920-1400(100-50) */
  gap: 0 clamp(3.125rem, -5.288rem + 9.615vw, 6.25rem);
}
@media (max-width: 767px) {
  .p-footer__nav-sns {
    gap: 30px 0;
  }
  .p-footer__nav-sns.u-flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.p-footer__nav {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.p-footer__list {
  gap: 1rem 2rem;
}

.p-footer__item {
  line-height: 1;
}

.p-footer__sns {
  width: 42px;
}

/* コピーライト
----------------------------------------------------------------------------------------*/
.l-copyright {
  background: #022765;
}

.c-copyright {
  font-size: 14px;
  line-height: 1;
  padding: 15px 0;
}

/* ============================================ */
/* ============================================ */
/* ============================================ */
/* section */
/* ============================================ */
/* ============================================ */
/*  top*/
/* ============================================ */
/*test*/
.txt {
  /* font-family: noto;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;
  letter-spacing: 0.1em; */
}

/*余白設定*/
.test-left {
  background: green;
  color: red;
}

.test-R {
  background: tan;
}

.ggg {
  font-size: clamp(1rem, calc(-1.0106382979rem + 8.9361702128vw), 6.25rem);
  color: #333;
}
@media (max-width: 1200px) {
  .ggg {
    color: orange;
  }
}
@media (max-width: 992px) {
  .ggg {
    color: red;
  }
}
@media (max-width: 768px) {
  .ggg {
    color: green;
  }
}
@media (max-width: 540px) {
  .ggg {
    color: aqua;
  }
}
@media (max-width: 360px) {
  .ggg {
    color: blue;
  }
}

.hogehoge {
  font-size: 1rem;
  color: #0000ff;
}
@media screen and (max-width: 360px) {
  .hogehoge {
    font-size: 1.25rem;
    color: #ff0000;
  }
}

.hogehoge3 {
  padding: 2.5rem;
  background: #ffcc00;
}
@media print, screen and (max-width: 1024px) {
  .hogehoge3 {
    padding: 20px;
  }
}

.hogehoge {
  font-size: 2rem;
}
@media print, screen and (max-width: 800px) {
  .hogehoge {
    font-size: 1rem;
    color: #ff0000;
  }
}

/* GSAP */
/* パララックス */
.test__img {
  width: 18.75rem;
  height: 18.75rem;
  overflow: hidden;
}

.test__img img {
  height: calc(100% + 3.125rem);
}

/*パララックス複数*/
.parallax__list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  gap: 0.625rem;
  place-content: center;
}

.parallax__item-img {
  width: 18.75rem;
  height: 18.75rem;
  overflow: hidden;
}

.parallax__item-img img {
  height: calc(100% + 3.125rem);
}

/* タイムライン */
.box_wrap {
  margin: 300px 100px;
}

.box {
  width: 150px;
  height: 150px;
  background: #333;
  color: #fff;
  font-size: 1.6rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.box + .box {
  margin-top: 30px;
}

/*===================================================================
    /* トップページ */
/* TOP
お知らせ
会社案内
事業内容
施設紹介
施工実績
採用情報
ダウンロード
お問い合わせ */
/* 私たちについて
company
事業紹介
service
新着情報
news
採用情報
recruit
cta
フッター */
/* 私たちについて
----------------------------------------------------------------------------------------*/
.p-section_topCompany {
  background: #efefef;
  /* 1920-375(150-60) */
  padding-top: clamp(3.75rem, 2.385rem + 5.825vw, 9.375rem);
  position: relative;
  z-index: 1;
  overflow: hidden;
  /* CSS変数 */
  --logo-opacity: 0;
  --logo-x: 100px;
  --logo-rotation: 10deg;
  /*右上のロゴ*/
}
.p-section_topCompany::after {
  content: "";
  position: absolute;
  z-index: 0;
  right: -22vw;
  top: -30vw;
  /* 1920-375(1027/821-321/256) */
  width: clamp(20.063rem, 9.353rem + 45.696vw, 64.188rem);
  height: clamp(16rem, 7.429rem + 36.57vw, 51.313rem);
  background-image: url("../images/common/logo3.svg");
  background-size: contain;
  background-position: center; /* または right bottom */
  background-repeat: no-repeat;
  /*  アニメーション */
  opacity: var(--logo-opacity);
  -webkit-transform: translateX(var(--logo-x)) rotate(var(--logo-rotation));
          transform: translateX(var(--logo-x)) rotate(var(--logo-rotation));
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease; /*  フォールバック用 */
  will-change: transform, opacity;
}
@media (max-width: 1099px) {
  .p-section_topCompany::after {
    top: -32vw;
  }
}
@media (max-width: 999px) {
  .p-section_topCompany::after {
    top: -34vw;
  }
}
@media (max-width: 799px) {
  .p-section_topCompany::after {
    top: -36vw;
  }
}
@media (max-width: 699px) {
  .p-section_topCompany::after {
    top: -38vw;
  }
}
@media (max-width: 599px) {
  .p-section_topCompany::after {
    top: -40vw;
  }
}
@media (max-width: 499px) {
  .p-section_topCompany::after {
    top: -44vw;
  }
}
@media (max-width: 399px) {
  .p-section_topCompany::after {
    top: -46vw;
  }
}
@media (max-width: 349px) {
  .p-section_topCompany::after {
    top: -50vw;
  }
}

.p-topCompany {
  /* 1440-900(80-40) */
  gap: 0 clamp(2.5rem, -1.667rem + 7.407vw, 5rem);
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (max-width: 699px) {
  .p-topCompany.u-flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.p-topCompany_left {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.p-topCompany_left .c-section__txt {
  margin-bottom: 1rem;
}
@media (min-width: 600px) and (max-width: 699px) {
  .p-topCompany_left {
    margin-bottom: 50px;
  }
}

.p-topCompany__right {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin-right: calc(50% - 50vw);
}
@media (max-width: 599px) {
  .p-topCompany__right {
    margin-right: 0;
  }
}

.p-topCompany__img {
  position: relative;
  z-index: 1;
  border-radius: 30px 0 0 30px;
  overflow: hidden;
}
.p-topCompany__img img {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (max-width: 599px) {
  .p-topCompany__img {
    max-width: 400px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 1rem;
  }
}
@media (max-width: 399px) {
  .p-topCompany__img {
    border-radius: 15px;
  }
}

.p-topCompany__img-car {
  max-width: 1280px;
}
.p-topCompany__img-car img {
  max-width: 1280px;
}
.p-topCompany__img-car {
  /* 1920-375(100-30) */
  margin: clamp(1.875rem, 0.813rem + 4.531vw, 6.25rem) auto;
}

/* 事業紹介
----------------------------------------------------------------------------------------*/
.p-section__topService {
  /* width: calc(1440px /1920px * 100vw); */
  background: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(75vw, #fff), color-stop(25vw, #efefef), to(#efefef));
  background: linear-gradient(90deg, #fff 0%, #fff 75vw, #efefef 25vw, #efefef 100%);
  position: relative;
}
.p-section__topService.u-ptpb-100 {
  /* 1920-375(150-70) */
  padding-bottom: clamp(1.25rem, -0.722rem + 8.414vw, 9.375rem);
}
.p-section__topService .c-section__ttl-block {
  margin-right: 0;
  margin-left: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
@media (max-width: 599px) {
  .p-section__topService .c-section__ttl-block {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}
.p-section__topService {
  /* 背景の大きなテキスト */
}
.p-section__topService .infiniteScrollText {
  top: auto;
  bottom: -10vw;
  left: 39%;
  z-index: 0;
}

.p-topService__top {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  /* 1920-900(100-50) */
  gap: 0 clamp(3.125rem, 0.368rem + 4.902vw, 6.25rem);
}
.p-topService__top.u-flex {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
@media (max-width: 699px) {
  .p-topService__top.u-flex {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.p-topService__top--left {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.p-topService__top--right {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  /* 1600-600(280-220) */
  width: clamp(13.75rem, 11.5rem + 6vw, 17.5rem);
}
@media (max-width: 1400px) {
  .p-topService__top--right .c-btn-link--pill {
    padding-left: 24px;
  }
}
@media (max-width: 599px) {
  .p-topService__top--right {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin-top: 1rem;
  }
}

.p-topService__bottom {
  background: #fff;
  padding: 1rem 0;
}

/* スペーサー
----------------------------------------------------------------------------------------*/
.p-section__spacer {
  height: 100px;
  background: #efefef;
}
@media (max-width: 699px) {
  .p-section__spacer {
    height: 50px;
  }
}

/* 新着情報
----------------------------------------------------------------------------------------*/
.p-section__topNews {
  background: #083783;
  color: #fff;
  position: relative;
  z-index: 1;
  overflow-x: clip;
  /*  CSS変数*/
  --logo-opacity: 0;
  --logo-x: 100px;
  --logo-rotation: 10deg;
}
.p-section__topNews .c-btn.--sub {
  display: none;
}
.p-section__topNews.u-mb80 {
  /* 1440-375(200-50) */
  margin-bottom: clamp(3.125rem, -0.176rem + 14.085vw, 12.5rem);
}
.p-section__topNews {
  /*右下のロゴ*/
}
.p-section__topNews::after {
  content: "";
  position: absolute;
  z-index: 0;
  right: -22vw;
  bottom: -16vw;
  /* 1920-375(1027/821-321/256) */
  width: clamp(20.063rem, 9.353rem + 45.696vw, 64.188rem);
  height: clamp(16rem, 7.429rem + 36.57vw, 51.313rem);
  background-image: url("../images/common/logo3.svg");
  background-size: contain;
  background-position: center; /* または right bottom */
  background-repeat: no-repeat;
  /* ★ アニメーション用プロパティ */
  opacity: var(--logo-opacity);
  -webkit-transform: translateX(var(--logo-x)) rotate(var(--logo-rotation));
          transform: translateX(var(--logo-x)) rotate(var(--logo-rotation));
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  will-change: transform, opacity;
}
@media (max-width: 599px) {
  .p-section__topNews .c-btn.--sub {
    display: block;
    position: relative;
    z-index: 1;
  }
  .p-section__topNews .c-btn.--wht.--sub {
    margin-top: 20px;
  }
}

.p-topNews {
  position: relative;
  z-index: 1;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  /* 1440-900(100-50) */
  gap: clamp(3.125rem, -2.083rem + 9.259vw, 6.25rem);
}
@media (max-width: 599px) {
  .p-topNews {
    gap: 0;
  }
  .p-topNews.u-flex {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

/* 左側の400pxカラム (NEWSタイトル部分) */
.p-topNews__left {
  /* 1440-900(280-200) */
  width: clamp(12.5rem, 4.167rem + 14.815vw, 17.5rem);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (max-width: 599px) {
  .p-topNews__left .c-btn {
    display: none;
  }
}

.p-topNews__right {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  max-width: 800px;
}

.p-topNews__list {
  list-style: none;
}

/* 各ニュースアイテム（liタグ） */
.p-topNews__item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.9);
  padding: 15px 0;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

/* 最後のアイテムから区切り線を削除 */
.p-topNews__item:last-child {
  border-bottom: none;
}

/* リンク全体 (日付、タグ、タイトル、アイコンを含む) */
.p-topNews__item-link {
  text-decoration: none;
  color: #fff;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  display: block;
}
.p-topNews__item-link:hover {
  color: #fff;
  /* テキスト下線アニメーション（コードb参考） */
}
.p-topNews__item-link:hover .p-topNews__title::after {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
  -webkit-transform-origin: left center;
          transform-origin: left center;
}
.p-topNews__item-link:hover {
  /* 矢印ボタンの拡大・浮き上がりアニメーション（コードb参考） */
}
.p-topNews__item-link:hover .p-topNews__arrow {
  -webkit-transform: scale(1.08) translateY(-2px);
          transform: scale(1.08) translateY(-2px);
  -webkit-box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
          box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
}
.p-topNews__item-link:hover {
  /* 日付の色変化 */
}
.p-topNews__item-link:hover .p-topNews__date {
  color: rgba(255, 255, 255, 0.9);
}

.p-topNews__date {
  font-family: "Albert Sans", sans-serif;
  font-weight: 500;
  /* 1440-1000(20-16) */
  font-size: clamp(1rem, 0.432rem + 0.909vw, 1.25rem);
  -ms-flex-negative: 0;
      flex-shrink: 0; /* 縮小させない */
  width: 120px; /* 日付の表示に十分な幅を確保 */
  margin-right: 20px;
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease;
}

.p-topNews__item-bottom {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.p-topNews__item-bottom.u-flex {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}

.p-topNews__category {
  -ms-flex-negative: 0;
      flex-shrink: 0; /* 縮小させない */
  display: inline-block;
  background-color: #fff;
  color: #083783;
  font-size: 14px;
  line-height: 1;
  /* 1440-900(20-10) */
  padding: 8px clamp(0.625rem, -0.417rem + 1.852vw, 1.25rem);
  border-radius: 50px;
  margin-right: 20px;
  -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  will-change: transform;
}
@media (max-width: 699px) {
  .p-topNews__category {
    padding: 3px 1.5rem;
  }
}

.p-topNews__title {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  margin-right: 20px;
  position: relative;
  display: inline-block;
}
.p-topNews__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 1px;
  background-color: #fff;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transform-origin: left center;
          transform-origin: left center;
  -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: -webkit-transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: transform;
}
@media (max-width: 499px) {
  .p-topNews__title {
    margin-right: 10px;
  }
}

/* 矢印ボタンのアニメーション */
.p-topNews__arrow {
  -ms-flex-negative: 0;
      flex-shrink: 0; /* 縮小させない */
  width: 30px;
  text-align: right;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%; /* 円形にする */
  background-color: #fff; /* 背景を白に */
  color: #083783; /* アイコンの色を背景色に合わせる */
  font-size: 14px; /* アイコンサイズ調整 */
  -webkit-transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  will-change: transform, box-shadow;
}

/* アクセシビリティ対応 */
.p-topNews__item-link:focus {
  outline: 2px solid rgba(255, 255, 255, 0.8);
  outline-offset: 2px;
}
.p-topNews__item-link:focus .p-topNews__title::after {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
}
.p-topNews__item-link:focus .p-topNews__arrow {
  -webkit-transform: scale(1.08) translateY(-2px);
          transform: scale(1.08) translateY(-2px);
  -webkit-box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
          box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
}

/* 採用情報
----------------------------------------------------------------------------------------*/
.p-section__topRecuruit {
  position: relative;
  z-index: 1;
}

.p-topRecuruit {
  border-radius: 60px;
}
.p-topRecuruit .l-container128 {
  position: relative;
}
.p-topRecuruit .c-section__catch {
  margin-bottom: 0;
}
.p-topRecuruit.u-bg-img {
  position: relative;
  overflow: hidden; /*スクロールバー非表示*/
  /* background-image: url('../images/index/top-recruit-bg.webp'); */
  /* カラーフィルター #083783*/
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(8, 55, 131, 0.4)), to(rgba(8, 55, 131, 0.4))), url(../images/index/top-recruit-bg.webp);
  background-image: linear-gradient(rgba(8, 55, 131, 0.4), rgba(8, 55, 131, 0.4)), url(../images/index/top-recruit-bg.webp);
  background-blend-mode: multiply; /* overlayなども可 */
  background-size: cover;
  background-position: top;
  background-repeat: no-repeat;
}
@media (max-width: 699px) {
  .p-topRecuruit.u-bg-img {
    /* 画像(2枚目)だけ位置をずらす */
    /* right 100px top = 右端から100px内側へ（左へ移動） */
    /* background-position: right top, right -100px top; */
  }
}
.p-topRecuruit {
  /* すりガラスフィルター */
}
.p-topRecuruit .glass-shape {
  position: absolute;
  z-index: 0;
  left: -10%;
  top: auto; /* 打消し */
  bottom: -25%;
  -webkit-transform: none;
          transform: none; /* 打消し */
  /* 1920-375(677-377）
  1920-375(542-302) */
  width: clamp(23.563rem, 19.012rem + 19.417vw, 42.313rem);
  height: clamp(18.875rem, 15.234rem + 15.534vw, 33.875rem);
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
  mask-image: url("../images/common/blur-logo.svg");
  -webkit-mask-image: url("../images/common/blur-logo.svg");
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  backdrop-filter: blur(10px); /* ぼかし度 */
  background-color: rgba(255, 255, 255, 0.1); /* 透過 度*/
  will-change: transform; /* GPU アクセラレーションを有効化 */
  contain: layout style paint; /* レイアウト計算を分離 */
  pointer-events: none; /* マウスイベントを無視 */
}
@media (max-width: 599px) {
  .p-topRecuruit .glass-shape {
    left: -20%;
  }
}
@media (max-width: 499px) {
  .p-topRecuruit .glass-shape {
    left: -30%;
  }
}
@media (max-width: 399px) {
  .p-topRecuruit .glass-shape {
    left: -40%;
  }
}
@media (max-width: 699px) {
  .p-topRecuruit {
    border-radius: 40px;
  }
}
@media (max-width: 399px) {
  .p-topRecuruit {
    border-radius: 30px;
  }
}

.p-topRecuruit .c-section__ttl-sub {
  margin-bottom: 50px;
}
@media (max-width: 767px) {
  .p-topRecuruit .c-section__ttl-sub {
    margin-bottom: 30px;
  }
}

.p-topRecuruit .c-btn {
  background: initial;
}

/*===================================================================
    /* 施設紹介 */
/*産業廃棄中間処理施設 汚泥の天日乾燥施設*/
/* 産業廃棄中間処理施設 廃油の油水分離システム */
/*===================================================================
    /* 事業内容 */
/* ====================================================
   p-service-nav: サービスセクションナビゲーション
   JSON: export_0002.json / グループ 1836（アートボード 1280×282px）
   6枚のカードを3列グリッドで表示し、各セクションへアンカーリンク
   ==================================================== */
/* ナビゲーション外包：l-container152 に上下パディングを付与 */
.p-service-nav-wrap {
  padding-top: 40px;
  padding-bottom: 40px;
}

/* ナビゲーションブロック：幅いっぱい使用 */
.p-service-nav {
  width: 100%;
}

/* ナビリスト：JSON: 3列グリッド、列gap=36px、行gap=38px
   list-styleはresetで処理済みのため省略 */
.p-service-nav__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 38px 36px;
}

/* 699px以下：2列表示 */
@media (max-width: 699px) {
  .p-service-nav__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
}
/* 399px以下：1列表示 */
@media (max-width: 399px) {
  .p-service-nav__list {
    grid-template-columns: repeat(1, 1fr);
  }
}
/* ナビアイテム：グリッドセル。高さ揃えのためheight:100%を子に渡す */
.p-service-nav__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

/* カードリンク
   JSON: width=403px（1fr換算）, min-height=122px
   border: 1px solid #083783（長方形ストロークより）
   border-radius: 10px（cornerRadiiより）
   box-shadow: 0 3px 6px rgba(0,0,0,0.16)（shadowより: blur6, opacity41/255≈0.16）
   padding-left: 52px（テキストx=52 / カードx=0 より算出）
   padding-right: 25px（カード幅403 − ▼位置367 − ▼幅11 = 25px より算出）
   font-size: 20px（JSONのfontSizeより）
   font-weight: Regular（JSONのfontStyleより）
   color: #083783（非アクティブテキスト色より） */
.p-service-nav__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  min-height: 122px;
  padding: 20px 25px 20px 52px;
  border: 1px solid #083783;
  border-radius: 10px;
  background: #fff;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  color: #083783;
  font-size: 20px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 1.55;
  text-decoration: none;
  -webkit-transition: background 0.2s, color 0.2s;
  transition: background 0.2s, color 0.2s;
}

/* 699px以下：フォントサイズとパディングを縮小 */
@media (max-width: 699px) {
  .p-service-nav__link {
    font-size: 15px;
    min-height: 80px;
    padding: 15px 16px 15px 20px;
  }
}
/* ▼アイコン：JSON: 多角形27〜32（11×10px）を::afterで代替
   colorはp-service-nav__linkから継承（非アクティブ: #083783、アクティブ: #fff） */
.p-service-nav__link::after {
  content: "▼";
  font-size: 0.65em;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  margin-left: 12px;
}

/* アクティブ状態
   JSON: 長方形1507 fill=#083783（Card1のみ塗り）
   is-activeクラスはJSでスクロール連動 or 静的付与 */
.p-service-nav__link.is-active {
  background: #083783;
  color: #fff;
}

/* ホバー状態：アクティブと同スタイル */
.p-service-nav__link:hover {
  background: #083783;
  color: #fff;
}

/* ====================================================
   各セクション別スタイル
   ==================================================== */
/* ====================================================
   各セクション見出し：青い左バー付きスタイル
   JSON: 長方形1518〜1525 / 4×27px #083783
   グリストラップ・浄水場・側溝・ビルメンテ・リサイクルフロー共通
   ==================================================== */
/* 青バー付き見出し：_title.scss の .c-lowerPage__ttl3 が既に border-left を持つため
   color と font-weight のみ上書き（border-left / padding は既存スタイルを流用） */
.c-lowerPage__ttl3.--bar {
  color: #083783;
  font-weight: 700;
}

/* ====================================================
   0003: オイルタンクの洗浄・漏洩検査
   JSON: グループ1836 / 962×1102px
   ==================================================== */
/* メイン写真コンテナ：JSON RIMG1638 960×460 borderRadius:20px */
.p-service2__fullimg {
  border-radius: 20px;
  overflow: hidden;
  margin-bottom: 30px;
}

/* 画像を幅100%に引き伸ばす */
.p-service2__fullimg img {
  width: 100%;
  height: auto;
  display: block;
}

/* フロー図ラッパー：見出しテキストと画像をまとめる */
.p-service2__flow {
  margin-bottom: 50px;
}

/* フロー図画像コンテナ：JSON 長方形1411 borderRadius:20px, fill=#FFFFFF */
.p-service2__flow-img {
  border-radius: 20px;
  overflow: hidden;
  background: #fff;
}

/* フロー図画像を幅100%に引き伸ばす */
.p-service2__flow-img img {
  width: 100%;
  height: auto;
  display: block;
}

/* ====================================================
   各セクション別スタイル
   ==================================================== */
/* 地域環境保全のトータルシステム */
/* 環境と生活を守る各種メンテナンス */
/* 清掃・ビルメンテナンスエリア：前セクションとの区切り線（JSON: グループ1840 上部に境界線） */
.--building_maintenance_regular {
  border-top: 1px solid #C9C8C8;
  padding-top: 1rem;
}

/* 699px以下：2列→1列に変更 */
@media (max-width: 699px) {
  .--building_maintenance_regular .u-grid {
    grid-template-columns: repeat(1, 1fr);
  }
}
/* 汚泥焼却灰のリサイクル */
/* ろ材更生 */
/* 流出油処理 */
/* 油混り汚泥の乾燥無害化 */
/* ====================================================
   0010: ろ材更生 セクション固有スタイル
   ==================================================== */
/* 全幅写真: JSON RIMG1638 960×460px borderRadius:10px */
.p-service4__fullimg {
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 30px;
}

.p-service4__fullimg img {
  width: 100%;
  height: auto;
  display: block;
}

/* 2列写真のborderRadius上書き: JSON cornerRadii 20px（デフォルト_lowerPage.scss の10pxを上書き）*/
.p-service4 .c-lowerPage__list-img {
  border-radius: 20px;
}

/* プロモカード: JSON グループ1829 960×250px
   border: 1px solid #124BA8 / shadow: 0 3px 6px rgba(0,0,0,0.16) / radius:20px */
/* プロモバナー: 画像を全幅で表示 */
.p-service4__promo {
  margin-top: 30px;
}

.p-service4__promo picture {
  display: block;
}

.p-service4__promo img {
  width: 100%;
  height: auto;
  display: block;
}

/* 左側画像エリア: JSON 395×250px 左上・左下radius:20px */
.p-service4__promo-img {
  position: relative;
  width: 41.15%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  overflow: hidden;
}

/* pictureタグのinlineをブロックに変更しないと隙間が生じる */
.p-service4__promo-img picture {
  display: block;
  width: 100%;
  height: 100%;
}

.p-service4__promo-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}

/* オーバーレイテキスト: JSON fontSize=20 Regular white letterSpacing:100(=0.1em) lineHeight:31px */
.p-service4__promo-catch {
  position: absolute;
  top: 20px;
  left: 17px;
  color: #fff;
  font-size: 20px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0.1em;
  pointer-events: none;
}

/* 右側コンテンツエリア */
.p-service4__promo-body {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 24px 32px;
}

/* サブテキスト: JSON fontSize=21 Medium black letterSpacing:50(=0.05em) */
.p-service4__promo-sub {
  font-size: 21px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  letter-spacing: 0.05em;
  margin-bottom: 4px;
}

/* メインタイトル: JSON fontSize=46 Bold #083783 letterSpacing:50(=0.05em) */
.p-service4__promo-title {
  font-size: 46px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  color: #083783;
  letter-spacing: 0.05em;
  line-height: 1;
  margin-bottom: 10px;
}

/* 説明テキスト: JSON fontSize=18 Regular lineHeight:25px */
.p-service4__promo-desc {
  font-size: 18px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 1.39;
  margin-bottom: 16px;
}

/* ボタン: JSON グループ1828 "専用ページを見る" white text on #083783 */
.p-service4__promo-btn {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  -ms-flex-item-align: end;
      align-self: flex-end;
  background: #083783;
  color: #fff;
  font-size: 18px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  text-decoration: none;
  padding: 10px 20px;
  border-radius: 0 0 20px 0;
}

.p-service4__promo-btn::after {
  content: "▶";
  font-size: 0.7em;
}

/* ====================================================
   0011〜0014: 流出油処理 セクション固有スタイル
   ==================================================== */
/* メイン写真: JSON RIMG5834(2) 960×460px borderRadius:20px */
.p-service5__fullimg {
  border-radius: 20px;
  overflow: hidden;
  margin-bottom: 20px;
}

.p-service5__fullimg img {
  width: 100%;
  height: auto;
  display: block;
}

/* フロー図: JSON グループ1731 959.5×533px borderRadius:10px */
.p-service5__flow-img {
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 10px;
}

.p-service5__flow-img img {
  width: 100%;
  height: auto;
  display: block;
}

/* ====================================================
   0015〜0016: 油混り汚泥の乾燥無害化 セクション固有スタイル
   ==================================================== */
/* 2列大型写真のborderRadius上書き: JSON cornerRadii 20px（0015のみ対象） */
.p-service6__sludge .c-lowerPage__list-img {
  border-radius: 20px;
}

/*===================================================================
    /* 会社案内 */
/* ====================================================
   p-company__ttl-block: 左カラムのEN/JP見出しブロック
   JSON (全セクション共通): グループ1635
     EN: fontSize=40 fontStyle=ExtraBold Albert Sans color=#083783
     JP: fontSize=26 fontStyle=Bold Noto Sans JP color=#083783
   ==================================================== */
/* EN見出し: 1920-800px → 40-22px */
.p-company__ttl-en {
  font-family: "Albert Sans", sans-serif;
  /* 1920-800: 40-22px / b=(40-22)/(1920-800)*100=1.607 / a=40-1920*1.607/100=9.13px=0.571rem */
  font-size: clamp(1.375rem, 0.571rem + 1.607vw, 2.5rem);
  font-weight: 800;
  color: #083783;
  line-height: 1;
  margin-bottom: 0.5rem;
  display: block;
}

/* JP副見出し: c-lowerPage__ttl と同スケール */
.p-company__ttl-jp {
  /* JSON: fontSize=26 Bold / c-lowerPage__ttl に合わせてスケール */
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(1.25rem, 0.982rem + 0.536vw, 1.625rem);
  font-weight: 700;
  color: #333;
  line-height: 1.2;
  display: block;
}

/* ====================================================
   0001: MESSAGE / 代表あいさつ 固有スタイル
   JSON: グループ1836 / 1520×626px
   ==================================================== */
/* 署名テキスト: JSON fontSize=20 Regular 右揃え */
.p-company__sign {
  font-size: 20px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  text-align: right;
  margin-top: 1.5rem;
}

@media (max-width: 767px) {
  .p-company__sign {
    font-size: 15px;
  }
}
/* ====================================================
   0002: PHILOSOPHY / 環境・経営方針 固有スタイル
   JSON: グループ1757 / 1280×844px
   ==================================================== */
/* 経営理念・方針 大テキスト: JSON fontSize=30 fontStyle=Medium */
/* 1920-800: 30-18px / b=(30-18)/(1920-800)*100=1.071 / a=30-1920*1.071/100=9.44px=0.59rem */
.p-company__lead {
  font-size: clamp(1.125rem, 0.59rem + 1.071vw, 1.875rem);
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  line-height: 1.9;
  margin-bottom: 2rem;
}

/* 行動方針リスト: JSON fontSize=24 fontStyle=Medium */
/* 1920-800: 24-16px / b=(24-16)/(1920-800)*100=0.714 / a=24-1920*0.714/100=10.29px=0.643rem */
.p-company__policy-list {
  margin-bottom: 1.5rem;
}

.p-company__policy-item {
  font-size: clamp(1rem, 0.643rem + 0.714vw, 1.5rem);
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  line-height: 1.9;
  margin-bottom: 0.75rem;
}

/* 方針注記テキスト: JSON fontSize=20 fontStyle=Regular */
/* 1920-800: 20-14px / b=(20-14)/(1920-800)*100=0.536 */
.p-company__note {
  font-size: clamp(0.875rem, 0.607rem + 0.536vw, 1.25rem);
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 1.9;
  color: #555;
  margin-top: 1rem;
}

/* ====================================================
   0003: OVERVIEW / 会社概要  &  0006: HISTORY / 会社沿革
   共通テーブルスタイル
   JSON: 線40〜47（OVERVIEW）/ 線40〜53（HISTORY）
         dt幅: x=569→787 = 218px / 960px ≈ 22.7%
   ==================================================== */
/* DLテーブル外包: 上部罫線から始まる */
.p-company__table {
  width: 100%;
  border-top: 1px solid #C9C8C8; /* JSON 線40 相当 */
}

/* 各行ラッパー: flexで左右並び + 下罫線 */
.p-company__table-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  border-bottom: 1px solid #C9C8C8; /* JSON 各線 相当 */
  padding: 0.75rem 0;
  gap: 0 20px;
}

/* 左カラム（ラベル）: JSON dt幅 ≈ 218px */
.p-company__table-dt {
  min-width: 200px;
  max-width: 200px;
  font-size: 18px; /* JSON: fontSize=18 Regular */
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 1.8;
  color: #333;
}

/* 右カラム（値）: 残幅すべて */
.p-company__table-dd {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 18px; /* JSON: fontSize=18 Regular */
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 1.8;
}

/* SP: 縦並びに切り替え */
@media (max-width: 767px) {
  .p-company__table-row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0;
    padding: 0.75rem 0;
  }
  .p-company__table-dt {
    min-width: unset;
    max-width: unset;
    font-size: 14px;
    font-weight: 700;
    padding-bottom: 0.2rem;
  }
  .p-company__table-dd {
    font-size: 14px;
  }
}
/* ====================================================
   0004: ACCESS / アクセス 固有スタイル
   JSON: グループ1759 / 1280×972px
     本社マップ: 長方形1325 960×400px
     中間処理場マップ: 長方形1326 960×400px
   ==================================================== */
/* 各地図ブロック外包 */
.p-company__map-block {
  margin-bottom: 2.5rem;
}

/* 住所テキスト: JSON fontSize=18 Regular */
.p-company__map-address {
  font-size: 18px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  margin-bottom: 0.75rem;
}

/* Googleマップ iframeコンテナ: JSON 960×400px（アスペクト比 41.67%） */
.p-company__map-iframe {
  position: relative;
  width: 100%;
  padding-top: 41.67%; /* 400/960 = 41.67% */
  border-radius: 10px;
  overflow: hidden;
  background: #eee;
}

.p-company__map-iframe iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 767px) {
  .p-company__map-address {
    font-size: 15px;
  }
  .p-company__map-iframe {
    padding-top: 75%; /* SP用: 高さを増やして視認性を確保 */
  }
}
/* ====================================================
   0007: PERMISSION / 許認可・登録 固有スタイル
   JSON: グループ1839 / 1520×1365px
     許認可リスト: 線40〜51 / 10行
     認証画像25: ISO14001 289×148px
     認証画像26: グリーン・ビズ 160×208px
   ==================================================== */
/* 許認可リスト外包: 上部罫線から始まる */
.p-company__perm-list {
  width: 100%;
  border-top: 1px solid #C9C8C8; /* JSON 線40 相当 */
  margin-bottom: 2.5rem;
}

/* 許認可リスト内リンク: 青色に上書き（[1] c-pageLink のデフォルト赤色を変更） */
.p-company__perm-item .c-pageLink {
  color: #083783;
}

.p-company__perm-item .c-pageLink::after {
  background-color: #083783;
}

/* 各許認可項目: JSON fontSize=18 fontStyle=Medium + 下罫線 */
.p-company__perm-item {
  font-size: 18px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  line-height: 1.8;
  border-bottom: 1px solid #C9C8C8; /* JSON 各線 相当 */
  padding: 0.65rem 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 0 0.5rem;
}

@media (max-width: 767px) {
  .p-company__perm-item {
    font-size: 13px;
  }
}
/* 認証セクション（ISO14001 / 北海道グリーン・ビズ）
   JSON: 画像左（x=569）+ テキスト右（x=921）
   画像25: 289×148px / 画像26: 160×208px */
.p-company__cert-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 30px;
  padding: 2rem 0;
  border-bottom: 1px solid #C9C8C8;
}

.p-company__cert-img {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.p-company__cert-img img {
  height: auto;
  display: block;
}

/* ISO14001: max-width:289px（JSON 画像25 289×148px） */
.p-company__cert-img.--iso img {
  max-width: 289px;
  width: 100%;
}

/* グリーン・ビズ: max-width:160px（JSON 画像26 160×208px） */
.p-company__cert-img.--greenbiz img {
  max-width: 160px;
  width: 100%;
}

.p-company__cert-body {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/* 認証タイトル: JSON fontSize=20 Bold */
.p-company__cert-title {
  font-size: 20px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  margin-bottom: 0.75rem;
}

/* 認証説明文: JSON fontSize=18 Regular */
.p-company__cert-txt {
  font-size: 18px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 1.8;
  margin-bottom: 0.75rem;
}

/* 認証番号: JSON fontSize=18 Regular */
.p-company__cert-no {
  font-size: 18px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}

@media (max-width: 767px) {
  .p-company__cert-block {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 15px;
  }
  .p-company__cert-img {
    max-width: 180px;
  }
  .p-company__cert-title {
    font-size: 15px;
  }
  .p-company__cert-txt {
    font-size: 14px;
  }
  .p-company__cert-no {
    font-size: 14px;
  }
}
/*===================================================================
    /* 実績 */
.p-works__category {
  /* 1920-375__60-30 */
  margin-bottom: clamp(1.875rem, 1.42rem + 1.942vw, 3.75rem);
}

.p-works__category-cat {
  background: #083783;
  color: #fff;
  text-align: center;
  border-radius: 10px;
  /* 1920-375__17-6 */
  padding: clamp(0.375rem, 0.208rem + 0.712vw, 1.063rem) 0;
}

.p-works__list--link {
  cursor: pointer;
}
.p-works__list--link:hover img {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}
.p-works__list--link:hover .p-works__list--ttl {
  background-size: 100% 1px;
}

.p-works__list--img {
  aspect-ratio: 1/1;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 8px;
}
.p-works__list--img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  vertical-align: bottom;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

.p-works__list--date {
  font-size: 16px;
  display: block;
}

.p-works__list--ttl {
  display: inline;
  font-weight: 500;
  background-image: -webkit-gradient(linear, left top, left bottom, from(currentColor), to(currentColor));
  background-image: linear-gradient(currentColor, currentColor);
  background-position: 0% 100%; /* 左下 */
  background-repeat: no-repeat;
  background-size: 0% 1px;
  -webkit-transition: background-size 0.3s ease;
  transition: background-size 0.3s ease;
}

/* ページネーション
-----------------------------------------------------------------------------*/
.c-pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 40px 0;
}
@media (min-width: 899px) {
  .c-pagination {
    padding: 80px 0;
  }
}

.c-pagination__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* 19920-375__12-0 */
  gap: clamp(0rem, -0.182rem + 0.777vw, 0.75rem);
  list-style: none;
  padding: 0;
  margin: 0;
}

.c-pagination__item {
  /* 必要に応じて余白調整 */
  margin: 0 4px;
}

/* --- リンク共通スタイル（円形ベース） --- */
.c-pagination__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-decoration: none;
  border-radius: 50%;
  border: 1px solid #ddd;
  color: #ccc;
  background-color: #fff;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

/* ホバー時の共通挙動（任意） */
.c-pagination__link:not(.is-active):hover {
  border-color: #083783;
  color: #083783;
  background-color: #f0f6ff;
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* --- 数字ボタン（1, 2, 3...） --- */
.c-pagination__link--number {
  /* 1920-375__50-40 */
  width: clamp(2.5rem, 2.348rem + 0.647vw, 3.125rem);
  height: clamp(2.5rem, 2.348rem + 0.647vw, 3.125rem);
}

/* --- アクティブな数字（現在地） --- */
.c-pagination__link--number.is-active {
  background-color: #083783;
  border-color: #083783;
  color: #fff;
  cursor: default;
  pointer-events: none; /* クリック無効化 */
}

/* --- 「前へ」「次へ」ボタン（少し大きく） --- */
.c-pagination__link--prev,
.c-pagination__link--next {
  /* 1920-375__70-50 */
  width: clamp(3.125rem, 3.277rem - 0.647vw, 2.5rem);
  height: clamp(3.125rem, 3.277rem - 0.647vw, 2.5rem);
  position: relative;
  /* 1920-375__15-0 */
  margin: 0 clamp(0rem, -0.228rem + 0.971vw, 0.938rem);
}

/* --- CSSで矢印（くの字）を描画 --- */
.c-pagination__link--prev::before,
.c-pagination__link--next::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-top: 2px solid currentColor; /* 親のcolorを継承 */
  border-right: 2px solid currentColor;
  position: absolute;
  top: 50%;
  left: 50%;
}

/* 前へ（左向き矢印）: 135度回転で左ならず、位置調整 */
.c-pagination__link--prev::before {
  -webkit-transform: translate(-30%, -50%) rotate(-135deg);
          transform: translate(-30%, -50%) rotate(-135deg);
}

/* 次へ（右向き矢印）: 45度回転 */
.c-pagination__link--next::before {
  -webkit-transform: translate(-70%, -50%) rotate(45deg);
          transform: translate(-70%, -50%) rotate(45deg);
}

/*===================================================================
    works詳細
===================================================================*/
.p-worksDetail__header {
  /* 1920-375__50-30 */
  margin-bottom: clamp(1.875rem, 1.572rem + 1.294vw, 3.125rem);
}

.p-worksDetail__title {
  /* 1920-375__36-22 */
  font-size: clamp(1.375rem, 1.163rem + 0.906vw, 2.25rem);
  font-weight: 500;
  line-height: 1.6;
  margin-bottom: 8px;
}

.p-worksDetail__date {
  display: block;
  color: #B7B7B7;
}

.p-worksDetail__thumbnail {
  margin-bottom: 0.5rem;
  border-radius: 10px;
  overflow: hidden;
  max-width: 880px;
}

.p-entry__body h2 {
  /* 1920-375__34-20 */
  font-size: clamp(1.25rem, 1.038rem + 0.906vw, 2.125rem);
  font-weight: 500;
  margin-bottom: 1rem;
}
.p-entry__body h3 {
  font-size: 30px;
  font-weight: 30;
  margin-bottom: 1rem;
}
.p-entry__body p {
  margin-bottom: 1rem;
  text-align: justify;
}

.p-worksDetail__footer {
  text-align: center;
}

.c-btn-back {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #083783;
  color: #fff;
  text-decoration: none;
  max-width: 300px;
  width: 100%;
  height: 60px;
  border-radius: 30px;
  font-weight: 500;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
.c-btn-back:hover {
  opacity: 0.8;
  color: #fff;
}
@media screen and (max-width: 430px) {
  .c-btn-back {
    width: 100%;
    height: 50px;
  }
}

/*===================================================================
    /* ダウンロード*/
/*===================================================================
    /* カテゴリ色一覧 */
/*===================================================================
    /* お知らせ最新情報 */
.p-news__category {
  margin-bottom: clamp(2.5rem, 1.591rem + 3.883vw, 5rem);
}

.p-news__category-btn {
  display: inline-block;
  background-color: #083783;
  color: #fff;
  font-weight: bold;
  padding: 15px 40px;
  border-radius: 5px;
  font-size: 0.875rem;
  letter-spacing: 0.1em;
}

.p-news__list {
  margin-bottom: clamp(3.75rem, 2.386rem + 5.825vw, 7.5rem);
  list-style: none;
}
.p-news__list .p-topNews__item {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  /* 42-16 */
  padding: clamp(1rem, 0.606rem + 1.683vw, 2.625rem) 0;
}
.p-news__list {
  /* 最後のアイテムから区切り線を削除 */
}
.p-news__list .p-topNews__item:last-child {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.p-news__list {
  /* リンク全体 (日付、タグ、タイトル、アイコンを含む) */
}
.p-news__list .p-topNews__item-link {
  color: #000;
}
.p-news__list .p-topNews__item-link:hover {
  color: #000;
}
.p-news__list .p-topNews__item-link:hover .p-topNews__date {
  color: #000;
}
.p-news__list .p-topNews__category {
  background-color: #083783;
  color: #fff;
}
.p-news__list .p-topNews__title::after {
  background-color: #083783;
}
.p-news__list {
  /* 矢印ボタンのアニメーション */
}
.p-news__list .p-topNews__arrow {
  background-color: #083783;
  color: #fff;
}

/* iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii */
/* uuuuuuuuuuuuuuuuuuuuuuuuuuuuuu */
/*===================================================================
    news詳細
===================================================================*/
/*===================================================================
    /* お問い合せ 電話とfax */
.p-section__contact--telfax .l-container128 {
  padding-bottom: 40px;
}
@media (max-width: 767px) {
  .p-section__contact--telfax .l-container128 {
    padding-bottom: 0;
  }
}

.p-contact__telfax {
  max-width: 1000px;
  margin-right: auto;
  margin-left: auto;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  /* 60-30 */
  gap: 0 clamp(1.875rem, 1.42rem + 1.942vw, 3.75rem);
}
@media (max-width: 599px) {
  .p-contact__telfax {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 20px 0;
  }
}

.p-contact__box {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  background-color: #083783;
  color: #fff;
  border-radius: 10px;
  /* 32-20 */
  padding: clamp(1.25rem, 1.068rem + 0.777vw, 2rem);
  text-align: center;
}
@media (max-width: 599px) {
  .p-contact__box {
    width: 100%;
    max-width: 100%;
  }
}

.p-contact__box-ttl {
  font-size: 20px;
  line-height: 1;
  margin-bottom: 12px;
}
@media (max-width: 599px) {
  .p-contact__box-ttl {
    font-size: 18px;
  }
}

.p-contact__box-no {
  font-weight: 500;
  font-family: "Albert Sans", sans-serif;
  font-size: 30px;
  line-height: 1;
  margin-bottom: 10px;
}
.p-contact__box-no a {
  color: #fff;
  text-decoration: none;
}
@media (max-width: 599px) {
  .p-contact__box-no {
    font-size: 26px;
  }
}

.p-contact__box-hours {
  font-size: 14px;
  line-height: 1;
}

.p-contact__note {
  max-width: 1000px;
  margin-right: auto;
  margin-left: auto;
  line-height: 2.2;
}
@media (max-width: 767px) {
  .p-contact__note {
    line-height: 1.6;
  }
}

.p-contact__btn-area {
  text-align: center;
}

.c-btn-policy {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 350px;
  height: 70px;
  background-color: #fff;
  border: 1px solid #707070;
  border-radius: 100px;
  text-decoration: none;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.c-btn-policy:hover {
  background-color: #083783;
  color: #fff;
  border-color: #083783;
}
@media (max-width: 599px) {
  .c-btn-policy {
    width: 100%;
    height: 50px;
  }
}

/*===================================================================
    /* フォーム */
.p-contact-form {
  /* width: 100%;
  max-width: 1000px;
  margin: 0 auto; */
}

.p-contact-form__field {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 30px;
  /* 28-16 */
  padding: clamp(1rem, 0.818rem + 0.777vw, 1.75rem);
  border-bottom: 1px solid #B7B7B7;
}
.p-contact-form__field:first-child {
  border-top: 1px solid #B7B7B7;
}
.p-contact-form__field.--matter {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media (max-width: 767px) {
  .p-contact-form__field {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

@media (max-width: 767px) {
  .p-contact-form__head {
    margin-bottom: 0.5rem !important;
  }
}

.p-contact-form__label {
  font-weight: 500;
}

.p-contact-form__required {
  display: inline-block;
  background-color: #B7B7B7;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  padding: 0 8px;
  border-radius: 5px;
  margin-left: 1rem;
  vertical-align: middle;
}

.p-contact-form__item {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
@media (max-width: 767px) {
  .p-contact-form__item {
    width: 100%;
  }
}

.p-contact-form__input,
.p-contact-form__textarea {
  width: 100%;
  background-color: #F0F0F0;
  border: none;
  padding: 7px;
  border-radius: 5px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.p-contact-form__input:focus,
.p-contact-form__textarea:focus {
  outline: 2px solid #083783;
  background-color: #fff;
}

.p-contact-form__textarea {
  height: 200px;
  resize: vertical;
}

.p-contact-form__postal {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 10px;
}

.p-contact-form__postal-mark {
  margin-right: 10px;
  font-weight: 500;
}

.p-contact-form__input--postal {
  width: 120px;
  text-align: center;
}
@media (max-width: 599px) {
  .p-contact-form__input--postal {
    width: 80px;
  }
}

.p-contact-form__hyphen {
  margin: 0 10px;
}

.p-contact-form__agreement {
  text-align: center;
  margin-top: 2rem;
}
@media (max-width: 399px) {
  .p-contact-form__agreement {
    text-align: left;
  }
}

.p-contact-form__checkbox-label {
  cursor: pointer;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  padding-left: 30px;
}

.p-contact-form__checkbox-input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.p-contact-form__checkbox-input + .p-contact-form__checkbox-text::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border: 1px solid #333;
  background-color: #fff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.p-contact-form__checkbox-input:checked + .p-contact-form__checkbox-text::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 50%;
  -webkit-transform: translateY(-60%) rotate(45deg);
          transform: translateY(-60%) rotate(45deg);
  width: 6px;
  height: 12px;
  border: solid #000;
  border-width: 0 2px 2px 0;
}

.p-contact-form__submit-wrapper {
  margin-bottom: 60px;
  text-align: center;
}
@media (max-width: 767px) {
  .p-contact-form__submit-wrapper {
    margin-bottom: 30px;
  }
}

.p-contact-form__submit {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 350px;
  height: 70px;
  background-color: #fff;
  color: #333;
  border: 1px solid #707070;
  border-radius: 100px;
  cursor: pointer;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.p-contact-form__submit:hover {
  background-color: #083783;
  color: #fff;
  border-color: #083783;
}
@media (max-width: 599px) {
  .p-contact-form__submit {
    min-width: 240px;
    width: 80%;
    height: 50px;
  }
}

/*===================================================================
    採用情報ページ
===================================================================*/
/* ====================================================
   p-recruit-mv: メインビジュアル
   JSON: export_0014 / アートボード 1720×876px
   背景写真をフルブリードで表示し、テキストを左側にオーバーレイ
   ==================================================== */
/* MV全体ラッパー: 右寄せ（左マージンauto・右マージン0）・最大幅1720px */
/* l-container172 と同様に margin-left: auto で右端寄せ */
.p-recruit-mv {
  position: relative; /* ::before の基点 */
  width: 89.6%;
  max-width: 1720px;
  /* 右マージン0・左マージンauto → 右端に寄せる */
  margin: 0 0 0 auto;
  /* ヘッダーとMV画像の間の余白: l-container172 の padding-top と同値 */
  /* 1920-800: 160-110px */
  padding-top: clamp(6.875rem, 4.643rem + 4.464vw, 10rem);
}
@media screen and (max-width: 768px) {
  .p-recruit-mv {
    /* モバイル: 89.6%幅を維持（左端に隙間あり）しつつ、ヘッダー余白を調整 */
    padding-top: clamp(5rem, 4rem + 2vw, 6rem);
  }
}

/* 青色帯: p-recruit-intro（#083783）と同色のソリッドな帯を画像の後ろに敷く */
/* right:0 で MV 右端に揃え、width:100vw で左端まで全幅をカバー */
/* DOM順で img-wrap より前に描画されるため、画像の背面に位置する */
.p-recruit-mv::before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100vw; /* 全画面幅: 右寄せコンテナの左余白も覆う */
  /* 帯の高さ: p-recruit-intro の食い込み量より大きく取る */
  /* 1920-800: 180-80px */
  height: clamp(5rem, 3.214rem + 3.571vw, 11.25rem);
  background-color: #083783;
  pointer-events: none;
}

/* 画像コンテナ: アスペクト比 1720:876 ≈ 16:7.9（実寸より算出） */
/* padding-top: 876/1720*100 = 50.93% */
.p-recruit-mv__img-wrap {
  position: relative;
  width: 100%;
  padding-top: 50.93%;
  /* 角丸なし */
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .p-recruit-mv__img-wrap {
    /* タブレット〜モバイル: 89.6%幅基準でテキストが収まるよう縦長に設定 */
    padding-top: 90%;
  }
}
@media screen and (max-width: 430px) {
  .p-recruit-mv__img-wrap {
    /* スマホ: padding-top による固定アスペクト比を解除しコンテンツ高さで自動伸縮 */
    padding-top: 0;
  }
}

/* 背景画像: object-fit: cover でエリアを覆う */
.p-recruit-mv__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

/* テキストオーバーレイコンテナ: 画像上に左側配置 */
/* XD デザイン準拠: RECRUIT を上端に、キャッチコピーを下方に配置 */
.p-recruit-mv__content {
  position: absolute;
  inset: 0;
  z-index: 1;
  color: #fff;
  padding: clamp(1.875rem, 0.417rem + 4.861vw, 6.25rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media screen and (max-width: 430px) {
  .p-recruit-mv__content {
    /* スマホ: absolute を解除してコンテンツの高さで img-wrap を自動伸縮させる */
    /* これにより画面幅が何pxでもテキストが必ずすべて表示される */
    position: relative;
    inset: auto;
    padding: 1.25rem clamp(1rem, 2vw, 1.5rem) 1rem;
  }
}

/* キャッチコピー: JSON fontSize=65 fontStyle=Medium lineHeight=90 Noto Sans JP 白 */
/* 1920-800: 65-28px */
/* 各行を block で表示（.animate-text の inline-block を詳細度 0,2,0 で上書き） */
.animate-text.p-recruit-mv__catch-line {
  display: block;
}

.p-recruit-mv__catch {
  font-size: clamp(1.75rem, 0.464rem + 2.571vw, 4.063rem);
  font-weight: 500;
  line-height: 1.384; /* 90/65 */
  color: #fff;
  margin-top: clamp(3rem, -2rem + 6.667vw, 6rem);
  margin-bottom: 1rem;
}
@media screen and (max-width: 1200px) {
  .p-recruit-mv__catch {
    margin-top: auto;
  }
}
@media screen and (max-width: 768px) {
  .p-recruit-mv__catch {
    font-size: clamp(1.5rem, 0.923rem + 2.462vw, 1.75rem);
    line-height: 1.5;
    /* モバイル: auto を固定値に戻してコンパクトなレイアウトに */
    margin-top: 1rem;
  }
}

/* MV内の採用情報テキスト: line-height:1 のままだと日本語文字の下部が欠けるため上書き */
.p-recruit-mv__content .p-subMv__ttl-sub {
  line-height: 1.4;
  margin-bottom: 0.25rem;
}

/* Join us 装飾SVG: recruit02.svg */
/* 1920-800: 200-120px */
.p-recruit-mv__join {
  display: block;
  width: clamp(7.5rem, 3.571rem + 7.857vw, 12.5rem);
  height: auto;
  margin-top: 0.5rem;
}

/* ====================================================
   p-recruit-intro: コンテンツセクション
   JSON: export_0015 / アートボード 1920×1098px
   背景: ダークブルー #083783 / テキスト左 + 画像右
   ==================================================== */
/* セクション外包: ダークブルー背景 + MVへの食い込み */
/* ネガティブmargin-topでMV画像の下部に重なるように配置 */
/* z-index: 0 にして p-subHero（z-index:2）のMV画像が前面に来るようにする */
.p-recruit-intro {
  background-color: #083783;
  position: relative;
  z-index: 0; /* p-subHero の z-index:2 より低く保ち、MV画像を前面に維持 */
  /* 1920-800: 食い込み量 100-50px */
  margin-top: clamp(-6.25rem, -2.679vw - 0.536rem, -3.125rem);
  /* 上パディングは食い込み量分を加算して、コンテンツの見た目の余白を確保 */
  /* 1920-800: 100-50px（食い込み分）+ 100-50px（余白分） */
  padding-top: clamp(6.25rem, 5.357rem + 1.786vw, 7.5rem);
  /* 1920-800: 100-50px */
  padding-bottom: clamp(3.125rem, 0.893rem + 4.464vw, 6.25rem);
}
@media (max-width: 767px) {
  .p-recruit-intro {
    margin-top: -2rem;
    padding-top: 3.5rem;
  }
}

/* 大見出し: JSON fontSize=40 fontStyle=SemiBold textAlign=center 白 lineHeight=72 */
/* 1920-800: 40-22px */
.p-recruit-intro__ttl {
  font-size: clamp(1.375rem, 0.571rem + 1.607vw, 2.5rem);
  font-weight: 600;
  text-align: center;
  color: #fff;
  line-height: 1.8; /* 72/40 */
  margin-bottom: clamp(2.5rem, 1.607rem + 1.786vw, 3.75rem);
}

/* 本文エリア: テキスト左 + 画像右 フレックス */
/* JSON: テキスト上端と画像上端が同じ y 位置 → align-items: flex-start */
/* gap: 1280px 内で テキスト右端(922px)〜画像左端(960px) = 38px / 1280px ≈ 3% */
.p-recruit-intro__body {
  gap: 0 clamp(1.5rem, 0.179rem + 2.643vw, 3.5rem);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start; /* テキストを画像の上端に揃える */
}
@media screen and (max-width: 768px) {
  .p-recruit-intro__body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 2rem 0;
  }
}

/* テキストブロック: 左カラム flex:1 */
.p-recruit-intro__text-block {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/* サブ見出し: JSON fontSize=32 fontStyle=Bold 白 lineHeight=46 */
/* 1920-800: 32-18px */
.p-recruit-intro__sub-ttl {
  font-size: clamp(1.125rem, 0.5rem + 1.25vw, 2rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.4375; /* 46/32 */
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 768px) {
  .p-recruit-intro__sub-ttl {
    font-size: clamp(1.125rem, 0.577rem + 2.333vw, 1.375rem);
    margin-bottom: 1rem;
  }
}

/* 本文: JSON fontSize=18 fontStyle=Regular 白 lineHeight=30 */
/* 1920-800: 18-14px */
.p-recruit-intro__txt {
  color: #fff;
  margin-bottom: 1rem;
  line-height: 1.8;
}

/* 画像ブロック: 1枚の画像を掲載（実寸 640×479px 相当の領域を確保） */
/* width は2枚分（320×2=640px）のままサイズを維持 */
/* 1920-800: 幅 640-320px */
.p-recruit-intro__img-block {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: clamp(20rem, 7.143rem + 25.714vw, 40rem);
  /* aspect-ratio で高さを確定: 640×479px の比率 */
  aspect-ratio: 640/479;
}
@media screen and (max-width: 768px) {
  .p-recruit-intro__img-block {
    width: 100%;
  }
}

/* 画像: ブロック全体を覆う */
.p-recruit-intro__img {
  width: 100%;
  height: 100%;
  overflow: hidden;
  margin: 0;
  border-radius: 30px;
}
@media screen and (max-width: 768px) {
  .p-recruit-intro__img {
    border-radius: 15px;
  }
}

.p-recruit-intro__img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}

/* ====================================================
   p-recruit-interview: インタビューセクション
   デザイン: 1520×416px / 白背景上の青丸角カード
   左: INTERVIEW見出し / 右: 部署ラベル + 本文
   ==================================================== */
/* l-section ラッパー: intro 下の灰色余白を確保 / l-section__lowerPage + u-mb100 構造 */
/* 1920-800: 上 100-60px */
.p-section__recruit-interview {
  padding-top: clamp(3.75rem, 1.964rem + 3.571vw, 6.25rem);
}

/* カード背景・角丸・padding は l-container152.--bg-blue と l-container128.u-ptpb-80 に移行 */
/* 内側フレックス: c-lowerPage と同値 */
.p-recruit-interview__inner {
  gap: 0 30px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media screen and (max-width: 768px) {
  .p-recruit-interview__inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 1.5rem 0;
  }
}

/* 左カラム: c-lowerPage__left と同値（1920-800: 290-180px） */
.p-recruit-interview__heading {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: clamp(11.25rem, 6.339rem + 9.821vw, 18.125rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media screen and (max-width: 768px) {
  .p-recruit-interview__heading {
    width: 100%;
  }
}

/* EN見出し: p-company__ttl-en のフォント定義を流用、カード内で白色に上書き */
.p-recruit-interview__ttl-en {
  color: #fff;
}

/* JP副見出し: p-company__ttl-jp のフォント定義を流用、--bg-blue 内で白色に上書き */
.p-recruit-interview__ttl-jp {
  color: #fff;
}

/* 本文: p-recruit-intro__txt を流用、--bg-blue 内で白色に上書き */
.p-recruit-interview__txt {
  color: #fff;
  line-height: 1.8;
}

/* 右カラム: ラベル + 本文 */
.p-recruit-interview__body {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/* 部署ラベル: 白背景・#083783文字・border-radius 10px */
/* デザイン: 430×68px / 20px Bold */
.p-recruit-interview__label {
  display: inline-block;
  background-color: #fff;
  border-radius: 10px;
  /* 1920-800: padding縦19px-10px / 横24px-16px */
  padding: clamp(0.625rem, 0.339rem + 0.571vw, 1.188rem) clamp(1rem, 0.571rem + 0.857vw, 1.5rem);
  /* 1400-999: 20-18px */
  font-size: clamp(1.125rem, 0.814rem + 0.499vw, 1.25rem);
  font-weight: 700;
  color: #083783;
  line-height: 1.2;
  margin-bottom: 1.25rem;
}

/* 本文: p-recruit-intro__txt を流用 */
/* ====================================================
   p-recruit-bgwrap: 背景画像ラッパー
   FAQ・ENTRY・CTA の3セクションを一枚の背景画像で覆う
   ==================================================== */
/* 背景画像: recruitBg.webp / cover で全体を覆う */
/* padding-bottom: CTA の u-mb80 相当の余白を確保 */
.p-recruit-bgwrap {
  background-image: url("../images/recruit/recruitBg.webp");
  background-size: cover;
  background-position: bottom -20vw center;
  /* 1920-800: 80-40px（u-mb80 相当） */
  padding-bottom: clamp(2.5rem, 1.62rem + 3.756vw, 5rem);
  background-repeat: no-repeat;
}

/* ====================================================
   p-recruit-requirements: 募集要項セクション
   JSON: export_0017 / アートボード 1280.5×1843px
   白背景・左に RECRUIT 見出し / 右に定義リスト形式テーブル
   ==================================================== */
/* l-section ラッパー: p-section__recruit-requirements は余白なし（u-mb100 が担当） */
/* 内側フレックス: c-lowerPage と同値 */
.p-recruit-requirements__inner {
  gap: 0 30px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media screen and (max-width: 768px) {
  .p-recruit-requirements__inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 2rem 0;
  }
}

/* 左カラム: c-lowerPage__left と同値（1920-800: 290-180px） */
.p-recruit-requirements__heading {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: clamp(11.25rem, 6.339rem + 9.821vw, 18.125rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media screen and (max-width: 768px) {
  .p-recruit-requirements__heading {
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    gap: 0 0.5rem;
  }
}

/* 右カラム: 定義リスト */
.p-recruit-requirements__table {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/* 定義リストリセット */
.p-recruit-requirements__list {
  margin: 0;
  padding: 0;
}

/* 行: border-bottom で区切り線 */
/* 1920-800: padding縦 20-14px */
.p-recruit-requirements__row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 0 clamp(1rem, 0.286rem + 1.429vw, 2rem);
  padding: clamp(0.875rem, 0.607rem + 0.536vw, 1.25rem) 0;
  border-bottom: 1px solid #C6C6C6;
}
@media screen and (max-width: 768px) {
  .p-recruit-requirements__row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0.25rem 0;
  }
}

/* 最初の行: 上にも border */
.p-recruit-requirements__row:first-child {
  border-top: 1px solid #C6C6C6;
}

/* 左: 項目名 */
/* 固定幅で全行の desc 開始位置を揃える / 1920-800: 幅 160-120px */
.p-recruit-requirements__term {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: clamp(7.5rem, 6.071rem + 2.857vw, 10rem);
  line-height: 1.75;
}
@media screen and (max-width: 768px) {
  .p-recruit-requirements__term {
    width: 100%;
    font-weight: 700;
  }
}

/* 右: 値 */
.p-recruit-requirements__desc {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  line-height: 1.75;
  margin: 0;
}

/* ====================================================
   p-recruit-faq: FAQセクション
   JSON: export_0018 / アートボード 1520×1167px
   白背景・左に FAQ 見出し / 右に Q&A リスト（5項目）
   ==================================================== */
/* l-section ラッパー: p-section__recruit-faq は余白なし（u-mb100 が担当） */
/* 内側フレックス: c-lowerPage と同値 */
.p-recruit-faq__inner {
  gap: 0 30px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media screen and (max-width: 768px) {
  .p-recruit-faq__inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 2rem 0;
  }
}

/* 左カラム: c-lowerPage__left と同値（1920-800: 290-180px） */
.p-recruit-faq__heading {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: clamp(11.25rem, 6.339rem + 9.821vw, 18.125rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media screen and (max-width: 768px) {
  .p-recruit-faq__heading {
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    gap: 0 0.5rem;
  }
}

/* 右カラム: Q&A リスト */
.p-recruit-faq__body {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/* 定義リストリセット */
.p-recruit-faq__list {
  margin: 0;
  padding: 0;
}

/* 各 Q&A アイテム */
/* 1920-800: アイテム間余白 32-20px */
.p-recruit-faq__item {
  margin-bottom: clamp(1.25rem, 0.679rem + 1.143vw, 2rem);
}

.p-recruit-faq__item:last-child {
  margin-bottom: 0;
}

/* 質問: アコーディオントグルバー / クリックで開閉 */
/* JSON: #083783 / fontSize=20 Bold / lineHeight=24 */
/* 1920-800: 20-16px */
.p-recruit-faq__question {
  background-color: #083783;
  border-radius: 10px;
  /* 右側にシェブロンアイコン分の余白を追加 */
  padding: clamp(0.75rem, 0.393rem + 0.714vw, 1.125rem) clamp(3rem, 2.143rem + 1.714vw, 4.25rem) clamp(0.75rem, 0.393rem + 0.714vw, 1.125rem) clamp(1rem, 0.571rem + 0.857vw, 1.5rem);
  font-size: clamp(1rem, 0.821rem + 0.357vw, 1.25rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.5;
  margin: 0;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  position: relative;
  -webkit-transition: background-color 0.2s ease;
  transition: background-color 0.2s ease;
}

/* ホバー: 少し明るいブルーに */
.p-recruit-faq__question:hover {
  background-color: #0a4aad;
}

/* シェブロンアイコン: 初期状態は下向き（▼）*/
.p-recruit-faq__question::after {
  content: "";
  position: absolute;
  right: clamp(1rem, 0.571rem + 0.857vw, 1.5rem);
  top: 50%;
  width: 0.6rem;
  height: 0.6rem;
  border-right: 2.5px solid #fff;
  border-bottom: 2.5px solid #fff;
  -webkit-transform: translateY(-65%) rotate(45deg);
          transform: translateY(-65%) rotate(45deg);
  -webkit-transition: -webkit-transform 0.35s ease;
  transition: -webkit-transform 0.35s ease;
  transition: transform 0.35s ease;
  transition: transform 0.35s ease, -webkit-transform 0.35s ease;
}

/* 開いた状態: シェブロンを上向きに（▲）*/
.p-recruit-faq__item.is-open .p-recruit-faq__question::after {
  -webkit-transform: translateY(-35%) rotate(-135deg);
          transform: translateY(-35%) rotate(-135deg);
}

/* 回答: アコーディオン / デフォルトで非表示・max-height トランジションで開閉 */
.p-recruit-faq__answer {
  line-height: 1.75;
  margin: 0;
  overflow: hidden;
  max-height: 0;
  /* 横 padding は維持、縦 padding はアニメーションで変化 */
  padding: 0 clamp(1rem, 0.571rem + 0.857vw, 1.5rem);
  -webkit-transition: max-height 0.4s ease, padding 0.4s ease;
  transition: max-height 0.4s ease, padding 0.4s ease;
}

/* 回答: 開いた状態 */
.p-recruit-faq__item.is-open .p-recruit-faq__answer {
  max-height: 800px;
  padding: clamp(1rem, 0.643rem + 0.714vw, 1.5rem) clamp(1rem, 0.571rem + 0.857vw, 1.5rem);
}

/* ====================================================
   p-recruit-entry: 採用エントリーセクション
   JSON: export_0019（フッター上部の採用 CTA）
   背景画像（recruitBg.webp）・中央にキャッチコピー + ENTRY ボタン
   ==================================================== */
/* セクション外包: 背景は p-recruit-bgwrap に移動 */
/* 上下余白: 1920-800: 100-50px（元の半分） */
.p-recruit-entry {
  padding: 0 0 clamp(3.125rem, 0.893rem + 4.464vw, 6.25rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

/* 内側コンテナ: 中央寄せ */
.p-recruit-entry__inner {
  text-align: center;
  width: 100%;
  padding: 0 clamp(1rem, 0.571rem + 0.857vw, 1.5rem);
}

/* キャッチコピー: JSON fontSize=32 Medium 白 lineHeight=60 */
/* 1920-800: 32-20px */
.p-recruit-entry__catch {
  /* 1400-599(32-18) */
  font-size: clamp(1.125rem, 0.471rem + 1.748vw, 2rem);
  font-weight: 500;
  color: #fff;
  line-height: 1.875; /* 60/32 */
  margin-bottom: clamp(2rem, 0.714rem + 2.571vw, 4rem);
  /* 背景画像上での視認性向上 */
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
}

/* ENTRY ボタン: JSON 800×200px / #083783 / border-radius 30px */
/* Albert Sans 60px ExtraBold / box-shadow: 0 3px 6px rgba(0,0,0,0.41) */
/* 1920-800: font 60-40px / padding縦 70-40px / border-radius 30-20px */
.p-recruit-entry__btn {
  display: block;
  max-width: 50rem; /* 800px */
  width: 90%;
  margin: 0 auto;
  background-color: #083783;
  color: #fff;
  font-family: "Albert Sans", sans-serif;
  font-size: clamp(2.5rem, 1.607rem + 1.786vw, 3.75rem);
  font-weight: 800;
  text-align: center;
  border-radius: clamp(1.25rem, 0.804rem + 0.893vw, 1.875rem);
  /* 1920-800: padding縦 70-40px */
  padding: clamp(2.5rem, 1.161rem + 2.679vw, 4.375rem) 2rem;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.41);
          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.41);
  text-decoration: none;
  line-height: 1;
  /* ホバーアニメーション */
  -webkit-transition: opacity 0.25s ease, -webkit-transform 0.25s ease;
  transition: opacity 0.25s ease, -webkit-transform 0.25s ease;
  transition: opacity 0.25s ease, transform 0.25s ease;
  transition: opacity 0.25s ease, transform 0.25s ease, -webkit-transform 0.25s ease;
}

/* ホバー: 浮き上がり + 白文字を維持 */
.p-recruit-entry__btn:hover {
  color: #fff;
  opacity: 0.88;
  -webkit-transform: translateY(-4px);
          transform: translateY(-4px);
}

/*===================================================================
    ろ材更生ページ
===================================================================*/
/* ====================================================
   MVセクション: p-recruit-mv をそのまま流用
   青帯（::before）はrecruitと同様に表示する
   SVGは p-recruit-mv__join と同じ扱いでシンプルに配置
   ==================================================== */
/* p-subHero背景: XDデザイン準拠でMVエリア左側を濃紺に */
/* recruit.html と異なり、filtermedia は MV 左余白を #083783 で塗りつぶす */
.filtermedia .p-subHero {
  background-color: #083783;
}

/* ろ材更生MVタイトル: 1行目(FILTER MEDIA)の下マージンをゼロにして2行を密着させる */
/* XD: lineHeight 61 / fontSize 45 ≒ 1.35 */
.filtermedia .p-recruit-mv__content .p-subMv__ttl {
  line-height: 1.35;
}

.filtermedia .p-recruit-mv__content .p-subMv__ttl:first-child {
  margin-bottom: 0;
}

/* Sustainable SVG: p-recruit-mv__join を流用しつつ XD 指定位置・サイズに補正 */
/* XD JSON: SVG x=567.554（アートボード基点）= 画像左端から367.554px */
/* flexコンテナ幅1720px・padding100px基準: (367.554-100)/1720 ≈ 15.55% */
/* 1920-800: 416-120px */
.filtermedia .p-recruit-mv__join {
  width: clamp(7.5rem, -0.5rem + 22vw, 26rem);
  -ms-flex-item-align: start;
      align-self: flex-start;
  margin-left: 15.5%;
}
@media screen and (max-width: 430px) {
  .filtermedia .p-recruit-mv__join {
    margin-left: 0;
  }
}

/* ====================================================
   p-filtermedia-intro: 概要セクション
   JSON: export_0021 / 白背景・MV直下（重なりなし）
   左: テキスト / 右: 比較写真ボックス
   ==================================================== */
.p-filtermedia-intro {
  background-color: #fff;
  /* 1920-800: 80-40px */
  padding-top: clamp(2.5rem, 1.071rem + 2.857vw, 5rem);
  /* 1920-800: 80-50px */
  padding-bottom: clamp(3.125rem, 1.786rem + 2.679vw, 5rem);
}

/* リード文: 青・センター・大きめ */
/* JSON: fontSize=40 SemiBold textAlign=center #083783 */
/* 1920-800: 40-20px */
.p-filtermedia-intro__lead {
  font-size: clamp(1.25rem, 0.536rem + 1.429vw, 2.5rem);
  font-weight: 600;
  text-align: center;
  color: #083783;
  line-height: 1.8;
  margin-bottom: clamp(2.5rem, 1.607rem + 1.786vw, 3.75rem);
}

/* 2カラムレイアウト */
.p-filtermedia-intro__body {
  gap: 0 clamp(2rem, 0.714rem + 2.571vw, 4rem);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media screen and (max-width: 768px) {
  .p-filtermedia-intro__body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 2rem 0;
  }
}

/* テキスト左カラム */
.p-filtermedia-intro__text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/* セクション見出し: JSON fontSize=32 Bold */
/* 1920-800: 32-18px */
.p-filtermedia-intro__ttl {
  font-size: clamp(1.125rem, 0.536rem + 1.179vw, 2rem);
  font-weight: 700;
  line-height: 1.44; /* 46/32 */
  color: #000;
  margin-bottom: 1.5rem;
}

/* 本文: JSON fontSize=18 Regular */
.p-filtermedia-intro__txt {
  font-size: clamp(0.875rem, 0.786rem + 0.179vw, 1.125rem);
  line-height: 1.667; /* 30/18 */
  color: #000;
  margin-bottom: 1rem;
}

/* 比較写真右カラム */
/* XD: artboard 1280px 内で比較ボックス 640px ≒ コンテンツ幅の50% */
/* 1920-800: 600-280px */
.p-filtermedia-intro__compare {
  width: clamp(17.5rem, 3.214rem + 28.571vw, 37.5rem);
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
@media screen and (max-width: 768px) {
  .p-filtermedia-intro__compare {
    width: 100%;
  }
}

/* 比較ボックス外枠: JSON 640×640 radius=30 bg=#F4F4F4 */
.p-filtermedia-intro__compare-box {
  background: #F4F4F4;
  border-radius: 15px;
  padding: clamp(1rem, 0.5rem + 1vw, 1.5rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1.25rem;
}
@media screen and (max-width: 768px) {
  .p-filtermedia-intro__compare-box {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 1rem;
  }
}

/* 比較グループ（マンガン砂 / 砂利洗浄）*/
.p-filtermedia-intro__compare-group {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-width: 0;
}

/* グループタイトル: JSON fontSize=24 Bold center / 1920-800: 24-14px */
.p-filtermedia-intro__compare-ttl {
  font-size: clamp(0.875rem, 0.304rem + 1.143vw, 1.5rem);
  font-weight: 700;
  text-align: center;
  color: #000;
  margin-bottom: 0.5rem;
}

/* 洗浄前/後 2枚横並びグリッド */
.p-filtermedia-intro__compare-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}

/* 写真アイテム */
.p-filtermedia-intro__compare-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0;
}

/* 比較写真（img ネスト禁止規則に従い別セレクターで記述） */
.p-filtermedia-intro__compare-item img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 1/1;
}

/* 洗浄前/後ラベル: JSON fontSize=18 Bold center #7B7B7B */
.p-filtermedia-intro__compare-label {
  font-size: clamp(0.75rem, 0.679rem + 0.143vw, 0.875rem);
  font-weight: 700;
  color: #7B7B7B;
  text-align: center;
  margin-top: 0.25rem;
}

/* ====================================================
   p-filtermedia-cost: コスト削減セクション
   JSON: export_0022 / 背景画像 + トラック写真
   ==================================================== */
.p-filtermedia-cost {
  background-color: #f5f5f5;
  background-image: url("../images/filtermedia/filtermediaKosto70__bg.webp");
  background-size: cover;
  background-position: center;
  overflow: hidden;
  /* 1920-800: 80-40px */
  padding-top: clamp(2.5rem, 1.071rem + 2.857vw, 5rem);
  padding-bottom: 0;
}

.p-filtermedia-cost__inner {
  position: relative;
}

/* テキストエリア */
.p-filtermedia-cost__text {
  padding-bottom: 1.5rem;
}

/* タイトル: "コスト、最大約70％削減。" */
/* JSON: #083783 / 青 / 大きい */
/* 1920-800: 60-28px */
.p-filtermedia-cost__ttl {
  font-size: clamp(1.75rem, 0.429rem + 2.643vw, 3.75rem);
  font-weight: 700;
  color: #083783;
  line-height: 1.2;
  margin-bottom: 0.5rem;
}

/* 数字 "70" を特に大きく */
.p-filtermedia-cost__num {
  font-family: "Albert Sans", sans-serif;
  font-size: 1.3em;
  font-weight: 800;
}

/* サブテキスト */
.p-filtermedia-cost__sub {
  font-size: clamp(1rem, 0.643rem + 0.714vw, 1.5rem);
  color: #555;
  font-weight: 400;
}

/* トラック画像 */
.p-filtermedia-cost__img-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
@media screen and (max-width: 768px) {
  .p-filtermedia-cost__img-wrap {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.p-filtermedia-cost__img {
  width: 100%;
  max-width: 900px;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: bottom right;
     object-position: bottom right;
  display: block;
}

/* ====================================================
   p-filtermedia-effect: 環境・経済効果 + 必要機器テーブル
   JSON: export_0023 / 白角丸ボックス・2カラム + テーブル
   ==================================================== */
.p-filtermedia-effect {
  background-color: #f0f0f0;
  /* 1920-800: 80-40px */
  padding-top: clamp(2.5rem, 1.071rem + 2.857vw, 5rem);
  padding-bottom: clamp(2.5rem, 1.071rem + 2.857vw, 5rem);
}

/* 白角丸コンテナ: JSON 長方形1556 radius=60px */
.p-filtermedia-effect__box {
  background: #fff;
  border-radius: clamp(1.25rem, 0.536rem + 1.429vw, 3.75rem);
  padding: clamp(2.5rem, 1.071rem + 2.857vw, 5rem) clamp(1.5rem, 0.714rem + 1.571vw, 3rem);
}

/* 2カラムレイアウト: テキスト左 + 写真右 */
.p-filtermedia-effect__body {
  gap: 0 clamp(2rem, 0.714rem + 2.571vw, 4rem);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  margin-bottom: clamp(2.5rem, 1.25rem + 2.5vw, 5rem);
}
@media screen and (max-width: 768px) {
  .p-filtermedia-effect__body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 2rem 0;
  }
}

/* テキスト左カラム */
.p-filtermedia-effect__text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

/* セクション見出し: JSON fontSize=32 Bold */
/* 1920-800: 32-18px */
.p-filtermedia-effect__ttl {
  font-size: clamp(1.125rem, 0.536rem + 1.179vw, 2rem);
  font-weight: 700;
  line-height: 1.44;
  color: #000;
  margin-bottom: 1.25rem;
}

/* 本文 */
.p-filtermedia-effect__txt {
  font-size: clamp(0.875rem, 0.786rem + 0.179vw, 1.125rem);
  line-height: 1.667;
  color: #000;
  margin-bottom: 1.25rem;
}

/* ハイライトエリア */
.p-filtermedia-effect__highlights {
  margin-bottom: 1.5rem;
}

/* ハイライトテキスト共通 */
/* JSON fontSize=22 Bold */
.p-filtermedia-effect__highlight {
  font-size: clamp(0.875rem, 0.696rem + 0.357vw, 1.125rem);
  font-weight: 700;
  line-height: 1.364; /* 30/22 */
  margin-bottom: 0.75rem;
}

/* 赤ハイライト: 環境負荷 */
.p-filtermedia-effect__highlight--red {
  color: #D30909;
}

/* 青ハイライト: 経済効果 */
.p-filtermedia-effect__highlight--blue {
  color: #124BA8;
}

/* ラベル (「環境負荷…」「経済効果…」) */
.p-filtermedia-effect__highlight-label {
  display: inline;
}

/* CTAボタン: JSON 480×81 radius=41 #083783 */
.p-filtermedia-effect__btn {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: #083783;
  color: #fff;
  font-size: clamp(0.875rem, 0.786rem + 0.179vw, 1.125rem);
  font-weight: 700;
  /* 1920-800: 41px → radius */
  border-radius: 2.5625rem;
  padding: 0.875rem clamp(1.5rem, 0.5rem + 2vw, 2.5rem);
  text-decoration: none;
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
          box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  line-height: 1;
}
.p-filtermedia-effect__btn:hover {
  opacity: 0.8;
}

/* 施設写真: JSON 640×640 radius=30 */
.p-filtermedia-effect__img-wrap {
  /* 1920-800: 400-220px */
  width: clamp(13.75rem, 8.929rem + 9.643vw, 25rem);
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
@media screen and (max-width: 768px) {
  .p-filtermedia-effect__img-wrap {
    width: 100%;
  }
}

.p-filtermedia-effect__img {
  width: 100%;
  height: auto;
  border-radius: clamp(0.625rem, 0.179rem + 0.893vw, 1.875rem);
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 1/1;
  display: block;
}

/* テーブルセクション */
.p-filtermedia-effect__table-wrap {
  border-top: 1px solid #e0e0e0;
  padding-top: clamp(2rem, 1.071rem + 1.857vw, 3.5rem);
}

/* テーブル見出し: JSON fontSize=32 Bold */
.p-filtermedia-effect__table-ttl {
  font-size: clamp(1.125rem, 0.536rem + 1.179vw, 2rem);
  font-weight: 700;
  color: #000;
  margin-bottom: 0.5rem;
}

/* テーブルリード文 */
.p-filtermedia-effect__table-lead {
  font-size: clamp(0.875rem, 0.786rem + 0.179vw, 1.125rem);
  color: #000;
  margin-bottom: 1.5rem;
}

/* スクロールラッパー（モバイル横スクロール） */
.p-filtermedia-effect__table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* テーブル本体 */
.p-filtermedia-effect__table {
  width: 100%;
  min-width: 600px;
  border-collapse: collapse;
  border: 1px solid #000;
  font-size: clamp(0.8125rem, 0.75rem + 0.125vw, 1.125rem);
  line-height: 1.667;
}

/* ヘッダーセル: JSON #083783 白文字 */
.p-filtermedia-effect__th {
  background: #083783;
  color: #fff;
  font-weight: 400;
  padding: 0.75rem 1rem;
  border: 1px solid #000;
  text-align: left;
  /* 列幅: 項目25% / 内訳50% / 備考25% */
}

.p-filtermedia-effect__th:nth-child(1) {
  width: 25%;
}

.p-filtermedia-effect__th:nth-child(2) {
  width: 50%;
}

.p-filtermedia-effect__th:nth-child(3) {
  width: 25%;
}

/* データセル */
.p-filtermedia-effect__td {
  padding: 0.75rem 1rem;
  border: 1px solid #000;
  vertical-align: top;
  color: #000;
}

/* ストライプ行: JSON opacity=0.58 #F0EEED */
.p-filtermedia-effect__tr--stripe .p-filtermedia-effect__td {
  background: rgba(240, 238, 237, 0.6);
}

/* ====================================================
   p-filtermedia-features: 装置の特徴セクション
   JSON: export_0024 / 背景: filtermediaBg.webp（ダーク）
   テキスト全白
   ==================================================== */
.p-filtermedia-features {
  background-color: #083783;
  background-image: url("../images/filtermedia/filtermediaBg.webp");
  background-size: cover;
  background-position: center;
  /* 1920-800: 80-40px */
  padding-top: clamp(2.5rem, 1.071rem + 2.857vw, 5rem);
  padding-bottom: clamp(2.5rem, 1.071rem + 2.857vw, 5rem);
}

/* 特徴ブロック（特徴 / ポイント 各1ブロック） */
.p-filtermedia-features__block {
  margin-bottom: clamp(2.5rem, 1.25rem + 2.5vw, 5rem);
}
.p-filtermedia-features__block:last-of-type {
  margin-bottom: 0;
}

/* ブロックヘッディング */
.p-filtermedia-features__heading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

/* 「特徴」「ポイント」ラベル: JSON fontSize=26 Bold 白 */
.p-filtermedia-features__label {
  font-size: clamp(1rem, 0.821rem + 0.357vw, 1.375rem);
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
}

/* サブタイトル: JSON fontSize=24 Bold 白 */
.p-filtermedia-features__ttl {
  font-size: clamp(1rem, 0.786rem + 0.429vw, 1.5rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.4;
}

/* 定義文: ろ材の定義 */
.p-filtermedia-features__def {
  font-size: clamp(0.875rem, 0.786rem + 0.179vw, 1.125rem);
  font-weight: 700;
  color: #fff;
  margin-bottom: 1rem;
}

/* 特徴リスト: ①〜⑥ */
.p-filtermedia-features__list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
  counter-reset: feature-counter;
}

.p-filtermedia-features__item {
  font-size: clamp(0.875rem, 0.786rem + 0.179vw, 1.125rem);
  line-height: 1.667;
  color: #fff;
  padding-left: 1.5em;
  position: relative;
  margin-bottom: 0.25rem;
}
.p-filtermedia-features__item::before {
  content: "①②③④⑤⑥";
  /* 順番に丸数字を割り当てるため CSS カウンターを使用 */
  position: absolute;
  left: 0;
}

/* 丸数字を正確に割り当てる */
.p-filtermedia-features__item:nth-child(1)::before {
  content: "①";
}

.p-filtermedia-features__item:nth-child(2)::before {
  content: "②";
}

.p-filtermedia-features__item:nth-child(3)::before {
  content: "③";
}

.p-filtermedia-features__item:nth-child(4)::before {
  content: "④";
}

.p-filtermedia-features__item:nth-child(5)::before {
  content: "⑤";
}

.p-filtermedia-features__item:nth-child(6)::before {
  content: "⑥";
}

/* 説明本文 */
.p-filtermedia-features__txt {
  font-size: clamp(0.875rem, 0.786rem + 0.179vw, 1.125rem);
  line-height: 1.667;
  color: #fff;
  margin-bottom: 1rem;
}

/* ポイント各項目 */
.p-filtermedia-features__points {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 2rem;
}

/* ポイント見出し: JSON fontSize=24 Bold 白 */
.p-filtermedia-features__point-ttl {
  font-size: clamp(1rem, 0.786rem + 0.429vw, 1.5rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.4;
  margin-bottom: 0.75rem;
}

/* ポイント本文 */
.p-filtermedia-features__point-txt {
  font-size: clamp(0.875rem, 0.786rem + 0.179vw, 1.125rem);
  line-height: 1.667;
  color: #fff;
}

/* ====================================================
   p-filtermedia-flow: フローシートセクション
   JSON: export_0025 / フローチャート + 工程写真
   ==================================================== */
.p-filtermedia-flow {
  background: #fff;
  /* 1920-800: 80-40px */
  padding-top: clamp(2.5rem, 1.071rem + 2.857vw, 5rem);
  padding-bottom: clamp(2.5rem, 1.071rem + 2.857vw, 5rem);
}

/* セクション内の共通間隔 */
.p-filtermedia-flow__intro,
.p-filtermedia-flow__sheet,
.p-filtermedia-flow__process,
.p-filtermedia-flow__compare {
  margin-bottom: clamp(2.5rem, 1.25rem + 2.5vw, 5rem);
}
.p-filtermedia-flow__intro:last-child,
.p-filtermedia-flow__sheet:last-child,
.p-filtermedia-flow__process:last-child,
.p-filtermedia-flow__compare:last-child {
  margin-bottom: 0;
}

/* メインタイトル */
/* 1920-800: 36-20px */
.p-filtermedia-flow__ttl {
  font-size: clamp(1.25rem, 0.714rem + 1.071vw, 2.25rem);
  font-weight: 700;
  color: #000;
  line-height: 1.4;
  margin-bottom: 1rem;
}

/* 説明文 */
.p-filtermedia-flow__txt {
  font-size: clamp(0.875rem, 0.786rem + 0.179vw, 1.125rem);
  line-height: 1.667;
  color: #000;
}

/* サブタイトル（フローシート / ろ材の流れ / 砂利比較） */
/* 1920-800: 28-16px */
.p-filtermedia-flow__sub-ttl {
  font-size: clamp(1rem, 0.571rem + 0.857vw, 1.75rem);
  font-weight: 700;
  color: #083783;
  margin-bottom: 1.25rem;
  border-bottom: 2px solid #083783;
  padding-bottom: 0.5rem;
}

/* フローチャート: 9ステップ横並び */
.p-filtermedia-flow__chart {
  display: grid;
  /* 1920-800: 最小幅 100px → auto-fill */
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  gap: 0.5rem;
}
@media screen and (max-width: 768px) {
  .p-filtermedia-flow__chart {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (max-width: 430px) {
  .p-filtermedia-flow__chart {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* フローステップ */
.p-filtermedia-flow__step {
  margin: 0;
}

/* フローステップ画像（img ネスト禁止規則に従い別セレクターで記述） */
.p-filtermedia-flow__step img {
  width: 100%;
  height: auto;
  border-radius: 6px;
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 5/3;
  display: block;
}

/* ろ材の流れ: 5枚グリッド */
.p-filtermedia-flow__process-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(0.5rem, 0.25rem + 0.5vw, 1rem);
}
@media screen and (max-width: 768px) {
  .p-filtermedia-flow__process-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 430px) {
  .p-filtermedia-flow__process-grid {
    grid-template-columns: 1fr;
  }
}

/* ろ材の流れ 工程アイテム */
.p-filtermedia-flow__process-item {
  margin: 0;
}

/* ろ材の流れ 工程画像（img ネスト禁止規則に従い別セレクターで記述） */
.p-filtermedia-flow__process-item img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 4/3;
  display: block;
}

/* 砂利比較グリッド */
.p-filtermedia-flow__compare-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(0.5rem, 0.25rem + 0.5vw, 1rem);
}
@media screen and (max-width: 768px) {
  .p-filtermedia-flow__compare-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* 砂利比較アイテム */
.p-filtermedia-flow__compare-item {
  margin: 0;
}

/* 砂利比較画像（img ネスト禁止規則に従い別セレクターで記述） */
.p-filtermedia-flow__compare-item img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 1/1;
  display: block;
}

/* ====================================================
   p-filtermedia-bgwrap: メッセージ + CTA 背景画像ラッパー
   JSON: export_0026 / 水中ブルー背景
   ==================================================== */
.p-filtermedia-bgwrap {
  background-color: #083783;
  background-image: url("../images/filtermedia/filtermediaBg.webp");
  background-size: cover;
  background-position: center;
}

/* メッセージセクション */
.p-filtermedia-message {
  padding-top: clamp(3rem, 1.25rem + 3.5vw, 6.25rem);
  padding-bottom: clamp(2.5rem, 1.071rem + 2.857vw, 5rem);
  text-align: center;
}

/* メッセージテキスト: JSON fontSize=32 Medium 白 center */
/* 1920-800: 32-18px */
.p-filtermedia-message__txt {
  font-size: clamp(1.125rem, 0.536rem + 1.179vw, 2rem);
  font-weight: 500;
  color: #fff;
  line-height: 1.875; /* 60/32 */
}

/*===================================================================
    /* 個人情報保護方針 */
.p-privacypolicy .c-lowerPage__ttl {
  color: #000;
}

.c-lowerPage__defaultlist-item {
  padding-left: 2em;
  position: relative;
}
.c-lowerPage__defaultlist-item::before {
  content: "・";
  position: absolute;
  left: 1em;
  font-size: 1em;
}/*# sourceMappingURL=style.css.map */