/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */

/* Reset box-model and set borders */
/* ============================================ */

*,
::before,
::after {
  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 {
  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] {
  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 */
  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;
}
/*
 * Theme Name: resysty
 * Version: 1.0.2
 * Author: Kaito Sagawa
 * Description: このテーマはリステムネットワーク専用テーマです。
*/

@charset "UTF-8";

@font-face {
  font-family: Arimo;
  font-style: normal;
  font-display: swap;
  font-weight: 400 700;
  src: url("webfonts/Arimo/Arimo-VariableFont_wght.woff2") format("woff2");
}

@font-face {
  font-family: "Noto Serif JP";
  font-weight: 300 700;
  font-display: swap;
  src: url("webfonts/Noto_Serif_JP/NotoSerifJP-VariableFont_wght.woff2")
    format("woff2");
}

@font-face {
  font-family: "Noto Sans JP";
  font-weight: 300 700;
  font-display: swap;
  src: url("webfonts/Noto_Sans_JP/NotoSansJP-VariableFont_wght.woff2")
    format("woff2");
}

:root {
  --main-color: #0d6cb7;
  --base-black-color: #262626;
  --bg-gray-color: #f6f9f8;
  --accent-color: #f69133;
  --font-weight500: 500;
  --font-weight600: 600;
  --font-weight700: 700;
  --font-weight800: 800;
}

html {
  font-size: 100%;
  scroll-behavior: smooth;
}

@media not all and (resolution >= 0.001dpcm) {
  /* Safari専用のスタイル */
  html {
    -webkit-font-smoothing: antialiased !important; /* フォントスムージングをオフ */
    text-size-adjust: 100%;
  }

  :root {
    --font-weight500: 400;
    --font-weight600: 500;
    --font-weight700: 500;
    --font-weight800: 700;
  }

  @media screen and (width <= 992px) {
    :root {
      --font-weight500: 500;
      --font-weight600: 600;
      --font-weight700: 700;
      --font-weight800: 800;
    }
  }
}

_::-webkit-full-page-media,
_:future,
:root {
  --font-weight500: 400;
  --font-weight600: 500;
  --font-weight700: 500;
  --font-weight800: 700;
}

@media screen and (width <= 992px) {
  _::-webkit-full-page-media,
  _:future,
  :root {
    --font-weight500: 500;
    --font-weight600: 600;
    --font-weight700: 700;
    --font-weight800: 800;
  }
}
/* stylelint-disable-next-line selector-type-no-unknown */
_::-webkit-full-page-media,
_:future, /* stylelint-disable-line */
:root strong {
  font-weight: 500;
}

@media screen and (width <= 992px) {
  /* stylelint-disable-next-line selector-type-no-unknown */
  _::-webkit-full-page-media,
  _:future, /* stylelint-disable-line */
  :root strong {
    font-weight: 600;
  }
}

body {
  background-color: white;
  color: var(--base-black-color);
  font-family: "Noto Serif JP", serif;
  font-weight: 300;
}

body.--en {
  background-color: white;
  color: var(--base-black-color);
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
}

img {
  max-height: 100%;
  max-width: 100%;
  height: auto;
  background-color: transparent !important; /* グレーを消す */
}

img[data-lazyloaded="0"],
img.lazyload {
  background-color: transparent !important; /* グレーを消す */
}

a {
  max-height: 100%;
  max-width: 100%;
}

a:hover {
  opacity: 0.65;
}

.sp-show {
  display: none;
}

@media screen and (width <= 992px) {
  .pc-show {
    display: none;
  }
}

.text-link {
  color: #00e;
  text-decoration: underline;
}

body.no-scroll {
  overflow: hidden;
  height: 100vh;
}

.cv-hidden {
  display: none !important;
}

/* ===========================================
	ヘッダーの設定
=========================================== */
#normal-header {
  align-items: center;
  display: flex;
  font-size: 16px;
  justify-content: space-between;
  padding: 2.9vw 5vw 1.74vw;
  position: relative;
  min-height: 140px;
}

#normal-header .lang-button-container {
  position: absolute;
  right: 5vw;
  top: 0;
  padding: 5px 10px;
  background-color: #d6ecff;

  /* border: #000 1px solid; */
}

#normal-header.--en {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
}

#normal-header h1 {
  height: auto;
  width: 250px;
  font-weight: 500;
  font-size: 17px;
  letter-spacing: 0.02em;
  display: flex;
}

#normal-header h1 > a {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 7px;
  align-items: start;
  justify-content: center;
}

#normal-header .header_logo--pc {
  height: 45px;
  width: 100%;
  background-image: url("images/header_logo.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
  z-index: 3;
}

#normal-header nav {
  align-items: center;
  display: flex;
  font-size: 1.04vw;
  gap: 2.29vw;
}

#normal-header nav > ul {
  display: flex;
  gap: 2.29vw;
}

#normal-header nav > .contact-button {
  align-items: center;
  background-color: white;
  border-color: var(--main-color);
  border-radius: 3.26vw;
  border-width: 2px;
  color: var(--base-black-color);
  display: flex;
  height: 3.26vw;
  justify-content: center;
  margin: auto;
  padding-left: 1.88vw;
  position: relative;
  transition-duration: 0.5s;
  transition-property: color, background-color;
  width: 17.15vw;
}

#normal-header nav > .contact-button:hover {
  background-color: #0d6cb7;
  color: white;
  opacity: 0.65;
  transition-duration: 0.5s;
  transition-property: color, background-color;
}

#normal-header nav > .contact-button > p {
  margin: auto;
  text-align: center;
}

#normal-header nav > .contact-button:hover > span::before {
  background-color: white;
  transition-duration: 0.5s;
  transition-property: background-color;
}

#normal-header nav > .contact-button:hover > span::after {
  border-color: white;
  transition-duration: 0.5s;
  transition-property: border-color;
}

#normal-header nav > .hamburger-button {
  display: none;
}

#normal-header .hamburger-menu {
  display: none;
}

#normal-header .lang-button-container > ul {
  display: flex;
  flex-direction: row;
  gap: 15px;
}

#normal-header .lang-button-container > ul > li {
  /* border: #000 1px solid; */
  padding: 3px 5px;
  font-size: 14px;
}

/* ===========================================
	フッターの設定
=========================================== */
footer {
  background-color: var(--main-color);
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 3.68vw 12.71vw 3.06vw;
}

footer.--en {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
}

footer > nav {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

footer > nav > a > img {
  height: 3.31vw;
  width: 19.24vw;
}

footer > nav > ul {
  display: flex;
  font-size: 1.11vw;
  gap: 2.64vw;
}

footer > .badge_container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
  margin-top: 2.16vw;
  width: 100%;
}

footer > .badge_container > img {
  width: 130px;
  height: 142px;
}

footer > .badge_container > .kyoryoku-button {
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: center;
  background-color: var(--main-color);
  color: #fff;
  border: #fff 0.35vw double;
  padding: 0.8vw 1vw;
  font-family: "Noto Sans JP", serif;
  font-weight: 400;
  box-shadow: 4px 4px 4px rgb(0 0 0 / 25%);
  height: min-content;
  letter-spacing: 0.1em;
}

footer > .badge_container > .kyoryoku-button > h3 {
  font-size: 1.21vw;
  line-height: 1.21vw;
  margin-bottom: 1vw;
}

footer > .badge_container > .kyoryoku-button .description_container {
  display: flex;
  gap: 0.4vw;
}

footer > .badge_container > .kyoryoku-button p {
  font-size: 1vw;
  line-height: 1.3vw;
}

footer > .badge_container > .kyoryoku-button > small {
  width: 100%;
  text-align: right;
  margin-top: 15px;
  font-size: 0.9vw;
}

footer > .footer__permission {
  display: flex;
  gap: 19.79vw;
  margin-top: 2.16vw;
}

footer > .footer__permission > p {
  font-size: 1.18vw;
  line-height: 2.36vw;
}

.footer__info {
  align-items: end;
  display: flex;
  font-size: 1.18vw;
  justify-content: space-between;
  margin-top: 4.17vw;
}

.footer__info__location {
  display: flex;
  gap: 2.85vw;
  flex-wrap: wrap;
  width: 80%;
}

.footer__info__location > div:nth-child(3) {
  flex-basis: 90%; /* 3つ目で強制改行 */
}

.footer__info__location > div {
  display: flex;
  flex-direction: column;
  gap: 1.18vw;
  line-height: 1.7vw;
}

footer > p {
  font-size: 1.04vw;
  margin-top: 6.32vw;
  text-align: center;
}

/* ===========================================
	アニメーション
=========================================== */
.fade-in {
  opacity: 0;
  transform: translate(0, 80px);
  transition: all 800ms;
}

.fade-in.scroll-in {
  opacity: 1;
  transform: translate(0, 0);
}

/* lpのボタンアニメーション */
.animation-button {
  position: relative;
  animation: btn-animation 1.5s infinite;
  box-shadow: 1px 5px 5px rgb(0 0 0 / 20%);
}

@keyframes btn-animation {
  0% {
    transform: translate(1.8px, 0);
  }

  5% {
    transform: translate(-1.8px, 0);
  }

  10% {
    transform: translate(1.8px, 0);
  }

  15% {
    transform: translate(-1.8px, 0);
  }

  20% {
    transform: translate(1.8px, 0);
  }

  25% {
    transform: translate(-1.8px, 0);
  }

  30% {
    transform: translate(0, 0);
  }

  /* 0% {
      box-shadow: 1px 5px 5px rgb(0, 0, 0, 0.2);
      top: 0px;
  }
  10% {
      box-shadow: 0 0 0 rgb(0, 0, 0, 0.2);
      top: 1px;
  }
  20% {
      box-shadow: 1px 5px 5px rgb(0, 0, 0, 0.2);
      top: 0px;
  }
  30% {
      box-shadow: 0 0 0 rgb(0, 0, 0, 0.2);
      top: 1px;
  }
  40% {
      box-shadow: 1px 5px 5px rgb(0, 0, 0, 0.2);
      top: 0px;
  } */
}

/* ===========================================
	その他
=========================================== */
.arrow {
  background: url("images/arrow.svg") no-repeat;
  background-size: contain;
  height: 0.9vw;
  margin-right: 0.85vw;
  width: 1.25vw;
}

a:hover > .arrow {
  background: url("images/arrow-white.svg") no-repeat;
  background-size: contain;
  height: 0.9vw;
  margin-right: 0.85vw;
  transition-duration: 0.5s;
  width: 1.25vw;
}

.overlay {
  height: 100%;
  position: relative;
  width: 100%;
}

.overlay::before {
  background-color: rgb(0 103 174 / 43%);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.overlay > img {
  height: 100%;
  width: 100%;
}

.underline-text {
  text-decoration-line: underline;
}

/* ###### 固定ページのメインビジュアル ###### */
.fixed-page-main-visual {
  height: 13.61vw;
  position: relative;
  width: 100%;
}

.fixed-page-main-visual__image-container {
  height: 100%;
  width: 100%;
}

.fixed-page-main-visual__image-container img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.fixed-page-main-visual__title {
  color: white;
  display: flex;
  flex-direction: column;
  font-size: 1.18vw;
  font-weight: 600;
  gap: 0.83vw;
  left: 5vw;
  position: absolute;
  top: 4.72vw;
}

body.--en .fixed-page-main-visual__title {
  top: 50%;
  transform: translate(0, -50%);
}

.fixed-page-main-visual__title__text {
  letter-spacing: 0.67em;
}

body.--en .fixed-page-main-visual__title__text {
  letter-spacing: 0.15em;
}

.contact-form-main-visual {
  height: 26.81vw;
  width: 100%;
}

.contact-form-main-visual > img {
  height: 100%;
  width: 100%;
}

.contact-main--mb {
  display: none;
}

/* ###### フォーム ###### */
.contact-webform {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 4.17vw;
  padding-bottom: 14.44vw;
  padding-left: 20.28vw;
  padding-right: 20.28vw;
}

.contact-webform-container {
  display: flex;
  flex-direction: column;
  gap: 2.22vw;
}

.contact-webform-container > p {
  font-size: 1.39vw;
  line-height: 2vw;
}

/* contact form 7 のcss設定 */
form {
  align-items: center;
  background-color: #ecedef;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 3.4vw 2.15vw 3.97vw;
  width: 100%;
}

.form-item {
  display: flex;
  flex-direction: column;
  font-size: 18px;
  width: 100%;
}

.wpcf7 textarea {
  background-color: white;
  border: 2px solid #adb5c0;
  border-radius: 6px;
  color: var(--base-black-color);
  min-height: 120px;
  height: 160px;
  padding: 13px 12px;
  width: 100%;
}

.form-item__title {
  display: flex;
}

.wpcf7 em {
  font-style: normal;
  background-color: white;
  font-size: 14px;
  color: black;
  padding: 1.5px 6px 2px;
  margin-right: 10px;
  margin-top: auto;
  margin-bottom: auto;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
  background-color: white;
  border: 2px solid #adb5c0;
  border-radius: 6px;
  color: var(--base-black-color);
  padding-left: 12px;
  padding-top: 13px;
  padding-bottom: 11px;
  width: 100%;
  font-size: 18px;
}

.wpcf7 .form-item > p {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.wpcf7 label {
  color: var(--base-black-color);
}

.wpcf7 .submit {
  align-items: center;
  background: linear-gradient(90deg, #005bac, #319fcd);
  text-align: center;
  border-radius: 10px;
  color: white;
  display: flex;
  font-size: 30px;
  justify-content: center;
  margin-top: 30px;
  width: 13.26vw;
  box-shadow: 2px 2px 8px 0 #8a8a8a;
  padding-top: 15px;
  padding-bottom: 15px;
}

/* ###### ニュース ###### */
.news {
  display: flex;
  flex-direction: column;
  gap: 3.26vw;
  padding: 6.81vw 12.57vw;
}

.news ul {
  display: flex;
  flex-direction: column;
  gap: 0.97vw;
}

.news ul li {
  border-bottom: 1px solid #aaa;
  padding-bottom: 0.97vw;
}

.news .news-info {
  align-items: center;
  display: flex;
  gap: 0.97vw;
}

.news ul li a {
  align-items: center;
  display: flex;
  font-size: 1.53vw;
  gap: 1.46vw;
  justify-content: start;
}

.news-tag {
  border-color: #f69133;
  border-radius: 5vw;
  border-width: 1px;
  color: var(--accent-color);
  padding: 0.97vw 1.74vw;
}

.news-date {
  text-align: center;
}

/* ===========================================
	各ページ固有設定
=========================================== */

/* -------------------------------------------
index.php
------------------------------------------- */

/* ###### 共通部 ###### */
#top main {
  margin-top: 3.08vw;
}

#top .section-title {
  display: flex;
  flex-direction: column;
  gap: 1.04vw;
}

#top .section-title > h2 {
  font-size: 3.58vw;
}

#top.--en .section-title > h2 {
  font-size: 2vw;
  font-weight: 700;
}

#top .section-title > p {
  font-size: 1.18vw;
}

#top .composition {
  display: flex;
  flex-direction: column;
  gap: 4.39vw;
}

#top .composition > h3 {
  font-size: 4.1vw;
  font-weight: 700;
  letter-spacing: 0.165em;
  line-height: 160%;
}

#top.--en .composition > h3 {
  font-size: 3vw;
  letter-spacing: 0;
}

#top .text {
  display: flex;
  flex-direction: column;
  gap: 1.88vw;
  max-width: 36.53vw;
}

#top .text > p {
  font-size: 1.39vw;
  font-weight: 400;
  letter-spacing: 0.09em;
  line-height: 2.36vw;
}

#top .view-more {
  align-items: center;
  border-color: var(--main-color);
  border-radius: 3.06vw;
  border-width: 2px;
  display: flex;
  height: 4.72vw;
  justify-content: space-between;
  padding-left: 7.6vw;
  padding-right: 0.7vw;
  transition-duration: 0.5s;
  transition-property: background-color;
  width: 23.19vw;
}

