@charset "UTF-8";
/*
Theme Name: K&I
Author: Refu
Version: 1.0
*/
*, *::before, *::after {
  box-sizing: border-box;
}

body, h1, h2, h3, h4, p, figure, blockquote, dl, dd {
  margin: 0;
}

ul[role=list], ol[role=list] {
  list-style: none;
}

html:focus-within {
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

a:not([class]) {
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

img, picture {
  max-width: 100%;
  display: block;
}

input, button, textarea, select {
  font: inherit;
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
html {
  scroll-behavior: smooth; /* スムーススクロール */
  max-width: 1920px;
  margin: 0 auto;
}

body {
  font-family: "Noto Sans JP", serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: #000;
  word-break: auto-phrase;
  max-width: 1920px;
  margin: 0 auto;
  background-color: #fff;
}
@media screen and (max-width: 767px) {
  body {
    font-size: 14px;
  }
}
body p {
  line-height: 2;
}

ul, li {
  word-break: normal;
}

a[href^="tel:"] {
  pointer-events: none;
}

.container {
  width: 80%;
  margin: 0 auto;
  max-width: 1536px;
}
@media screen and (max-width: 767px) {
  .container {
    width: 90%;
  }
}

ul, li {
  margin: 0;
  padding: 0;
  list-style: none;
}

img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

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

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

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

.table_design03 {
  border-collapse: collapse;
  width: 100%;
  word-break: auto-phrase;
  font-weight: bold;
}
.table_design03 tbody {
  border-top: 1px solid #707070;
  border-bottom: 1px solid #707070;
}
.table_design03 td {
  padding: 1.25rem 0;
}
.table_design03 td a:hover {
  opacity: 0.7;
}
.table_design03 td:first-child {
  width: 15%;
  min-width: 80px;
  color: #005949;
}
@media screen and (max-width: 767px) {
  .table_design03 td:first-child {
    width: 100%;
  }
}
.table_design03 td:last-child {
  width: 85%;
  padding-left: 2rem;
}
@media screen and (max-width: 767px) {
  .table_design03 td:last-child {
    padding: 0;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .table_design03 td {
    padding: 0;
  }
}
.table_design03 a {
  text-decoration: underline;
  display: block;
}
@media screen and (max-width: 767px) {
  .table_design03 tr {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 10px 0;
  }
}

.lower-fv {
  display: flex;
  gap: 20px;
  padding: 5rem 0 2.5rem 10%;
  border-bottom: 1px solid #707070;
  align-items: center;
  margin-top: 5rem;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .lower-fv {
    padding: 3rem 0 2.5rem 10%;
  }
}
@media screen and (max-width: 767px) {
  .lower-fv {
    gap: 14px;
    margin-top: 4rem;
    padding: 2rem 5% 1rem;
  }
}
.lower-fv img {
  width: 4rem;
}
@media screen and (max-width: 767px) {
  .lower-fv img {
    width: 3rem;
  }
}
.lower-fv .section-title {
  display: flex;
  gap: 1.5rem;
  align-items: flex-end;
}
@media screen and (max-width: 767px) {
  .lower-fv .section-title {
    flex-direction: column-reverse;
    gap: 0;
    align-items: baseline;
  }
}
.lower-fv.news-fv, .lower-fv.company-fv, .lower-fv.service-fv, .lower-fv.recruit-fv {
  background: url(./images/news-fv.png) no-repeat center/cover;
  padding: 10rem 0 10rem 15%;
  z-index: 0;
}
@media screen and (max-width: 1024px) {
  .lower-fv.news-fv, .lower-fv.company-fv, .lower-fv.service-fv, .lower-fv.recruit-fv {
    padding: 5rem 0 5rem 15%;
  }
}
@media screen and (max-width: 767px) {
  .lower-fv.news-fv, .lower-fv.company-fv, .lower-fv.service-fv, .lower-fv.recruit-fv {
    padding: 4rem;
  }
}
.lower-fv.news-fv .section-title, .lower-fv.company-fv .section-title, .lower-fv.service-fv .section-title, .lower-fv.recruit-fv .section-title {
  position: relative;
  z-index: 10;
}
.lower-fv.news-fv img, .lower-fv.company-fv img, .lower-fv.service-fv img, .lower-fv.recruit-fv img {
  position: absolute;
  width: 13%;
  left: 10%;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .lower-fv.news-fv img, .lower-fv.company-fv img, .lower-fv.service-fv img, .lower-fv.recruit-fv img {
    width: 23%;
    left: 5%;
  }
}
.lower-fv.news-fv .section-title h1, .lower-fv.company-fv .section-title h1, .lower-fv.service-fv .section-title h1, .lower-fv.recruit-fv .section-title h1 {
  color: #fff;
  font-size: clamp(2rem, 1.455rem + 1.82vw, 3.5rem);
}
.lower-fv.company-fv {
  background: url(./images/company-fv.png) no-repeat center/cover;
}
.lower-fv.service-fv {
  background: url(./images/service-fv.png) no-repeat center/cover;
}
.lower-fv.recruit-fv {
  background: url(./images/recruit-fv.png) no-repeat center/cover;
}

.pankuzu {
  padding: 0.5rem 10% 0;
}
@media screen and (max-width: 767px) {
  .pankuzu {
    padding: 0.5rem 5% 0;
  }
}

.main {
  width: 70%;
  margin: 5rem auto 100px;
}
@media screen and (max-width: 1024px) {
  .main {
    width: 80%;
  }
}
@media screen and (max-width: 767px) {
  .main {
    width: 90%;
    margin: 2.5rem auto 7.5rem;
  }
}

.h2-img {
  color: #005949;
  margin-bottom: 2.5rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .h2-img {
    margin-bottom: 1.5rem;
  }
}
.h2-img-text {
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 1rem;
  background-color: #fff;
  padding-right: 1rem;
}
@media screen and (max-width: 767px) {
  .h2-img-text {
    gap: 0.5rem;
  }
}
.h2-img h2 {
  font-size: clamp(1.125rem, 0.989rem + 0.45vw, 1.5rem);
}
.h2-img::before {
  content: "";
  position: absolute;
  width: 100%;
  background-color: #00A987;
  height: 1px;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: -1;
}
.h2-img img {
  width: 1.5rem;
}

.wp-pagenavi {
  width: 100%;
  margin: 2.5rem auto 0;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .wp-pagenavi {
    margin-top: 2rem;
  }
}
.wp-pagenavi .pages {
  display: none;
}
.wp-pagenavi span,
.wp-pagenavi a {
  margin: 0 1rem !important;
  display: inline-block;
  padding: 0.7rem 0 !important;
  font-weight: bold;
  text-align: center;
  border: none !important;
  color: #95AEAE;
  font-size: clamp(1.25rem, 0.795rem + 1.52vw, 2.5rem);
}
.wp-pagenavi span:hover,
.wp-pagenavi a:hover {
  opacity: 0.7;
}
.wp-pagenavi span.last, .wp-pagenavi span.first,
.wp-pagenavi a.last,
.wp-pagenavi a.first {
  font-size: 14px;
}
.wp-pagenavi span.current {
  color: #005949;
  pointer-events: none;
}

.banner {
  margin: 7.5rem auto;
  width: 70%;
}
@media screen and (max-width: 1400px) {
  .banner {
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  .banner {
    margin: 5rem auto;
    width: 100%;
  }
}
.banner > a {
  background-color: #00342B;
  padding: 0 5%;
  display: flex;
  gap: 5%;
  position: relative;
  z-index: 0;
}
@media screen and (max-width: 1024px) {
  .banner > a {
    flex-direction: column-reverse;
  }
}
.banner > a:hover {
  opacity: 0.7;
}
.banner > a:hover .arrow-btn-bg::after {
  animation: animate_arrow 0.3s forwards 0.15s;
}
.banner > a:hover .arrow-btn::before {
  left: 0;
}
.banner > a img {
  position: absolute;
  height: 100%;
  top: 0;
  right: 0;
  width: auto;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: left;
     object-position: left;
}
@media screen and (max-width: 1024px) {
  .banner > a img {
    position: relative;
  }
}
.banner-text {
  width: -moz-fit-content;
  width: fit-content;
  color: #fff;
  padding: 4rem 0;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .banner-text {
    width: 100%;
    padding: 1rem 1rem 1.5rem;
  }
}
.banner-text h3 {
  font-size: clamp(2rem, 1.5rem + 1.67vw, 3.375rem);
  margin: 1rem 0;
}
@media screen and (max-width: 767px) {
  .banner-text h3 {
    margin: 0 0 1rem;
  }
}
.banner-text .arrow-btn-bg {
  margin-top: 2rem;
}
@media screen and (max-width: 1024px) {
  .banner-text .arrow-btn-bg {
    margin-top: 1rem;
  }
}
.banner-text p:first-child {
  line-height: 1.5;
}
.banner-text p:nth-child(3) {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
.banner-text p:last-child {
  text-decoration: underline;
  margin-top: 2rem;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
@media screen and (max-width: 767px) {
  .banner-text p:last-child {
    margin-top: 0;
  }
}

.hidden-view {
  display: none;
}
.hidden-view.open {
  display: block;
}

header {
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  transition: 0.3s;
  background-color: #01373E;
}

header.UpMove {
  animation: UpAnime 0.5s forwards;
}

@keyframes UpAnime {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(-100px);
  }
}
header.DownMove {
  animation: DownAnime 0.5s forwards;
}

@keyframes DownAnime {
  from {
    opacity: 0;
    transform: translateY(-100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.header-contents {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 80px;
  width: 90%;
  margin: 0 auto;
  max-width: 1728px;
}
@media screen and (max-width: 767px) {
  .header-contents {
    height: 65px;
  }
}

.header-left {
  width: 350px;
}
@media screen and (max-width: 1280px) {
  .header-left {
    width: 300px;
  }
}
@media screen and (max-width: 767px) {
  .header-left {
    width: 55px;
  }
}
.header-left a img {
  width: 350px;
}
@media screen and (max-width: 767px) {
  .header-left a img {
    width: 55px;
    height: 52px;
  }
}

.header-right {
  display: flex;
  align-items: center;
  gap: 3rem;
  justify-content: end;
}
@media screen and (max-width: 1600px) {
  .header-right {
    gap: 2rem;
  }
}
@media screen and (max-width: 1280px) {
  .header-right {
    gap: 1rem;
  }
}
.header-right > .hamburger-nav > ul {
  display: flex;
  align-items: center;
  gap: 3rem;
  font-size: 1rem;
}
@media screen and (max-width: 1600px) {
  .header-right > .hamburger-nav > ul {
    gap: 2rem;
  }
}
@media screen and (max-width: 1400px) {
  .header-right > .hamburger-nav > ul {
    font-size: 14px;
  }
}
@media screen and (max-width: 1280px) {
  .header-right > .hamburger-nav > ul {
    gap: 1rem;
  }
}
@media screen and (max-width: 1024px) {
  .header-right > .hamburger-nav > ul {
    display: none;
  }
}
.header-right > .hamburger-nav > ul > li > a {
  position: relative;
  color: #fff;
  width: -moz-fit-content;
  width: fit-content;
  line-height: 1;
  font-weight: bold;
}
.header-right > .hamburger-nav > ul > li > a:hover {
  opacity: 0.7;
}

.hamburger-menu {
  display: none;
}
@media screen and (max-width: 1024px) {
  .hamburger-menu {
    display: block;
  }
}
.hamburger-menu input {
  display: none;
}
.hamburger-menu .menu-btn {
  display: flex;
  height: 45px;
  width: 45px;
  justify-content: center;
  align-items: center;
  z-index: 30;
  position: relative;
}
.hamburger-menu .menu-btn::before {
  content: "Menu";
  position: absolute;
  width: 100%;
  text-align: center;
  left: 0;
  bottom: -4px;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .hamburger-menu .menu-btn {
    height: 40px;
    width: 40px;
  }
}
.hamburger-menu .menu-btn span,
.hamburger-menu .menu-btn span:before,
.hamburger-menu .menu-btn span:after {
  content: "";
  display: block;
  height: 2px;
  width: 40px;
  background-color: #fff;
  position: absolute;
  transition: 0.3s;
}
.hamburger-menu .menu-btn span:before {
  bottom: 16px;
}
.hamburger-menu .menu-btn span:after {
  bottom: 8px;
}
.hamburger-menu #menu-btn-check:checked ~ .menu-btn span,
.hamburger-menu #menu-btn-check:checked ~ .menu-btn span:before,
.hamburger-menu #menu-btn-check:checked ~ .menu-btn span:after {
  background-color: #fff;
}
.hamburger-menu #menu-btn-check:checked ~ .menu-btn span {
  background-color: rgba(255, 255, 255, 0); /*メニューオープン時は真ん中の線を透明にする*/
}
.hamburger-menu #menu-btn-check:checked ~ .menu-btn span::before {
  bottom: 8px;
  transform: rotate(45deg);
  width: 35px;
}
.hamburger-menu #menu-btn-check:checked ~ .menu-btn span::after {
  bottom: 8px;
  transform: rotate(-45deg);
  width: 35px;
}
.hamburger-menu #menu-btn-check:checked ~ .hamburger-demo-cover {
  width: 100%;
  height: 100vh;
  left: 0;
  position: fixed;
  top: 0;
  z-index: 15;
  background-color: rgba(255, 255, 255, 0.5);
}
.hamburger-menu .menu-content .logo {
  margin: 0 auto;
  max-width: 300px;
}
@media screen and (max-width: 1024px) {
  .hamburger-menu .menu-content .logo {
    width: -moz-fit-content;
    width: fit-content;
    height: 60px;
  }
  .hamburger-menu .menu-content .logo img {
    height: 100%;
  }
}
@media screen and (max-width: 767px) {
  .hamburger-menu .menu-content .logo {
    width: 55px;
    height: 52px;
  }
}
.hamburger-menu .menu-content .hamburger-wrap {
  width: 80%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .hamburger-menu .menu-content .hamburger-wrap {
    margin: 2rem auto 0;
  }
}
.hamburger-menu .menu-content .hamburger-wrap .lang-nav {
  display: none !important;
}
.hamburger-menu .menu-content ul li a {
  font-size: 1rem;
  width: 100%;
  display: flex;
  padding-bottom: 0.3rem;
  align-items: center;
  gap: 1.5rem;
  color: #fff;
}
.hamburger-menu .gnavi__sp-style {
  position: fixed;
  z-index: -2;
  top: 0;
  background: #01373E;
  color: #fff;
  width: 100%;
  height: 100vh;
  left: 100%;
  transition: all 0.5s;
  font-size: 1rem;
  opacity: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2rem;
}
.hamburger-menu .gnavi__sp-style > a {
  position: absolute;
  left: 5%;
  top: 1rem;
}
@media screen and (max-width: 767px) {
  .hamburger-menu .gnavi__sp-style > a {
    top: 0.5rem;
  }
}
.hamburger-menu .gnavi__sp-style a {
  color: #000;
}
.hamburger-menu .gnavi__sp-style .hamburger-menu .header-btn {
  font-weight: 500;
}
@media screen and (max-width: 1024px) {
  .hamburger-menu .gnavi__sp-style .hamburger-menu .header-btn {
    border-radius: 5px;
    width: 100%;
    max-width: 250px;
  }
  .hamburger-menu .gnavi__sp-style .hamburger-menu .header-btn:first-of-type {
    margin-bottom: 0.5rem;
  }
}
.hamburger-menu .gnavi__sp-style > img {
  width: 100px;
  margin-bottom: 2.5rem;
}
.hamburger-menu .gnavi__sp-style .hamburger-nav {
  margin-bottom: 2.5rem;
}
@media screen and (max-width: 767px) {
  .hamburger-menu .gnavi__sp-style .hamburger-nav {
    margin-bottom: 1rem;
  }
}
.hamburger-menu .gnavi__sp-style .policy-btn {
  font-size: 14px;
  font-weight: bold;
}
.hamburger-menu .gnavi__sp-style .hamburger-nav > ul > li {
  margin-bottom: 1rem;
}
@media screen and (max-width: 1024px) {
  .hamburger-menu .gnavi__sp-style .hamburger-nav > ul > li {
    width: -moz-fit-content;
    width: fit-content;
  }
}
.hamburger-menu .gnavi__sp-style.active {
  opacity: 1;
  z-index: 20;
  left: 0;
}

#menu-item-252,
#menu-item-279,
header .menu-item-has-children {
  position: relative;
  margin-right: 13px;
  padding-bottom: 28px;
  margin-top: 28px;
}
@media screen and (max-width: 1024px) {
  #menu-item-252,
  #menu-item-279,
  header .menu-item-has-children {
    padding-bottom: 0;
    margin-top: 0;
  }
}
#menu-item-252::before,
#menu-item-279::before,
header .menu-item-has-children::before {
  content: "";
  position: absolute;
  right: -1rem;
  top: 7px;
  width: 12px;
  height: 12px;
  background: url(./images/header-triangle.png) no-repeat center/contain;
}
@media screen and (max-width: 1024px) {
  #menu-item-252::before,
  #menu-item-279::before,
  header .menu-item-has-children::before {
    display: none;
  }
}
#menu-item-252 .sub-menu,
#menu-item-279 .sub-menu,
header .menu-item-has-children .sub-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: -moz-max-content;
  width: max-content;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  #menu-item-252 .sub-menu,
  #menu-item-279 .sub-menu,
  header .menu-item-has-children .sub-menu {
    position: relative;
    display: block;
    padding: 0.5rem 0 0 1.5rem;
    text-align: left;
  }
}
#menu-item-252 .sub-menu li:not(:last-child) a,
#menu-item-279 .sub-menu li:not(:last-child) a,
header .menu-item-has-children .sub-menu li:not(:last-child) a {
  margin-bottom: 2px;
}
#menu-item-252 .sub-menu a,
#menu-item-279 .sub-menu a,
header .menu-item-has-children .sub-menu a {
  display: block;
  background-color: #fff;
  padding: 0.5rem;
  color: #005949;
  font-size: 14px !important;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  #menu-item-252 .sub-menu a,
  #menu-item-279 .sub-menu a,
  header .menu-item-has-children .sub-menu a {
    background-color: transparent;
    position: relative;
    padding: 0 0 0 1rem;
    margin-bottom: 0.5rem;
  }
  #menu-item-252 .sub-menu a::before,
  #menu-item-279 .sub-menu a::before,
  header .menu-item-has-children .sub-menu a::before {
    content: ">";
    position: absolute;
    left: 0;
    top: 0;
  }
}
#menu-item-252 .sub-menu a:hover,
#menu-item-279 .sub-menu a:hover,
header .menu-item-has-children .sub-menu a:hover {
  opacity: 0.7;
}
#menu-item-252:hover .sub-menu,
#menu-item-279:hover .sub-menu,
header .menu-item-has-children:hover .sub-menu {
  display: block;
}

.lang-nav__list {
  display: flex;
  padding: 5px;
  background-color: #fff;
  border-radius: 24px;
  border: none;
}
.lang-nav__list a {
  padding: 5px 0.5rem;
  border-radius: 24px;
  color: #005949;
  display: block;
  font-weight: bold;
}
.lang-nav__list .current-lang a {
  color: #fff;
  background-color: #00A987;
  padding: 5px 1rem;
}

.footer {
  background: linear-gradient(to right, #002324, #005B40);
  color: #fff;
  padding: 2.5rem 0 20px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .footer {
    padding: 2.5rem 0 1rem;
  }
}
.footer a {
  color: #fff;
}
.footer a:hover {
  opacity: 0.7;
}
.footer-wrap {
  display: flex;
  gap: 10%;
  width: 90%;
  margin: 0 auto 5rem;
}
@media screen and (max-width: 767px) {
  .footer-wrap {
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 3.5rem;
  }
}
.footer div.footer-ul {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  .footer div.footer-ul {
    width: 70%;
  }
}
@media screen and (max-width: 767px) {
  .footer div.footer-ul {
    width: 100%;
  }
}
.footer-address {
  margin-bottom: 1rem;
}
.footer-address p {
  margin-bottom: 0.5rem;
}
@media screen and (max-width: 767px) {
  .footer-address p {
    margin-bottom: 0.25rem;
  }
}
.footer .logo {
  margin: 0 auto 1rem;
}
@media screen and (max-width: 767px) {
  .footer .logo {
    margin: 0 0 0.5rem;
  }
}
.footer .logo a {
  width: -moz-fit-content;
  width: fit-content;
  display: block;
}
.footer .logo img {
  width: 400px;
}
@media screen and (max-width: 1280px) {
  .footer .logo img {
    width: 350px;
  }
}
@media screen and (max-width: 1024px) {
  .footer .logo img {
    width: 300px;
  }
}
@media screen and (max-width: 767px) {
  .footer .logo img {
    width: 100%;
  }
}
.footer ul {
  display: flex;
  gap: 2rem 6%;
  flex-wrap: wrap;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .footer ul {
    gap: 20px 0;
  }
}
.footer ul.sub-menu {
  margin: 1rem 0 0 1rem;
  font-size: 14px;
  max-width: 200px;
  justify-content: left;
  gap: 1rem 1.5rem;
}
@media screen and (max-width: 767px) {
  .footer ul.sub-menu {
    flex-direction: column;
  }
}
.footer ul.sub-menu > li {
  width: -moz-fit-content;
  width: fit-content;
  font-size: 14px;
  position: relative;
  padding-left: 1rem;
}
.footer ul.sub-menu > li::before {
  content: ">";
  position: absolute;
  left: 0;
  top: 0;
}
.footer ul.sub-menu > li a {
  font-weight: normal;
}
.footer ul > li {
  position: relative;
  font-size: 18px;
}
@media screen and (max-width: 767px) {
  .footer ul > li {
    width: 100%;
  }
}
.footer ul > li > a {
  font-weight: 600;
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  line-height: 1;
}
.footer ul > li > a:hover {
  opacity: 0.7;
}
.footer-bottom {
  display: flex;
  gap: 2.5rem;
  font-weight: bold;
  margin: 0 0 20px 5%;
}
@media screen and (max-width: 767px) {
  .footer-bottom {
    font-size: 12px;
    gap: 1.5rem;
    justify-content: center;
    margin: 0 auto 16px;
  }
}
.footer .copyright {
  padding: 20px 0 0;
  margin: 0 auto;
  text-align: center;
  font-size: clamp(0.75rem, 0.705rem + 0.15vw, 0.875rem);
  width: 90%;
  border-top: 1px solid;
}
@media screen and (max-width: 767px) {
  .footer .copyright {
    padding-top: 1rem;
  }
}
.footer-top {
  display: flex;
}
.footer-top a {
  display: flex;
  justify-content: center;
  gap: 2.5rem;
  width: 50%;
  padding: 3.5rem 0;
  color: #fff;
  align-items: center;
  font-size: clamp(1.25rem, 0.795rem + 1.52vw, 2.5rem);
  font-weight: bold;
}
.footer-top a.contact-a {
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .footer-top a {
    padding: 1.5rem 0;
  }
}
@media screen and (max-width: 767px) {
  .footer-top a {
    gap: 12px;
    padding: 12px 0;
  }
}
.footer-top a:hover {
  opacity: 0.7;
}
.footer-top a img {
  width: 3.5rem;
}
@media screen and (max-width: 767px) {
  .footer-top a img {
    width: 2rem;
  }
}
.footer-top a:first-child {
  background-color: #00A987;
}
.footer-top a:nth-child(2) {
  background-color: #005949;
}

.section-title {
  color: #005949;
}
.section-title h1 {
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
}
.section-title h2 {
  font-size: clamp(0.75rem, 0.659rem + 0.3vw, 1rem);
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
}

.top-title {
  display: flex;
  gap: 20px;
  align-items: center;
  color: #005949;
  font-weight: bold;
  margin-bottom: 2.5rem;
}
@media screen and (max-width: 767px) {
  .top-title {
    margin-bottom: 20px;
    gap: 14px;
  }
}
.top-title img {
  width: 4rem;
}
@media screen and (max-width: 767px) {
  .top-title img {
    width: 3rem;
  }
}
.top-title p {
  font-size: clamp(0.75rem, 0.659rem + 0.3vw, 1rem);
  margin: 0;
  line-height: 1;
}
.top-title h2 {
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
}

.recruit-title {
  text-align: center;
  color: #005949;
  font-weight: bold;
  margin-bottom: 2.5rem;
}
@media screen and (max-width: 767px) {
  .recruit-title {
    margin-bottom: 1rem;
  }
}
.recruit-title p {
  font-size: 14px;
  line-height: 1;
}
.recruit-title h2 {
  font-size: clamp(1.125rem, 0.807rem + 1.06vw, 2rem);
}

a {
  text-decoration: none;
  color: #000;
  cursor: pointer;
}
a:hover {
  transition: 0.3s;
  cursor: pointer;
}

.arrow-btn {
  background: #00A987;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0;
  color: #fff;
  font-weight: bold;
  display: block;
  font-size: 1rem;
  letter-spacing: 1px;
  position: relative;
  overflow: hidden;
  text-align: center;
  padding: 1.5rem 2rem;
  width: 240px;
}
.arrow-btn.two {
  padding: 0.8rem 2rem;
}
.arrow-btn.two span {
  line-height: 1.5;
}
.arrow-btn-bg {
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  overflow: hidden;
  border-radius: 40px;
  margin: 5rem auto 0;
  border-radius: 40px;
}
@media screen and (max-width: 767px) {
  .arrow-btn-bg {
    margin-top: 2.5rem;
  }
}
.arrow-btn-bg:hover::after {
  animation: animate_arrow 0.3s forwards 0.15s;
}
.arrow-btn-bg::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: #00A987;
  border-radius: 40px;
  top: 50%;
  left: -100%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transition: 0.5s;
}
.arrow-btn::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: #005949;
  border-radius: 40px;
  top: 50%;
  left: -80%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transition: 0.3s;
}
.arrow-btn::after {
  content: "＞";
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: 10;
}
.arrow-btn span {
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  margin: 0 auto;
  position: relative;
  z-index: 10;
  line-height: 1;
}
.arrow-btn:hover::before {
  left: 0;
}

.content-down {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  justify-content: center;
  color: #005949;
  padding: 0.8rem 0 !important;
  font-weight: bold;
  width: 230px !important;
  margin: 1.5rem auto;
  background-color: transparent !important;
}
@media screen and (max-width: 767px) {
  .content-down {
    display: flex;
    margin: 0 auto;
  }
}
.content-down.open img {
  transform: rotate(180deg);
}
.content-down img {
  width: 15px;
  height: 8px;
}

.fv {
  position: relative;
  margin-bottom: 5rem;
}
@media screen and (max-width: 1024px) {
  .fv {
    margin-top: 5rem;
  }
}
@media screen and (max-width: 767px) {
  .fv {
    margin-top: 0;
    margin-bottom: 2.5rem;
  }
}
.fv > img {
  border-radius: 0 0 1000px 0;
}
@media screen and (max-width: 767px) {
  .fv > img {
    aspect-ratio: 394/900;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: left;
       object-position: left;
    border-radius: 0 0 100px 0;
  }
}
.fv-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  color: #fff;
  padding-bottom: 1rem;
  width: -moz-max-content;
  width: max-content;
  text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2), -1px -1px 5px rgba(0, 0, 0, 0.2), -1px 1px 5px rgba(0, 0, 0, 0.2), 1px -1px 5px rgba(0, 0, 0, 0.2), 1px 0 5px rgba(0, 0, 0, 0.2), -1px 0 5px rgba(0, 0, 0, 0.2), 0 1px 5px rgba(0, 0, 0, 0.2), 0 -1px 5px rgba(0, 0, 0, 0.2); /* 右上方向に影 */
  z-index: 0;
}
.fv-text.fadeUp h1, .fv-text.fadeUp p {
  animation: animate_opacity 1.5s forwards 0.3s;
}
@media screen and (max-width: 767px) {
  .fv-text.fadeUp h1, .fv-text.fadeUp p {
    animation: animate_opacity 1.5s forwards 0s;
  }
}
.fv-text.fadeUp::before {
  animation: animate_opacity 1.5s forwards 0.3s;
}
@media screen and (max-width: 767px) {
  .fv-text.fadeUp::before {
    animation: animate_opacity 1.5s forwards 0s;
  }
}
.fv-text.fadeUp img {
  animation: animate_opacity 1.5s forwards 0s;
}
@media screen and (max-width: 767px) {
  .fv-text {
    writing-mode: vertical-rl;
    display: flex;
    align-items: center;
    gap: 20px;
    top: 110px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  }
  .fv-text img {
    width: 95px;
    height: 90px;
    opacity: 0;
  }
}
.fv-text::before {
  content: "";
  position: absolute;
  width: 41%;
  aspect-ratio: 1/1;
  background: url(./images/top-fv.png) no-repeat center/contain;
  left: -15%;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  z-index: -1;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  .fv-text::before {
    display: none;
  }
}
.fv-text h1 {
  font-size: clamp(1.5rem, 0.818rem + 2.27vw, 3.375rem);
  opacity: 0;
}
@media screen and (max-width: 767px) {
  .fv-text h1 {
    line-height: 1.8;
  }
}
.fv-text p {
  font-size: 20px;
  margin-top: 1rem;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  .fv-text p {
    display: none;
  }
}
.fv-text-sp {
  position: absolute;
  color: #fff;
  width: -moz-max-content;
  width: max-content;
  text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2), -1px -1px 5px rgba(0, 0, 0, 0.2), -1px 1px 5px rgba(0, 0, 0, 0.2), 1px -1px 5px rgba(0, 0, 0, 0.2), 1px 0 5px rgba(0, 0, 0, 0.2), -1px 0 5px rgba(0, 0, 0, 0.2), 0 1px 5px rgba(0, 0, 0, 0.2), 0 -1px 5px rgba(0, 0, 0, 0.2); /* 右上方向に影 */
  text-align: center;
  bottom: 10%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  font-size: 20px;
  opacity: 0;
}
.fv-text-sp.fadeUp {
  animation: animate_opacity 0.7s forwards 0s;
}
.fv-text-sp p {
  line-height: 1.5;
}
.fv__scroll-list {
  z-index: 1;
  position: absolute;
  top: 0;
  display: flex;
  list-style: none;
  padding-inline: 0;
  margin-inline: 0;
  gap: 0;
  left: calc(50% - 50vw);
  width: 100vw;
  overflow: hidden;
}
.fv__scroll-list > li {
  color: #F5F5F5;
  -webkit-text-stroke: 1px #FBAF30;
  font-size: clamp(7.75rem, 5.114rem + 8.79vw, 15rem);
  font-family: "myfont", sans-serif;
  font-weight: 100;
  line-height: 1;
  white-space: nowrap;
  padding: 0 3rem 0 0;
  margin: 0;
  animation: text-right 16s linear infinite;
}
@media screen and (max-width: 1024px) and (min-height: 900px) {
  .fv .pc-video {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .fv .pc-video {
    display: none;
  }
}
.fv .tab-video {
  display: none;
}
@media screen and (max-width: 1024px) and (min-height: 900px) {
  .fv .tab-video {
    display: block;
  }
}
.fv .sp-video {
  display: none;
}
@media screen and (max-width: 767px) {
  .fv .sp-video {
    display: block;
  }
}

.about-us {
  margin: 0 auto 5rem;
  width: 80%;
}
.about-us .arrow-btn-bg {
  margin: 2.5rem 0 0 auto;
}
@media screen and (max-width: 1024px) {
  .about-us .arrow-btn-bg {
    margin: 1.5rem 0 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .about-us .arrow-btn-bg {
    margin: 2rem auto 0;
  }
}
.about-us-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row-reverse;
}
@media screen and (max-width: 1024px) {
  .about-us-wrap {
    flex-direction: column-reverse;
    gap: 4rem;
  }
}
@media screen and (max-width: 767px) {
  .about-us-wrap {
    gap: 2rem;
  }
}
@media screen and (max-width: 1280px) {
  .about-us {
    margin: 0 0 7.5rem 5%;
  }
}
@media screen and (max-width: 1024px) {
  .about-us {
    margin: 0 auto 5rem;
  }
}
@media screen and (max-width: 767px) {
  .about-us {
    width: 90%;
  }
}
.about-us-left {
  width: 65%;
}
@media screen and (max-width: 1024px) {
  .about-us-left {
    width: 100%;
  }
}
.about-us-right {
  width: 30%;
  display: flex;
  flex-direction: column;
  gap: 2.5rem 5%;
}
@media screen and (max-width: 1024px) {
  .about-us-right {
    flex-direction: row;
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .about-us-right {
    flex-direction: column;
    gap: 0.5rem;
  }
}
@media screen and (max-width: 1024px) {
  .about-us-right img {
    width: 47.5%;
  }
}
@media screen and (max-width: 767px) {
  .about-us-right img {
    width: 100%;
  }
}
.about-us-right img:nth-child(2) {
  max-width: 400px;
  width: 80%;
  margin: 0 0 0 auto;
}
@media screen and (max-width: 1024px) {
  .about-us-right img:nth-child(2) {
    width: 47.5%;
  }
}
@media screen and (max-width: 767px) {
  .about-us-right img:nth-child(2) {
    width: 100%;
  }
}
.about-us-text {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  font-weight: bold;
  opacity: 0;
}
.about-us-text-en > p, .about-us-text-en div:not(.about-us-box) p {
  font-size: clamp(0.875rem, 0.83rem + 0.15vw, 1rem) !important;
}
.about-us-text.fadeUp {
  animation: textY-100 1s forwards 0.5s;
}
@media screen and (max-width: 767px) {
  .about-us-text {
    flex-direction: column;
    gap: 0.5rem;
    align-items: center;
    text-align: center;
  }
}
.about-us-text:not(:last-child) {
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .about-us-text:not(:last-child) {
    margin-bottom: 2rem;
  }
}
.about-us-text div.about-us-box {
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 300px;
}
@media screen and (max-width: 1024px) {
  .about-us-text div.about-us-box {
    width: 100%;
    gap: 12px;
    justify-content: center;
  }
}
.about-us-text div.about-us-box img {
  width: 5rem;
}
@media screen and (max-width: 1600px) {
  .about-us-text div.about-us-box img {
    width: 3.5rem;
  }
}
@media screen and (max-width: 767px) {
  .about-us-text div.about-us-box img {
    width: 2.5rem;
  }
}
.about-us-text div.about-us-box p {
  color: #808080;
}
.about-us-text > p {
  width: calc(100% - 330px);
}
@media screen and (max-width: 1024px) {
  .about-us-text > p {
    width: 100%;
  }
  .about-us-text > p br {
    display: none;
  }
}
.about-us-text > p, .about-us-text div:not(.about-us-box) p {
  color: #005949;
  font-size: clamp(1rem, 0.955rem + 0.15vw, 1.125rem);
}
@media screen and (max-width: 1024px) {
  .about-us-text > p, .about-us-text div:not(.about-us-box) p {
    width: 100%;
  }
  .about-us-text > p br, .about-us-text div:not(.about-us-box) p br {
    display: none;
  }
}
.about-us-text div:not(.about-us-box) {
  width: calc(100% - 330px);
}
@media screen and (max-width: 1024px) {
  .about-us-text div:not(.about-us-box) {
    width: 100%;
  }
}
.about-us-text div:not(.about-us-box) img {
  margin-top: 20px;
}
@media screen and (max-width: 767px) {
  .about-us-text div:not(.about-us-box) img {
    width: 75%;
    margin: 20px auto 0;
  }
}

.top-slider-wrap {
  margin: 0 0 5rem;
}
.top-slider-wrap h3 {
  margin: 0 0 1rem 10%;
  color: #005949;
  font-size: 1rem;
}
.top-slider .loopSlide {
  display: flex;
  height: 200px;
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 1600px) {
  .top-slider .loopSlide {
    height: 150px;
  }
}
@media screen and (max-width: 767px) {
  .top-slider .loopSlide {
    height: 120px;
  }
}
.top-slider .loopSlide::before {
  position: absolute;
  content: "";
  background: url(./images/top-slider.png);
  background-repeat: repeat-x;
  background-size: cover;
  width: 100%;
  height: 100%;
  animation: scroll-anim2 120s linear infinite;
  z-index: 5;
}
@keyframes scroll-anim2 {
  100% {
    background-position: -6818px 0;
  }
}

.top-map {
  padding: 5rem 0;
  background-color: #F4F9F9;
  color: #00A987;
  margin-bottom: 7.5rem;
}
@media screen and (max-width: 767px) {
  .top-map {
    padding: 2.5rem 0;
    margin-bottom: 0;
  }
}
.top-map-count {
  display: flex;
  align-items: baseline;
  gap: 0 4px;
  flex-wrap: wrap;
}
.top-map-count .count {
  color: #00A987;
  font-size: clamp(2.5rem, 1.591rem + 3.03vw, 5rem);
  line-height: 1.3;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
}
.top-map-count .count p {
  font-size: clamp(0.875rem, 0.648rem + 0.76vw, 1.5rem) !important;
}
.top-map-count-wrap {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .top-map-count-wrap {
    flex-direction: column;
  }
}
.top-map-title {
  margin: 0 10% 4.5rem;
}
.top-map-title.top-map-title-en h2 {
  font-size: clamp(1rem, 0.455rem + 1.82vw, 2.5rem);
}
@media screen and (max-width: 767px) {
  .top-map-title {
    margin: 0 5% 1rem;
  }
}
.top-map-title p {
  font-size: clamp(1rem, 0.636rem + 1.21vw, 2rem);
}
.top-map-title h2 {
  font-size: clamp(1.5rem, 0.955rem + 1.82vw, 3rem);
}
.top-map-title h2 span {
  background: linear-gradient(transparent 50%, #C1FF72 50%);
}
.top-map-left {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.top-map-wrap {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin: 0 10%;
}
@media screen and (max-width: 1600px) {
  .top-map-wrap {
    margin: 0 5%;
  }
}
@media screen and (max-width: 1024px) {
  .top-map-wrap {
    flex-direction: column;
    gap: 2.5rem;
  }
}
.top-map-right {
  width: 25%;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .top-map-right {
    width: 35%;
  }
}
@media screen and (max-width: 767px) {
  .top-map-right {
    width: 100%;
  }
}
.top-map-right .arrow-btn-bg {
  margin: 0 0 2.5rem auto;
}
@media screen and (max-width: 1024px) {
  .top-map-right .arrow-btn-bg {
    margin: 1.5rem 0 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .top-map-right .arrow-btn-bg {
    margin: 20px auto 0;
  }
}
.top-map-right-wrap {
  position: absolute;
  max-width: 338px;
  aspect-ratio: 1/1;
  width: 90%;
  bottom: 0;
}
@media screen and (max-width: 1024px) {
  .top-map-right-wrap {
    position: relative;
  }
}
@media screen and (max-width: 767px) {
  .top-map-right-wrap {
    width: 60%;
    margin-left: auto;
  }
}
.top-map-right-wrap img {
  position: absolute;
  width: 48%;
  aspect-ratio: 1/1;
  top: -5%;
  left: -15%;
}
@media screen and (max-width: 767px) {
  .top-map-right-wrap img {
    width: 45%;
    margin-left: auto;
  }
}
.top-map-left {
  width: 70%;
}
@media screen and (max-width: 1024px) {
  .top-map-left {
    width: 100%;
  }
}
.top-map-item {
  padding: 1rem 2.5rem;
  background-color: #fff;
  font-weight: bold;
  width: -moz-fit-content;
  width: fit-content;
}
.top-map-item.top-map-item-en .top-map-count .count {
  font-size: clamp(1.25rem, 0.25rem + 3.33vw, 4rem);
}
@media screen and (max-width: 767px) {
  .top-map-item.top-map-item-en p:first-child {
    font-size: 10px;
  }
}
@media screen and (max-width: 1280px) {
  .top-map-item {
    padding: 0.5rem;
  }
}
.top-map-item.last {
  width: 100%;
  position: relative;
  padding-bottom: 2rem;
}
.top-map-item.last::before {
  content: "※前身親会社の期間含む";
  position: absolute;
  color: #898989;
  bottom: 1rem;
  right: 1rem;
  font-weight: normal;
  font-size: clamp(0.75rem, 0.568rem + 0.61vw, 1.25rem);
}
@media screen and (max-width: 1280px) {
  .top-map-item.last::before {
    bottom: 0.5rem;
    right: 0.5rem;
  }
}
.top-map-item.last p:nth-child(2) {
  font-size: clamp(0.75rem, 0.568rem + 0.61vw, 1.25rem);
}
.top-map-item.last p:nth-child(2) span {
  font-size: clamp(1.5rem, 0.227rem + 4.24vw, 5rem);
  line-height: 1.3;
  margin: 0 0.8rem;
}
@media screen and (max-width: 767px) {
  .top-map-item.last p:nth-child(2) span {
    margin: 0;
  }
}
.top-map-item p:first-child {
  font-size: clamp(0.875rem, 0.648rem + 0.76vw, 1.5rem);
}
.top-map-item p:nth-child(2) {
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
.top-map-item p:nth-child(2) span {
  font-size: clamp(2.5rem, 1.591rem + 3.03vw, 5rem);
  line-height: 1.3;
  margin: 0 0.8rem;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  .top-map-item p:nth-child(2) span {
    margin: 0;
  }
}
.top-map-circle {
  background-image: url(./images/top-map-circle.png);
  background-position: top;
  animation: parallax linear both;
  animation-timeline: view();
  aspect-ratio: 1/1;
  border-radius: 999vh;
}
@keyframes parallax {
  from {
    background-position: 40% -100px;
  }
  to {
    background-position: 60% -300px;
  }
}

.top-sales {
  margin: 7.5rem 0;
}
@media screen and (max-width: 767px) {
  .top-sales {
    margin: 5rem 0 0;
  }
}
.top-sales .top-title {
  margin: 0 10% 5rem;
}
@media screen and (max-width: 767px) {
  .top-sales .top-title {
    margin: 0 5% 3rem;
  }
}
.top-sales-wrap {
  top: 5%;
  background-color: #fff;
  position: sticky;
  margin-right: 10%;
  padding: 10rem 0 15rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  opacity: 0;
}
@media screen and (max-width: 1600px) {
  .top-sales-wrap {
    padding: 8rem 0 15rem;
  }
}
@media screen and (max-width: 1024px) {
  .top-sales-wrap {
    padding: 2.5rem 0 5rem;
  }
}
@media screen and (max-width: 1024px) and (min-height: 900px) {
  .top-sales-wrap {
    position: relative;
    padding: 2rem 0;
    flex-direction: column;
    gap: 2.5rem;
    margin: 0;
    align-items: baseline;
  }
}
@media screen and (max-width: 767px) {
  .top-sales-wrap {
    padding: 2rem 0;
    position: relative;
    flex-direction: column;
    gap: 0;
    margin: 0;
    align-items: baseline;
  }
}
.top-sales-wrap.fadeUp_re {
  animation: animate_opacity 1s forwards 0.2s;
}
.top-sales-wrap .arrow-btn-bg {
  margin: 2.5rem 0 0 auto;
}
@media screen and (max-width: 767px) {
  .top-sales-wrap .arrow-btn-bg {
    margin: 1.5rem 0 0 auto;
  }
}
.top-sales-wrap p:not(:last-child) {
  margin-bottom: 1rem;
}
.top-sales-wrap.first .top-sales-img img {
  -o-object-position: bottom;
     object-position: bottom;
}
@media screen and (max-width: 1024px) {
  .top-sales-wrap.last {
    padding: 7.5rem 0 5rem;
  }
}
@media screen and (max-width: 1024px) and (min-height: 900px) {
  .top-sales-wrap.last {
    position: relative;
    padding: 2rem 0 5rem;
  }
}
@media screen and (max-width: 767px) {
  .top-sales-wrap.last {
    position: relative;
    padding: 2rem 0 5rem;
  }
}
.top-sales-text {
  width: 35%;
}
@media screen and (max-width: 1024px) {
  .top-sales-text {
    width: 50%;
  }
}
@media screen and (max-width: 1024px) and (min-height: 900px) {
  .top-sales-text {
    width: 90%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .top-sales-text {
    width: 90%;
    margin: 0 auto;
    padding: 20px 0 0;
  }
}
.top-sales-text h3 {
  color: #005949;
  margin-bottom: 2.5rem;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
}
@media screen and (max-width: 1280px) {
  .top-sales-text h3 {
    margin-bottom: 1rem;
  }
}
.top-sales-img {
  width: 60%;
  border-radius: 0 500px 0 0;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .top-sales-img {
    width: 45%;
  }
}
@media screen and (max-width: 1024px) and (min-height: 900px) {
  .top-sales-img {
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  .top-sales-img {
    width: 90%;
  }
}
.top-sales-img img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.top-sustainability {
  background-color: #F4F9F9;
  padding: 2.5rem 0 7.5rem;
  margin-top: -10rem;
  position: relative;
}
@media screen and (max-width: 1024px) and (min-height: 900px) {
  .top-sustainability {
    margin-top: 0;
  }
}
@media screen and (max-width: 767px) {
  .top-sustainability {
    padding: 2.5rem 0;
    margin-top: 0;
  }
}
.top-sustainability .top-title {
  padding: 0 10% 20px;
  margin-bottom: 0;
}
@media screen and (max-width: 767px) {
  .top-sustainability .top-title {
    padding: 0 5% 1.5rem;
  }
}
.top-sustainability-wrap a {
  padding: 5rem 10%;
  background: url(./images/top-sustainability.png) no-repeat center/cover;
  color: #fff;
  display: block;
}
@media screen and (max-width: 767px) {
  .top-sustainability-wrap a {
    padding: 2.5rem 2.5%;
  }
}
.top-sustainability-wrap a:hover {
  opacity: 0.7;
}
.top-sustainability-wrap a p:first-child {
  font-size: clamp(1.25rem, 0.614rem + 2.12vw, 3rem);
  line-height: 1;
}
.top-sustainability-wrap a p:nth-child(2) {
  margin: 1rem 0;
}

.top-banner {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .top-banner {
    margin: 0;
  }
}
.top-banner a {
  padding: 0 15%;
}
@media screen and (max-width: 767px) {
  .top-banner a {
    padding: 0 5%;
  }
}
.top-banner a img {
  right: 5%;
}

.news.top-news {
  margin: 7.5rem auto 10rem;
  width: 80%;
  display: flex;
  justify-content: space-between;
  max-width: none;
}
@media screen and (max-width: 1024px) {
  .news.top-news {
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  .news.top-news {
    flex-direction: column;
    margin: 2.5rem auto 5rem;
  }
}
.news.top-news .top-news-left {
  width: 230px;
}
@media screen and (max-width: 767px) {
  .news.top-news .top-news-left {
    width: 100%;
  }
  .news.top-news .top-news-left .arrow-btn-bg {
    display: none;
  }
}
.news.top-news .top-news-right {
  width: calc(100% - 300px);
}
@media screen and (max-width: 1024px) {
  .news.top-news .top-news-right {
    width: calc(100% - 280px);
  }
}
@media screen and (max-width: 767px) {
  .news.top-news .top-news-right {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .news.top-news .arrow-btn-bg {
    margin: 1.5rem auto 0;
  }
}

.page-id-251 .top-map-item.last::before {
  content: "(*Including the period under parent companies)";
}
.page-id-251 .news.top-news .top-news-left {
  width: 350px;
}
@media screen and (max-width: 1024px) {
  .page-id-251 .news.top-news .top-news-left {
    width: 280px;
  }
}
@media screen and (max-width: 767px) {
  .page-id-251 .news.top-news .top-news-left {
    width: 100%;
  }
}
.page-id-251 .news.top-news .top-news-right {
  width: calc(100% - 380px);
}
@media screen and (max-width: 1024px) {
  .page-id-251 .news.top-news .top-news-right {
    width: calc(100% - 330px);
  }
}
@media screen and (max-width: 767px) {
  .page-id-251 .news.top-news .top-news-right {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .page-id-251 .top-sales-wrap {
    padding: 0.5rem 0 10rem;
  }
}
@media screen and (max-width: 767px) {
  .page-id-251 .top-sales-wrap.last {
    padding: 0.5rem 0 20rem;
  }
}
@media screen and (max-width: 767px) {
  .page-id-251 .top-map-item p:nth-child(2) span {
    padding: 0 0.5rem;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-251 .top-map-item.fadeUp.last p:last-child br.pc {
    display: none;
  }
}
.page-id-251 .top-map-item.fadeUp.last span.span-3 {
  animation: animate_opacity 1s forwards 1.5s;
}
.page-id-251 .top-map-item.fadeUp.last span.span-4 {
  animation: animate_opacity 1s forwards 2s;
}
@media screen and (max-width: 767px) {
  .page-id-251 .fv-text-en {
    writing-mode: initial;
  }
}
@media screen and (max-width: 767px) {
  .page-id-251 .fv-text:has(.fv-text-en) {
    width: 90%;
    text-align: center;
  }
}

/*404*/
.not-found {
  margin: 10rem auto 5rem;
  text-align: center;
  width: 90%;
}
@media screen and (max-width: 767px) {
  .not-found {
    margin: 7.5rem auto;
  }
}
.not-found .section-title {
  margin-bottom: 2.5rem;
}
.not-found .section-title h1 {
  font-size: clamp(2.5rem, 2.318rem + 0.61vw, 3rem);
}
.not-found .section-title h2 {
  font-size: 1.5rem;
}
@media screen and (max-width: 767px) {
  .not-found .section-title {
    margin-bottom: 20px;
  }
}
.not-found p {
  margin-bottom: 2.5rem;
}
@media screen and (max-width: 767px) {
  .not-found p {
    margin-bottom: 1rem;
  }
}

@media screen and (max-width: 1024px) {
  .sec-policy {
    margin-top: 2rem !important;
  }
}
.sec-policy .policy-a {
  color: #fff;
  padding: 1.5rem 3rem;
  border-radius: 10px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.45);
  border: 6px solid #fff;
  background-color: #7BE1CF;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 1rem;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  position: relative;
  z-index: 0;
  font-weight: bold;
}
.sec-policy .policy-a:hover {
  opacity: 0.7;
}
.sec-policy .policy-a::before {
  content: "";
  position: absolute;
  background-color: #50CAB4;
  left: 0;
  top: 50%;
  width: 100%;
  height: 50%;
  z-index: -1;
}

.policy {
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .policy {
    margin-bottom: 1.5rem;
  }
}
.policy h3 {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  padding-bottom: 0.5rem;
  margin-bottom: 20px;
  border-bottom: 1px solid #707070;
  color: #005949;
  max-width: 600px;
}
.policy p {
  width: 95%;
  margin: 0 auto;
  line-height: 2;
}
.policy p:not(:last-child) {
  margin-bottom: 1rem;
}
.policy p span {
  display: inline-block;
}
.policy table {
  border-collapse: collapse;
  margin-top: 1rem;
}
.policy table td {
  padding: 1rem;
  border: 1px solid;
}
@media screen and (max-width: 767px) {
  .policy table td {
    padding: 0.5rem;
  }
}
.policy li {
  list-style: inside;
  padding-left: 1rem;
  width: 95%;
  margin: 0 auto;
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .policy li {
    padding-left: 0;
  }
}
.policy ol.second-list li {
  list-style: lower-roman;
}

/*contact*/
.contact {
  max-width: 800px;
  margin: 0 auto;
}
.contact form {
  margin: 5rem auto;
}
@media screen and (max-width: 767px) {
  .contact form {
    margin: 2.5rem auto;
  }
}
@media screen and (max-width: 1024px) {
  .contact form > div {
    width: 100%;
  }
  .contact form > div div {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .contact form > div {
    flex-direction: column;
    gap: 0.5rem;
  }
}
.contact form > div:not(:last-child) {
  margin-bottom: 2.5rem;
  display: flex;
  justify-content: space-between;
}
.contact form > div p:first-child {
  text-align: left;
  margin-bottom: 8px;
  font-size: 1rem;
  font-weight: bold;
  width: 320px;
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
@media screen and (max-width: 1024px) {
  .contact form > div p:first-child {
    width: 100%;
    margin-bottom: 0;
  }
}
.contact form > div p:last-child {
  width: calc(100% - 380px);
  max-width: 420px;
}
@media screen and (max-width: 1024px) {
  .contact form > div p:last-child {
    width: calc(100% - 280px);
  }
}
@media screen and (max-width: 767px) {
  .contact form > div p:last-child {
    width: 100%;
  }
}
.contact p:has(input[type=submit]) {
  width: -moz-fit-content !important;
  width: fit-content !important;
}
.contact input:not([type=radio]),
.contact textarea,
.contact select {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  color: #000;
  padding: 6px 1rem;
  width: 100%;
  border: 1px solid #707070;
  background-color: #fff;
  border-radius: 3px;
}
.contact p:has(select) {
  position: relative;
}
.contact p:has(select)::after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
  border-top: 12px solid #555555;
  border-bottom: 0;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  position: absolute;
}
.contact select[name=menu-250] {
  font-size: clamp(0.688rem, 0.574rem + 0.38vw, 1rem);
}
.contact .required {
  color: #00A987;
  display: inline-block;
  font-weight: bold;
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
.contact .contact-policy {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}
.contact .contact-policy .required {
  margin-bottom: 4px;
}
.contact p:has(.contact-policy) {
  text-align: center;
  margin-top: 5rem;
}
@media screen and (max-width: 767px) {
  .contact p:has(.contact-policy) {
    margin-top: 2.5rem;
  }
}
.contact .contact-policy label {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
@media screen and (max-width: 767px) {
  .contact .contact-policy label {
    gap: 0.3rem;
  }
}
.contact .contact-policy input {
  display: inline-block;
  width: 22px;
  height: 22px;
  margin-top: 0;
}
@media screen and (max-width: 1024px) {
  .contact .contact-policy input {
    width: 20px;
    height: 20px;
  }
}
.contact .current-check {
  opacity: 0;
  pointer-events: none;
}
.contact input[type=checkbox] {
  position: relative;
  width: 20px;
  height: 20px;
  border: 1px solid #000;
  border-radius: 0;
  vertical-align: -5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0;
  margin: 0;
}
@media screen and (max-width: 767px) {
  .contact input[type=checkbox] {
    width: 15px;
    height: 15px;
  }
}
.contact input[type=checkbox]:checked:before {
  position: absolute;
  top: 1px;
  left: 5px;
  transform: rotate(50deg);
  width: 8px;
  height: 12px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  content: "";
  z-index: 1;
}
@media screen and (max-width: 767px) {
  .contact input[type=checkbox]:checked:before {
    top: 1px;
    left: 3px;
    width: 7px;
    height: 9px;
  }
}
.contact input[type=checkbox]:checked:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #0779FF;
  content: "";
}
.contact .contact-policy a {
  text-decoration: underline;
  color: #0779FF;
}
.contact p:has(input[type=submit]),
.contact p:has(input[type=button]) {
  position: relative;
}
.contact p:has(input[type=submit])::before,
.contact p:has(input[type=button])::before {
  content: "";
  position: absolute;
  width: 1rem;
  height: 1rem;
  background: url(./images/page-top.png) no-repeat center/contain;
  top: 50%;
  right: 2rem;
  transform: translateY(-50%) rotate(90deg);
  -webkit-transform: translateY(-50%) rotate(90deg);
  -ms-transform: translateY(-50%) rotate(90deg);
  z-index: 10;
}
.contact input[type=submit],
.contact input[type=button] {
  background: #00A987;
  width: -moz-fit-content;
  width: fit-content;
  margin: 5rem auto 0;
  color: #fff;
  font-weight: bold;
  text-align: center;
  padding: 1rem 2.5rem;
  border-radius: 40px;
  width: 240px;
  display: block;
  font-size: 1rem;
  letter-spacing: 1px;
  position: relative;
  border: none;
}
@media screen and (max-width: 767px) {
  .contact input[type=submit],
  .contact input[type=button] {
    min-width: 215px;
    padding: 1rem 2.5rem;
    margin-top: 0;
  }
}
.contact input[type=submit]:hover,
.contact input[type=button]:hover {
  cursor: pointer;
  opacity: 0.7;
}
.contact .submit-wrap {
  margin: 0 auto 0;
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 767px) {
  .contact .submit-wrap {
    margin-top: 2.5rem;
  }
}
.contact input.wpcf7-not-valid {
  background-color: #FFF1F1;
}
.contact input.wpcf7-not-valid span {
  height: 0;
  margin-bottom: 2rem;
}
.contact .wpcf7-not-valid-tip {
  text-align: left;
  color: red;
}
.contact .wpcf7-spinner {
  display: none;
}
.contact textarea {
  resize: vertical; /* 縦方向のリサイズを許可 */
}

/*contact-confirm*/
.contact-confirm form > div:not(:last-child) {
  flex-direction: column;
  border-bottom: 1px solid #707070;
}
.contact-confirm form > div p:first-child {
  color: #005949;
}
.contact-confirm form > div:not(.submit-btn) p:last-child {
  color: #000;
  width: 100%;
  text-align: left;
  max-width: none;
}
.contact-confirm .submit-wrap {
  margin: 0;
}
.contact-confirm .submit-wrap:has(input[type=button])::after {
  left: 100%;
  width: 100%;
}
.contact-confirm .submit-wrap:has(input[type=button]):hover::after {
  left: 0;
}
.contact-confirm .submit-btn {
  margin: 5rem auto 0;
  flex-direction: row-reverse !important;
  justify-content: space-around !important;
  border: none !important;
}
@media screen and (max-width: 1024px) {
  .contact-confirm .submit-btn {
    margin-top: 3rem;
  }
}
@media screen and (max-width: 767px) {
  .contact-confirm .submit-btn {
    flex-direction: column !important;
    align-items: center;
    gap: 2.5rem;
  }
}
.contact-confirm .submit-btn input {
  margin-top: 0;
}
.contact-confirm .submit-btn input[type=button] {
  background: #707070;
  padding: 0.5rem;
  width: 150px;
  min-width: auto;
}
.contact-confirm .submit-btn p:has(input[type=button])::before {
  transform: translateY(-50%) rotate(-90deg);
  -webkit-transform: translateY(-50%) rotate(-90deg);
  -ms-transform: translateY(-50%) rotate(-90deg);
}
.contact-confirm .submit-btn input[type=button]:hover {
  background-color: #231E20;
}

/*contact-thanks*/
.thanks {
  text-align: center;
}
@media screen and (max-width: 767px) {
  .thanks .arrow-btn-bg {
    margin: 2.5rem auto;
  }
}
.thanks h2 {
  color: #005949;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #000;
  max-width: 580px;
  margin: 0 auto 2rem;
}
@media screen and (max-width: 767px) {
  .thanks h2 {
    margin-bottom: 1.5rem;
  }
}
.thanks p {
  font-weight: bold;
}
.thanks p:not(:last-child) {
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .thanks p:not(:last-child) {
    margin-bottom: 1rem;
  }
}
.thanks-box {
  background-color: #F5F5F5;
  max-width: 530px;
  margin: 1rem auto 2rem;
  padding: 2.5rem 0;
}
.thanks-box p {
  margin-bottom: 0 !important;
}

/*about*/
.company-btn {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .company-btn {
    gap: 0.5rem;
    margin-bottom: 2.5rem;
  }
}
.company-btn a {
  width: 40%;
  max-width: 440px;
  position: relative;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  color: #fff;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .company-btn a {
    width: calc((100% - 8px) / 2);
  }
}
.company-btn a img {
  transition: 0.3s;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 767px) {
  .company-btn a img {
    aspect-ratio: 171/88;
  }
}
.company-btn a:hover {
  opacity: 0.7;
}
.company-btn a p {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: -moz-max-content;
  width: max-content;
}
.company-greeting {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin: 0 auto 7.5rem;
  width: 90%;
}
@media screen and (max-width: 1280px) {
  .company-greeting {
    flex-direction: column;
    align-items: center;
  }
}
.company-greeting-wrap {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  width: 35%;
  margin-bottom: 2.5rem;
  flex-direction: column;
  gap: 20px;
}
@media screen and (max-width: 1280px) {
  .company-greeting-wrap {
    width: 50%;
  }
}
@media screen and (max-width: 767px) {
  .company-greeting-wrap {
    flex-direction: column;
    gap: 0;
    align-items: center;
    margin-bottom: 1rem;
    width: 100%;
  }
}
.company-greeting-wrap p {
  font-size: 1rem;
  font-weight: bold;
}
.company-greeting-wrap p span {
  color: #005949;
  display: block;
  font-size: 2rem;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .company-greeting {
    width: 100%;
    margin-bottom: 5rem;
  }
}
.company-greeting-text {
  width: 60%;
}
@media screen and (max-width: 1280px) {
  .company-greeting-text {
    width: 100%;
  }
}
.company-greeting-text p {
  margin-bottom: 1.5rem;
}
.company-greeting-text span{
  font-weight: bold;
  text-decoration: underline;
}
.company iframe {
  width: 100%;
  height: 300px;
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .company iframe {
    margin-bottom: 2.5rem;
  }
}

.service-solution {
  display: flex;
  flex-wrap: wrap;
  gap: 5rem 5%;
  margin: 2.5rem 0;
}
@media screen and (max-width: 1024px) {
  .service-solution {
    gap: 2.5rem;
  }
}
.service-solution-item {
  width: 47.5%;
  display: flex;
  justify-content: space-between;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .service-solution-item {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .service-solution-item {
    flex-direction: column;
    gap: 0.5rem;
  }
}
.service-solution-item h3 {
  font-size: clamp(0.875rem, 0.648rem + 0.76vw, 1.5rem);
  color: #005949;
  display: flex;
  align-items: center;
}
.service-solution-item h3 span {
  position: relative;
  padding: 0 3rem 3rem 0;
  margin-bottom: 3.5rem;
}
@media screen and (max-width: 1600px) {
  .service-solution-item h3 span {
    padding: 0 2.5rem 1rem 0;
    margin-bottom: 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  .service-solution-item h3 span {
    padding: 0px 1rem 0rem 0;
    margin-bottom: 0;
  }
}
.service-solution-item h3 span::before {
  content: "";
  position: absolute;
  width: 120%;
  height: auto;
  aspect-ratio: 1/1;
  border-bottom: 2px solid;
  transform: rotate(-45deg);
  top: -2rem;
  left: -2rem;
}
@media screen and (max-width: 767px) {
  .service-solution-item h3 span::before {
    width: 17px;
    transform: rotate(-70deg);
    top: 0px;
    left: 8px;
  }
}
.service-solution-item img {
  width: 34%;
}
@media screen and (max-width: 767px) {
  .service-solution-item img {
    width: 100%;
    aspect-ratio: 350/137;
    -o-object-fit: cover;
       object-fit: cover;
  }
}
.service-solution-item div {
  width: 60%;
}
@media screen and (max-width: 767px) {
  .service-solution-item div {
    width: 100%;
  }
}
.service > h3 {
  color: #005949;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  padding: 12px 2.5rem;
  background-color: #F4F9F9;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .service > h3 {
    padding: 0.5rem 1rem;
  }
}
.service-list {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 5%;
  margin-bottom: 5rem;
}
.service-list div {
  width: 47.5%;
  padding: 1.5rem 2%;
  background-color: #F4F9F9;
}
@media screen and (max-width: 767px) {
  .service-list div {
    width: 100%;
  }
}
.service-list div p {
  font-size: clamp(0.75rem, 0.705rem + 0.15vw, 0.875rem);
}
.service-list div p:first-child {
  font-weight: bold;
  color: #005949;
  font-size: clamp(0.75rem, 0.568rem + 0.61vw, 1.25rem);
}
.service-sell {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 5%;
  margin-bottom: 5rem;
}
.service-sell > div {
  width: 47.5%;
  padding: 1.5rem 2%;
  background-color: #F4F9F9;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 1024px) {
  .service-sell > div {
    width: 100%;
  }
}
.service-sell > div p {
  font-weight: bold;
}
.service-sell > div p:first-child {
  color: #005949;
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
.service-sell > div img {
  margin-top: 20px;
}
.service-contact {
  width: 70%;
  margin: 4rem auto 10rem;
  background-color: #ECF3F3;
  padding: 20px 2.5rem;
}
@media screen and (max-width: 1024px) {
  .service-contact {
    width: 80%;
    padding: 0;
  }
}
@media screen and (max-width: 767px) {
  .service-contact {
    width: 90%;
    margin: 5rem auto 7.5rem;
  }
}
.service-contact-wrap {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .service-contact-wrap {
    flex-direction: column-reverse;
  }
}
.service-contact-img {
  position: absolute;
  height: 100%;
  width: 50%;
  right: 0;
  top: 0;
}
@media screen and (max-width: 1024px) {
  .service-contact-img {
    position: relative;
    width: 100%;
  }
}
.service-contact-img img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
  -o-object-position: left;
     object-position: left;
}
.service-contact-text {
  width: -moz-fit-content;
  width: fit-content;
  padding: 2rem 5%;
  color: #005949;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .service-contact-text {
    text-align: center;
    position: relative;
    z-index: 0;
    padding: 1rem 5% 2.5rem;
  }
  .service-contact-text::before {
    content: "";
    position: absolute;
    width: 95%;
    height: 95%;
    background-color: #fff;
    top: 0;
    left: 2.5%;
    z-index: -1;
  }
}
.service-contact-text h3 {
  font-size: 1rem;
  position: relative;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .service-contact-text h3 {
    margin-bottom: 0.5rem;
  }
}
.service-contact-text h3::before {
  content: "";
  position: absolute;
  width: 75%;
  height: 1px;
  background-color: #005949;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .service-contact-text h3::before {
    display: none;
  }
}
.service-contact-text p:last-of-type {
  font-size: clamp(1.25rem, 1.159rem + 0.3vw, 1.5rem);
  line-height: 1.5;
}
.service-contact-text .arrow-btn-bg {
  margin: 2.5rem 0 0 0;
}
@media screen and (max-width: 767px) {
  .service-contact-text .arrow-btn-bg {
    margin: 20px auto 0;
  }
}

.slide-in {
  overflow: hidden;
  display: inline-block;
}

.slide-in_inner {
  display: inline-block;
}

/*左右のアニメーション*/
.leftAnime {
  opacity: 0; /*事前に透過0にして消しておく*/
}

.slideAnimeLeftRight {
  animation-name: slideTextX100;
  animation-duration: 0.8s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes slideTextX100 {
  from {
    transform: translateX(-100%); /*要素を左の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0); /*要素を元の位置に移動*/
    opacity: 1;
  }
}
.slideAnimeRightLeft {
  animation-name: slideTextX-100;
  animation-duration: 0.8s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes slideTextX-100 {
  from {
    transform: translateX(100%); /*要素を右の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0); /*要素を元の位置に移動*/
    opacity: 1;
  }
}
@keyframes fadeRightAnime2 {
  from {
    opacity: 0;
    transform: translateX(-300px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fadeLeftAnime {
  from {
    opacity: 0;
    transform: translateX(300px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fadeUpAnime {
  from {
    opacity: 0;
    top: 100%;
  }
  to {
    opacity: 1;
    top: 50%;
  }
}
@keyframes fadeUpAnime2 {
  from {
    opacity: 0;
    top: 50%;
  }
  to {
    opacity: 1;
    top: 0%;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes text-right {
  100% {
    transform: translateX(-100%);
  }
}
@keyframes animate_opacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes slideY-100 {
  from {
    transform: translateY(300px); /*要素を右の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0); /*要素を元の位置に移動*/
    opacity: 1;
  }
}
@keyframes textY-100 {
  from {
    transform: translateY(30%); /*要素を右の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0); /*要素を元の位置に移動*/
    opacity: 1;
  }
}
@keyframes animate_arrow {
  from {
    left: -100%;
  }
  to {
    left: -85%;
  }
}
.blue-wrap {
  position: relative;
  padding: 2.5rem 0 5rem;
  z-index: 0;
  margin-top: 5rem;
}
@media screen and (max-width: 767px) {
  .blue-wrap {
    margin-top: 2.5rem;
    padding: 2rem 0 2.5rem;
  }
}
.blue-wrap::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 0 500px 0 0;
  background-color: #ECF3F3;
  bottom: 0;
  left: 0;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .blue-wrap::before {
    border-radius: 0 100px 0 0;
  }
}

.message {
  margin: 5rem 0 0 auto;
  display: flex;
  width: 90%;
  justify-content: space-between;
  max-width: 1632px;
  flex-direction: row-reverse;
}
@media screen and (max-width: 1400px) {
  .message {
    width: 95%;
  }
}
@media screen and (max-width: 1280px) {
  .message {
    flex-direction: column;
    gap: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .message {
    gap: 1rem;
    width: 100%;
    margin: 2.5rem 0 0;
  }
}
.message img {
  width: 50%;
  border-radius: 300px 0 0 0;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 1280px) {
  .message img {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .message img {
    width: 95%;
    margin: 0 0 0 auto;
  }
}
.message-text {
  width: 45%;
}
.message-text .recruit-title h2 {
  text-align: left;
}
@media screen and (max-width: 1280px) {
  .message-text {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .message-text {
    width: 90%;
    margin: 0 auto;
  }
}
.message-text-item {
  font-weight: bold;
}
.message-text-item p:not(:last-child) {
  margin-bottom: 1rem;
}

.culture {
  display: flex;
  width: 70%;
  margin: 5rem auto 0;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 1600px) {
  .culture {
    width: 80%;
    margin: 5rem 15% 0 5%;
  }
}
@media screen and (max-width: 1280px) {
  .culture {
    flex-direction: column;
    gap: 2.5rem;
    align-items: center;
    margin-top: 4rem;
  }
}
@media screen and (max-width: 767px) {
  .culture {
    width: 100%;
    margin: 2rem 0 0;
  }
}
.culture-img {
  width: 40%;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  .culture-img {
    width: 70%;
  }
}
@media screen and (max-width: 767px) {
  .culture-img {
    width: 90%;
  }
}
.culture-img img {
  width: 47.5%;
  height: -moz-fit-content;
  height: fit-content;
  aspect-ratio: 160/232;
  opacity: 0;
}
.culture-img img:first-child {
  margin-top: 10rem;
}
.culture-img img.fadeUp {
  animation: slideY-100 1.5s forwards 0.3s;
}
.culture-text {
  width: 55%;
  display: flex;
  gap: 2.5rem;
}
@media screen and (max-width: 1280px) {
  .culture-text {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .culture-text {
    flex-direction: column;
    align-items: center;
    gap: 0;
    width: 90%;
    margin: 0 auto;
  }
}
.culture-text-item:first-child {
  margin-bottom: 5rem;
}
@media screen and (max-width: 1280px) {
  .culture-text-item:first-child {
    margin-bottom: 2.5rem;
  }
}
.culture-text-item p:first-child {
  color: #005949;
  font-weight: bold;
  margin-bottom: 0.5rem;
}

.voice {
  margin: 5rem auto 7.5rem;
  width: 80%;
}
@media screen and (max-width: 1600px) {
  .voice {
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  .voice {
    margin-bottom: 5rem;
  }
}
.voice .sdg-thumbnail {
  margin: 2.5rem auto 20px;
  width: 90%;
  overflow: hidden;
}
.voice .sdg-thumbnail img {
  aspect-ratio: 1/1;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 999vh;
  width: 80%;
  max-width: 160px;
  margin: 0 auto 0.5rem;
  -o-object-position: 75%;
     object-position: 75%;
}
.voice .sdg-thumbnail p {
  text-align: center;
  color: #005949;
  font-weight: bold;
}
.voice .sdg-thumbnail .swiper-slide {
  opacity: 0.5;
  transition: 0.3s;
  cursor: pointer;
}
.voice .sdg-thumbnail .swiper-slide:hover {
  opacity: 1;
}
.voice .sdg-thumbnail .swiper-slide-thumb-active {
  opacity: 1;
}
.voice .sdg-slider {
  position: relative;
}
.voice .sdg-slider .swiper-button-next, .voice .sdg-slider .swiper-button-prev {
  width: 3rem;
  height: 6rem;
  top: -10rem;
}
@media screen and (max-width: 1600px) {
  .voice .sdg-slider .swiper-button-next, .voice .sdg-slider .swiper-button-prev {
    width: 2.5rem;
    height: 2.5rem;
    top: -7rem;
  }
}
@media screen and (max-width: 1280px) {
  .voice .sdg-slider .swiper-button-next, .voice .sdg-slider .swiper-button-prev {
    top: -6rem;
  }
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-button-next, .voice .sdg-slider .swiper-button-prev {
    width: 1rem;
    height: 1.5rem;
    top: -5rem;
  }
}
.voice .sdg-slider .swiper-button-prev {
  left: -5rem;
}
@media screen and (max-width: 1600px) {
  .voice .sdg-slider .swiper-button-prev {
    left: -1rem;
  }
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-button-prev {
    left: 0;
  }
}
.voice .sdg-slider .swiper-button-prev::after {
  background: url(./images/sdg-before.png) no-repeat center/contain;
  width: 3rem;
  height: 6rem;
}
@media screen and (max-width: 1600px) {
  .voice .sdg-slider .swiper-button-prev::after {
    width: 2.5rem;
    height: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-button-prev::after {
    width: 1rem;
    height: 1.5rem;
  }
}
.voice .sdg-slider .swiper-button-next {
  right: -5rem;
}
@media screen and (max-width: 1600px) {
  .voice .sdg-slider .swiper-button-next {
    right: -1rem;
  }
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-button-next {
    right: 0;
  }
}
.voice .sdg-slider .swiper-button-next::after {
  background: url(./images/sdg-after.png) no-repeat center/contain;
  width: 3rem;
  height: 6rem;
}
@media screen and (max-width: 1600px) {
  .voice .sdg-slider .swiper-button-next::after {
    width: 2.5rem;
    height: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-button-next::after {
    width: 1rem;
    height: 1.5rem;
  }
}
.voice .sdg-slider .swiper-slide {
  opacity: 0 !important;
  z-index: -1;
  height: 0;
  background-color: #ECF3F3;
  padding: 1.5rem 2.5rem;
}
.voice .sdg-slider .swiper-slide.swiper-slide-active {
  opacity: 1 !important;
  z-index: 1;
  height: 100%;
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-slide {
    padding: 1.5rem 0 0;
  }
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-slide > a {
    display: flex;
    gap: 1rem;
    margin-top: 2rem;
    padding: 0.5rem;
    background-color: #005949;
    color: #fff;
    font-weight: bold;
    text-align: center;
    gap: 1rem;
    align-items: center;
    justify-content: center;
  }
}
.voice .sdg-slider .swiper-slide > a img {
  width: 12px;
  height: 12px;
  transform: rotate(180deg);
}
.voice .sdg-slider .swiper-slide .sdg-slider-title {
  display: flex;
  color: #005949;
  font-weight: bold;
  gap: 0 1rem;
  flex-wrap: wrap;
  margin: 0rem 0 1rem;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-slide .sdg-slider-title {
    width: 90%;
    margin: 0 auto 1rem;
  }
}
.voice .sdg-slider .swiper-slide-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 1280px) {
  .voice .sdg-slider .swiper-slide-wrap {
    gap: 1rem;
    flex-direction: column-reverse;
  }
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-slide-wrap {
    gap: 20px;
  }
}
.voice .sdg-slider .swiper-slide-wrap .table_design03 tbody {
  border: none;
}
.voice .sdg-slider .swiper-slide-wrap .table_design03 td {
  padding: 0.25rem;
  word-break: break-all;
}
.voice .sdg-slider .swiper-slide-wrap .table_design03 td:first-child {
  min-width: 100px;
}
.voice .sdg-slider .swiper-slide-wrap .table_design03 td p {
  font-weight: normal !important;
  margin-bottom: 0 !important;
  line-height: 1.3 !important;
}
.voice .sdg-slider .swiper-slide .sdg-slider-1 {
  width: 35%;
}
@media screen and (max-width: 1280px) {
  .voice .sdg-slider .swiper-slide .sdg-slider-1 {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-slide .sdg-slider-1 {
    width: 90%;
    margin: 0 auto;
  }
}
.voice .sdg-slider .swiper-slide .sdg-slider-1 .sdg-slider-history {
  background-color: #fff;
  padding: 1rem;
  margin-bottom: 1rem;
}
.voice .sdg-slider .swiper-slide .sdg-slider-1 .sdg-slider-history p:first-child {
  font-weight: bold;
  margin-bottom: 0.5rem;
  line-height: 1;
}
.voice .sdg-slider .swiper-slide .sdg-slider-1 .sdg-time {
  background-color: #fff;
  padding: 1rem;
}
.voice .sdg-slider .swiper-slide .sdg-slider-1 .sdg-time h4 {
  font-size: 1rem;
  color: #00A987;
  text-align: center;
  font-size: 20px;
}
.voice .sdg-slider .swiper-slide .sdg-slider-1 .content-down {
  background-color: #00A987 !important;
  color: #fff;
  padding: 0 !important;
  border-radius: 24px;
  width: 130px !important;
  gap: 8px;
  margin: 1rem auto 0;
}
.voice .sdg-slider .swiper-slide .sdg-slider-1 .content-down img {
  width: 13px;
  height: 12px;
  margin-top: 3px;
}
.voice .sdg-slider .swiper-slide .sdg-slider-2 {
  width: 63%;
  background-color: #fff;
  padding: 1rem;
}
@media screen and (max-width: 1280px) {
  .voice .sdg-slider .swiper-slide .sdg-slider-2 {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider .swiper-slide .sdg-slider-2 {
    width: 90%;
    margin: 0 auto;
  }
}
.voice .sdg-slider .swiper-slide .sdg-slider-2 h3 {
  color: #005949;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  margin-bottom: 1rem;
}
.voice .sdg-slider-img {
  position: relative;
}
@media screen and (max-width: 767px) {
  .voice .sdg-slider-img::before {
    content: "";
    position: absolute;
    width: 20%;
    aspect-ratio: 1/1;
    bottom: 0;
    left: 0;
  }
}

.requirements {
  width: 80%;
  margin: 0 auto 5rem;
  background-color: #ECF3F3;
  padding: 2.5rem 5%;
}
@media screen and (max-width: 1024px) {
  .requirements {
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  .requirements {
    padding: 1rem 5%;
  }
}
.requirements-bg {
  background-color: #fff;
  padding: 20px 2.5rem 2.5rem;
}
@media screen and (max-width: 767px) {
  .requirements-bg {
    padding: 1rem 0%;
  }
}
.requirements-table {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1400px) {
  .requirements-table {
    flex-direction: column;
  }
}
@media screen and (max-width: 767px) {
  .requirements-table {
    width: 90%;
    margin: 0 auto;
  }
}
.requirements-table table {
  width: 48%;
}
@media screen and (max-width: 1400px) {
  .requirements-table table {
    width: 100%;
  }
}
.requirements-wrap {
  background: url(./images/requirements-img.png) no-repeat center/cover;
  padding: 2.5rem 0;
  text-align: center;
  color: #fff;
  font-weight: bold;
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 767px) {
  .requirements-wrap {
    margin-bottom: 0;
  }
}
.requirements-img {
  position: relative;
  width: 30%;
  max-width: 200px;
}
@media screen and (max-width: 767px) {
  .requirements-img {
    width: 47.5%;
  }
}
@media screen and (max-width: 767px) {
  .requirements-img:first-child {
    width: 100%;
    max-width: none;
  }
  .requirements-img:first-child img {
    width: 47.5%;
    margin: 0 auto;
  }
  .requirements-img:first-child p {
    bottom: 15%;
  }
}
.requirements-img:nth-child(2) p {
  bottom: 18%;
}
.requirements-img p {
  position: absolute;
  color: #005949;
  bottom: 20%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: -moz-max-content;
  width: max-content;
  text-align: center;
  line-height: 1.3;
  font-size: clamp(0.625rem, 0.489rem + 0.45vw, 1rem);
}
.requirements-img-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  width: 80%;
  margin: 2rem auto 0;
  max-width: 860px;
}
@media screen and (max-width: 1024px) {
  .requirements-img-wrap {
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  .requirements-img-wrap {
    justify-content: center;
    gap: 1rem 5%;
  }
}
.requirements .table_design03 tbody {
  border: none;
}
.requirements .table_design03 td {
  vertical-align: baseline;
}
@media screen and (max-width: 767px) {
  .requirements .table_design03 tr {
    gap: 0;
  }
}
.requirements .table_design03 td:last-child {
  font-weight: normal;
}

/*お知らせ一覧ページ*/
.news {
  margin: 5rem auto 10rem;
  max-width: 1145px;
}
@media screen and (max-width: 767px) {
  .news {
    margin: 1.5rem auto 7.5rem;
  }
}
.news-contents {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
@media screen and (max-width: 767px) {
  .news-contents {
    gap: 0;
  }
}
.news-category {
  display: flex;
  margin-bottom: 2.5rem;
  justify-content: space-between;
}
.news-category a {
  width: 33.3333333333%;
  text-align: center;
  font-weight: bold;
  font-size: clamp(0.75rem, 0.568rem + 0.61vw, 1.25rem);
  padding-bottom: 0.5rem;
  position: relative;
}
.news-category a::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 12px;
  background-color: #D9D9D9;
  bottom: -12px;
  left: 0;
  transition: 0.3s;
}
.news-category a:hover {
  opacity: 0.7;
}
.news-category a:hover::before {
  background-color: #00A987;
}
.news .item:first-child {
  border-top: 1px solid;
}
.news .news-item {
  padding: 2rem 0;
  border-bottom: 1px solid #01373E;
}
@media screen and (max-width: 767px) {
  .news .news-item {
    padding: 1rem 0;
  }
}
.news .news-item:hover {
  opacity: 0.7;
  cursor: pointer;
  transition: 0.3s;
}
.news .newsList li:first-child {
  font-size: clamp(0.75rem, 0.705rem + 0.15vw, 0.875rem);
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .news .newsList li:first-child {
    margin-bottom: 0.5rem;
  }
}
.news .newsList li:nth-child(2) {
  font-weight: bold;
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
.news .newsList li span {
  margin-left: 1rem;
  padding: 2px 8px;
  color: #005949;
  border: 1px solid;
  border-radius: 5px;
}
@media screen and (max-width: 767px) {
  .news .newsList li span {
    margin-left: 0.5rem;
  }
}

/*詳細ページ*/
.single-news {
  margin: 0rem auto 5rem;
  max-width: 850px;
  padding: 2.5rem 0;
}
@media screen and (max-width: 767px) {
  .single-news {
    background-color: transparent;
    padding: 0;
    margin: 2.5rem auto 7.5rem;
  }
}
.single-news .news-left {
  width: 100%;
}
.single-news .article_title {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  margin: 1.5rem 0;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #707070;
}
@media screen and (max-width: 767px) {
  .single-news .article_title {
    margin: 0.5rem 0 1rem;
  }
}
.single-news .single-wrap {
  margin-top: 3rem;
}
@media screen and (max-width: 767px) {
  .single-news .single-wrap {
    margin-top: 0;
  }
}
.single-news .content + a {
  margin: 5rem auto 0;
}
@media screen and (max-width: 767px) {
  .single-news .content + a {
    margin-top: 3rem;
  }
}
.single-news .content p {
  line-height: 1.5;
}
.single-news .content p:not(:last-child) {
  margin-bottom: 1.5rem;
}
.single-news .article_meta {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: clamp(0.75rem, 0.568rem + 0.61vw, 1.25rem);
}
@media screen and (max-width: 767px) {
  .single-news .article_meta {
    gap: 0.25rem;
  }
}
.single-news .article_meta p:nth-child(2) {
  border: 1px solid;
  border-radius: 10px;
  padding: 4px 12px;
}
@media screen and (max-width: 767px) {
  .single-news .article_meta p:nth-child(2) {
    padding: 4px 8px;
    line-height: 1;
  }
}
.single-news .article_meta a {
  border: 1px solid;
  border-radius: 10px;
  padding: 4px 12px;
  color: #005949;
}

.catch {
  margin: 3rem auto 2.5rem;
  width: 90%;
}
@media screen and (max-width: 767px) {
  .catch {
    width: 100%;
    margin: 1rem 0 20px;
  }
}
.catch:has(.thumbnail) {
  padding: 10% 5%;
  background-color: #01373E;
}
.catch img {
  max-height: 450px;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 1024px) {
  .catch img {
    max-height: 350px;
  }
}
.catch img.thumbnail {
  -o-object-fit: contain;
     object-fit: contain;
  width: 80%;
  max-width: 400px;
  margin: 0 auto;
}

.news-category-btn::before {
  background-color: #00A987 !important;
}

body.category-news-category2 .news-category a:nth-child(2):before, body.category-news-category-en .news-category a:nth-child(2):before {
  background-color: #00A987;
}
body.category-news-category .news-category a:nth-child(3):before, body.category-news-category2-en .news-category a:nth-child(3):before {
  background-color: #00A987;
}

.single-post #menu-item-252,
.single-post #menu-item-279,
.single-post .lang-nav,
.page-id-17 #menu-item-252,
.page-id-17 #menu-item-279,
.page-id-17 .lang-nav {
  display: none;
}

/*sustainability*/
@media screen and (max-width: 767px) {
  .sustainability.main {
    margin-bottom: 5rem;
  }
}
.sustainability-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5rem;
}
@media screen and (max-width: 1024px) {
  .sustainability-top {
    flex-direction: column;
    gap: 1.5rem;
  }
}
.sustainability-top-left {
  width: 50%;
}
@media screen and (max-width: 1024px) {
  .sustainability-top-left {
    width: 100%;
  }
}
.sustainability-top-left h2 {
  color: #005949;
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 767px) {
  .sustainability-top-left h2 {
    margin-bottom: 1rem;
  }
}
.sustainability-top-left h2 span {
  display: inline-block;
}
.sustainability-top-right {
  width: 40%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media screen and (max-width: 1280px) {
  .sustainability-top-right {
    width: 47%;
  }
}
@media screen and (max-width: 1024px) {
  .sustainability-top-right {
    width: 100%;
    max-width: 400px;
  }
}
.sustainability-top-right div {
  position: relative;
  width: 40%;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .sustainability-top-right div {
    width: 45%;
  }
}
.sustainability-top-right div:first-child {
  margin: 0 30%;
}
@media screen and (max-width: 767px) {
  .sustainability-top-right div:first-child {
    margin: 0 27.5%;
  }
}
.sustainability-top-right div p {
  position: absolute;
  bottom: 1rem;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: -moz-max-content;
  width: max-content;
  color: #005949;
  text-align: center;
  line-height: 1.3;
  font-size: 14px;
}
@media screen and (max-width: 767px) {
  .sustainability-top-right div p {
    font-size: 12px;
  }
}
.sustainability-work1 {
  margin-bottom: 7.5rem;
}
@media screen and (max-width: 1024px) {
  .sustainability-work1 {
    margin-bottom: 5rem;
  }
}
.sustainability-work1 > h3 {
  color: #005949;
  font-size: clamp(0.875rem, 0.83rem + 0.15vw, 1rem);
  margin-bottom: 0.5rem;
}
.sustainability-work1 > p {
  max-width: 670px;
}
.sustainability-work1 table {
  margin: 2.5rem 0;
  width: 100%;
  border-collapse: collapse;
  min-width: 720px;
}
@media screen and (max-width: 1024px) {
  .sustainability-work1 table {
    margin: 1rem 0;
  }
}
.sustainability-work1 table tr {
  border: 1px solid #707070;
  border-top: none;
}
.sustainability-work1 table tr:first-child {
  background-color: #005949;
  color: #fff;
}
.sustainability-work1 table td {
  padding: 0.5rem;
}
.sustainability-work1 table td p {
  line-height: 1.5;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .sustainability-table {
    overflow-x: scroll;
    margin: 1rem 0;
  }
}
.sustainability-wrap {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1024px) {
  .sustainability-wrap {
    flex-direction: column;
    gap: 3rem;
  }
}
.sustainability-wrap div {
  width: 48%;
}
@media screen and (max-width: 1024px) {
  .sustainability-wrap div {
    width: 100%;
  }
}
.sustainability-wrap div h3 {
  margin: 20px 0 0.5rem;
  color: #005949;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
.sustainability-work2 {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1024px) {
  .sustainability-work2 {
    flex-direction: column;
    gap: 1.5rem;
    align-items: center;
  }
}
.sustainability-work2 .arrow-btn-bg {
  margin: 2.5rem 0 0 0;
}
@media screen and (max-width: 1024px) {
  .sustainability-work2 .arrow-btn-bg {
    margin-top: 0.5rem;
  }
}
.sustainability-work2 .arrow-btn-bg.sp {
  display: none;
}
@media screen and (max-width: 1024px) {
  .sustainability-work2 .arrow-btn-bg.sp {
    display: block;
  }
}
@media screen and (max-width: 1024px) {
  .sustainability-work2 .arrow-btn-bg.pc {
    display: none;
  }
}
.sustainability-work2 h3 {
  color: #005949;
  font-size: clamp(1rem, 0.636rem + 1.21vw, 2rem);
  margin-bottom: 20px;
}
.sustainability-work2-left {
  width: 48%;
}
@media screen and (max-width: 1024px) {
  .sustainability-work2-left {
    width: 100%;
  }
}
.sustainability-work2-right {
  width: 48%;
  display: flex;
  gap: 1.5rem;
}
@media screen and (max-width: 1024px) {
  .sustainability-work2-right {
    width: 100%;
    max-width: 400px;
  }
}
.sustainability-work2-right img {
  width: calc((100% - 1.5rem) / 2);
}

/*map*/
.map-all {
  position: relative;
}
.map-title {
  text-align: center;
  padding-top: 2.5rem;
  margin: 0 auto 2.5rem;
  width: 90%;
  color: #005949;
  font-size: clamp(1rem, 0.636rem + 1.21vw, 2rem);
}
@media screen and (max-width: 767px) {
  .map-title {
    margin: 0 auto 1rem;
  }
}
.map-btn {
  z-index: 15;
  width: -moz-fit-content;
  width: fit-content;
  position: fixed;
  display: flex;
  bottom: 0;
  right: 0;
  width: 100%;
  max-width: 500px;
}
.map-btn a {
  width: 50%;
  text-align: center;
  background-color: #fff;
  font-weight: bold;
  height: 50px;
  border-top: 3px solid #D9D9D9;
  line-height: 50px;
}
.map-btn a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 767px) {
  .map-btn a {
    padding: 4px 0;
    line-height: 1.5;
  }
}
.map-btn a:first-child {
  line-height: 50px;
  padding: 0;
  border-top: 3px solid #00A987;
  border-right: 1px solid #D9D9D9;
}
.map .tabs {
  position: relative;
}
.map .tabs:has(.tab-item.europ.active) .tab-item.asia,
.map .tabs:has(.tab-item.europ.active) .tab-item.europ,
.map .tabs:has(.tab-item.europ.active) .tab-item.america, .map .tabs:has(.tab-item.asia.active) .tab-item.asia,
.map .tabs:has(.tab-item.asia.active) .tab-item.europ,
.map .tabs:has(.tab-item.asia.active) .tab-item.america, .map .tabs:has(.tab-item.america.active) .tab-item.asia,
.map .tabs:has(.tab-item.america.active) .tab-item.europ,
.map .tabs:has(.tab-item.america.active) .tab-item.america {
  display: none;
}
.map .tab-item {
  background-color: #005949;
  color: #fff;
  padding: 0.5rem;
  cursor: pointer;
  width: -moz-fit-content;
  width: fit-content;
  position: absolute;
  transition: 0.3s;
  font-size: clamp(1rem, 0.636rem + 1.21vw, 2rem);
}
@media screen and (max-width: 1024px) {
  .map .tab-item {
    display: none;
  }
}
.map .tab-item:hover {
  opacity: 0.7;
}
.map .tab-item.map1_top, .map .tab-item.europ_top, .map .tab-item.america_top, .map .tab-item.asia_top {
  position: relative;
}
.map .tab-item.map1 {
  left: 5%;
  top: 5%;
}
.map .tab-item.map1.active {
  display: none;
}
.map .tab-item.europ {
  left: 53%;
  top: 32%;
}
.map .tab-item.america {
  left: 21%;
  top: 28%;
}
.map .tab-item.asia {
  right: 10%;
  top: 46%;
}
.map .world-point {
  position: absolute;
  background-color: #005949;
  padding: 0.5rem;
  cursor: pointer;
  width: -moz-fit-content;
  width: fit-content;
  position: absolute;
  transition: 0.3s;
  font-size: clamp(0.75rem, 0.659rem + 0.3vw, 1rem);
}
.map .world-point a {
  color: #fff;
}
.map .world-point a p {
  line-height: 1;
}
.map .world-point a:hover {
  opacity: 0.7;
}
.map .world-point.america {
  left: 20%;
  top: 30%;
}
.map .world-point.asia {
  right: 15%;
  top: 20%;
}
.map .world-point.europ {
  left: 55%;
  top: 45%;
}
.map .tab-panel {
  display: none;
}
.map .tab-panel.map1 {
  left: 30%;
  top: 10%;
}
.map .tab-panel.europ {
  left: 50%;
  top: 45%;
}
.map .tab-panel.america {
  left: 21%;
  top: 28%;
}
.map .tab-panel.asia {
  right: 20%;
  top: 30%;
}
.map .tab-item.active {
  background-color: skyblue;
  color: #fff;
  font-weight: bold;
}
.map .tab-panel.active {
  display: block;
}
.map .tab-panel.active h2 {
  font-size: 20px;
  font-weight: bold;
}
.map-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 4rem 3.3333333333%;
  margin-bottom: 5rem;
}
@media screen and (max-width: 1280px) {
  .map-wrap {
    gap: 4rem 5%;
  }
}
@media screen and (max-width: 767px) {
  .map-wrap {
    gap: 2.5rem 0;
    margin-bottom: 2.5rem;
  }
}
.map-item {
  width: 30%;
}
@media screen and (max-width: 1280px) {
  .map-item {
    width: 47.5%;
  }
}
@media screen and (max-width: 767px) {
  .map-item {
    width: 100%;
  }
}
.map-item p {
  line-height: 1.5;
}
.map-item p:nth-child(2) {
  margin-top: 0.5rem;
}
.map-item > p:first-child {
  color: #005949;
  font-weight: bold;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #000;
  margin-bottom: 0.5rem;
}
@media screen and (max-width: 767px) {
  .map-text.main {
    margin-bottom: 5rem;
  }
}
.map-text.main h2 {
  background-color: #005949;
  color: #fff;
  padding: 0.5rem;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  margin-bottom: 1.5rem;
}
.map-point {
  position: absolute;
  line-height: 1;
}
.map-point > p {
  padding: 8px 0.5rem;
  color: #fff;
  line-height: 1;
  background-color: #005949;
}
.map-point:hover {
  z-index: 10;
}
.map-point:hover .map-point-text {
  opacity: 1;
  width: -moz-fit-content;
  width: fit-content;
  display: block;
}
.map-point:hover::before {
  opacity: 0;
}
.map-point::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  bottom: -1rem;
  left: 0;
  background-color: #005949;
  transition: 0;
}
@media screen and (max-width: 767px) {
  .map-point::before {
    display: none;
  }
}
.map-point-text {
  opacity: 0;
  transition: all ease 0.4s;
  background-color: #fff;
  display: none;
  max-width: 240px;
  font-size: 14px;
}
.map-point-text a {
  color: #005949;
  padding: 8px 8px 8px 1rem;
  display: block;
  position: relative;
}
.map-point-text a:hover {
  opacity: 0.7;
}
.map-point-text a p {
  line-height: 1.3;
}
.map-point-text a::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 100%;
  background-color: #FF9200;
  left: 0;
  top: 0;
}
.map-point-text a:nth-child(2)::before {
  background-color: #00A987;
}
.map-point.calgary {
  top: 25%;
  left: 35%;
}
.map-point.houston {
  top: 86%;
  left: 50%;
}
.map-point.mumbai {
  right: 14%;
  bottom: 9%;
}
.map-point.delhi {
  right: 6%;
  bottom: 18%;
}
.map-point.dubai {
  right: 32%;
  bottom: 16%;
}
.map-point.abu {
  right: 39%;
  bottom: 19%;
}
.map-point.abu::before {
  left: auto;
  right: 0;
}
.map-point.tehran {
  right: 42%;
  top: 42%;
}
.map-point.moscow {
  left: 40%;
  top: 21%;
}
.map-point.mirano {
  left: 27%;
  top: 37%;
}
.map-point.dussel {
  left: 23%;
  top: 20%;
}
.map-point.london {
  left: 7%;
  top: 21%;
}
.map-point.sydney {
  bottom: 18%;
  right: 18%;
}
.map-point.ki {
  right: 7%;
  top: 22%;
}
.map-point.seoul {
  right: 23%;
  top: 2%;
}
.map-point.busan {
  right: 18%;
  top: 14%;
}
.map-point.beijing {
  right: 31%;
  top: 6%;
}
.map-point.shanghai {
  right: 24%;
  top: 32%;
}
.map-point.taipei {
  right: 56.5%;
  top: 13%;
}
.map-point.bangkok {
  top: 25%;
  left: 19%;
}
.map-point.kuala {
  top: 42%;
  left: 21%;
}
.map-point.jakarta {
  top: 83%;
  left: 24%;
}
.map-point.singapore {
  top: 51%;
  left: 25%;
}
.map-point.tita {
  right: 12%;
  top: 38%;
}
@media screen and (max-width: 1024px) {
  .map-point.tita {
    right: 11%;
    top: 36%;
  }
}
.map-point.wakayama {
  right: 28%;
  top: 59%;
}
@media screen and (max-width: 1024px) {
  .map-point.wakayama {
    right: 24%;
  }
}
.map-point.ama {
  right: 32%;
  top: 44%;
}
@media screen and (max-width: 1024px) {
  .map-point.ama {
    right: 31%;
    top: 39%;
  }
}
@media screen and (max-width: 767px) {
  .map-point.ama {
    right: 26%;
  }
}
.map-point.himeji {
  right: 39%;
  top: 41%;
}
@media screen and (max-width: 1024px) {
  .map-point.himeji {
    right: 37%;
    top: 39%;
  }
}
@media screen and (max-width: 767px) {
  .map-point.himeji {
    right: 40%;
    top: 45%;
  }
}
.map-point.hikari {
  right: 67%;
  top: 63%;
}
@media screen and (max-width: 1024px) {
  .map-point.hikari {
    right: 65%;
    top: 60%;
  }
}
.map-point.simonoseki {
  right: 76%;
  top: 62%;
}
@media screen and (max-width: 1024px) {
  .map-point.simonoseki {
    right: 74%;
    top: 59%;
  }
}
.map-point.ishikawa {
  right: 20%;
  top: 8%;
}

.japan {
  position: relative;
}

body:has(.map-title.fadeUp_re) .map-btn a {
  border-top: 3px solid #00A987;
}
body:has(.map-title.fadeUp_re) .map-btn a:first-child {
  border-top: 3px solid #D9D9D9;
}

.tab-wrap {
  display: flex;
  width: 70%;
  margin: 0 auto 1rem;
}
@media screen and (max-width: 1280px) {
  .tab-wrap {
    width: 80%;
  }
}
@media screen and (max-width: 1024px) {
  .tab-wrap {
    display: none;
  }
}
.tab-wrap .tab-item {
  width: 25%;
  text-align: center;
  padding: 1rem 0;
  font-weight: bold;
  background-color: #D9D9D9;
}
.tab-wrap .tab-item:not(:last-child) {
  border-right: 1px solid #707070;
}
.tab-wrap .tab-item.active {
  background-color: #00A987;
  color: #fff;
  border-right: 1px solid #fff;
}

@media screen and (max-width: 1024px) {
  .tab-content.pc {
    display: none;
  }
}
@media screen and (max-width: 1024px) {
  .tab-content.sp {
    display: block;
  }
}

.tab-content.sp .japan a {
  color: #fff;
  padding: 4px 0.5rem;
  color: #fff;
  line-height: 1;
  background-color: #005949;
  font-size: 14px;
  display: block;
}
@media screen and (max-width: 767px) {
  .tab-content.sp .japan a {
    font-size: 12px;
  }
}
.tab-content.sp .japan a p {
  line-height: 1;
}

body:not(:has(.map1_top.active)) .map .tab-item.asia,
body:not(:has(.map1_top.active)) .map .tab-item.europ,
body:not(:has(.map1_top.active)) .map .tab-item.america {
  display: none;
}

.page-id-265 .map-point.simonoseki {
  right: 73%;
}
@media screen and (max-width: 1600px) {
  .page-id-265 .map-point.simonoseki {
    top: 59%;
    right: 71%;
  }
}
@media screen and (max-width: 1280px) {
  .page-id-265 .map-point.simonoseki {
    right: 69%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-265 .map-point.simonoseki {
    right: 66%;
    top: 56%;
  }
}
.page-id-265 .map-point.hikari {
  right: 66%;
}
@media screen and (max-width: 1600px) {
  .page-id-265 .map-point.hikari {
    right: 64%;
  }
}
@media screen and (max-width: 1400px) {
  .page-id-265 .map-point.hikari {
    right: 63%;
    top: 62%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-265 .map-point.hikari {
    right: 61%;
    top: 60%;
  }
}
@media screen and (max-width: 767px) {
  .page-id-265 .map-point.hikari {
    top: 67%;
  }
}
.page-id-265 .map-point.ama {
  right: 29%;
}
@media screen and (max-width: 1400px) {
  .page-id-265 .map-point.ama {
    right: 27%;
    top: 42%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-265 .map-point.ama {
    right: 24%;
    top: 40%;
  }
}
@media screen and (max-width: 767px) {
  .page-id-265 .map-point.ama {
    top: 43%;
  }
}
@media screen and (max-width: 1600px) {
  .page-id-265 .map-point.wakayama {
    right: 27%;
    top: 57%;
  }
}
@media screen and (max-width: 1400px) {
  .page-id-265 .map-point.wakayama {
    right: 25%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-265 .map-point.wakayama {
    right: 22%;
  }
}
.page-id-265 .map-point.himeji {
  right: 38%;
  top: 42%;
}
@media screen and (max-width: 1400px) {
  .page-id-265 .map-point.himeji {
    right: 37%;
    top: 40%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-265 .map-point.himeji {
    right: 35%;
    top: 37%;
  }
}
@media screen and (max-width: 767px) {
  .page-id-265 .map-point.himeji {
    top: 34%;
  }
}
.page-id-265 .map-point.ishikawa {
  right: 19%;
}
@media screen and (max-width: 1280px) {
  .page-id-265 .map-point.ishikawa {
    right: 17%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-265 .map-point.ishikawa {
    right: 15%;
  }
}
@media screen and (max-width: 1400px) {
  .page-id-265 .map-point.tita {
    right: 11%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-265 .map-point.tita {
    right: 9%;
  }
}
@media screen and (max-width: 767px) {
  .page-id-265 .tab-content.sp .japan a {
    font-size: 10px;
    padding: 2px 4px;
  }
}
@media screen and (max-width: 767px) {
  .page-id-265 .map-btn a {
    line-height: 50px;
    padding: 0;
  }
}