#top .view-more:hover {
  background-color: #0d6cb7;
  opacity: 0.65;
  transition-duration: 0.5s;
  transition-property: background-color;
}

#top .view-more > p {
  color: var(--main-color);
  font-family: Arimo, sans-serif;
  font-size: 1.39vw;
  transition-duration: 0.5s;
  transition-property: color;
}

#top .view-more:hover > p {
  color: white;
  transition-duration: 0.5s;
  transition-property: color;
}

#top .composition > h2 {
  font-size: 4.1vw;
  letter-spacing: 0.165em;
  line-height: 160%;
}

#top.--en .composition > h2 {
  font-size: 3vw;
  letter-spacing: 0;
}

#top .composition > .text {
  display: flex;
  flex-direction: column;
  font-size: 1.39vw;
  font-weight: 600;
  gap: 1.39vw;
  letter-spacing: 0.09em;
  line-height: 2.36vw;
  size: 1.39vw;
}

/* ###### メインビジュアル ###### */
#top .main-visual {
  display: flex;
  flex-direction: row-reverse;
  position: relative;
  z-index: 1;
}

#top .main-visual__contents {
  display: flex;
  flex-flow: column;
  gap: 3.94vw;
  padding-bottom: 24.5vw;
  width: 79.72vw;
}

#top .main-title {
  display: flex;
  gap: 3.75vw;
  justify-content: start;
}

#top .main-title__text {
  font-size: 4.41vw;
  letter-spacing: 0.67em;
  line-height: 5.21vw;
}

#top.--en .main-title__text {
  font-size: 4.41vw;
  letter-spacing: 0.1em;
  line-height: 5.21vw;
  font-weight: 700;
}

#top .main-title-sub__text {
  font-family: Arimo, sans-serif;
  font-size: 2vw;
  font-weight: 700;
  line-height: 2.5vw;
  margin-top: 0.42vw;
}

.video-container {
  height: 43.7vw;
  position: absolute;
  top: 20.5vw;
  width: 79.72vw;
}

.main-visual__video {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

#top .scroll {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-top: 21.14vw;
  position: relative;
  width: 20.28vw;
}

#top .scroll div {
  align-items: center;
  display: flex;
  font-family: Arimo, sans-serif;
  font-size: 0.91vw;
  font-weight: 400;
  gap: 0.8vw;
  transform: rotateZ(90deg);
}

#top .scroll > div > span {
  height: 2px;
  position: relative;
  width: 15.15vw;
}

@keyframes animation-scroll {
  0% {
    width: 0;
  }

  60% {
    left: 0;
    width: 100%;
  }

  100% {
    bottom: 0;
    left: 15.15vw;
    width: 0;
  }
}

#top .scroll > div > span::after {
  animation-duration: 2.5s;
  animation-iteration-count: infinite;
  animation-name: animation-scroll;
  animation-timing-function: linear;
  background-color: var(--base-black-color);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 0;
}

/* ###### 概要 ###### */
#top .about {
  background-color: var(--bg-gray-color);
  padding-bottom: 13vw;
  padding-top: 28vw;
  position: relative;
}

#top.--en .about {
  padding-top: 22vw;
}

#top .recommend-container {
  background-color: #ecedef;
  display: flex;
  flex-direction: column;
  gap: 1.5vw;
  margin-left: 20.28vw;
  padding-bottom: 3vw;
  padding-left: 1vw;
  padding-top: 3vw;
}

#top .recommend-container > h2 {
  color: #7e7f81;
  font-family: Arimo, sans-serif;
  font-size: 1.39vw;
  font-weight: 700;
}

#top .recommend {
  display: flex;
  flex-wrap: wrap;
  gap: 1.67vw;
}

#top .recommend > a {
  box-shadow: 4px 5px 6px 0 #00000052;
  height: 12.1vw;
  width: 21.25vw;
}

#top .recommend > a > img {
  height: 100%;
  width: 100%;
}

#top .recommend > a:hover {
  opacity: 0.65;
}

#top .about > .composition {
  margin-left: 8.54vw;
  margin-top: 8.08vw;
  width: 38.43vw;
}

#top .about > .composition > h2 {
  font-weight: 700;
}

#top .about > img {
  height: 44.31vw;
  position: absolute;
  right: 0;
  top: 79.5vw;
  width: 49.03vw;
  z-index: 0;
}

#top.--en .about > img {
  top: 64.5vw;
}

/* ###### 事業内容 ###### */
#top .service {
  padding: 25vw 6.88vw 47.5vw 5.97vw;
  position: relative;
}

#top.--en .service {
  padding-top: 18vw;
}

#top .service > .media {
  display: flex;
  justify-content: space-between;
}

#top .service > .media > img {
  height: 35.42vw;
  margin-top: 6vw;
  width: 38.47vw;
}

#top .service-image1 {
  height: 32.92vw;
  left: 0;
  position: absolute;
  top: 85vw;
  width: 49.72vw;
}

#top .service-image2 {
  height: 46.25vw;
  position: absolute;
  right: 0;
  top: 97vw;
  width: 43.33vw;
}

/* ###### 会社情報 ###### */
#top .company {
  background-color: var(--bg-gray-color);
  padding: 15vw 5vw 6.78vw 8.47vw;
}

#top .media-reverse {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
}

#top .media-reverse > img {
  height: 31.4583vw;
  margin-top: 18vw;
  width: 44.1vw;
}

#top.--en .media-reverse > img {
  margin-top: 23vw;
}

/* ###### SDGs ###### */
#top .sdgs {
  background-color: var(--bg-gray-color);
  padding: 8.06vw 5.07vw;
}

#top .sdgs-container {
  align-items: center;
  background-color: white;
  border-radius: 1.11vw;
  box-shadow: 0 4px 10px 0 rgb(0 0 0 / 25%);
  display: flex;
  flex-direction: column;
  gap: 2.64vw;
  padding-bottom: 4.84vw;
  padding-top: 4.84vw;
}

#top .sdgs-container > .resystem-and-sdgs-logo-image--pc {
  height: 6.53vw;
  width: 48.54vw;
}

#top .sdgs-container > .resystem-and-sdgs-logo-image--mb {
  display: none;
}

#top .sdgs-container > .individual-logo-image {
  height: 10.25vw;
  width: 61.46vw;
}

#top .sdgs-container > .item-container {
  display: flex;
  flex-direction: column;
  gap: 3.33vw;
  width: 61.46vw;
}

#top .sdgs-container > .item-container > .item {
  display: flex;
  flex-direction: column;
  gap: 1.39vw;
}

#top .sdgs-container > .item-container > .item > .item-title-container {
  align-items: center;
  display: flex;
  gap: 1.88vw;
}

#top .sdgs-container > .item-container > .item > .item-title-container > h2 {
  font-size: 1.53vw;
  font-weight: 700;
  line-height: 150%;
}

#top
  .sdgs-container
  > .item-container
  > .item
  > .item-title-container
  > .item-title-decoration-container {
  display: flex;
  gap: 0.35vw;
  height: 2.01vw;
  justify-content: start;
  min-width: 3.54vw;
}

#top .sdgs .title-decoration-box {
  height: 100%;
  width: 0.63vw;
}

#top .sdgs .--sdgs-seven {
  background-color: #fabd00;
}

#top .sdgs .--sdgs-nine {
  background-color: #ec6a06;
}

#top .sdgs .--sdgs-eleven {
  background-color: #f5a20b;
}

#top .sdgs .--sdgs-twelve {
  background-color: #d39206;
}

#top .sdgs .--sdgs-seventeen {
  background-color: #023067;
}

#top .sdgs .--sdgs-thirteen {
  background-color: #407936;
}

#top .sdgs-container > .item-container > .item > p {
  font-size: 1.04vw;
  font-weight: 300;
  letter-spacing: 0.09em;
  line-height: 150%;
  size: 1vw;
  text-align: justify;
  word-break: break-all;
}

#top.--en .sdgs-container > .item-container > .item > p {
  font-weight: 400;
}

/* -------------------------------------------
company.php
------------------------------------------- */

/* ###### 共通部 ###### */
#company .section-title {
  align-items: center;
  display: flex;
  flex-direction: column;
  font-size: 1.18vw;
  gap: 1.39vw;
}

#company.--en .section-title {
  font-weight: 600;
}

#company .section-title > h2 {
  font-size: 4.58vw;
}

#company.--en .section-title > h2 {
  font-size: 3vw;
}

/* ###### 経営理念 ###### */
#company .philosophy {
  display: flex;
  flex-direction: column;
  gap: 2.36vw;
  padding: 6.47vw 12.43vw 11.32vw;
}

#company .philosophy__text {
  border-color: var(--base-black-color);
  border-width: 0.21vw;
  padding: 3.26vw 7.85vw;
}

#company .philosophy__text > p {
  font-size: 1.67vw;
  letter-spacing: 0.165em;
  line-height: 200%;
}

#company.--en .philosophy__text > p {
  letter-spacing: 0;
  font-weight: 600;
}

/* ###### 代表挨拶 ###### */
#company .message {
  background-color: var(--bg-gray-color);
  padding-bottom: 8.82vw;
  padding-top: 4.93vw;
}

#company .ceo-image--pc {
  height: 16.53vw;
  margin-top: 3.4vw;
  width: 100%;
}

#company .ceo-image--mb {
  display: none;
}

#company .message > .text {
  display: flex;
  flex-direction: column;
  font-size: 1.39vw;
  gap: 2.36vw;
  letter-spacing: 0;
  line-height: 200%;
  margin-left: 20.21vw;
  margin-right: 20.21vw;
  margin-top: 5.49vw;
  text-align: justify;
  word-break: break-all;
}

/* ###### 会社概要 ###### */
#company .profile {
  padding-bottom: 12.36vw;
  padding-top: 5.21vw;
}

#company .profile > table {
  border-collapse: collapse;
  font-size: 1.39vw;
  line-height: 2.39vw;
  margin-left: 12.64vw;
  margin-right: 12.64vw;
  margin-top: 3.82vw;
  width: 74.72vw;
}

#company .profile > table > tr,
#company .profile > table th,
#company .profile > table td {
  border: 1px solid var(--base-black-color);
}

#company .profile > table th,
.profile > table td {
  padding: 1.53vw 1.97vw;
}

#company .profile > table th {
  vertical-align: middle;
  width: 20.76vw;
}

#company .profile > p {
  font-size: 1.39vw;
  margin-left: 12.64vw;
  margin-right: 12.64vw;
  margin-top: 1.53vw;
}

/* ###### 取得許可一覧 ###### */
#company .permission {
  padding-bottom: 11.46vw;
  padding-left: 0;
  padding-right: 0;
}

#company .permission > .overlay > img {
  height: 28.54vw;
  width: 100%;
}

#company .permission > .section-title {
  margin-top: 5.9vw;
}

#company .permission > h3 {
  margin-left: 12.64vw;
  margin-right: 12.64vw;
}

#company .permission__table-container {
  padding-left: 12.64vw;
  padding-right: 12.64vw;
  width: 100%;
}

#company .permission__table-container > h3 {
  font-size: 1.67vw;
  font-weight: 700;
  letter-spacing: 0.065em;
  margin-bottom: 1.11vw;
  margin-top: 3.33vw;
}

#company .permission__table-container p {
  font-size: 1.39vw;
}

#company .permission__table-container h4 {
  font-size: 1.39vw;
  font-weight: 700;
  margin-bottom: 1.11vw;
}

#company .permission__table-container table {
  width: 100%;
}

#company .permission__table-container table tr,
#company .permission__table-container table td {
  border: 1px solid var(--base-black-color);
  padding: 1.53vw 1.97vw;
}

#company .permission__table-container table td > p {
  line-height: 150%;
}

/* -------------------------------------------
service.php
------------------------------------------- */

/* ###### 概要 ###### */
#service .summary {
  align-items: center;
  display: flex;
  flex-direction: column;
  padding-left: 5vw;
  padding-right: 5vw;
  padding-top: 5.03vw;
}

#service .service-button-container {
  align-items: end;
  display: flex;
  gap: 6.11vw;
}

#service .service-button-container > a {
  align-items: center;
  background-color: #ecedef;
  border-radius: 1.04vw;
  box-shadow: 0 4px 4px rgb(0 0 0 / 25%);
  display: flex;
  flex-direction: column;
  gap: 0.9vw;
  justify-content: end;
  min-height: 9.06vw;
  padding: 0.94vw 1.77vw;
  width: 15.47vw;
}

#service .service-button-container > a > img {
  height: 4.15vw;
  object-fit: contain;
  width: 6.48vw;
}

#service .service-button-container > a > p {
  color: var(--main-color);
  font-size: 1.11vw;
  font-weight: 700;
}

#service .composition {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 3.96vw;
  margin-top: 9.17vw;
}

#service .composition > h2 {
  font-size: 2.01vw;
  font-weight: 700;
  text-align: center;
}

#service.--en .composition > h2 {
  line-height: 170%;
}

#service .composition > .text {
  display: flex;
  flex-direction: column;
  font-size: 1.32vw;
  gap: 2.73vw;
  letter-spacing: 0.195em;
  line-height: 229.5%;
  text-align: justify;
  word-break: break-all;
  width: 59.9vw;
}

#service.--en .composition > .text {
  letter-spacing: 0;
  line-height: 170%;
}

#service .summary > .overlay {
  height: 27.48vw;
  margin-top: 6.11vw;
}

#service .summary > .overlay > img {
  height: auto;
}

/* ###### 事業一覧 ###### */

#service .service-intro {
  padding: 8.33vw 20.28vw 12.9vw;
}

#service .business-domain > h2 {
  font-size: 2.08vw;
  font-weight: 700;
}

#service .media {
  box-shadow: 0 2px 6px rgb(0 0 0 / 25%);
  display: flex;
  height: 20.9vw;
  margin-bottom: 7.85vw;
  margin-top: 2.15vw;
}

#service.--en .media {
  height: 30.9vw;
}

#service .media > img {
  height: 20.9vw;
  width: 28.78vw;
}

#service.--en .media > img {
  height: 100%;
  object-fit: cover;
}

#service .media__description {
  display: flex;
  flex-direction: column;
  font-weight: 700;
  gap: 1.74vw;
  height: 100%;
  padding-left: 1.98vw;
  padding-right: 1.98vw;
  padding-top: 1.94vw;
  position: relative;
  width: 100%;
}

#service .media__description > h3 {
  font-size: 1.67vw;
  font-weight: 700;
}

#service .media__description > p {
  font-size: 1.11vw;
  font-weight: 400;
  letter-spacing: -0.005em;
  line-height: 2.36vw;
  text-align: justify;
  word-break: break-all;
}

#service.--en .media__description > p {
  letter-spacing: 0;
  text-align: left;
}

#service .description-button-container {
  display: flex;
  justify-content: end;
}

#service .description-button {
  align-items: center;
  bottom: 1.94vw;
  box-shadow: 2px 2px 8px rgb(0 0 0 / 25%);
  display: flex;
  font-size: 1.18vw;
  font-weight: 700;
  height: 3.06vw;
  justify-content: center;
  position: absolute;
  right: 1.98vw;
  width: 11.67vw;
}

#service .media--reverse {
  flex-direction: row-reverse;
}

#service .no-image-media-container {
  display: flex;
  gap: 1.67vw;
}

#service .no-image-media {
  box-shadow: 0 2px 6px rgb(0 0 0 / 25%);
  display: flex;
  flex-direction: column;
  gap: 1.74vw;
  height: 20.85vw;
  padding-left: 1.98vw;
  padding-right: 1.98vw;
  padding-top: 1.94vw;
  position: relative;
  width: 28.89vw;
}

#service.--en .no-image-media {
  height: 28.85vw;
}

#service .no-image-media > h3 {
  font-size: 1.67vw;
  font-weight: 700;
}

#service .no-image-media > p {
  font-size: 1.11vw;

  /* font-weight: 400; */
  letter-spacing: -0.005em;
  line-height: 2.36vw;
  text-align: justify;
  word-break: break-all;
}

#service.--en .no-image-media > p {
  text-align: left;
}

/* -------------------------------------------
recruit.php
------------------------------------------- */

/* ###### 概要 ###### */
#recruit .summary {
  position: relative;
}

#recruit .summary > img {
  height: 49.17vw;
  object-fit: cover;
  width: 100%;
}

#recruit .summary > .composition {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 6.18vw;
  left: 20.28vw;
  position: absolute;
  right: 20.28vw;
  top: 9.86vw;
}

#recruit .summary > .composition > h2 {
  font-size: 2.29vw;
}

#recruit.--en .summary > .composition > h2 {
  font-size: 1.8vw;
  font-weight: 600;
}

#recruit .summary > .composition > .text {
  display: flex;
  flex-direction: column;
  font-size: 1.18vw;
  gap: 2.36vw;
  letter-spacing: 0;
  line-height: 2.36vw;
  text-align: justify;
  word-break: break-all;
  font-weight: 500;
}

/* ###### 採用情報一覧 ###### */
#recruit .recruit-case {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 7.29vw;
  padding-bottom: 30.54vw;
  padding-top: 7.43vw;
}

#recruit .recruit-case > h2 {
  font-size: 2.29vw;
}

#recruit.--en .recruit-case > h2 {
  font-size: 1.8vw;
  font-weight: 600;
}

#recruit .recruit-case > p {
  font-size: 1.39vw;
  letter-spacing: 0.6em;
}

#recruit.--en .recruit-case > p {
  letter-spacing: 0;
}

/* -------------------------------------------
contact.php
------------------------------------------- */

/* ###### お問い合わせ先一覧 ###### */
#contact .contact-case {
  display: flex;
  flex-direction: column;
  gap: 3.82vw;
  padding: 5.14vw 12.64vw 13.46vw;
}

#contact .contact-case > h2 {
  font-size: 2.29vw;
}

#contact .contact-case-inner {
  display: flex;
  flex-direction: column;
  gap: 3.5vw;
  width: 100%;
}

#contact .contact-case-inner > a {
  width: 100%;
}

#contact .contact-case-inner > a > img {
  height: 20.08vw;
  width: 100%;
}

#contact .contact-sapai-image--mb {
  display: none;
}

#contact .contact-recycle-image--mb {
  display: none;
}

#contact .contact-other-image--mb {
  display: none;
}

/* -------------------------------------------
contact-sanpai.php
------------------------------------------- */

/* ###### 共通部 ###### */
#contact-sanpai h2 {
  font-size: 2.29vw;
}

/* ###### お電話・LINEでのお問い合わせ ###### */
#contact-sanpai .contact-method {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 3.07vw;
  padding: 8.47vw 12.64vw 12.29vw;
}

#contact-sanpai .contact-method-container {
  align-items: center;
  display: flex;
  gap: 2.5vw;
}

#contact-sanpai .contact-method-container h3 {
  font-size: 2.29vw;
}

#contact-sanpai .contact-method-container > span {
  background-color: var(--base-black-color);
  height: 9.25vw;
  width: 1px;
}

#contact-sanpai .contact-webform {
  padding-top: 7.29vw;
}

#contact-sanpai .phone {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 2.08vw;
}

#contact-sanpai .phone > p {
  font-size: 1.11vw;
}

#contact-sanpai .phone-number-container {
  align-items: baseline;
  display: flex;
  gap: 0.69vw;
}

#contact-sanpai .phone-number-pref {
  font-size: 2.29vw;
}

#contact-sanpai .phone-number {
  color: var(--main-color);
  font-size: 3.68vw;
}

#contact-sanpai .line {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 2vw;
}

#contact-sanpai .line-container {
  display: flex;
  gap: 1.76vw;
}

#contact-sanpai .line-container > img {
  height: 9.68vw;
  width: 9.68vw;
}

#contact-sanpai .line-button-container {
  display: flex;
  flex-direction: column;
  gap: 1.43vw;
}

#contact-sanpai .line-button-container > p {
  font-size: 1.25vw;
}

#contact-sanpai .line-button-container a {
  height: 6.45vw;
  width: 20.26vw;
}

#contact-sanpai .line-button-container a > img {
  height: 100%;
  width: 100%;
}

/* -------------------------------------------
contact-recycle.php
------------------------------------------- */

/* ###### 共通部 ###### */
#contact-recycle h2 {
  font-size: 2.29vw;
}

/* ###### ウェブフォーム ###### */
#contact-recycle .contact-webform {
  padding-top: 7.29vw;
}

/* -------------------------------------------
contact-other.php
------------------------------------------- */

/* ###### 共通部 ###### */
#contact-other h2 {
  font-size: 2.29vw;
}

/* ###### お電話でのお問い合わせ ###### */
#contact-other .phone {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 3.47vw;
  padding-left: 27.85vw;
  padding-right: 27.85vw;
  padding-top: 8.75vw;
}

#contact-other .phone-container {
  align-items: center;
  background-color: #ecedef;
  display: flex;
  flex-direction: column;
  height: 16.81vw;
  justify-content: space-around;
  width: 100%;
}

#contact-other .phone-number-container {
  align-items: baseline;
  display: flex;
  gap: 0.69vw;
}

#contact-other .phone-number-pref {
  font-size: 2.29vw;
}

#contact-other .phone-number {
  color: var(--main-color);
  font-size: 3.68vw;
}

#contact-other .phone-info-container {
  align-items: center;
  background-color: white;
  display: flex;
  font-size: 16px;
  height: 3.24vw;
  justify-content: center;
  text-align: center;
  width: 36.62vw;
}

/* ###### ウェブフォーム ###### */
#contact-other .contact-webform {
  padding-top: 9.65vw;
}

/* -------------------------------------------
news.php
------------------------------------------- */

#news .section-title {
  display: flex;
  flex-direction: column;
  gap: 1.04vw;
}

#news .section-title > h2 {
  font-size: 4.58vw;
}

#news .section-title > p {
  font-size: 1.18vw;
}

/* -------------------------------------------
single.php
------------------------------------------- */
#news-article main {
  padding-bottom: 100px;
  padding-top: 30px;
}

#news-article article {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 40px;
  max-width: 922px;
  padding-left: 35px;
  padding-right: 35px;
}

#news-article .article-header {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

#news-article .article-header > h2 {
  font-size: 25px;
}

#news-article .article-header > span {
  background-color: var(--base-black-color);
  height: 1px;
  width: 100%;
}

#news-article .article-header-info-container {
  display: flex;
  gap: 15px;
}

#news-article .article-tag {
  color: var(--accent-color);
}

#news-article .article-content {
  background-color: white;
  color: var(--base-black-color);
  display: flex;
  flex-direction: column;
  font-family:
    "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans",
    Meiryo, sans-serif;
  font-size: 17px;
  font-weight: 300;
  gap: 1vw;
  height: auto !important;
  letter-spacing: 0.05em;
  margin: 20px auto;
  max-width: 950px;
  padding: 25px 0 100px;
  width: 100%;
}

#news-article .article-content > h2 {
  font-size: 25px;
  font-weight: 600;
  margin-bottom: 1vw;
  margin-top: 4vw;
  padding-bottom: 1.25vw;
  padding-top: 1vw;
  text-align: center;
}

#news-article .article-content > h2::after {
  border-bottom: var(--main-color) 2px solid;
  content: "";
  display: block;
  height: 10px;
  margin: auto;
  width: 30%;
}

#news-article .article-content > h3 {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 1vw;
  margin-top: 2.5vw;
  padding-bottom: 1vw;
  padding-top: 1vw;
}

#news-article .article-content > p {
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;

  /* letter-spacing: 0.05em; */
  line-height: 180%;
}

#news-article .article-content strong {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 180%;
}

#news-article .article-content ul {
  list-style: "◼︎";
}

#news-article .article-content br {
  display: block;
  content: "";
  margin: 10px 0;
}

/* -------------------------------------------
page.php
------------------------------------------- */
#page main {
  padding-bottom: 100px;
  padding-top: 30px;
}

#page article {
  display: flex;
  flex-direction: column;
  gap: 50px;
}

#page .article-header {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 80px;
  max-width: 922px;
  padding-left: 35px;
  padding-right: 35px;
}

#page h2 {
  font-size: 30px;
}

#page .article-content {
  background-color: white;
  color: var(--base-black-color);
  display: flex;
  flex-direction: column;
  font-family:
    "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans",
    Meiryo, sans-serif;
  font-size: 18px;

  /* font-weight: 400; */
  gap: 1vw;
  height: auto !important;
  letter-spacing: 0.05em;
  margin: 20px auto;
  max-width: 950px;
  padding: 25px 0 100px;
  width: 100%;
}

#page .article-content > h2 {
  font-size: 25px;
  font-weight: 600;
  margin-bottom: 1vw;
  margin-top: 4vw;
  padding-bottom: 1.25vw;
  padding-top: 1vw;
  text-align: center;
}

#page .article-content > h2::after {
  border-bottom: var(--main-color) 2px solid;
  content: "";
  display: block;
  height: 10px;
  margin: auto;
  width: 30%;
}

#page .article-content > h3 {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 1vw;
  margin-top: 2.5vw;
  padding-bottom: 1vw;
  padding-top: 1vw;
}

#page .article-content > p {
  font-family: "Noto Sans JP", sans-serif;
  letter-spacing: 0.05em;
  line-height: 200%;
  font-size: 18px;
  font-weight: 400;
}

#page .article-content strong {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 200%;
}

#page .article-content ul {
  list-style: "◼︎";
  padding-left: 17px;
}

#page .article-content ol {
  list-style-type: decimal;
  padding-left: 17px;
  line-height: 200%;
  font-weight: 400;
}

/* -------------------------------------------
archive.php
------------------------------------------- */
#archive main {
  padding-bottom: 100px;
  padding-top: 30px;
}

#archive article {
  display: flex;
  flex-direction: column;
  gap: 50px;
}

#archive .article-header {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 80px;
  max-width: 922px;
  padding-left: 35px;
  padding-right: 35px;
}

#archive h2 {
  font-size: 30px;
}

#archive .article-content {
  margin-left: auto;
  margin-right: auto;
  margin-top: 80px;
  max-width: 922px;
  min-width: 615px;
  padding-left: 35px;
  padding-right: 35px;
  width: 64.03vw;
}

#archive .article-content > h2 {
  background-color: var(--main-color);
  color: white;
  margin-bottom: 1vw;
  margin-top: 1vw;
  padding-bottom: 1vw;
  padding-left: 25px;
  padding-top: 1vw;
}

#archive .article-content > p {
  line-height: 35px;
}

/*******************************************
	レスポンシブ対応
********************************************/

@media screen and (width <= 970px) {
  /* -------------------------------------------
  news-article.php
  ------------------------------------------- */
  #news-article .article-header {
    gap: 15px;
  }

  #news-article .article-content {
    gap: 15px;
    width: 650px;
  }

  /* -------------------------------------------
  page.php
  ------------------------------------------- */
  #page .article-header {
    gap: 15px;
  }

  #page .article-content {
    gap: 15px;
    width: 650px;
  }

  /* -------------------------------------------
  recruit.php
  ------------------------------------------- */
  #recruit .recruit-case {
    padding-left: 10vw;
    padding-right: 10vw;
  }

  #recruit .recruit-case > p {
    letter-spacing: 0.09em;
  }
}

@media screen and (width <= 799px) {
  /* ===========================================
	ヘッダーの設定
  =========================================== */
  #normal-header {
    background-color: white;
    position: relative;
    min-height: 73px;
    padding: 16px;
  }

  #normal-header .lang-button-container {
    display: none;
  }

  #normal-header h1 {
    height: auto;
    min-height: 65px;
    width: 250px;
    z-index: 3;
    font-size: 17px;
    letter-spacing: 0.02em;
  }

  #normal-header h1 > a {
    gap: 2px;
    justify-content: start;
  }

  #normal-header .tagline {
    font-size: 14px;
  }

  #normal-header .tagline.is-active {
    color: white;
  }

  #normal-header .header_logo--pc {
    width: 200px;
    height: 35px;
  }

  #normal-header .header_logo--pc.is-active {
    background-image: url("images/header_logo-white.webp");
  }

  #normal-header nav > .hamburger-button {
    background-image: url("images/hamburger-icon.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40px;
    border-radius: 5px;
    display: block;
    height: 50px;
    width: 50px;
    z-index: 3;
  }

  #normal-header nav > .hamburger-button:hover {
    background-color: var(--bg-gray-color);
    cursor: pointer;
  }

  #normal-header nav > .hamburger-button.is-active {
    color: white;
  }

  #normal-header nav > .hamburger-button:hover.is-active {
    color: white;
  }

  #normal-header nav > ul {
    display: none;
  }

  #normal-header nav > .contact-button {
    display: none;

    /* border-radius: 30px;
    height: auto;
    padding: 10px 60px;
    width: auto;
    z-index: 3; */
  }

  #normal-header nav > .contact-button > p {
    /* font-size: 14px;
    font-weight: 600; */
  }

  #normal-header nav > .contact-button > .arrow {
    /* display: none; */
  }

  #normal-header .hamburger-menu {
    background-color: rgb(9 47 73 / 98%);
    display: none;
    height: 100vh;
    left: 0;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 2;
    padding-top: 160px;
    overflow: hidden auto; /* 横スクロールを防止 */
    transform: translateX(100%);
  }

  #normal-header .hamburger-menu.is-active {
    display: flex;
    flex-direction: column;
    gap: 60px;
    transform: translateX(0);
  }

  #normal-header .hamburger-menu .bogo-language-switcher {
    display: flex;
    flex-direction: column;
    gap: 30px;
  }

  #normal-header .hamburger-menu > ul {
    color: white;
    font-size: 20px;
    margin-left: 50px;
    margin-right: 50px;
    width: 100%;
  }

  #normal-header .hamburger-menu > ul > li {
    border-bottom: white 1px solid;
  }

  #normal-header .hamburger-menu > ul > li > a {
    display: block;
    height: 100%;
    padding-bottom: 20px;
    padding-top: 20px;
    width: 100%;
  }

  #normal-header .hamburger-menu .bogo-language-switcher > li > span {
    padding-bottom: 20px;
  }

  /* ===========================================
	フッターの設定
  =========================================== */
  footer {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding-left: 16px;
    padding-right: 16px;
  }

  footer > nav {
    align-items: center;
    flex-direction: column;
    gap: 20px;
    width: 100%;
  }

  footer > nav > a {
    width: 100%;
  }

  footer > nav > a > img {
    height: 60px;
    object-fit: contain;
    width: 300px;
  }

  footer > nav > ul {
    border-top: white 1px solid;
    flex-direction: column;
    gap: 0;
    width: 100%;
  }

  footer > nav > ul > li {
    border-bottom: white 1px solid;
    font-size: 15px;
    padding-bottom: 20px;
    padding-top: 20px;
    width: 100%;
  }

  footer > .badge_container {
    margin-top: 8vw;
    flex-direction: column;
  }

  footer > .badge_container > .kyoryoku-button {
    border: #fff 0.35vw double;
    padding: 2vw 2.2vw;
    box-shadow: 4px 4px 4px rgb(0 0 0 / 25%);
  }

  footer > .badge_container > .kyoryoku-button > h3 {
    font-size: 3.21vw;
    line-height: 3.21vw;
    margin-bottom: 2vw;
  }

  footer > .badge_container > .kyoryoku-button .description_container {
    gap: 0.4vw;
  }

  footer > .badge_container > .kyoryoku-button p {
    font-size: 2vw;
    line-height: 2.5vw;
  }

  footer > .badge_container > .kyoryoku-button > small {
    margin-top: 15px;
    font-size: 1.9vw;
  }

  footer > .footer__permission {
    flex-direction: column;
    gap: 15px;
    width: 100%;
  }

  footer > .footer__permission > p {
    font-size: 15px;
    line-height: 28px;
  }

  .footer__info {
    align-items: end;
    flex-flow: row wrap;
    gap: 5vw;
    width: 100%;
  }

  .footer__info__location {
    flex-direction: column;
  }

  .footer__info__location > div {
    font-size: 15px;
    line-height: 20px;
  }

  .footer__info > a {
    font-size: 15px;
  }

  footer > p {
    font-size: 15px;
  }

  /* ===========================================
	その他
  =========================================== */
  .arrow {
    height: 20px;
    margin-right: 1.85vw;
    width: 20px;
  }

  a:hover > .arrow {
    height: 20px;
    margin-right: 1.85vw;
    width: 20px;
  }

  /* ###### 固定ページのメインビジュアル ###### */
  .fixed-page-main-visual {
    height: 150px;
  }

  .fixed-page-main-visual__title {
    font-size: 16px;
    top: 50%;
    transform: translate(0, -50%);
  }

  .contact-form-main-visual {
    height: 67.8873vw;
    width: 100%;
  }

  .contact-form-main-visual > img {
    height: 100%;
    width: 100%;
  }

  .contact-main--mb {
    display: inline;
  }

  .contact-main--pc {
    display: none;
  }

  /* ###### ニュース ###### */
  .news {
    gap: 7.26vw;
    padding: 6.81vw 10vw 10.81vw;
  }

  .news ul {
    display: flex;
    flex-direction: column;
    gap: 3vw;
    font-weight: 400;
  }

  .news ul li {
    padding-bottom: 3vw;
  }

  .news .news-info {
    flex-direction: column;
    justify-content: center;
    min-width: 23vw;
  }

  .news .news-tag {
    font-size: 3vw;
  }

  .news ul li a {
    font-size: 4vw;
    gap: 30px;
  }

  /* ###### フォーム ###### */
  .contact-webform {
    padding-left: 16px;
    padding-right: 16px;
  }

  .contact-webform-container > p {
    font-size: 15px;
    line-height: 25px;
  }

  /* contact form 7 のcss設定 */
  form {
    gap: 16px;
    padding: 16px;
  }

  .form-item {
    font-size: 18px;
    gap: 8px;
  }

  .wpcf7 input[type="text"],
  .wpcf7 input[type="email"],
  .wpcf7 input[type="tel"] {
    border-radius: 7px;
    height: 45px;
    padding-left: 10px;
  }

  .wpcf7 textarea {
    border-radius: 7px;
    height: 45px;
    min-height: 200px;
    padding-left: 10px;
    padding-top: 10px;
  }

  .form-item__title {
    display: flex;
  }

  .wpcf7 > form > p {
    width: 100%;
  }

  .wpcf7 .submit {
    align-items: center;
    border-radius: 0.69vw;
    color: white;
    display: flex;
    font-size: 25px;
    height: 60px;
    justify-content: center;
    letter-spacing: 0.6em;
    margin-top: 3.19vw;
    padding-left: 15px;
    width: 100%;
  }

  /* ===========================================
	各ページ固有設定
  =========================================== */

  /* -------------------------------------------
  index.php
  ------------------------------------------- */

  /* ###### 共通部 ###### */
  #top .section-title {
    gap: 1.04vw;
  }

  #top .section-title > h2 {
    font-size: 8.58vw;
  }

  #top.--en .section-title > h2 {
    font-size: 3.7vw;
  }

  #top .section-title > p {
    font-size: 3.18vw;
  }

  #top .composition > h2 {
    font-size: 8.1vw;
  }

  #top.--en .composition > h2 {
    font-size: 6.1vw;
  }

  #top .composition > h3 {
    font-size: 6.1vw;
  }

  #top.--en .composition > h3 {
    font-size: 6.1vw;
  }

  #top .composition > .text {
    max-width: 90vw;
    text-align: justify;
    word-break: break-all;
  }

  #top .composition > .text > p {
    font-size: 3.39vw;
    line-height: 5.36vw;
  }

  #top .view-more {
    border-radius: 30px;
    height: 60px;
    padding-left: 32vw;
    width: 100%;
  }

  #top.--en .view-more {
    margin-top: 8vw;
  }

  #top .view-more > p {
    font-size: 3.39vw;
  }

  /* ###### メインビジュアル ###### */
  #top .main-visual__contents {
    gap: 0;
    width: 90vw;
  }

  #top .main-title {
    gap: 0;
  }

  #top .main-title__text {
    font-size: 7vw;
    line-height: 10.58vw;
  }

  #top.--en .main-title__text {
    font-size: 6vw;
    line-height: 8.58vw;
  }

  #top .main-title-sub__text {
    display: none;
  }

  #top .video-container {
    height: 43.7vw;
    top: 35.5vw;
    width: 90vw;
  }

  #top.--en .video-container {
    top: 33.5vw;
  }

  #top .scroll {
    display: none;
  }

  /* ###### 概要 ###### */
  #top .about {
    padding-bottom: 0;
    padding-top: 24vw;
  }

  #top.--en .about {
    padding-top: 32vw;
  }

  #top .recommend-container {
    margin-left: 10vw;
  }

  #top .recommend > a {
    box-shadow: 4px 5px 6px 0 #00000052;
    height: 15.4366vw;
    width: 27.1097vw;
  }

  #top .about > .composition {
    margin-left: 10vw;
    margin-right: 10vw;
    text-align: justify;
    word-break: break-all;
    width: auto;
  }

  #top .about > img {
    height: 90.3683vw;
    margin-top: 20vw;
    position: initial;
    top: 0;
    width: 100vw;
  }

  /* ###### 事業内容 ###### */
  #top .service {
    padding-left: 10vw;
    padding-right: 10vw;
    padding-top: 20vw;
  }

  #top .service > .media {
    display: flex;
    flex-direction: column-reverse;
    justify-content: space-between;
  }

  #top .service > .media > img {
    height: 80vw;
    padding-top: 10vw;
    width: 80vw;
  }

  #top .service-image1 {
    top: 225vw;
  }

  #top .service-image2 {
    top: 230vw;
  }

  /* ###### 会社情報 ###### */
  #top .company {
    padding: 20vw 10vw 10vw;
  }

  #top .media-reverse {
    flex-direction: column-reverse;
  }

  #top .media-reverse > img {
    height: 71.3386%;
    margin-top: 18vw;
    width: 100%;
  }

  /* ###### SDGs ###### */
  #top .sdgs {
    background-color: var(--bg-gray-color);
    padding: 8.06vw 5.07vw;
  }

  #top .sdgs-container {
    border-radius: 2vw;
    gap: 7vw;
    padding: 7.84vw 5.07vw;
  }

  #top .sdgs-container > .resystem-and-sdgs-logo-image--pc {
    display: none;
  }

  #top .sdgs-container > .resystem-and-sdgs-logo-image--mb {
    display: block;
    height: 41.8281vw;
    width: 81.42vw;
  }

  #top .sdgs > .sdgs-container > .title-container > h2 {
    font-size: 2.43vw;
  }

  #top .sdgs-container > .individual-logo-image {
    height: 13.7517vw;
    width: 81.42vw;
  }

  #top .sdgs-container > .item-container {
    gap: 5.47vw;
    width: 81.42vw;
  }

  #top .sdgs-container > .item-container > .item {
    gap: 4.47vw;
  }

  #top .sdgs-container > .item-container > .item > .item-title-container > h2 {
    font-size: 17px;
  }

  #top.--en
    .sdgs-container
    > .item-container
    > .item
    > .item-title-container
    > h2 {
    font-size: 2.9vw;
  }

  #top
    .sdgs-container
    > .item-container
    > .item
    > .item-title-container
    > .item-title-decoration-container {
    gap: 0.87vw;
    height: 5.03vw;
    min-width: 11vw;
  }

  #top .sdgs .title-decoration-box {
    width: 1.56vw;
  }

  #top .sdgs-container > .item-container > .item > p {
    font-size: 14px;
  }

  #top.--en .sdgs-container > .item-container > .item > p {
    font-size: 2.9vw;
  }

  /* -------------------------------------------
  company.php
  ------------------------------------------- */

  /* ###### 共通部 ###### */
  #company .section-title {
    font-size: 16px;
    gap: 1.39vw;
  }

  #company .section-title > h2 {
    font-size: 6.58vw;
  }

  /* ###### 経営理念 ###### */
  #company .philosophy {
    gap: 6.36vw;
    padding: 10.47vw 16px 15.32vw;
  }

  #company .philosophy__text {
    padding: 5.26vw 16px;
  }

  #company .philosophy__text > p {
    font-size: 16px;
    letter-spacing: 0.165em;
    line-height: 32px;
  }

  /* ###### 代表挨拶 ###### */
  #company .message {
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 10.47vw;
  }

  #company .ceo-image--pc {
    display: none;
  }

  #company .ceo-image--mb {
    display: block;
    margin-top: 6.36vw;
    width: 100%;
    height: auto;
  }

  #company .message > .text {
    display: flex;
    flex-direction: column;
    font-size: 16px;
    gap: 4.36vw;
    letter-spacing: 0.09em;
    line-height: 32px;
    margin-left: 0;
    margin-right: 0;
    margin-top: 5.49vw;
  }

  /* ###### 会社概要 ###### */
  #company .profile {
    padding-top: 10.47vw;
    padding-left: 16px;
    padding-right: 16px;
  }

  #company .profile > table {
    border-collapse: collapse;
    font-size: 16px;
    line-height: 22px;
    margin-top: 6.36vw;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }

  #company .profile > table > tbody {
    width: 100%;
  }

  #company .profile > p {
    font-size: 16px;
    line-height: 22px;
  }

  /* ###### 取得許可一覧 ###### */
  #company .permission__table-container {
    margin-top: 6.36vw;
    padding: 0 16px;
  }

  #company .permission__table-container > h3 {
    font-size: 20px;
  }

  #company .permission__table-container p {
    font-size: 16px;
  }

  #company .permission__table-container h4 {
    font-size: 16px;
  }

  /* -------------------------------------------
  service.php
  ------------------------------------------- */

  /* ###### 概要 ###### */
  #service .summary {
    padding-top: 10.03vw;
  }

  #service .service-button-container {
    flex-direction: column;
    gap: 3vw;
    width: 100%;
  }

  #service .service-button-container > a {
    flex-direction: row;
    gap: 30px;
    height: 100px;
    justify-content: center;
    width: 100%;
  }

  #service .service-button-container > a > p {
    font-size: 18px;
  }

  #service .service-button-container > a > img {
    height: 47px;
    object-fit: contain;
    width: 77px;
  }

  #service .composition {
    gap: 5.96vw;
    margin-top: 15.17vw;
  }

  #service .composition > h2 {
    font-size: 18px;
  }

  #service .composition > .text {
    font-size: 15px;
    gap: 25px;
    width: auto;
  }

  /* ###### 事業一覧 ###### */
  #service .service-intro {
    padding: 8.33vw 10vw 12.9vw;
  }

  #service .media {
    flex-direction: column;
    height: 95vw;
  }

  #service.--en .media {
    flex-direction: column;
    height: 105vw;
  }

  #service .media > img {
    height: 60vw;
    width: 100%;
  }

  #service.--en .media > img {
    height: 60vw;
    width: 100%;
  }

  #service .media__description {
    gap: 15px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
  }

  #service .business-domain > h2 {
    font-size: 20px;
  }

  #service .media__description > h3 {
    font-size: 18px;
  }

  #service .media__description > p {
    font-size: 15px;
    line-height: 25px;
  }

  #service .description-button {
    bottom: 20px;
    font-size: 18px;
    height: 45px;
    right: 20px;
    width: 170px;
  }

  #service .no-image-media-container {
    flex-direction: column;
    gap: 35px;
  }

  #service .no-image-media {
    height: 250px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    width: auto;
  }

  #service.--en .no-image-media {
    height: 250px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 20px;
    width: auto;
  }

  #service .no-image-media > h3 {
    font-size: 18px;
  }

  #service .no-image-media > p {
    font-size: 15px;
    line-height: 25px;
  }

  /* -------------------------------------------
  recruit.php
  ------------------------------------------- */

  /* ###### 概要 ###### */
  #recruit .summary > img {
    height: 70vw;
  }

  #recruit .summary > .composition {
    left: 10vw;
    right: 10vw;
  }

  #recruit .summary > .composition > h2 {
    font-size: 20px;
  }

  #recruit.--en .summary > .composition > h2 {
    font-size: 20px;
  }

  #recruit .summary > .composition > .text {
    font-size: 15px;
    gap: 18px;
    line-height: 25px;
  }

  /* ###### 採用情報一覧 ###### */
  #recruit .recruit-case > h2 {
    font-size: 20px;
  }

  #recruit.--en .recruit-case > h2 {
    font-size: 20px;
  }

  #recruit .recruit-case > p {
    font-size: 15px;
  }

  /* -------------------------------------------
  contact.php
  ------------------------------------------- */

  /* ###### お問い合わせ先一覧 ###### */
  #contact .contact-case {
    padding-left: 10vw;
    padding-right: 10vw;
  }

  #contact .contact-case > h2 {
    font-size: 20px;
    padding-bottom: 10vw;
    padding-top: 12vw;
  }

  #contact .contact-case-inner {
    gap: 7vw;
  }

  #contact .contact-case-inner > a > img {
    height: 54.2933vw;
    width: 80vw;
  }

  #contact .contact-sapai-image--mb {
    box-shadow: 0 4px 4px rgb(0 0 0 / 25%);
    display: inline;
  }

  #contact .contact-recycle-image--mb {
    box-shadow: 0 4px 4px rgb(0 0 0 / 25%);
    display: inline;
  }

  #contact .contact-other-image--mb {
    box-shadow: 0 4px 4px rgb(0 0 0 / 25%);
    display: inline;
  }

  #contact .contact-sapai-image--pc {
    display: none;
  }

  #contact .contact-recycle-image--pc {
    display: none;
  }

  #contact .contact-other-image--pc {
    display: none;
  }

  /* -------------------------------------------
  contact-sanpai.php
  ------------------------------------------- */

  /* ###### 共通部 ###### */
  #contact-sanpai h2 {
    font-size: 20px;
  }

  /* ###### お電話・LINEでのお問い合わせ ###### */
  #contact-sanpai .contact-method {
    gap: 7.07vw;
    padding-left: 0;
    padding-right: 0;
  }

  #contact-sanpai .contact-method-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 5.5vw;
  }

  #contact-sanpai .contact-method-container h3 {
    font-size: 25px;
  }

  #contact-sanpai .contact-method-container > span {
    height: 1px;
    width: 30.25vw;
  }

  #contact-sanpai .phone > p {
    font-size: 15px;
  }

  #contact-sanpai .phone-number-pref {
    font-size: 25px;
  }

  #contact-sanpai .phone-number {
    font-size: 40px;
  }

  #contact-sanpai .line-container > img {
    height: 120px;
    width: 120px;
  }

  #contact-sanpai .line-button-container {
    gap: 15px;
  }

  #contact-sanpai .line-button-container > p {
    font-size: 15px;
  }

  #contact-sanpai .line-button-container a {
    height: 80px;
    width: 240px;
  }

  /* -------------------------------------------
  contact-recycle.php
  ------------------------------------------- */

  /* ###### 共通部 ###### */
  #contact-recycle h2 {
    font-size: 20px;
  }

  /* -------------------------------------------
  contact-other.php
  ------------------------------------------- */

  /* ###### 共通部 ###### */
  #contact-other h2 {
    font-size: 20px;
  }

  /* ###### お電話でのお問い合わせ ###### */
  #contact-other .phone {
    gap: 20px;
    padding-left: 16px;
    padding-right: 16px;
  }

  #contact-other .phone-container {
    height: 150px;
    width: 380px;
  }

  #contact-other .phone-number-container {
    gap: 16px;
  }

  #contact-other .phone-number-pref {
    font-size: 25px;
  }

  #contact-other .phone-number {
    font-size: 40px;
  }

  #contact-other .phone-info-container {
    font-size: 16px;
    height: 30px;
    width: 83%;
  }

  /* -------------------------------------------
  news-article.php
  ------------------------------------------- */
  #news-article article {
    padding-left: 16px;
    padding-right: 16px;
  }

  #news-article .article-header {
    gap: 15px;
  }

  #news-article .article-header > h2 {
    font-size: 20px;
  }

  #news-article .article-content {
    font-family: "Noto Sans JP", serif;
    font-size: 16px;
    gap: 15px;
    padding: 10px 0 100px;
    width: auto;
  }

  #news-article .article-content > h2 {
    font-size: 20px;
    margin-bottom: 20px;
    margin-top: 50px;
  }

  #news-article .article-content > h3 {
    margin-bottom: 20px;
    margin-top: 30px;
  }

  /* -------------------------------------------
  page.php
  ------------------------------------------- */
  #page article {
    width: 100%;
  }

  #page .article-header {
    gap: 15px;
  }

  #page h2 {
    font-size: 20px;
  }

  #page .article-content {
    font-family: "Noto Sans JP", serif;
    font-size: 16px;
    gap: 15px;
    padding: 10px 16px 100px;
    width: 100%;
  }

  #page .article-content > h2 {
    font-size: 20px;
    margin-bottom: 20px;
    margin-top: 50px;
  }

  #page .article-content > h3 {
    margin-bottom: 20px;
    margin-top: 30px;
  }

  #page .article-content p {
    width: 100%;
    overflow-wrap: anywhere;
  }
}

@media screen and (width <= 616px) {
  /* ===========================================
	フッターの設定
  =========================================== */
  footer > nav > ul {
    flex-wrap: wrap;
    justify-content: center;
  }

  /* ===========================================
	その他
  =========================================== */
  .arrow {
    display: none;
  }

  /* ###### ニュース ###### */
  .news-info {
    min-width: 100px;
  }

  /* ===========================================
	各ページ固有設定
  =========================================== */

  /* -------------------------------------------
  index.php
  ------------------------------------------- */

  /* ###### 共通部 ###### */
  #top .section-title > h2 {
    font-size: 9.58vw;
  }

  #top .section-title > p {
    font-size: 4.18vw;
  }

  #top .composition {
    display: flex;
    flex-direction: column;
    gap: 9vw;
  }

  #top .composition > .text > p {
    font-size: 18px;
    line-height: 180%;
  }

  #top .view-more {
    justify-content: center;
    padding-left: 0;
  }

  #top .view-more > p {
    font-size: 18px;
  }

  /* ###### 概要 ###### */
  #top .about {
    padding-top: 30vw;
  }

  #top .recommend-container > h2 {
    font-size: 18px;
  }

  #top .recommend {
    gap: 2.67vw;
  }

  #top .recommend > a {
    height: 24.2vw;
    width: 42.5vw;
  }

  /* ###### 事業内容 ###### */
  #top.--en .service-image1 {
    top: 250vw;
  }

  #top.--en .service-image2 {
    top: 245vw;
  }

  /* ###### SDGs ###### */
  #top.--en
    .sdgs-container
    > .item-container
    > .item
    > .item-title-container
    > h2 {
    font-size: 3.18vw;
  }

  #top.--en .sdgs-container > .item-container > .item > p {
    font-size: 3.18vw;
  }

  /* -------------------------------------------
  service.php
  ------------------------------------------- */

  /* ###### 事業一覧 ###### */
  #service .media {
    height: 530px;
  }

  /* -------------------------------------------
  recruit.php
  ------------------------------------------- */

  /* ###### 概要 ###### */
  #recruit .summary > img {
    height: 100vw;
  }
}

@media screen and (width <= 540px) {
  .sp-show {
    display: block;
  }

  /* ===========================================
	フッターの設定
  =========================================== */
  .footer__info {
    align-items: center;
    flex-direction: column;
    justify-content: center;
  }

  footer > .badge_container > .kyoryoku-button {
    margin-bottom: 10px;
    border: #fff 6px double;
    padding: 15px;
    box-shadow: 4px 4px 4px rgb(0 0 0 / 25%);
  }

  footer > .badge_container > .kyoryoku-button > h3 {
    font-size: 18px;
    line-height: 18px;
    margin-bottom: 15px;
  }

  footer > .badge_container > .kyoryoku-button .description_container {
    column-gap: 10px;
    flex-wrap: wrap;
    width: 100%;
    justify-content: center;
  }

  footer > .badge_container > .kyoryoku-button p {
    font-size: 14px;
    line-height: 18px;
  }

  footer > .badge_container > .kyoryoku-button > small {
    margin-top: 10px;
    font-size: 14px;
  }

  /* ===========================================
	各ページ固有設定
  =========================================== */

  /* -------------------------------------------
  index.php
  ------------------------------------------- */

  /* ###### 共通部 ###### */
  #top.--en .section-title > h2 {
    font-size: 5.58vw;
  }

  /* ###### 事業内容 ###### */
  #top .service-image1 {
    top: 255vw;
  }

  #top .service-image2 {
    top: 250vw;
  }

  #top.--en .service-image1 {
    top: 265vw;
  }

  #top.--en .service-image2 {
    top: 260vw;
  }

  /* ###### SDGs ###### */
  #top.--en
    .sdgs-container
    > .item-container
    > .item
    > .item-title-container
    > h2 {
    font-size: 18px;
  }

  #top.--en .sdgs-container > .item-container > .item > p {
    font-size: 18px;
  }

  /* ###### SDGs ###### */

  /* #top .sdgs-container > h2 {
    font-size: 18px;
  }
  #top .sdgs-container > p {
    font-size: 16px;
  } */

  /* -------------------------------------------
  service.php
  ------------------------------------------- */
  #service.--en .media {
    height: 123vw;
  }

  #service.--en .no-image-media {
    height: 270px;
  }
}

@media screen and (width <= 480px) {
  /* ===========================================
	各ページ固有設定
  =========================================== */

  /* -------------------------------------------
  index.php
  ------------------------------------------- */

  /* ###### 事業内容 ###### */
  #top.--en .service-image1 {
    top: 285vw;
  }

  #top.--en .service-image2 {
    top: 280vw;
  }

  /* -------------------------------------------
  recruit.php
  ------------------------------------------- */

  /* ###### 概要 ###### */
  #recruit .summary > img {
    height: 110vw;
  }

  #recruit.--en .summary > img {
    height: 130vw;
  }

  /* -------------------------------------------
  service.php
  ------------------------------------------- */
  #service.--en .media {
    height: 135vw;
  }

  #service.--en .no-image-media {
    height: 290px;
  }
}

@media screen and (width <= 437px) {
  /* ===========================================
	各ページ固有設定
  =========================================== */

  /* -------------------------------------------
  index.php
  ------------------------------------------- */

  /* ###### 事業内容 ###### */
  #top .service-image1 {
    top: 265vw;
  }

  #top .service-image2 {
    top: 260vw;
  }

  #top.--en .service-image1 {
    top: 295vw;
  }

  #top.--en .service-image2 {
    top: 290vw;
  }

  /* ###### 概要 ###### */
  #recruit.--en .summary > img {
    height: 140vw;
  }
}

@media screen and (width <= 425px) {
  /* ===========================================
	各ページ固有設定
  =========================================== */

  /* -------------------------------------------
  index.php
  ------------------------------------------- */

  /* ###### 事業内容 ###### */
  #top .service-image1 {
    top: 275vw;
  }

  #top .service-image2 {
    top: 270vw;
  }

  #top.--en .service-image1 {
    top: 315vw;
  }

  #top.--en .service-image2 {
    top: 310vw;
  }
}

@media screen and (width <= 410px) {
  /* ===========================================
	各ページ固有設定
  =========================================== */

  /* -------------------------------------------
  index.php
  ------------------------------------------- */

  /* ###### 事業内容 ###### */
  #top .service-image1 {
    top: 285vw;
  }

  #top .service-image2 {
    top: 280vw;
  }

  /* -------------------------------------------
  service.php
  ------------------------------------------- */
  #service.--en .media {
    height: 155vw;
  }

  #service.--en .no-image-media {
    height: 310px;
  }

  /* -------------------------------------------
  recruit.php
  ------------------------------------------- */

  /* ###### 概要 ###### */
  #recruit .summary > img {
    height: 150vw;
  }
}

@media screen and (width <= 390px) {
  /* ===========================================
	フッターの設定
  =========================================== */
  footer > .footer__permission > p {
    font-size: 14px;
  }

  /* ===========================================
	各ページ固有設定
  =========================================== */

  /* -------------------------------------------
  index.php
  ------------------------------------------- */

  /* ###### 事業内容 ###### */
  #top.--en .service-image1 {
    top: 325vw;
  }

  #top.--en .service-image2 {
    top: 320vw;
  }

  /* -------------------------------------------
  recruit.php
  ------------------------------------------- */

  /* ###### 概要 ###### */
  #recruit.--en .summary > img {
    height: 170vw;
  }
}

@media screen and (width <= 375px) {
  /* ===========================================
	ヘッダーの設定
  =========================================== */
  #normal-header nav > .contact-button {
    padding-left: 7px;
    padding-right: 7px;
    width: 150px;
  }

  /* ===========================================
	各ページ固有設定
  =========================================== */

  /* -------------------------------------------
  index.php
  ------------------------------------------- */

  /* ###### 事業内容 ###### */
  #top.--en .service-image1 {
    top: 345vw;
  }

  #top.--en .service-image2 {
    top: 340vw;
  }

  /* -------------------------------------------
  company.php
  ------------------------------------------- */
  #company .permission__table-container > h3 {
    margin-bottom: 16px;
    margin-top: 25px;
  }

  /* -------------------------------------------
  service.php
  ------------------------------------------- */

  /* ###### 概要 ###### */
  #service .service-button-container > a {
    gap: 15px;
  }

  /* ###### 事業一覧 ###### */
  #service .service-intro {
    padding-top: 15vw;
  }

  #service .business-domain > h2 {
    padding-top: 15vw;
  }

  /* -------------------------------------------
  recruit.php
  ------------------------------------------- */

  /* ###### 概要 ###### */
  #recruit .summary > img {
    height: 180vw;
  }

  /* ###### 採用情報一覧 ###### */
  #recruit .recruit-case {
    padding-left: 16px;
    padding-right: 16px;
  }

  /* -------------------------------------------
  contact-sanpai.php
  ------------------------------------------- */

  /* ###### お電話・LINEでのお問い合わせ ###### */
  #contact-sanpai .phone-number-pref {
    font-size: 20px;
  }

  #contact-sanpai .phone-number {
    font-size: 30px;
  }

  #contact-sanpai .line-container > img {
    display: none;
  }

  /* -------------------------------------------
  contact-other.php
  ------------------------------------------- */
  #contact-other .phone {
    padding-left: 16px;
    padding-right: 16px;
  }

  #contact-other .phone-container {
    padding-left: 16px;
    padding-right: 16px;
    width: auto;
  }

  #contact-other .phone-number-container {
    gap: 5px;
  }

  #contact-other .phone-number-pref {
    font-size: 20px;
  }

  #contact-other .phone-number {
    font-size: 30px;
  }

  #contact-other .phone-info-container {
    padding-left: 16px;
    padding-right: 16px;
    width: auto;
  }
}

/* ===========================================
===========================================
  header-lp.php
===========================================
=========================================== */
#lp-header {
  display: flex;
  justify-content: center;
  padding: 20px 40px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
}

#lp-header .header_inner {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 1145px;
}

#lp-header .top_container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#lp-header .header_logo {
  height: 45px;
  width: 100%;
  background-image: url("images/header_logo.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
  position: relative;
  z-index: 3;
}

#lp-header .header_logo.is-active {
  background-image: url("images/header_logo-white.webp");
}

#lp-header .tagline.is-active {
  color: #fff;
  position: relative;
  z-index: 4;
}

#lp-header .button_container {
  display: flex;
  gap: 10px;
}

#lp-header .button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  height: 75px;
  border-radius: 6px;
  color: #fff;
  padding-left: 12px;
  padding-right: 12px;
  padding-bottom: 2px;
  box-shadow: 1px 5px 5px rgb(0 0 0 / 20%);
}

#lp-header .button > .text_container {
  display: flex;
  flex-direction: column;
  gap: 2px;
  justify-content: center;
  align-items: center;
}

#lp-header .button > .icon {
  width: 30px;
  height: auto;
}

#lp-header .button > .arrow--nonStick {
  width: 10px;
}

#lp-header .button > .text_container > small {
  font-size: 13px;
  font-weight: 400;
  margin-top: 3px;
}

#lp-header .button > .text_container > p {
  font-size: 20px;
  font-weight: var(--font-weight600);
  letter-spacing: 0.05em;
  margin-bottom: -3px;
}

#lp-header .button.--phone {
  background-color: #ff9d23;
}

#lp-header .button.--line {
  background-color: #00c300;
}

#lp-header .button.--mail {
  background: linear-gradient(to right, #005bac, #54c3f1);
}

#lp-header nav {
  display: flex;
  width: 100%;
  height: 42px;
}

#lp-header nav .pc-list {
  display: table;
  table-layout: fixed;
  list-style-type: none;
  justify-content: space-between;
  width: 100%;
}

#lp-header nav .pc-list:first-child {
  border-left: 1px solid #c2c9cd;
}

#lp-header nav .pc-list > li {
  display: table-cell;
  vertical-align: middle;
  align-items: center;
  border-right: 1px solid #c2c9cd;
  word-wrap: break-word;
  height: 100%;
}

#lp-header nav .pc-list > li > a {
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  font-size: 18px;
  letter-spacing: 0.11em;
}

#lp-header .hamburger-menu {
  display: none;
}

@media screen and (width <= 1185px) {
  #lp-header .header_inner {
    width: 1000px;
  }
}

@media screen and (width <= 1050px) {
  #lp-header {
    padding: 20px 16px;
  }

  #lp-header .header_inner {
    flex-direction: row;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    align-items: center;
  }

  #lp-header .header_logo {
    width: 215px;
  }

  #lp-header .tagline {
    font-size: 14px;
  }

  #lp-header nav {
    justify-content: end;
  }

  #lp-header nav > .pc-list {
    display: none;
  }

  #lp-header .button_container {
    display: none;
  }

  #lp-header .hamburger-button {
    background-image: url("images/hamburger-icon.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40px;
    border-radius: 5px;
    display: block;
    height: 50px;
    width: 50px;
    z-index: 3;
  }

  #lp-header .hamburger-button:hover {
    background-color: var(--bg-gray-color);
    cursor: pointer;
  }

  #lp-header .hamburger-button.is-active {
    color: white;
  }

  #lp-header .hamburger-button:hover.is-active {
    color: white;
  }

  #lp-header .hamburger-menu {
    background-color: rgb(9 47 73 / 98%);
    display: none;
    height: 100vh;
    left: 0;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 2;
    padding-top: 160px;
    overflow: hidden auto; /* メニュー内はスクロール可能 */ /* 横スクロールを防止 */
    transform: translateX(100%);
  }

  #lp-header .hamburger-menu.is-active {
    display: flex;
    flex-direction: column;
    gap: 60px;
    transform: translateX(0);
  }

  #lp-header .hamburger-menu .bogo-language-switcher {
    display: flex;
    flex-direction: column;
    gap: 30px;
  }

  #lp-header .hamburger-menu > ul {
    color: white;
    font-size: 20px;
    margin-left: 50px;
    margin-right: 50px;
    width: 100%;
  }

  #lp-header .hamburger-menu > ul > li {
    border-bottom: white 1px solid;
  }

  #lp-header .hamburger-menu > ul > li > a {
    display: block;
    height: 100%;
    padding-bottom: 20px;
    padding-top: 20px;
    width: 100%;
  }

  #lp-header .hamburger-menu .bogo-language-switcher > li > span {
    padding-bottom: 20px;
  }
}

/* ===========================================
===========================================
  footer-lp.php
===========================================
=========================================== */
#lp-footer {
  padding-bottom: 180px;
}

@media screen and (width <= 992px) {
  #lp-footer {
    padding-bottom: 140px;
  }
}

/* ===========================================
===========================================
	lp.php
===========================================
=========================================== */

/* ###### 共通 ###### */
#lp h2 {
  font-family: "Noto Serif JP", serif;
  font-size: 40px;
  text-align: center;
  font-weight: var(--font-weight600);
  line-height: 55px;
}

#lp section {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding-left: 16px;
  padding-right: 16px;
}

#lp .section-inner {
  display: flex;
  flex-direction: column;
  gap: 64px;
  padding-top: 64px;
  padding-bottom: 75px;
  align-items: center;
  width: 960px;
}

#lp img.--sp {
  display: none;
}

@media screen and (width <= 992px) {
  #lp h2 {
    font-size: 20px;
    line-height: 30px;
  }

  #lp section {
    padding-left: 0;
    padding-right: 0;
  }

  #lp .section-inner {
    gap: 30px;
    padding: 30px 16px 50px;
    width: 100%;
  }

  #lp img.--pc {
    display: none;
  }

  #lp img.--sp {
    display: block;
  }
}

/* ###### メインビジュアル ###### */
#lp {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
}

#lp .main-visual {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("images/lp-mv-background-image.webp");
  background-size: 100%;
  padding: 73px 16px;
  color: #fff;
}

#lp .main-visual .main-visual_inner {
  display: flex;
  flex-direction: column;
  gap: 54px;
  background-color: rgb(58 130 163 / 95%);
  padding: 44px 40px 54px;
  position: relative;
}

#lp .main-visual .title_container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 25px;
}

#lp .main-visual .title-region {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: black;
  padding: 10px 23px 15px;
  font-size: 31px;
  font-weight: var(--font-weight600);
  letter-spacing: 0.11em;
}

#lp .main-visual .title_container > strong {
  font-weight: var(--font-weight800);
  font-size: 55px;
  text-shadow: rgb(0 0 0 / 39%) 4px 4px 1px;
  letter-spacing: 0.11em;
  line-height: 74px;
}

#lp .main-visual .title_container > strong > span {
  font-size: 70px;
  color: #f5d77f;
}

#lp .main-visual .description_container {
  display: flex;
  gap: 41px;
  align-items: end;
}

#lp .main-visual .point_container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

#lp .main-visual .point_inner {
  display: flex;
  gap: 17px;
}

#lp .main-visual .point-box {
  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: center;
  gap: 21px;
  padding: 20px 10px;
  background-image: url("images/lp-mv-point-background-image.webp");
  background-size: contain;
  background-repeat: no-repeat;
  width: 200px;
  height: 187px;
  color: #000;
  font-size: 26px;
  font-weight: 500;
  position: relative;
}

#lp .main-visual .point-box > img {
  width: 68px;
  height: auto;
}

#lp .main-visual .point-box > p {
  text-align: center;
  letter-spacing: 0.11em;
}

#lp .main-visual .point-box > .attension {
  position: absolute;
  font-size: 12px;
  top: 90px;
  right: 16px;
}

#lp .main-visual .description_container > img {
  width: 395px;
  height: 297px;
  border-color: #fff;
  border-width: 6px;
}

#lp .main-visual .main-visual_inner > .circle {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  width: 172px;
  height: 172px;
  border-radius: 50%;
  position: absolute;
  top: 25px;
  right: 35px;
}

#lp .main-visual .main-visual_inner > .circle > p {
  color: #000;
  font-size: 22px;
  letter-spacing: 0.11em;
  font-weight: 500;
  text-align: center;
}

@media screen and (width <= 1185px) {
  #lp .main-visual {
    padding: 33px 16px;
  }

  #lp .main-visual .main-visual_inner {
    gap: 34px;
    padding: 34px 25px 44px;
  }

  #lp .main-visual .title_container > strong {
    font-size: 40px;
    line-height: 59px;
  }

  #lp .main-visual .title_container > strong > span {
    font-size: 50px;
  }

  #lp .main-visual .description_container {
    gap: 25px;
  }

  #lp .main-visual .point_inner {
    gap: 6px;
  }

  #lp .main-visual .point-box {
    width: 175px;
    height: 165px;
    font-size: 20px;
  }

  #lp .main-visual .point-box > img {
    width: 55px;
  }

  #lp .main-visual .description_container > img {
    width: 350px;
    height: 267px;
  }

  #lp .main-visual .main-visual_inner > .circle {
    width: 152px;
    height: 152px;
  }
}

@media screen and (width <= 992px) {
  #lp .main-visual {
    padding: 16px 0;
    background-image: url("images/lp-mv-background-image--sp.webp");
  }

  #lp .main-visual .main-visual_inner {
    padding: 22px 10px;
  }

  #lp .main-visual .title_container {
    gap: 20px;
  }

  #lp .main-visual .title-region {
    padding: 8px 15px;
    font-size: 19px;
  }

  #lp .main-visual .title_container > strong {
    font-size: 18px;
    line-height: 151%;
    letter-spacing: 0.07em;
    text-shadow: rgb(0 0 0 / 39%) 2px 2px 1px;
  }

  #lp .main-visual .title_container > strong > span {
    font-size: 27px;
  }

  #lp .main-visual .point_container small {
    font-size: 12px;
  }

  #lp .main-visual .point_container {
    gap: 10px;
  }

  #lp .main-visual .description_container {
    display: flex;
    flex-direction: column-reverse;
    align-items: start;
    gap: 20px;
  }

  #lp .main-visual .point-box {
    gap: 7px;
    padding: 14px 10px;
    width: 104px;
    height: 95px;
    font-size: 12px;
  }

  #lp .main-visual .point-box > img {
    width: 34px;
  }

  #lp .main-visual .point-box > .attension {
    font-size: 10px;
    top: 40px;
    right: 10px;
  }

  #lp .main-visual .description_container > img {
    width: 209px;
    height: 157px;
  }

  #lp .main-visual .main-visual_inner > .circle {
    width: 102px;
    height: 102px;
    top: 150px;
    right: 10px;
  }

  #lp .main-visual .main-visual_inner > .circle > p {
    font-size: 14px;
  }
}

/* ###### 産廃処理でこんなお悩みありませんか？ ###### */
#lp .worries {
  background-color: #dce1e5;
}

#lp .worries .worries_container {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

#lp .worries .worries_box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 25px;
}

#lp .worries .worries-text_container {
  position: relative;
  background-image: url("images/onayami-background-image.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 210px;
  height: 122px;
  display: block;
}

#lp .worries .worries-text_container.--middle {
  background-image: url("images/onayami-background-image--middle.webp");
  width: 225px;
}

#lp .worries .worries-text_container.--large {
  background-image: url("images/onayami-background-image--large.webp");
  width: 243px;
}

#lp .worries .worries_box img {
  width: 210px;
  height: 134px;
  object-fit: cover;
}

#lp .worries .worries-text_container p {
  position: absolute;
  width: 100%;
  top: 37%;
  left: 50%;
  text-align: center;
  transform: translate(-50%, -50%);
  font-size: 16px;
  line-height: 23px;
}

@media screen and (width <= 992px) {
  #lp .worries .worries_container {
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
  }

  #lp .worries .worries-text_container {
    width: 155px;
    height: 100px;
  }

  #lp .worries .worries_box {
    gap: 15px;
  }

  #lp .worries .worries-text_container.--middle {
    background-image: url("images/onayami-background-image--middle.webp");
    width: 155px;
  }

  #lp .worries .worries-text_container.--large {
    background-image: url("images/onayami-background-image--large.webp");
    width: 160px;
  }

  #lp .worries .worries-text_container p {
    top: 37%;
    left: 50%;
    font-size: 12px;
    line-height: 18px;
  }

  #lp .worries .worries_box img {
    width: 155px;
    height: 100px;
  }
}

/* ###### 産業廃棄物とは、
事業活動から出る廃棄物です ###### */

#lp .about-sanpai .description_container {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  padding: 20px 30px 40px;
  border: 3px solid #1c425c;
}

#lp .about-sanpai .description_container h3 {
  margin-top: 20px;
  font-size: 25px;
  font-weight: var(--font-weight600);
}

#lp .about-sanpai .description_container .description_container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

#lp .about-sanpai .description_container p {
  padding-top: 10px;
  font-size: 20px;
  letter-spacing: 0.11em;
  line-height: 29px;
}

#lp .about-sanpai a {
  color: #1488ed;
}

@media screen and (width <= 992px) {
  #lp .about-sanpai .description_container {
    gap: 15px;
    padding: 5px 16px 32px;
    border: 2px solid #1c425c;
  }

  #lp .about-sanpai .description_container h3 {
    font-size: 18px;
    line-height: 27px;
  }

  #lp .about-sanpai .description_container p {
    padding-top: 0;
    font-size: 14px;
    line-height: 22px;
  }
}

/* ###### 東京・埼玉・群馬・栃木の産業廃棄物処理なら
業界歴18年の「株式会社リステムネットワーク」 ###### */
#lp .company-introduction {
  color: #fff;
  background-image: url("images/company-introduction-bg-img.webp");
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: auto;
}

#lp .company-introduction h1 {
  font-family: "Noto Serif JP", serif;
  font-size: 40px;
  text-align: center;
  font-weight: 600;
  line-height: 55px;
}

#lp .company-introduction p {
  font-size: 20px;
  letter-spacing: 0.11em;
  line-height: 29px;
  font-weight: 300;
}

@media screen and (width <= 992px) {
  #lp .company-introduction {
    background-size: cover;
    background-image: url("images/company-introduction-bg-img--sp.webp");
  }

  #lp .company-introduction h1 {
    font-size: 20px;
    line-height: 30px;
  }

  #lp .company-introduction p {
    font-size: 14px;
    line-height: 22px;
  }
}

/* ###### 当サービスが選ばれる4つの理由 ###### */
#lp .reason .reason_container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 15px;
}

#lp .reason .reason-box {
  width: 472px;
  min-height: 484px;
  border-color: #1c425c;
  border-width: 7px;
}

#lp .reason .reason-box .title_container {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 20px 15px;
  background-color: #1c425c;
  color: #fff;
  font-size: 25px;
  font-weight: var(--font-weight700);
  letter-spacing: 0.11em;
}

#lp .reason .reason-box span {
  font-size: 45px;
}

#lp .reason .reason-box h3 {
  width: 100%;
  text-align: center;
}

#lp .reason .reason-box .description_container {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 25px;
}

#lp .reason .reason-box .description_container p {
  letter-spacing: 0.11em;
}

#lp .reason .reason-box img {
  width: 100%;
  height: 252px;
  object-fit: cover;
}

@media screen and (width <= 992px) {
  #lp .reason .reason_container {
    justify-content: center;
    row-gap: 15px;
  }

  #lp .reason .reason-box {
    width: 328px;
    min-height: 300px;
  }

  #lp .reason .reason-box .title_container {
    gap: 10px;
    padding: 6px 20px 15px;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.11em;
  }

  #lp .reason .reason-box span {
    font-size: 30px;
  }

  #lp .reason .reason-box .description_container {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 16px 16px 32px;
  }

  #lp .reason .reason-box .description_container p {
    font-size: 14px;
    line-height: 22px;
  }

  #lp .reason .reason-box img {
    width: 100%;
    height: 170px;
  }
}

/* ###### 産廃処理全体の適正化・リサイクル率向上
に関する無償コンサルティング ###### */
#lp .consulting .media_container {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 10px;
}

#lp .consulting .media {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
  padding: 20px 30px;
  border-width: 6px;
  border-color: #1c425c;
}

#lp .consulting .media h3 {
  font-size: 22px;
  font-weight: var(--font-weight600);
}

#lp .consulting .media .description_container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

#lp .consulting .media img {
  width: 229px;
  height: 173px;
}

#lp .consulting .media p {
  font-size: 18px;
}

@media screen and (width <= 992px) {
  #lp .consulting .media {
    flex-direction: column;
    gap: 16px;
    padding: 16px;
  }

  #lp .consulting .media h3 {
    font-size: 16px;
  }

  #lp .consulting .media .description_container {
    gap: 16px;
  }

  #lp .consulting .media p {
    font-size: 14px;
    line-height: 22px;
  }
}

/* ###### メディア掲載実績 ###### */
#lp .achievements .achievements_container {
  display: flex;
  flex-direction: column;
  gap: 30px;
  width: 100%;
}

#lp .achievements .achievements_container > img {
  width: 100%;
  height: auto;
}

/* ###### シンプルでお得な料金表 ###### */
#lp .price {
  background-color: #f6f6f6;
}

#lp .price .price-list_container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: 100%;
}

#lp .price .price-list_container > p {
  text-align: center;
}

#lp .price h3 {
  font-size: 25px;
  font-weight: var(--font-weight600);
}

#lp .price table {
  table-layout: fixed;
  width: 100%;
}

#lp .price table,
th,
td {
  border: 2px solid #000;
  padding: 20px;
  font-weight: var(--font-weight600);
}

#lp .price table th {
  background-color: #d9d9d9;
  text-align: center;
}

#lp .price table td {
  background-color: #fff;

  /* vertical-align: middle */
}

#lp .price table .forward {
  width: 599px;
}

#lp .price table h4 {
  font-size: 21px;
  font-weight: var(--font-weight600);
  padding-bottom: 10px;
}

#lp .price table .forward p {
  padding-left: 24px;
  line-height: 23px;
  font-weight: var(--font-weight500);
}

#lp .price table .forward img {
  padding-left: 24px;
  width: 80%;
  margin-top: 16px;
  height: auto;
  max-width: 200px;
}

#lp .price table .backward {
  text-align: center;
  background-color: #fe0;
  vertical-align: middle;
}

#lp .price table .backward p {
  font-size: 28px;
  font-weight: var(--font-weight600);
  color: red;
}

#lp .price table .backward small {
  display: block;
  font-size: 18px;
  line-height: 30px;
  width: 100%;
  text-align: center;
}

#lp .price table .backward img {
  width: 80%;
  margin-top: 16px;
  height: auto;
}

#lp .price table .backward .red-text {
  font-weight: var(--font-weight600);
  font-size: 16px;
  color: red;
}

#lp .price .price-list_container small {
  width: 100%;
  font-size: 16px;
  line-height: 25px;
}

#lp .price .price-list_container > .description {
  line-height: 25px;
  padding-top: 30px;
  padding-bottom: 30px;
}

#lp .price .image-box_container {
  display: flex;
  position: relative;
  width: 100%;
  border-color: #000;
  border-width: 3px;
  border-radius: 15px;
  padding-left: 40px;
  padding-right: 40px;
}

#lp .price .image-box_container > p {
  position: absolute;
  background-color: #f6f6f6;
  padding: 0 20px;
  font-size: 30px;
  font-weight: var(--font-weight600);
  top: -5px;
  left: 50%;
  transform: translate(-50%, -50%);
}

#lp .price .image-box_inner {
  display: flex;
  gap: 40px;
  justify-content: center;
  width: 100%;
}

#lp .price .image-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 286px;
  padding: 40px 0 30px;
}

#lp .price .image-box > img {
  min-width: 170px;
  height: auto;
  object-fit: cover;
}

#lp .price .image-box p {
  font-size: 20px;
  font-weight: var(--font-weight600);
}

@media screen and (width <= 992px) {
  #lp .price h3 {
    font-size: 18px;
    font-weight: 600;
  }

  #lp .price table,
  th,
  td {
    border: 1px solid #000;
    padding: 20px 10px;
  }

  #lp .price table th {
    font-size: 14px;
  }

  #lp .price table .forward {
    width: 200px;
  }

  #lp .price table h4 {
    font-size: 14px;
    font-weight: 600;
  }

  #lp .price table .forward p {
    padding-left: 5px;
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
  }

  #lp .price table .backward p {
    font-size: 14px;
    line-height: 22px;
  }

  #lp .price table .backward .red-text {
    font-size: 12px;
  }

  #lp .price table .backward small {
    font-size: 12px;
    line-height: 15px;
  }

  #lp .price .price-list_container small {
    font-size: 12px;
    line-height: 15px;
  }

  #lp .price .price-list_container > .description {
    font-size: 14px;
    line-height: 22px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  #lp .price .image-box_container {
    border: 0 #000 solid;
    border-top: 3px #000 solid;
    border-radius: 0;
  }

  #lp .price .image-box_container > p {
    font-size: 18px;
  }

  #lp .price .image-box p {
    font-size: 16px;
    font-weight: 600;
  }

  #lp .price .image-box small {
    font-size: 12px;
  }

  #lp .price .section-inner > p {
    font-size: 14px;
    line-height: 22px;
  }
}

@media screen and (width <= 760px) {
  #lp .price .image-box_inner {
    gap: 10px;
  }

  #lp .price .image-box {
    gap: 10px;
    width: 286px;
  }
}

@media screen and (width <= 563px) {
  #lp .price .image-box_container {
    padding: 0;
  }

  #lp .price .image-box_inner {
    overflow-x: scroll;
    justify-content: start;
  }

  .scrollbar::-webkit-scrollbar {
    width: 10px;
    height: 4px;
  }

  .scrollbar-thumb-rounded::-webkit-scrollbar-thumb {
    border-radius: 0;
  }

  .scrollbar-thumb-black::-webkit-scrollbar-thumb {
    --bg-opacity: 1;

    background-color: rgb(167 167 167);
  }
}

/* ###### サービス対象のエリア ###### */
#lp .area .area-box_container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 30px;
}

#lp .area .area-box_container > p {
  width: 100%;
  text-align: center;
  font-size: 22px;
}

#lp .area .area-box {
  display: flex;
  flex-direction: column;
  gap: 13px;
}

#lp .area .area-box h3 {
  font-size: 25px;
  font-weight: var(--font-weight600);
}

#lp .area .area-box p {
  font-size: 18px;
  line-height: 25px;
  letter-spacing: 0.05em;
}

@media screen and (width <= 992px) {
  #lp .area .area-box h3 {
    font-size: 20px;
    font-weight: 600;
  }

  #lp .area .area-box p {
    font-size: 14px;
    line-height: 22px;
  }
}

/* ###### 産廃回収までの 3 STEP ###### */
#lp .step {
  background-color: #f6f6f6;
}

#lp .step .media-container {
  display: flex;
  flex-direction: column;
  gap: 37px;
  width: 100%;
}

#lp .step .media {
  display: flex;
  background-color: #fff;
  width: 100%;
  position: relative;
  padding: 37px 27px 20px;
}

#lp .step .media .title_container {
  display: flex;
  gap: 20px;
  align-items: center;
  position: absolute;
  top: -20px;
  left: 20px;
  font-weight: var(--font-weight600);
}

#lp .step .media .title_container span {
  color: #0966b3;
  font-size: 32px;
}

#lp .step .media .title_container h3 {
  font-size: 25px;
}

#lp .step .media .description-container {
  display: flex;
  gap: 30px;
}

#lp .step .media .description-container > img {
  width: 220px;
  height: 148px;
}

#lp .step .media .description-container > p {
  font-size: 18px;
  line-height: 26px;
}

@media screen and (width <= 992px) {
  #lp .step .media-container {
    padding-top: 15px;
  }

  #lp .step .media .title_container {
    top: -15px;
    left: 20px;
    font-weight: var(--font-weight600);
  }

  #lp .step .media .title_container span {
    font-size: 25px;
  }

  #lp .step .media .title_container h3 {
    font-size: 18px;
  }

  #lp .step .media .description-container {
    flex-direction: column;
    align-items: center;
  }

  #lp .step .media .description-container > p {
    font-size: 14px;
    line-height: 23px;
  }
}

/* ###### ご依頼前の注意点 ###### */
#lp .note .description_container {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #fff;
  width: 100%;
  padding-top: 20px;
  padding-bottom: 20px;
  font-size: 18px;
  line-height: 26px;
  border: #000 3px solid;
}

@media screen and (width <= 992px) {
  #lp .note .description_container {
    font-size: 14px;
    line-height: 22px;
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* ###### 2025年、産廃処理方法の見直しが必要な３つの理由 ###### */
#lp .switch-reason {
  background-color: #f6f6f6;
}

#lp .switch-reason .switch-box_container {
  display: flex;
  flex-direction: column;
  gap: 37px;
}

#lp .switch-reason .switch-box {
  display: flex;
  flex-direction: column;
  gap: 16px;
  font-size: 20px;
}

#lp .switch-reason .switch-box h3 {
  font-weight: var(--font-weight600);
}

#lp .switch-reason .switch-box p {
  line-height: 1.7em;
}

@media screen and (width <= 992px) {
  #lp .switch-reason .switch-box_container {
    gap: 25px;
  }

  #lp .switch-reason .switch-box {
    gap: 10px;
    font-size: 14px;
  }
}

/* ###### 違法業者には注意！委託した廃棄物が不法投棄された場合、現状回復に数億円負担のリスクも ###### */
#lp .attention {
  background-color: #e7e7e7;
}

#lp .attention .description_container {
  display: flex;
  flex-direction: column;
  font-size: 20px;
  line-height: 1.7em;
  gap: 24px;
}

#lp .attention .image_container {
  display: flex;
  justify-content: space-between;
}

#lp .attention .image_container > img {
  width: 48%;
  height: auto;
}

@media screen and (width <= 992px) {
  #lp .attention h2 {
    font-size: 18px;
  }

  #lp .attention .description_container {
    gap: 16px;
    font-size: 14px;

    /* line-height: 1.5em; */
  }
}

/* ###### よくある質問 ###### */
#lp .q-and-a .q-and-a_container {
  display: flex;
  flex-direction: column;
  gap: 30px;
  width: 100%;
}

#lp .q-and-a .q-and-a_container > span {
  width: 100%;
  height: 1px;
  background-color: #000;
}

#lp .q-and-a .q-and-a-box {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-left: 15px;
}

#lp .q-and-a .q-and-a-box .q_container {
  display: flex;
  gap: 25px;
  font-size: 25px;
  font-weight: var(--font-weight600);
}

#lp .q-and-a .q-and-a-box .q_container > span {
  margin-top: -8px;
  font-size: 35px;
}

#lp .q-and-a .q-and-a-box .a_container {
  display: flex;
  gap: 32px;
  padding-left: 7px;
  font-size: 18px;
}

#lp .q-and-a .q-and-a-box .a_container a {
  color: #1488ed;
}

@media screen and (width <= 992px) {
  #lp .q-and-a .q-and-a_container {
    gap: 16px;
    width: 100%;
  }

  #lp .q-and-a .q-and-a-box {
    gap: 10px;
  }

  #lp .q-and-a .q-and-a-box .q_container {
    gap: 16px;
    font-size: 16px;
  }

  #lp .q-and-a .q-and-a-box .q_container > span {
    margin-top: -3px;
    font-size: 20px;
  }

  #lp .q-and-a .q-and-a-box .a_container {
    gap: 20px;
    font-size: 14px;
    padding-left: 5px;
    line-height: 22px;
  }
}

/* ###### 代表紹介 ###### */
#lp .ceo-introduction {
  background-color: #f6f6f6;
}

#lp .ceo-introduction .box_container {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

#lp .ceo-introduction .ceo-box {
  display: flex;
  justify-content: center;
  gap: 47px;
  width: 100%;
  background-color: #fff;
  padding: 30px 0;
}

#lp .ceo-introduction .ceo-box > img {
  width: 245px;
  height: 245px;
}

#lp .ceo-introduction .ceo-box .description_container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

#lp .ceo-introduction .ceo-box .description_container h3 {
  font-size: 25px;
  font-weight: var(--font-weight600);
}

#lp .ceo-introduction .ceo-box .description_container p {
  font-size: 18px;
  line-height: 25px;
}

#lp .ceo-introduction .message-box {
  display: flex;
  flex-direction: column;
  gap: 30px;
  background-color: #fff;
  font-size: 18px;
  padding: 30px 60px 60px;
}

#lp .ceo-introduction .message-box h3 {
  width: 100%;
  font-size: 30px;
  font-weight: var(--font-weight600);
  text-align: center;
}

#lp .ceo-introduction .message-box h4 {
  font-size: 20px;
  font-weight: var(--font-weight600);
}

#lp .ceo-introduction .message-box p {
  padding-left: 20px;
  line-height: 28px;
}

@media screen and (width <= 992px) {
  #lp .ceo-introduction .ceo-box {
    flex-direction: column;
    align-items: center;
    padding-left: 16px;
    padding-right: 16px;
  }

  #lp .ceo-introduction .ceo-box .description_container h3 {
    font-size: 16px;
  }

  #lp .ceo-introduction .ceo-box .description_container p {
    font-size: 14px;
    line-height: 22px;
  }

  #lp .ceo-introduction .message-box {
    gap: 20px;
    padding: 20px 16px 30px;
  }

  #lp .ceo-introduction .message-box h3 {
    font-size: 23px;
  }

  #lp .ceo-introduction .message-box h4 {
    font-size: 16px;
    line-height: 23px;
  }

  #lp .ceo-introduction .message-box p {
    padding-left: 10px;
    font-size: 14px;
    line-height: 22px;
  }
}

/* ###### {地域}について ###### */
#lp .resion {
  background-color: #f6f6f6;
}

#lp .resion .description_container {
  display: flex;
  flex-direction: column;
  gap: 12px;
  background-color: #fff;
  padding: 35px 70px;
}

#lp .resion h3 {
  font-size: 20px;
  font-weight: var(--font-weight600);
}

#lp .resion p {
  font-size: 18px;
  line-height: 27px;
}

@media screen and (width <= 992px) {
  #lp .resion .description_container {
    padding: 25px 16px;
  }

  #lp .resion h3 {
    font-size: 18px;
  }

  #lp .resion p {
    font-size: 14px;
    line-height: 22px;
  }
}

/* ===========================================
===========================================
	includes/cv-area.php
===========================================
=========================================== */

/* ###### お問い合わせ ###### */
#lp .cv-area {
  background-color: #e9f3fa;
}

#lp .cv-area > .section-inner > p {
  width: 100%;
  text-align: center;
}

#lp .cv-area .annotation {
  background-color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding-top: 38px;
  padding-bottom: 38px;
  font-size: 25px;
  font-weight: 400;
  letter-spacing: 0.11em;
  line-height: 35px;
  text-align: center;
}

#lp .cv-area .cv-button_container {
  display: flex;
  flex-direction: column;
  gap: 35px;
  width: 100%;
}

#lp .cv-area .cv-button_inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

#lp .cv-area .cv-button-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
}

#lp .cv-area .cv-button-box > p {
  font-size: 20px;
}

#lp .cv-area .cv-button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 436.96px;
  height: 115px;
  padding-left: 24px;
  padding-right: 15px;
  color: white;
  box-shadow: 1px 5px 5px 0 rgb(0 0 0 / 40%);
  border-radius: 6px;
}

#lp .cv-area .cv-button.--orange {
  background: linear-gradient(to right, #ff9d23, #ffbe19);
}

#lp .cv-area .cv-button.--green {
  background: #00c300;
}

#lp .cv-area .cv-button.--blue {
  background: linear-gradient(to right, #005bac, #54c3f1);
}

#lp .cv-area .cv-button > .icon {
  width: 65px;
  height: auto;
}

#lp .cv-area .cv-button > .arrow--nonStick {
  width: 17px;
}

#lp .cv-area .cv-button .text_continer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  font-size: 23px;
  font-weight: var(--font-weight700);
  padding-bottom: 5px;
}

#lp .cv-area .cv-button.--orange .text_continer p {
  font-size: 37px;
  letter-spacing: 0.09em;
}

#lp .cv-area .cv-button .text_continer span {
  font-size: 45px;
}

#lp .cv-area .cv-button .text_continer small {
  font-size: 18px;
  font-weight: 400;
}

@media screen and (width <= 992px) {
  #lp .cv-area > .section-inner > p {
    font-size: 12px;
  }

  #lp .cv-area .cv-button_container {
    gap: 25px;
    width: 100%;
  }

  #lp .cv-area .annotation {
    padding: 16px;
    font-size: 14px;
    line-height: 20px;
    width: 100%;
    letter-spacing: 0;
  }

  #lp .cv-area .cv-button_inner {
    flex-direction: column;
    justify-content: space-between;
    gap: 25px;
  }

  #lp .cv-area .cv-button-box > p {
    font-size: 16px;
  }

  #lp .cv-area .cv-button {
    width: 328px;
    height: 75px;
    padding-left: 16px;
    padding-right: 10px;
  }

  #lp .cv-area .cv-button > .icon {
    width: 36px;
  }

  #lp .cv-area .cv-button > .arrow--nonStick {
    width: 15px;
  }

  #lp .cv-area .cv-button .text_continer {
    gap: 7px;
    font-size: 23px;
    padding-bottom: 5px;
  }

  #lp .cv-area .cv-button.--orange .text_continer p {
    font-size: 25px;
  }

  #lp .cv-area .cv-button .text_continer span {
    font-size: 30px;
  }

  #lp .cv-area .cv-button .text_continer small {
    font-size: 14px;
  }
}

/* ===========================================
===========================================
	includes/cv-area.php
===========================================
=========================================== */

#lp .campaign-area {
  background-color: #e9f3fa;
}

#lp .campaign-area .section-inner {
  gap: 20px;
  padding-bottom: 0;
}

#lp .campaign-area .campaign-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  background-image: url("images/campaign-card-background.webp");
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
  padding-top: 15px;
  padding-bottom: 25px;
  gap: 10px;
}

#lp .campaign-area .campaign-card h2 {
  font-family: "Noto Sans JP", sans-serif;
  color: red;
  font-size: 30px;
  font-weight: var(--font-weight700);
  text-shadow:
    1px 1px 0 #fff,
    -1px -1px 0 #fff,
    -1px 1px 0 #fff,
    1px -1px 0 #fff,
    0 1px 0 #fff,
    0-1px 0 #fff,
    -1px 0 0 #fff,
    1px 0 0 #fff;
}

#lp .campaign-area .campaign-card h2 > span {
  text-decoration: underline;
}

#lp .campaign-area .campaign-card .description_container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

#lp .campaign-area .campaign-card .description_container > small {
  font-size: 18px;
}

#lp .campaign-area .campaign-card .description_container > small > strong {
  font-size: 20px;
}

#lp .campaign-area .campaign-card .main-text_container {
  display: flex;
  flex-direction: column;
  align-items: end;
}

#lp .campaign-area .campaign-card .main-text_container > p {
  font-size: 25px;
  font-weight: var(--font-weight700);
  text-shadow:
    1px 1px 0 #fff,
    -1px -1px 0 #fff,
    -1px 1px 0 #fff,
    1px -1px 0 #fff,
    0 1px 0 #fff,
    0-1px 0 #fff,
    -1px 0 0 #fff,
    1px 0 0 #fff;
}

#lp .campaign-area .campaign-card .main-text_container > p > span {
  font-size: 65px;
  color: red;
}

#lp .campaign-area .campaign-card .main-text_container > em {
  font-style: normal;
  color: red;
  font-weight: var(--font-weight700);
  text-shadow:
    0.5px 0.5px 0 #fff,
    -0.5px -0.5px 0 #fff,
    -0.5px 0.5px 0 #fff,
    0.5px -0.5px 0 #fff,
    0 0.5px 0 #fff,
    0-0.5px 0 #fff,
    -0.5px 0 0 #fff,
    0.5px 0 0 #fff;
}

#lp .campaign-area .attention_container {
  font-size: 12px;
}

#lp .campaign-area > p {
  padding-top: 16px;
  padding-left: 16px;
  padding-right: 16px;
}

@media screen and (width <= 992px) {
  #lp .campaign-area .section-inner {
    gap: 10px;
  }

  #lp .campaign-area .campaign-card {
    background-size: cover;
    padding-left: 16px;
    padding-right: 16px;
    gap: 20px;
    background-image: url("images/campaign-card-background--sp.webp");
  }

  #lp .campaign-area .campaign-card h2 {
    font-size: 20px;
    line-height: 25px;
  }

  #lp .campaign-area .campaign-card .description_container > small {
    font-size: 14px;
    text-align: center;
  }

  #lp .campaign-area .campaign-card .description_container > small > strong {
    font-size: 16px;
  }

  #lp .campaign-area .campaign-card .main-text_container {
    gap: 5px;
  }

  #lp .campaign-area .campaign-card .main-text_container > p {
    font-size: 22px;
    text-align: center;
  }

  #lp .campaign-area .campaign-card .main-text_container > p > span {
    font-size: 35px;
  }

  #lp .campaign-area .campaign-card .main-text_container > em {
    width: 100%;
    font-size: 14px;
    text-align: center;
  }

  #lp .campaign-area .attention_container {
    font-size: 10px;
  }

  #lp .campaign-area > p {
    font-size: 14px;
  }
}

/* ===========================================
===========================================
	includes/cv-footer.php
===========================================
=========================================== */
#cv-footer {
  background: rgb(255 255 255 / 90%);
  display: flex;
  gap: 9px;
  width: 100%;
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 9999;
  padding: 12px 5px;

  /* transition: transform 1s ease, opacity 1s ease;
  opacity: 1; 最初は表示 */
}

/* 非表示時のスタイル */
#cv-footer.hidden {
  transform: translateY(100%);
  opacity: 0; /* フェードアウト */
}

#cv-footer > p {
  font-size: 14px;
  color: #454545;
  text-align: center;
}

#cv-footer .button_container.--sp {
  display: none;
}

#cv-footer .button_container.--pc {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  width: 960px;
}

#cv-footer .button_container.--pc .button {
  display: flex;
  gap: 10px;
  min-width: 113px;
  width: 49.5%;
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  align-items: center;
  justify-content: space-around;
  padding-top: 7px;
  padding-bottom: 7px;
  border-radius: 6px;
  box-shadow: 1px 5px 5px rgb(0 0 0 / 20%);
  position: relative;
}

#cv-footer .button_container.--pc .button > .text_container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

#cv-footer .button_container.--pc .button > .text_container > p {
  font-weight: var(--font-weight600);
}

#cv-footer .button_container.--pc .button > .arrow--nonStick {
  height: auto;
  width: 17px;
  right: 10px;
}

#cv-footer .button_container.--pc .button.--phone {
  background: linear-gradient(to right, #ff9d23, #ffbe19);
}

#cv-footer .button_container.--pc .button.--phone > .icon {
  width: 40px;
  height: 40px;
}

#cv-footer .button_container.--pc .button.--phone > .text_container > p {
  font-size: 26px;
}

#cv-footer .button_container.--pc .button.--line {
  background-color: #00c300;
}

#cv-footer .button_container.--pc .button.--line > .icon {
  width: 40px;
  height: 40px;
}

#cv-footer .button_container.--pc .button.--line > .text_container > p {
  font-size: 22px;
}

#cv-footer .button_container.--pc .button.--mail {
  background: linear-gradient(to right, #005bac, #54c3f1);
}

#cv-footer .button_container.--pc .button.--mail > .icon {
  width: 40px;
  height: 40px;
}

#cv-footer .button_container.--pc .button.--mail > .text_container > p {
  font-size: 22px;
}

@media screen and (width <= 992px) {
  #cv-footer {
    justify-content: space-around;
    padding: 12px 5px;
  }

  #cv-footer > p {
    font-size: 12px;
  }

  #cv-footer .button_container.--pc {
    display: none;
  }

  #cv-footer .button_container.--sp {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding-left: 16px;
    padding-right: 16px;
    width: 100%;
  }

  #cv-footer .button_container.--sp .button {
    display: flex;
    gap: 4px;
    min-width: 113px;
    width: 100%;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    align-items: center;
    justify-content: space-around;
    padding: 7px;
    border-radius: 6px;
    box-shadow: 1px 5px 5px rgb(0 0 0 / 20%);
  }

  #cv-footer .button_container.--sp .button > .arrow--nonStick {
    height: auto;
    width: 11px;
  }

  #cv-footer .button_container.--sp .button.--phone {
    background: linear-gradient(to right, #ff9d23, #ffbe19);
    letter-spacing: 0.1em;
  }

  #cv-footer .button_container.--sp .button.--phone > .icon {
    width: 21px;
    height: 21px;
  }

  #cv-footer .button_container.--sp .button.--line {
    background-color: #00c300;
  }

  #cv-footer .button_container.--sp .button.--line > .icon {
    width: 23px;
    height: 23px;
  }

  #cv-footer .button_container.--sp .button.--mail {
    background: linear-gradient(to right, #005bac, #54c3f1);
  }

  #cv-footer .button_container.--sp .button.--mail > .icon {
    width: 19px;
    height: 19px;
  }
}

/* ===========================================
===========================================
	lp-contact-line.php, lp-contact-mail.php
===========================================
=========================================== */

/* ###### 共通 ###### */
#lp-page-contact {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  width: 100%;
}

#lp-page-contact section {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

#lp-page-contact .section-inner {
  display: flex;
  flex-direction: column;
}

/* ###### メインビジュアル ###### */
#lp-page-contact .main-visual {
  display: flex;
  gap: 10px;
  flex-direction: column;
  align-items: center;
  color: #fff;
  font-weight: var(--font-weight600);
  padding-top: 40px;
  padding-bottom: 40px;
  background-repeat: no-repeat;
  background-size: cover;
}

#lp-page-contact .main-visual.--line {
  background-color: #00c300;
}

#lp-page-contact .main-visual.--mail {
  background-image: url("images/contact-mail-mvbg.webp");
}

#lp-page-contact .main-visual h1 {
  font-size: 40px;
  text-align: center;
}

#lp-page-contact .main-visual p {
  font-size: 25px;
}

@media screen and (width <= 992px) {
  #lp-page-contact .main-visual {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  #lp-page-contact .main-visual h1 {
    font-size: 25px;
    line-height: 32px;
  }

  #lp-page-contact .main-visual p {
    font-size: 16px;
  }
}

/* ###### コンテンツ ###### */
#lp-page-contact .contents .section-inner {
  width: 960px;
  padding: 50px 0 65px;
}

#lp-page-contact .contents h2 {
  font-size: 25px;
  font-weight: var(--font-weight600);
  padding-left: 10px;
  padding-top: 25px;
  padding-bottom: 30px;
}

#lp-page-contact .contents h2::after {
  content: "";
  width: 100%;
  height: 1px;
  margin-top: 10px;
  margin-left: -10px;
  background-color: black;
  display: block;
}

#lp-page-contact .contents .section-inner > h3 {
  font-size: 25px;
  font-weight: var(--font-weight600);
  padding-left: 15px;
  padding-top: 13px;
  padding-bottom: 13px;
  margin-top: 35px;
  margin-bottom: 20px;
  margin-left: 10px;
  border-left: #023067 solid 13px;
}

#lp-page-contact .contents p {
  font-size: 18px;
  line-height: 25px;
  padding-left: 10px;
}

#lp-page-contact .contents p > a {
  color: #00e;
}

/* 協力業者の募集職種 */
#lp-page-contact .contents .box_container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 20px;
}

#lp-page-contact .contents .box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: #d9d9d9;
  width: 49%;
  padding-top: 40px;
  padding-bottom: 40px;
  gap: 20px;
}

#lp-page-contact .contents .box > h3 {
  font-size: 22px;
  font-weight: var(--font-weight700);
}

#lp-page-contact .contents .box > strong {
  font-size: 18px;
  line-height: 1.3em;
  text-align: center;
}

/* LINE誘導 */
#lp-page-contact .contents .line-box {
  display: flex;
  gap: 28px;
  padding-bottom: 20px;
  padding-left: 10px;
}

#lp-page-contact .contents .line-box > img {
  width: 176px;
  height: 177px;
}

#lp-page-contact .contents .line-button_container {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

#lp-page-contact .contents .line-button_container > p {
  font-size: 25px;
  color: #00c300;
}

#lp-page-contact .contents .line-button_container > a,
img {
  width: 408px;
  height: 130px;
}

/* コンタクトフォーム */
#lp-page-contact .contents .form_container .button_container {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

#lp-page-contact .contents .form_container .button_container button {
  background-color: #fff;
  color: #535a62;
  border-width: 2px;
  border-color: #535a62;
  border-radius: 6px;
  padding: 8px 15px;
  font-weight: 600;
}

#lp-page-contact .contents #a-btn {
  color: #535a62;
  background-color: #fff;
}

#lp-page-contact .contents #a-btn.is-active {
  color: #fff;
  background-color: #535a62;
}

#lp-page-contact .contents #b-btn {
  color: #535a62;
  background-color: #fff;
}

#lp-page-contact .contents #b-btn.is-active {
  color: #fff;
  background-color: #535a62;
}

#lp-page-contact .contents #c-btn {
  color: #535a62;
  background-color: #fff;
}

#lp-page-contact .contents #c-btn.is-active {
  color: #fff;
  background-color: #535a62;
}

#lp-page-contact .contents #d-btn {
  color: #535a62;
  background-color: #fff;
}

#lp-page-contact .contents #d-btn.is-active {
  color: #fff;
  background-color: #535a62;
}

#lp-page-contact .contents .formA {
  display: none;
}

#lp-page-contact .contents .formA.is-active {
  display: block;
}

#lp-page-contact .contents .formB {
  display: none;
}

#lp-page-contact .contents .formB.is-active {
  display: block;
}

#lp-page-contact .contents .formC {
  display: none;
}

#lp-page-contact .contents .formC.is-active {
  display: block;
}

#lp-page-contact .contents .formD {
  display: none;
}

#lp-page-contact .contents .formD.is-active {
  display: block;
}

#lp-page-contact .contents .form_container {
  background-color: #ecedef;
  padding: 30px 40px;
  margin-top: 30px;
  margin-bottom: 20px;
}

#lp-page-contact .contents .form_container .contact-type {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#lp-page-contact .contents .form_container > small {
  display: block;
  margin-top: 10px;
  width: 100%;
  text-align: right;
}

#lp-page-contact .contents .form_container .contact-type > h3 {
  font-size: 18px;
  font-weight: var(--font-weight600);
  padding-bottom: 13px;
}

#lp-page-contact .contents .form_container .contact-type .button_container {
  width: 600px;
}

#lp-page-contact
  .contents
  .form_container
  .contact-type
  .button_container
  .button {
  font-weight: var(--font-weight600);
}

#lp-page-contact .contents .form_container h3 > em {
  font-style: normal;
  background-color: white;
  font-size: 14px;
  color: black;
  padding: 1.5px 6px 2px;
  margin-right: 10px;
  margin-top: auto;
  margin-bottom: auto;
}

#lp-page-contact .contents form {
  padding: 0;
}

#lp-page-contact .contents .wpcf7-form {
  padding-top: 25px;
  padding-left: 0;
  padding-right: 0;
  gap: 20px;
}

#lp-page-contact .contents .form-item > p {
  padding-left: 0;
  font-size: 18px;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

#lp-page-contact .contents .form-item > p > label {
  display: block;
  padding-left: 0;
  font-size: 18px;
  font-weight: var(--font-weight600);
}

#lp-page-contact .contents .form-item > p > span {
  width: 600px;
}

#lp-page-contact .contents .form-item > p > span > input {
  font-size: 18px;
  gap: 20px;
  font-weight: var(--font-weight600);
  width: 100%;
}

#lp-page-contact .contents .form-item > p > span > textarea {
  font-weight: var(--font-weight600);
  width: 100%;
}

#lp-page-contact .contents .checkbox_container {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 10px;
}

#lp-page-contact .contents .checkbox_container .checklist-title {
  margin-top: 10px;
  margin-bottom: 5px;
  font-size: 18px;
  font-weight: var(--font-weight600);
  width: 100%;
  text-align: center;
}

#lp-page-contact .contents .checkbox_container p {
  width: 100%;
}

#lp-page-contact .contents .checkbox_container p > small {
  display: block;
  width: 100%;
  text-align: center;
}

#lp-page-contact .contents .wpcf7 .submit-button_container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

#lp-page-contact .contents .wpcf7 .submit {
  width: 100%;
  height: auto;
  margin-top: 40px;
  padding: 20px 30px;
}

#lp-page-contact .contents .wpcf7 .submit-button_container small {
  display: block;
  width: 100%;
  text-align: center;
}

@media screen and (width <= 992px) {
  #lp-page-contact .contents .section-inner {
    width: 100%;
    padding: 15px 16px 30px;
  }

  #lp-page-contact .contents h2 {
    font-size: 18px;
    padding-top: 25px;
    padding-bottom: 30px;
  }

  #lp-page-contact .contents .section-inner > h3 {
    font-size: 18px;
    font-weight: var(--font-weight600);
    padding-left: 10px;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-top: 35px;
    margin-bottom: 20px;
    margin-left: 0;
    border-left: #023067 solid 8px;
  }

  #lp-page-contact .contents p {
    font-size: 14px;
    line-height: 22px;
    padding-left: 0;
  }

  /* 協力業者の募集職種 */
  #lp-page-contact .contents .box {
    width: 100%;
  }

  #lp-page-contact .contents .box > h3 {
    font-size: 20px;
    font-weight: var(--font-weight700);
  }

  #lp-page-contact .contents .box > strong {
    font-size: 16px;
    line-height: 1.3em;
    text-align: center;
  }

  /* LINE誘導 */
  #lp-page-contact .contents .line-box {
    gap: 10px;
  }

  #lp-page-contact .contents .line-box > img {
    width: 92px;
    height: 92px;
  }

  #lp-page-contact .contents .line-button_container {
    gap: 6px;
  }

  #lp-page-contact .contents .line-button_container > a,
  img {
    width: 200px;
    height: 65px;
  }

  #lp-page-contact .contents .line-button_container > p {
    font-size: 12px;
    color: #00c300;
  }

  /* コンタクトフォーム */
  #lp-page-contact .contents .form_container {
    padding: 10px;
  }

  #lp-page-contact .contents .form_container .button_container button {
    width: 100%;
  }

  #lp-page-contact .contents .form_container .contact-type {
    flex-direction: column;
    align-items: start;
  }

  #lp-page-contact .contents .form_container > small {
    text-align: left;
  }

  #lp-page-contact .contents .form_container h3 {
    margin-top: 10px;
    font-size: 17px;
  }

  #lp-page-contact .contents .form_container .contact-type .button_container {
    width: 100%;
  }

  #lp-page-contact .contents form {
    align-items: start;
  }

  #lp-page-contact .contents .form-item > p {
    padding-left: 0;
    font-size: 17px;
    flex-direction: column;
    justify-content: space-between;
    align-items: start;
  }

  #lp-page-contact .contents .form-item > p > label {
    font-size: 17px;
  }

  #lp-page-contact .contents .form-item > p > span {
    width: 100%;
    font-size: 17px;
  }

  #lp-page-contact .contents .form-item > p > span > input {
    font-size: 17px;
  }

  #lp-page-contact .contents .form-item > p > span > textarea {
    min-height: 100px;
    height: 120px;
    font-size: 17px;
  }

  #lp-page-contact .contents .form-item .wpcf7-list-item {
    margin-left: 0;
  }

  #lp-page-contact .contents .checkbox_container .checklist-title {
    margin-top: 20px;
    font-size: 17px;
    width: 100%;
    text-align: center;
  }

  #lp-page-contact .contents .wpcf7 .submit-button_container {
    width: 100%;
  }

  #lp-page-contact .contents .wpcf7 .submit-button_container > p {
    width: 100%;
  }

  #lp-page-contact .contents .wpcf7 .submit {
    font-size: 17px;
    letter-spacing: 0.1em;
    width: 100%;
  }
}