@charset "UTF-8";
/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
footer
-----------------------------------------------------------------------*/
.footer {
  background-color: #000;
}

.footer_top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: flex-start;
  padding: 100px 0 120px;
}

.footer_nav_item {
  padding: 24px 34px;
  background-color: #292929;
  border-radius: 8px;
  max-width: 436px;
  display: grid;
  grid-template-columns: 1fr 145px;
  align-items: flex-end;
  gap: 30px;
}
.footer_nav_item:not(:last-child) {
  margin-bottom: 32px;
}

.footer_nav_txt {
  color: #fff;
}

.footer_nav_ttl {
  font-family: "Gotham, sans-serif";
  font-size: 24px;
  font-weight: 500;
  margin-bottom: 24px;
}

.footer_nav_desc {
  font-size: 12px;
}

.footer_nav_btn.btn {
  width: 145px;
  height: 46px;
}
.footer_nav_btn.btn .btn_txt {
  font-size: 12px;
}

.footer_right {
  padding-left: 8px;
}

.footer_logo {
  width: 470px;
  transform: translateX(-24px);
  margin-bottom: 16px;
}

.footer_access {
  font-size: 12px;
  color: #fff;
}

.footer_line {
  background-color: 1px solid #292929;
  width: 100%;
  height: 1px;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
header
-----------------------------------------------------------------------*/
.is-opened .header {
  top: 0;
  opacity: 1;
}

.is-opening .header {
  animation: header-opening 0.6s 5s ease forwards;
}

@keyframes header-opening {
  0% {
    top: -100px;
    opacity: 0;
  }
  100% {
    top: 0;
    opacity: 1;
  }
}
.header {
  padding: 0 68px 0 16px;
  background-color: #fff;
  width: 100%;
  border-bottom: 1px solid #DDDDDD;
  position: fixed;
  z-index: 100;
  height: 94px;
  display: flex;
  align-items: center;
  top: -100px;
  opacity: 0;
}

.header_wrap {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header_logo {
  width: 286px;
}

.header_right {
  display: flex;
  align-items: center;
  gap: 16px;
}

.header_nav {
  display: flex;
  align-items: center;
  gap: 16px;
}

.header_nav_btn {
  width: 128px;
  height: 48px;
  font-family: "Gotham, sans-serif";
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  transition: all 0.4s;
  padding-top: 4px;
}
.header_nav_btn:nth-child(1) {
  background-color: #E7E7E7;
  border: 1px solid #E7E7E7;
}
.header_nav_btn:nth-child(1):hover {
  background-color: #fff;
}
.header_nav_btn:nth-child(2) {
  background-color: #333333;
  color: #fff;
  border: 1px solid #333;
}
.header_nav_btn:nth-child(2):hover {
  background-color: #fff;
  color: #333;
}

.header_menu {
  position: fixed;
  top: 28px;
  right: 16px;
  z-index: 120;
  top: -72px;
  opacity: 0;
}

.is-opened .header_menu {
  top: 28px;
  opacity: 1;
}

.is-opening .header_menu {
  animation: headrMenu-opening 0.6s 5s ease forwards;
}

@keyframes headrMenu-opening {
  0% {
    top: -72px;
    opacity: 0;
  }
  100% {
    top: 28px;
    opacity: 1;
  }
}
.mask {
  padding: 180px 0;
  display: block;
  position: fixed;
  opacity: 0;
  top: 0;
  right: -1000px;
  height: 100vh;
  width: 320px;
  background: #777;
  z-index: 101;
  transition: all 0.5s;
}

.mask .header_link {
  margin: 0 auto 36px;
  width: -moz-fit-content;
  width: fit-content;
}

.mask .header_link a {
  font-size: 18px;
  color: #FFF;
  font-weight: 600;
  display: block;
  margin-bottom: 16px;
  transform: all 0.3s;
}
.mask .header_link a:hover {
  opacity: 0.6;
}

.open.mask {
  opacity: 1;
  right: 0;
}

.toggle_btn {
  width: 36px;
  height: 36px;
  cursor: pointer;
  position: relative;
  transition: all 0.3s;
}
.toggle_btn:hover {
  opacity: 0.7;
}
.toggle_btn span {
  display: block;
  position: absolute;
  height: 2px;
  background-color: #000;
  transition: all 0.5s;
  width: 30px;
  left: 50%;
  transform: translateX(-50%);
}
.toggle_btn span:nth-child(1) {
  top: 10px;
}
.toggle_btn span:nth-child(2) {
  bottom: 10px;
}

.open .toggle_btn span {
  background-color: #000;
  transition: all 0.5s;
}
.open .toggle_btn span:nth-child(1) {
  top: 17px;
  transform: translateX(-50%) rotate(45deg);
}
.open .toggle_btn span:nth-child(2) {
  bottom: 17px;
  transform: translateX(-50%) rotate(-45deg);
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
html {
  scrollbar-gutter: stable;
}

body {
  width: 100%;
  overflow-x: hidden;
  background-color: #F0F0F0;
  font-family: "ryo-gothic-plusn", sans-serif;
  color: #000;
  position: relative;
}

body.is-opening {
  overflow: hidden;
  animation: body_scroll 0s 5.7s forwards;
}

@keyframes body_scroll {
  to {
    overflow: auto;
  }
}
body.open {
  height: 100%;
  overflow: hidden;
}

main {
  padding-top: 94px;
}

img {
  display: block;
  width: 100%;
}

a {
  text-decoration: none;
}

p {
  font-size: 14px;
  line-height: 2.4;
  text-align: justify;
}

/* --------------------------------------------------------------------- 
    animation
-----------------------------------------------------------------------*/
.animation_fuwafuwa {
  animation: fuwafuwa 2s linear infinite;
  scale: 1;
}

@keyframes fuwafuwa {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(5px);
  }
  100% {
    transform: translateY(0);
  }
}
.animation_dokundokun {
  animation: dokundokun 1300ms ease infinite;
}

@keyframes dokundokun {
  0% {
    transform: scale(1);
  }
  20% {
    transform: scale(1.1);
  }
  40% {
    transform: scale(1);
  }
  70% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
.animation_shiny {
  background: #D96F86;
  background: linear-gradient(-45deg, #D96F86 50%, rgb(238.2967032967, 191.7032967033, 201.8131868132) 60%, #D96F86 70%);
  background-size: 600% 100%;
  animation: shine 20s infinite;
  animation-delay: 0s;
  animation-timing-function: linear;
}

@keyframes shine {
  0% {
    background-position-x: 400%;
  }
  50% {
    background-position-x: 0%;
  }
  100% {
    background-position-x: -400%;
  }
}
.fadein {
  opacity: 0;
  transform: translateY(20px);
  transition: all 1s;
}

.scrollin {
  opacity: 1;
  transform: translateY(0);
}

/* --------------------------------------------------------------------- 
    wrap
-----------------------------------------------------------------------*/
.wrap-lg {
  width: 93.75%;
  max-width: 1300px;
  margin: 0 auto;
}
@media screen and (max-width: 1260px) {
  .wrap-lg {
    width: 96%;
  }
}

.wrap {
  width: 84%;
  max-width: 1180px;
  margin: 0 auto;
}
@media screen and (max-width: 1260px) {
  .wrap {
    width: 90%;
  }
}

.wrap-sm {
  width: 80%;
  max-width: 980px;
  margin: 0 auto;
}
@media screen and (max-width: 1260px) {
  .wrap-sm {
    width: 90%;
  }
}

.wrap-grid {
  display: grid;
  grid-template-columns: 350px 1fr;
  align-items: flex-start;
}

.wrap-grid > *:nth-child(2) {
  padding-top: 12px;
}

.wrap-slide {
  width: calc(100% - (100% - 1180px) / 2);
  margin-left: auto;
  display: grid;
  grid-template-columns: 350px calc(100% - 350px);
  align-items: flex-start;
}
@media screen and (max-width: 1400px) {
  .wrap-slide {
    width: 92%;
  }
}

@media screen and (max-width: 1400px) {
  .wrap-slide .pr_item {
    padding-right: 8%;
  }
}

.wrap-slide .pr_item > * {
  max-width: 830px;
}

.wrap-slide > *:nth-child(2) {
  padding-top: 12px;
}

.section_line {
  height: 1px;
  background: #BCBCBC;
}

/* --------------------------------------------------------------------- 
    section_heading
-----------------------------------------------------------------------*/
.top_heading-lg {
  font-family: "Gotham, sans-serif";
  font-size: 74px;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.top_heading {
  font-family: "Gotham, sans-serif";
  font-size: 44px;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.section_heading {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.8;
}

/* --------------------------------------------------------------------- 
    btn
-----------------------------------------------------------------------*/
.btn {
  height: 48px;
  width: 190px;
  border-radius: 4px;
  overflow: hidden;
  background-color: #000;
  border: 1px solid #000;
  display: flex;
  align-items: center;
  padding-top: 2px;
  padding-left: 16px;
  position: relative;
  transition: color 0.3s;
}
.btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  transform: translateX(-101%);
  z-index: 3;
}

.btn.btn-gray {
  background-color: #333333;
  border: 1px solid #333333;
}

/* 入る: 左→右にスライドイン */
.btn.enter::after {
  transition: transform 0.35s cubic-bezier(0.45, 0, 0.55, 1);
  transform: translateX(0);
}

/* 出る: 左→右に抜けて消える */
.btn.leave::after {
  transition: transform 0.35s cubic-bezier(0.45, 0, 0.55, 1);
  transform: translateX(101%);
}

/* leave完了後にtransitionなしでリセット */
.btn.reset::after {
  transition: none;
  transform: translateX(-101%);
}

.btn_txt {
  position: relative;
  z-index: 8;
  display: block;
  color: #fff;
  font-family: "Gotham, sans-serif";
  font-size: 14px;
  font-weight: 500;
}

.btn.enter .btn_txt {
  color: #000;
}

.btn.leave .btn_txt {
  color: #fff;
  transition: color 0.35s;
}

.btn_arrow {
  background-color: #292929;
  display: block;
  width: 25px;
  height: 40px;
  border-radius: 2px;
  right: 4px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.btn_arrow::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 8px;
  background-image: url(../images/common/btn_arrow.webp);
  background-size: 100% 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.btn_hover {
  background-color: #292929;
  display: block;
  width: 25px;
  height: 40px;
  border-radius: 2px;
  right: 16px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  z-index: 10;
  transition: all 0.4s 0.4s;
}
.btn_hover::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 8px;
  background-image: url(../images/common/btn_arrow.webp);
  background-size: 100% 100%;
  top: 50%;
  left: 32%;
  transform: translate(-50%, -50%);
  z-index: 2;
  transition: all 0.5s 0.6s;
}

.btn.enter .btn_hover {
  right: 4px;
  opacity: 1;
}
.btn.enter .btn_hover::after {
  left: 50%;
}

.btn.leave .btn_hover {
  opacity: 0;
  transition: all 0.4s;
  right: 4px;
}
.btn.leave .btn_hover::after {
  left: 50%;
}

/* --------------------------------------------------------------------- 
    cta
-----------------------------------------------------------------------*/
.cta_wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
}

.cta_item {
  padding: 75px 0;
}

.cta-service {
  background-image: url(../images/common/service_bg.webp);
  background-size: cover;
}

.cta-contact {
  background-color: #fff;
  overflow: hidden;
  position: relative;
}
.cta-contact::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  transform: translateX(-101%);
  z-index: 1;
  transition: transform 0.5s cubic-bezier(0.8, 0, 1, 0.6);
}

.cta-contact:hover::after {
  transition: transform 0.5s cubic-bezier(0.8, 0, 1, 0.6);
  transform: translateX(0);
}

.cta_inner {
  max-width: 400px;
  margin: 0 auto;
  background-color: rgba(255, 255, 255, 0.98);
  padding: 55px 0;
  position: relative;
  z-index: 3;
}

.cta_btn {
  margin: 0 auto;
}

.cta_ttl {
  font-family: "Gotham, sans-serif";
  font-size: 32px;
  font-weight: 500;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 18px;
}

.cta_txt {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 40px;
  font-size: 14px;
}

/* --------------------------------------------------------------------- 
    page-top
-----------------------------------------------------------------------*/
.page-top {
  padding-top: 80px;
}

.page-top_wrap.wrap-line {
  border-bottom: 1px solid #BCBCBC;
}

.page-top_head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.page-top_heading {
  font-size: 54px;
  font-weight: 700;
  line-height: 1.3;
}

.page-top_fv {
  height: 48.3333333333%;
  border-radius: 8px;
  overflow: hidden;
  margin-top: 32px;
}

.page-top_fv img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.page-top_txt {
  margin: 64px auto 0;
  width: -moz-fit-content;
  width: fit-content;
  padding-bottom: 64px;
}
.page-top_txt p {
  max-width: 740px;
}
.page-top_txt p:not(.align-center) {
  text-align: justify;
}

.page-top_ttl {
  font-size: 32px;
  line-height: 1.7;
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-weight: 700;
}

.page-top_ttl.fs-24 {
  font-size: 24px;
}

.page-top_txt span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}

.page-top_txt .align-center {
  text-align: center;
}

.page-top_txt .fw-bold {
  font-weight: 700;
}

.page-top_txt .m-auto {
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}

.page-top_txt .mb-48 {
  margin-bottom: 48px;
}

.page-top_txt .mb-32 {
  margin-bottom: 32px;
}

.page-top_txt .mb-20 {
  margin-bottom: 20px;
}

/* --------------------------------------------------------------------- 
    breadcrumb
-----------------------------------------------------------------------*/
.breadcrumb {
  padding-bottom: 12px;
}

.breadcrumb_list {
  display: flex;
  gap: 45px;
  align-items: center;
}

.breadcrumb_item {
  font-size: 14px;
}

.breadcrumb_item:not(:last-child) {
  position: relative;
}
.breadcrumb_item:not(:last-child)::after {
  content: "";
  position: absolute;
  width: 1px;
  height: 24px;
  background-color: #292929;
  top: 50%;
  transform: translateY(-50%) rotate(28deg);
  right: -24px;
}

.breadcrumb_item:last-child {
  color: #BCBCBC;
}
.breadcrumb_item:last-child a {
  pointer-events: none;
}

.breadcrumb_link-home {
  display: flex;
  gap: 8px;
  align-items: center;
}
.breadcrumb_link-home img {
  width: 12px;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
    front
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
    fv
-----------------------------------------------------------------------*/
.fv {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  position: relative;
}

.fv_wrap {
  padding-top: 184px;
  position: relative;
  min-height: calc(100dvh - 90px);
  padding-bottom: 24px;
  width: 93.75%;
  max-width: 1428px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 1260px) {
  .fv_wrap {
    width: 96%;
  }
}

.fv_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.fv_bg_img {
  opacity: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: opacity 0.6s ease;
  position: absolute;
  top: 0;
  left: 0;
}

.fv_bg_img.is-hover {
  opacity: 1;
}

/* ---- fv_heading ----*/
.fv_heading {
  position: absolute;
  width: 610px;
  transition: all 0.4s;
}
.fv_heading h2 {
  opacity: 0;
}

.fv.is-hover .fv_heading {
  color: #fff;
}

.fv.is-hover .fv_desc {
  color: #fff;
}

.is-opening .fv_heading {
  overflow: hidden;
  display: block;
  position: absolute;
  top: calc(50% - 47px);
  left: 50%;
  transform: translate(-50%, -50%);
  animation: fv_heading 0.5s 4s forwards;
}
.is-opening .fv_heading h2 {
  animation: opacity-in 0.1s 3s forwards;
}
.is-opening .fv_heading .fv_heading_bg {
  background-color: #000;
  bottom: -1px;
  content: "";
  display: block;
  left: 0;
  position: absolute;
  right: 0;
  top: -1px;
  transform: translate(0, 100%);
  animation: mask-bg 1.2s 2.4s cubic-bezier(0.8, 0, 0.17, 1);
  z-index: 1;
}

@keyframes fv_heading {
  0% {
    top: calc(50% - 47px);
    left: 50%;
    transform: translate(-50%, -50%);
  }
  100% {
    top: 98px;
    left: 0;
    transform: none;
  }
}
@keyframes opacity-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fv_desc {
  font-size: 18px;
  transition: all 0.4s;
  margin: 0 0 74px;
  opacity: 0;
}

.is-opening .fv_desc {
  animation: opacity-in 0.6s 4.5s forwards;
}

/* ---- fv_content ----*/
.fv_content {
  display: grid;
  grid-template-columns: 55fr 64fr;
  gap: 16px;
  width: 100%;
  height: 100%;
  min-height: 426.6666666667px;
  max-height: 600px;
  position: relative;
  z-index: 2;
  opacity: 0;
  pointer-events: none;
  flex: 1;
}
@media screen and (max-width: 1400px) {
  .fv_content {
    min-height: calc(2800vw * 1%);
  }
}

.is-opening .fv_content {
  animation: fv_content 0.1s 4.5s forwards, fv_pointer 0s 5.7s forwards;
}

@keyframes fv_content {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fv_pointer {
  to {
    pointer-events: auto;
  }
}
/* ---- fv_service ----*/
.fv_service {
  overflow: hidden;
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  transition: all 0.4s;
}

.fv_service_wrap {
  border-radius: 8px;
  border: 1px solid #DBDBDB;
  position: relative;
  transition: all 0.4s;
  width: 100%;
  height: 100%;
  opacity: 0;
  overflow: hidden;
}
.fv_service_wrap::before {
  content: "";
  position: absolute;
  background-image: url(../images/top/fv_service_img.webp);
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transition: all 0.4s;
}

.is-opening .fv_service_wrap {
  animation: opacity-in 0.1s 5.2s forwards;
}

.fv.is-hover .fv_service {
  opacity: 0.5;
}

.fv.is-hover .fv_service .fv_service_wrap {
  border: 1px solid #fff;
  color: #fff;
}
.fv.is-hover .fv_service .fv_service_wrap::before {
  content: "";
  opacity: 0;
}

.fv.is-hover .fv_service.is-hover {
  opacity: 1;
}

.is-opening .fv_service_bg {
  background-color: #000;
  bottom: -1px;
  content: "";
  display: block;
  left: 0;
  position: absolute;
  right: 0;
  top: -1px;
  transform: translate(0, 100%);
  animation: mask-bg 1.2s 4.5s cubic-bezier(0.8, 0, 0.17, 1);
  z-index: 1;
}

@keyframes mask-bg {
  0% {
    transform: translate(0, 101%);
  }
  40%, 60% {
    transform: translate(0, 0%);
  }
  100% {
    transform: translate(0, -100%);
  }
}
.fv_service_inner {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  padding: 0 30px 36px;
}

.fv_service_ttl {
  font-family: "Gotham, sans-serif";
  font-weight: 500;
  font-size: 40px;
  margin-bottom: 8px;
  transition: all 0.4s;
}

.fv_service_txt {
  font-size: 14px;
  display: block;
  transition: all 0.4s;
}

.fv_service_arrow {
  width: 42px;
  aspect-ratio: 1/1;
  position: absolute;
  border-radius: 2px;
  bottom: 36px;
  right: 30px;
  transition: all 0.4s;
}

/* ---- fv_list ----*/
.fv_list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 16px;
  width: 100%;
  height: 100%;
}

.fv_item {
  width: 100%;
  height: 100%;
}

.fv_link {
  overflow: hidden;
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  transition: all 0.4s;
}

.fv_link_wrap {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  border: 1px solid #E7E7E7;
  background-color: #E7E7E7;
  position: relative;
  overflow: hidden;
  transition: all 0.4s;
  opacity: 0;
}

.is-opening .fv_link_wrap {
  animation: opacity-in 0.1s 5.2s forwards;
}

.fv.is-hover .fv_link {
  opacity: 0.5;
}

.fv.is-hover .fv_link .fv_link_wrap {
  background-color: unset;
  border: 1px solid #fff;
  color: #fff;
}

.fv.is-hover .fv_link.is-hover {
  opacity: 1;
}

.is-opening .fv_link_bg {
  background-color: #000;
  bottom: -1px;
  content: "";
  display: block;
  left: 0;
  position: absolute;
  right: 0;
  top: -1px;
  transform: translate(0, 100%);
  animation: mask-bg 1.2s 4.5s cubic-bezier(0.8, 0, 0.17, 1);
  z-index: 1;
}

.fv_link_inner {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  padding: 0 24px 22px;
}

.fv_link_ttl {
  font-family: "Gotham, sans-serif";
  font-weight: 500;
  font-size: 28px;
  margin-bottom: 4px;
  transition: all 0.4s;
}

.fv_link_txt {
  display: block;
  font-size: 12px;
  transition: all 0.4s;
}

.fv_link_arrow {
  width: 25px;
  aspect-ratio: 1/1;
  position: absolute;
  border-radius: 2px;
  bottom: 22px;
  right: 18px;
}

/* リロードのみ（アニメーションなし） */
.is-opened .fv_heading {
  top: 98px;
  left: 0;
  transform: none;
}
.is-opened .fv_heading h2 {
  opacity: 1;
}
.is-opened .fv_heading .fv_heading_bg {
  display: none;
}

.is-opened .fv_desc {
  opacity: 1;
}

.is-opened .fv_content {
  opacity: 1;
  pointer-events: auto;
}

.is-opened .fv_service_wrap {
  opacity: 1;
}

.is-opened .fv_service_bg {
  display: none;
}

.is-opened .fv_link_wrap {
  opacity: 1;
}

.is-opened .fv_link_bg {
  display: none;
}

/* --------------------------------------------------------------------- 
    top-event
-----------------------------------------------------------------------*/
.top-event {
  padding: 124px 0 154px;
}

.top-event_head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 32px;
}

.top-event_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}

.top-event_item {
  padding-bottom: 16px;
  border-bottom: 1px solid #C7C7C7;
}

/* --------------------------------------------------------------------- 
    top-about
-----------------------------------------------------------------------*/
.top-about {
  background-image: url(../images/top/about_bg.webp);
  background-size: cover;
  background-position: center;
  height: 800px;
}

.top-about_wrap {
  height: 100%;
  position: relative;
}

.top-about_inner {
  position: absolute;
  width: 384px;
  bottom: 108px;
  right: 0;
  color: #fff;
}

.top-about_heading {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.7;
  padding-bottom: 36px;
  width: 100%;
  border-bottom: 1px solid #C7C7C7;
  margin-bottom: 36px;
}

.top-about_txt {
  margin-bottom: 40px;
}

/* --------------------------------------------------------------------- 
    top-service
-----------------------------------------------------------------------*/
.top-service {
  padding: 104px 0 154px;
}

.top-service_heading {
  margin-bottom: 32px;
}

.top-service_content {
  display: grid;
  grid-template-columns: 1fr 58%;
}

.top-service_desc {
  width: 320px;
  text-align: justify;
}

.top-service_list {
  padding-top: 20px;
  border-bottom: 1px solid #464646;
}

.top-service_link {
  display: block;
  width: 100%;
  border-top: 1px solid #464646;
  padding: 36px 8px 48px 70px;
  position: relative;
}

.top-service_num {
  font-family: "Gotham, sans-serif";
  font-size: 14px;
  font-weight: 500;
  position: absolute;
  left: 2px;
  top: 26px;
}

.top-service_head {
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.top-service_ttl {
  font-size: 32px;
  font-weight: 700;
}

.top-service_arrow {
  width: 35px;
  position: relative;
}

.top-service_arrow img:nth-child(1) {
  opacity: 1;
  transition: all 0.6s;
}

.top-service_link.enter .top-service_arrow img:nth-child(1) {
  opacity: 0;
  transform: translateX(16px);
}

.top-service_link.leave .top-service_arrow img:nth-child(1) {
  transform: translateX(0);
  transition: all 0s;
}

.top-service_arrow img:nth-child(2) {
  position: absolute;
  opacity: 0;
  top: 0;
  transform: translateX(-16px);
  transition: all 0.6s 0.4s;
}

.top-service_link.enter .top-service_arrow img:nth-child(2) {
  opacity: 1;
  transform: translateX(0);
}

.top-service_link.leave .top-service_arrow img:nth-child(2) {
  opacity: 0;
  transform: translateX(-16px);
  transition: all 0s;
}

/* --------------------------------------------------------------------- 
    top-voice
-----------------------------------------------------------------------*/
.top-voice {
  width: 100%;
  overflow-x: hidden;
  background-color: #E7E7E7;
}

.top-voice_wrap {
  padding: 120px 0;
}

.top-voice_head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 48px;
}

.top-voice_line {
  display: block;
  height: 1px;
  background-color: #BCBCBC;
}

.top-voice_swiper {
  margin-bottom: 50px;
}
.top-voice_swiper .swiper-slide {
  width: 580px !important;
  opacity: 0.3 !important;
  transform: scale(0.86) !important;
  transform-origin: top center !important;
  transition: opacity 0.4s ease, transform 0.4s ease !important;
  pointer-events: none !important;
}
.top-voice_swiper .swiper-slide-active {
  transform: scale(1) !important;
  width: 580px !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.top-voice_pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.top-voice_pagination button {
  transition: opacity 0.3s ease;
  width: 50px;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Gotham, sans-serif";
  font-size: 14px;
  font-weight: 500;
  border: 1px solid #BCBCBC;
  border-radius: 50%;
  color: #BCBCBC;
  padding-top: 3px;
  letter-spacing: 0.04em;
  cursor: pointer;
}

.top-voice_pagination button.is-active {
  background-color: #000000;
  border: 1px solid #000000;
  color: #fff;
  cursor: default;
}

/* --------------------------------------------------------------------- 
    top-news
-----------------------------------------------------------------------*/
.top-news {
  padding: 120px 0 180px;
  background-color: #E7E7E7;
}

.top-news_wrap {
  display: grid;
  grid-template-columns: 300px 1fr;
  align-items: flex-start;
}

.top-news_list {
  margin-bottom: 32px;
}

.top-news_item:not(:last-child) {
  margin-bottom: 16px;
}

.top-news_link {
  display: grid;
  grid-template-columns: 136px 1fr;
  align-items: center;
  padding: 36px 54px;
  background-color: #fff;
  border-radius: 8px;
  transition: all 0.4s;
}
@media screen and (max-width: 1400px) {
  .top-news_link {
    padding: 36px;
  }
}

.top-news_link:hover {
  opacity: 0.6;
}

.top-news_date {
  font-family: "Gotham, sans-serif";
  font-size: 16px;
  font-weight: 500;
  display: block;
  padding-top: 4px;
}

.top-news_ttl {
  line-height: 1.4;
  font-size: 18px;
}

.top-news_btn {
  margin-left: auto;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
service
-----------------------------------------------------------------------*/
.service .page-top_wrap {
  padding-bottom: 24px;
}

.service_content {
  padding-top: 60px;
}

.service_item:not(:last-child) {
  margin-bottom: 4px;
}

.service_link {
  display: block;
  height: 600px;
  width: 100%;
  position: relative;
  background-size: cover;
  background-position: center;
  position: relative;
  transition: all 0.5s;
  overflow: hidden;
}
.service_link::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  transform: translateX(-101%);
  z-index: 1;
  transition: transform 0.5s cubic-bezier(0.8, 0, 1, 0.6);
}

.service_link:hover::after {
  transition: transform 0.5s cubic-bezier(0.8, 0, 1, 0.6);
  transform: translateX(0);
}

.service_item:nth-child(1) .service_link {
  background-image: url(../images/service/service_link_bg1.webp);
}

.service_item:nth-child(2) .service_link {
  background-image: url(../images/service/service_link_bg2.webp);
}

.service_item:nth-child(3) .service_link {
  background-image: url(../images/service/service_link_bg3.webp);
}

.service_item:nth-child(4) .service_link {
  background-image: url(../images/service/service_link_bg4.webp);
}

.service_inner {
  width: 100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  z-index: 5;
}

.service_txt {
  color: #fff;
}

.service_ttl {
  font-weight: 700;
  font-size: 40px;
  margin-bottom: 30px;
}

.service_desc {
  max-width: 480px;
}

.service_arrow {
  width: 72px;
  position: absolute;
  right: 32px;
  bottom: 32px;
  z-index: 6;
}

.service_arrow img:nth-child(1) {
  opacity: 1;
  transition: all 0.6s;
}

.service_link.enter .service_arrow img:nth-child(1) {
  opacity: 0;
  transform: translateX(16px);
}

.service_link.leave .service_arrow img:nth-child(1) {
  transform: translateX(0);
  transition: all 0s;
}

.service_arrow img:nth-child(2) {
  position: absolute;
  opacity: 0;
  top: 0;
  transform: translateX(-16px);
  transition: all 0.6s 0.4s;
}

.service_link.enter .service_arrow img:nth-child(2) {
  opacity: 1;
  transform: translateX(0);
}

.service_link.leave .service_arrow img:nth-child(2) {
  opacity: 0;
  transform: translateX(-16px);
  transition: all 0s;
}

/* --------------------------------------------------------------------- 
service-child
-----------------------------------------------------------------------*/
.service-child_content {
  padding: 64px 0 108px;
}

.service-child_list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  max-width: 1080px;
  gap: 24px;
  margin: 0 auto;
  width: 100%;
}

.service-child_link {
  display: flex;
  flex-direction: column;
  height: 200px;
  background-color: #fff;
  border-radius: 8px;
  border: 1px solid #BCBCBC;
  padding: 40px 0 36px 32px;
  position: relative;
}

.service-child_ttl {
  font-size: 24px;
  font-weight: 700;
  flex: 1;
}

.service-child_desc {
  font-size: 12px;
  color: #969696;
  padding-right: 116px;
}

.service-child_arrow {
  width: 25px;
  position: absolute;
  bottom: 36px;
  right: 32px;
}

.service-child_arrow img:nth-child(1) {
  opacity: 1;
  transition: all 0.6s;
}

.service-child_link.enter .service-child_arrow img:nth-child(1) {
  opacity: 0;
  transform: translateX(16px);
}

.service-child_link.leave .service-child_arrow img:nth-child(1) {
  transform: translateX(0);
  transition: all 0s;
}

.service-child_arrow img:nth-child(2) {
  position: absolute;
  opacity: 0;
  top: 0;
  transform: translateX(-16px);
  transition: all 0.6s 0.4s;
}

.service-child_link.enter .service-child_arrow img:nth-child(2) {
  opacity: 1;
  transform: translateX(0);
}

.service-child_link.leave .service-child_arrow img:nth-child(2) {
  opacity: 0;
  transform: translateX(-16px);
  transition: all 0s;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
jpb
-----------------------------------------------------------------------*/
.jpb .page-top_heading {
  display: grid;
  grid-template-columns: 180px 1fr;
  align-items: center;
  gap: 28px;
}
.jpb .page-top_heading h2 {
  font-size: 24px;
}

/* --------------------------------------------------------------------- 
jpb-about
-----------------------------------------------------------------------*/
.jpb-about_wrap {
  padding: 64px 0 120px;
}

.jpb-about_item:not(:first-child) {
  padding-top: 80px;
}

.jpb-about_item > *:not(:last-child) {
  margin-bottom: 32px;
}

.jpb-about_item h4 {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.8;
}

.jpb-about_img {
  max-width: 440px;
  margin: 0 auto;
}

.jpb-about_movie {
  width: 100%;
}
.jpb-about_movie video {
  width: 100%;
}

/* --------------------------------------------------------------------- 
jpb-reason
-----------------------------------------------------------------------*/
.jpb-reason {
  background-color: #E2E2E2;
}

.jpb-reason_wrap {
  padding: 100px 0 134px;
}

.jpb-reason_head {
  margin-bottom: 96px;
}

.jpb-reason_txt h4 {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 24px;
}

.jpb-reason_item {
  border-left: 1px solid #464646;
  border-bottom: 1px solid #464646;
  padding-left: 64px;
  padding-bottom: 58px;
  display: grid;
  grid-template-columns: 1fr 540px;
}
.jpb-reason_item:not(:first-child) {
  padding-top: 58px;
}
.jpb-reason_item:last-child {
  border-bottom: none;
}

.jpb-reason_num {
  font-family: "Gotham, sans-serif";
  font-size: 14px;
  font-weight: 500;
  display: block;
  margin-bottom: 28px;
}

.jpb-reason_ttl {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 32px;
}
.jpb-reason_ttl h5 {
  font-size: 32px;
  font-weight: 700;
}
.jpb-reason_ttl span {
  color: #969696;
  font-weight: 700;
  font-size: 18px;
}

.jpb-reason_copy {
  margin-bottom: 24px;
}

.jpb-reason_copy span {
  display: block;
}
.jpb-reason_copy span:nth-child(1) {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 16px;
}
.jpb-reason_copy span:nth-child(2) {
  font-size: 14px;
  font-weight: 700;
}

.jpb-reason_topic li {
  font-size: 14px;
  line-height: 2.2;
}

.jpb-reason_detail {
  background-color: #F5F5F5;
  padding: 28px 40px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
@media screen and (max-width: 1524px) {
  .jpb-reason_detail {
    padding: 28px 24px;
  }
}

.jpb-reason_detail li p {
  line-height: 2;
}

.jpb-reason_detail li span {
  font-weight: 700;
}

/* --------------------------------------------------------------------- 
jpb-report
-----------------------------------------------------------------------*/
.jpb-report_wrap {
  padding: 85px 0 200px;
}

.jpb-report_head {
  margin-bottom: 90px;
}

.jpb-report_top {
  display: grid;
  grid-template-columns: 50% 1fr;
  align-items: flex-start;
  gap: 48px;
  margin-bottom: 80px;
}

.jpb-report_top_img img {
  margin-bottom: 18px;
}
.jpb-report_top_img span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-size: 12px;
}

.jpb-report_item:not(:last-child) {
  margin-bottom: 80px;
}

.jpb-report_desc {
  margin-bottom: 48px;
}

.jpb-report_photo {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  row-gap: 40px;
  -moz-column-gap: 30px;
       column-gap: 30px;
}

.jpb-report_photo_item img {
  margin-bottom: 12px;
}
.jpb-report_photo_item span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-size: 12px;
  line-height: 1.7;
  text-align: center;
}

/* --------------------------------------------------------------------- 
jpb-merit
-----------------------------------------------------------------------*/
.jpb-merit {
  background-color: #fff;
}

.jpb-merit_wrap {
  padding: 120px 0 0;
}

.jpb-merit_item {
  display: grid;
  grid-template-columns: 44px 1fr;
  align-items: center;
  padding: 36px 40px;
  background-color: #E8E8E8;
  border-radius: 8px;
  width: 100%;
}
@media screen and (max-width: 1524px) {
  .jpb-merit_item {
    padding: 36px 24px;
  }
}
.jpb-merit_item:not(:last-child) {
  margin-bottom: 16px;
}

.jpb-merit_num {
  display: block;
  padding-top: 1px;
  font-family: "Gotham, sans-serif";
  font-size: 14px;
  font-weight: 500;
}

.jpb-merit_txt {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
}

/* --------------------------------------------------------------------- 
jpb-info
-----------------------------------------------------------------------*/
.jpb-info {
  background-color: #fff;
}

.jpb-info_wrap {
  padding: 100px 0 168px;
}

.jpb-info_item:not(:last-child) {
  margin-bottom: 40px;
}

.jpb-info_ttl {
  display: block;
  font-size: 24px;
  font-weight: 700;
  padding-bottom: 16px;
  width: 100%;
  border-bottom: 1px solid #000;
  margin-bottom: 16px;
}

.jpb-info_desc {
  line-height: 2.4;
}

.jpb-info_link {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 20px;
}

/* --------------------------------------------------------------------- 
jpb-member
-----------------------------------------------------------------------*/
.jpb-member_wrap {
  padding: 140px 0 200px;
}

.jpb-member_desc {
  margin-bottom: 60px;
}

.jpb-member_item:not(:last-child) {
  margin-bottom: 36px;
}

.jpb-member_ttl {
  display: grid;
  width: -moz-fit-content;
  width: fit-content;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  padding: 8px 20px;
  background-color: #292929;
  margin-bottom: 20px;
}

.jpb-member_detail_item {
  display: grid;
  grid-template-columns: 244px 1fr;
  align-items: center;
  padding-bottom: 18px;
  border-bottom: 1px dashed #969696;
}
.jpb-member_detail_item:not(:last-child) {
  margin-bottom: 20px;
}

.jpb-member_company {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
}

.jpb-member_access {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 14px;
}
.jpb-member_access a {
  text-decoration: underline;
}

/* --------------------------------------------------------------------- 
jpb-nav
-----------------------------------------------------------------------*/
.jpb-nav {
  position: fixed;
  z-index: 50;
  bottom: 120px;
  right: 0;
  transform: translateX(100%);
  background-color: #E2E2E2;
  width: -moz-fit-content;
  width: fit-content;
  padding: 26px;
  transition: all 0.6s;
}

.jpb-nav.active {
  transform: translateX(0);
}

.jpb-nav_arrow {
  position: absolute;
  width: 22px;
  height: 100%;
  background-color: #292929;
  top: 0;
  left: -22px;
  cursor: pointer;
}
.jpb-nav_arrow::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 12px;
  background-color: #fff;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(180deg);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  transition: all 0.6s;
}

.jpb-nav.active .jpb-nav_arrow::after {
  transform: translate(-50%, -50%);
}

.jpb-nav_ttl {
  font-size: 14px;
  display: block;
  margin-bottom: 16px;
  color: #BCBCBC;
}

.jpb-nav_item:not(:last-child) {
  margin-bottom: 16px;
}

.jpb-nav_link {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  padding-left: 15px;
  font-size: 14px;
  transition: all 0.4s;
}
.jpb-nav_link::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 8px;
  height: 1px;
  background-color: #BCBCBC;
}
.jpb-nav_link:hover {
  opacity: 0.6;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
quality
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
quality-result
-----------------------------------------------------------------------*/
.quality-result {
  background-color: #fff;
}

.quality-result_wrap {
  padding: 60px 0 80px;
}

.quality-result_heading {
  font-size: 24px;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  line-height: 1.8;
  text-align: center;
  margin: 0 auto 48px;
}

.quality-result_desc {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 60px;
}

.quality-result_content {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

.quality-result_list {
  display: grid;
  grid-template-columns: repeat(3, 248px);
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.quality-result_list:not(:last-child) {
  margin-bottom: 32px;
}

.quality-result_item {
  width: 100%;
  position: relative;
}
.quality-result_item:not(:last-child)::after {
  content: "";
  position: absolute;
  height: 100%;
  width: 1px;
  background-color: #BCBCBC;
  top: 0;
  right: 0;
}

.quality-result_ttl {
  font-size: 18px;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 16px;
  font-weight: 700;
}

.quality-result_bottom {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-size: 18px;
  font-weight: 700;
}

.quality-result_num {
  font-family: "Gotham, sans-serif";
  font-size: 40px;
  font-weight: 500;
}

.quality-result_note {
  font-size: 12px;
  font-weight: 300;
  display: block;
  margin-left: auto;
  width: -moz-fit-content;
  width: fit-content;
  margin-right: 40px;
}

/* --------------------------------------------------------------------- 
quality-flow
-----------------------------------------------------------------------*/
.quality-flow_wrap {
  padding: 120px 0 160px;
}

.quality-flow_txt {
  margin-bottom: 32px;
}
.quality-flow_txt h4 {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 24px;
}

.quality-flow_ttl {
  background-color: #292929;
  padding: 26px 32px;
  border-radius: 4px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 18px;
}

.quality-flow_list {
  padding-bottom: 78px;
  border-bottom: 1px solid #BCBCBC;
  margin-bottom: 40px;
}

.quality-flow_item {
  display: grid;
  grid-template-columns: 300px 1fr;
  align-items: center;
  gap: 24px;
  position: relative;
}
.quality-flow_item:not(:last-child)::after {
  content: "";
  position: absolute;
  width: 68px;
  height: 12px;
  background-color: #BCBCBC;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  bottom: -21px;
  left: 118px;
}
.quality-flow_item:not(:last-child) {
  margin-bottom: 28px;
}

.quality-flow_inner span {
  font-weight: 700;
  font-size: 18px;
  display: block;
  margin-bottom: 8px;
}

.quality-flow_bottom p {
  margin-bottom: 20px;
}

/* --------------------------------------------------------------------- 
quality-service
-----------------------------------------------------------------------*/
.quality-service {
  background-color: #E2E2E2;
}

.quality-service_wrap {
  padding: 100px 0;
}

.quality-service_txt {
  margin-bottom: 32px;
}

.quality-service_item:not(:last-child) {
  margin-bottom: 40px;
}
.quality-service_item h4 {
  font-size: 18px;
  font-weight: 700;
  padding: 16px 0;
  width: 100%;
  border-top: 1px solid #464646;
  border-bottom: 1px solid #464646;
  margin-bottom: 18px;
}
.quality-service_item p {
  margin-bottom: 20px;
}

/* --------------------------------------------------------------------- 
quality-feature
-----------------------------------------------------------------------*/
.quality-feature {
  background-color: #Fff;
}

.quality-feature_wrap {
  padding: 120px 0 100px;
}

.quality-feature_top {
  background-color: #F5F5F5;
  padding: 50px 64px;
  border-radius: 8px;
  margin-bottom: 36px;
}

.quality-feature_ttl {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}
.quality-feature_ttl h4 {
  font-size: 24px;
  font-weight: 700;
}

.quality-feature_item {
  border-top: 1px dashed #464646;
  padding: 20px 0;
  font-size: 18px;
}
.quality-feature_item:last-child {
  border-bottom: 1px dashed #464646;
}

.quality-feature_desc {
  margin-bottom: 48px;
}

.quality-feature_figure {
  padding: 120px 204px;
  margin: 0 auto;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
}

.quality-feature_figure_ttl {
  position: absolute;
  width: 100%;
  left: 0;
  top: 49%;
  transform: translateY(-50%);
  text-align: center;
  line-height: 1.8;
  font-size: 20px;
  font-weight: 700;
  opacity: 0;
}

.move .quality-feature_figure_ttl {
  animation: feature_figure_txt 0.6s 1.4s linear forwards;
}

.quality-feature_figure_txt img {
  position: absolute;
  opacity: 0;
}
.quality-feature_figure_txt img:nth-child(1) {
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 214px;
}
.quality-feature_figure_txt img:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  width: 198px;
}
.quality-feature_figure_txt img:nth-child(3) {
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 214px;
}
.quality-feature_figure_txt img:nth-child(4) {
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 198px;
}

.move .quality-feature_figure_txt img {
  animation: feature_figure_txt 0.6s 1.4s linear forwards;
}

@keyframes feature_figure_txt {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.quality-feature_circle {
  width: 410px;
  margin: 0 auto;
  transform: rotate(-90deg);
  opacity: 0;
}

.move .quality-feature_circle {
  animation: feature_circle 1s 0.4s ease-out forwards;
}

@keyframes feature_circle {
  0% {
    transform: rotate(-90deg);
    opacity: 0;
  }
  100% {
    transform: rotate(0deg);
    opacity: 1;
  }
}
.quality-feature_circle_txt span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: #fff;
  font-size: 14px;
  font-weight: 700;
  position: absolute;
  z-index: 2;
  opacity: 0;
}
.quality-feature_circle_txt span:nth-child(1) {
  border: 6px solid #292929;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.quality-feature_circle_txt span:nth-child(2) {
  border: 6px solid #969696;
  top: 50%;
  transform: translateY(-50%);
  right: 24px;
}
.quality-feature_circle_txt span:nth-child(3) {
  border: 6px solid #BCBCBC;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
.quality-feature_circle_txt span:nth-child(4) {
  border: 6px solid #DBDBDB;
  top: 50%;
  transform: translateY(-50%);
  left: 24px;
}

.move .quality-feature_circle_txt span {
  animation: feature_figure_txt 0.6s 1.4s linear forwards;
}

/* --------------------------------------------------------------------- 
quality-reason
-----------------------------------------------------------------------*/
.quality-reason_wrap {
  padding: 100px 0 120px;
}

.quality-reason_heading {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 48px;
}

.quality-reason_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 64px;
}

.quality-reason_img {
  position: relative;
  margin-bottom: 16px;
}
.quality-reason_img span {
  position: absolute;
  font-family: "Gotham, sans-serif";
  font-size: 32px;
  font-weight: 500;
  color: #fff;
  top: 16px;
  left: 20px;
  z-index: 2;
}

.quality-reason_ttl {
  font-weight: 700;
  margin-bottom: 8px;
}

p.quality-reason_point {
  line-height: 2;
  margin-bottom: 12px;
}

.quality-reason_bubble {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background-color: #969696;
  text-align: center;
  height: 46px;
  font-size: 14px;
  color: #fff;
  position: relative;
  margin-bottom: 24px;
}
.quality-reason_bubble::after {
  content: "";
  position: absolute;
  width: 30px;
  height: 18px;
  left: 50%;
  transform: translateX(-50%);
  bottom: -16px;
  background-color: #969696;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

.quality-reason_copy {
  display: block;
  font-size: 24px;
  font-weight: 700;
  text-align: center;
  line-height: 1.6;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

.quality-reason_bottom {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.quality-reason_bottom li {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #292929;
  width: 142px;
  aspect-ratio: 1/1;
  border-radius: 50%;
}

.quality-reason_bottom li span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  padding-top: 4px;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
longterm
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
longterm-differ
-----------------------------------------------------------------------*/
.longterm-differ_wrap {
  padding: 54px 0 64px;
}

.longterm-differ_heading {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 40px;
  font-size: 24px;
  font-weight: 700;
}

.longterm-differ_txt {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 48px;
}

.longterm-differ_head {
  display: grid;
  grid-template-columns: 17fr 27fr 20fr 20fr;
  gap: 4px;
  margin-bottom: 4px;
}

.longterm-differ_head td {
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  line-height: 1.5;
}

.longterm-differ_head_mine {
  background-color: #292929;
  padding-top: 8px;
}
.longterm-differ_head_mine img {
  width: 74%;
  margin: 0 auto 8px;
}

.longterm-differ_head_other {
  background-color: #969696;
}

.longterm-differ_row {
  display: grid;
  grid-template-columns: 17fr 27fr 20fr 20fr;
  gap: 4px;
}
.longterm-differ_row:not(:last-child) {
  margin-bottom: 4px;
}

.longterm-differ_row th,
.longterm-differ_row td {
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.longterm-differ_row th span,
.longterm-differ_row td span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
  line-height: 1.5;
  position: relative;
  font-weight: 500;
  z-index: 3;
}

.longterm-differ_row th {
  background-color: #E7E7E7;
}

.longterm-differ_row td {
  position: relative;
  background-color: #E7E7E7;
}
.longterm-differ_row td::after {
  content: "";
  width: 80px;
  height: 80px;
  background-size: 100% 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.longterm-differ_row td.dubble {
  background-color: #fff;
}
.longterm-differ_row td.dubble::after {
  background-image: url(../images/common/dubble_icon.webp);
}

.longterm-differ_row td.circle::after {
  background-image: url(../images/common/circle_icon.webp);
}

.longterm-differ_row td.triangle::after {
  background-image: url(../images/common/triangle_icon.webp);
}

.longterm-differ_row td.cross::after {
  background-image: url(../images/common/cross_icon.webp);
}

/* --------------------------------------------------------------------- 
longterm-period
-----------------------------------------------------------------------*/
.longterm-period_wrap {
  padding: 64px 0 40px;
}

.longterm-period_top {
  margin-bottom: 48px;
}

.longterm-period_top_txt {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 28px;
}

.longterm-period_top_list {
  display: grid;
  grid-template-columns: 132px 132px;
  gap: 16px;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 16px;
}

.longterm-period_top_note {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-size: 12px;
}

.longterm-period_heading {
  background-color: #292929;
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  width: 100%;
  text-align: center;
  padding: 22px 0;
  border-radius: 4px;
  margin-bottom: 48px;
}

.longterm-period_list {
  margin-left: 20px;
  position: relative;
  padding-bottom: 40px;
  border-bottom: 1px solid #BCBCBC;
}

.longterm-period_content {
  background-color: #fff;
  border-radius: 8px;
  padding: 48px 116px 70px;
}

.longterm-period_item {
  display: grid;
  grid-template-columns: 160px 1fr;
  align-items: flex-start;
  position: relative;
  z-index: 2;
}
.longterm-period_item:not(:last-child) {
  margin-bottom: 24px;
}

.longterm-period_item-line::after {
  content: "";
  position: absolute;
  height: 28px;
  width: 1px;
  left: 11px;
  top: 20px;
  background-color: #000;
}

.longterm-period_year {
  position: relative;
  font-size: 18px;
  font-weight: 700;
  padding-left: 35px;
}
.longterm-period_year::after {
  content: "";
  width: 22px;
  height: 22px;
  position: absolute;
  background-color: #292929;
  border-radius: 50%;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}

.longterm-period_ttl {
  display: flex;
  align-items: center;
  gap: 14px;
}
.longterm-period_ttl h5 {
  font-size: 18px;
  font-weight: 700;
}
.longterm-period_ttl span {
  color: #969696;
  font-size: 14px;
}

.longterm-period_desc {
  line-height: 2;
  margin: 12px 0 0;
}
.longterm-period_desc span {
  font-weight: 700;
}

.longterm-period_copy {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 16px;
}

.longterm-period_copy span {
  font-weight: 700;
}
.longterm-period_copy span:nth-child(1) {
  font-size: 18px;
}
.longterm-period_copy span:nth-child(2) {
  font-size: 24px;
  color: #AD0000;
}

.longterm-period_detail {
  background-color: #E8E8E8;
  border-radius: 8px;
  padding: 20px 32px;
  width: -moz-fit-content;
  width: fit-content;
  margin-top: 12px;
}
.longterm-period_detail p {
  line-height: 2;
}

.longterm-period_bottom {
  padding-top: 32px;
  margin-left: 20px;
}

/* --------------------------------------------------------------------- 
longterm-target
-----------------------------------------------------------------------*/
.longterm-target_wrap {
  padding-bottom: 180px;
}

.longterm-target_content {
  background-color: #fff;
  border-radius: 8px;
  padding: 48px 116px 70px;
}

.longterm-target_heading {
  background-color: #292929;
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  width: 100%;
  text-align: center;
  padding: 22px 0;
  border-radius: 4px;
  margin-bottom: 48px;
}

.longterm-target_img {
  width: 90%;
  margin: 0 auto 30px;
}

.longterm-target_note {
  font-size: 14px;
  line-height: 2;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
shortterm
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
shortterm-case
-----------------------------------------------------------------------*/
.shortterm-case {
  width: 100%;
  overflow-x: hidden;
}

.shortterm-case_wrap {
  padding-bottom: 120px;
}

.shortterm-case_slider {
  width: 100%;
  margin-bottom: 64px;
  position: relative;
}
.shortterm-case_slider .shortterm-case_swiper {
  width: 100%;
  overflow: hidden;
}
.shortterm-case_slider .swiper-button-prev {
  width: 35px;
  height: 35px;
  background-image: url(../images/common/prev_btn.webp);
  background-size: 100% 100%;
  position: absolute;
  left: -350px !important;
  top: 148px !important;
  transform: none !important;
}
.shortterm-case_slider .swiper-button-prev svg {
  display: none;
}
.shortterm-case_slider .swiper-button-next {
  width: 35px;
  height: 35px;
  background-image: url(../images/common/next_btn.webp);
  background-size: 100% 100%;
  position: absolute;
  top: 148px !important;
  left: -311px !important;
}
.shortterm-case_slider .swiper-button-next svg {
  display: none;
}

.shortterm-case_item img {
  margin-bottom: 16px;
}
.shortterm-case_item span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-size: 18px;
  font-weight: 700;
}

.shortterm-case_table table {
  width: 100%;
}

.shortterm-case_table tr {
  display: grid;
  grid-template-columns: 215px 1fr;
  width: 100%;
  border: 1px solid #BCBCBC;
  border-bottom: none;
  height: 64px;
}
.shortterm-case_table tr:last-child {
  border-bottom: 1px solid #BCBCBC;
}

.shortterm-case_table tr th {
  background-color: #F5F5F5;
  font-size: 18px;
  font-weight: 700;
  padding: 0 24px;
  border-right: 1px solid #BCBCBC;
  line-height: 1.5;
  display: flex;
  align-items: center;
}

.shortterm-case_table tr td {
  background-color: #fff;
  padding: 0 28px;
  line-height: 1.7;
  display: flex;
  align-items: center;
}

/* --------------------------------------------------------------------- 
shortterm-support
-----------------------------------------------------------------------*/
.shortterm-support_wrap {
  padding: 80px 0 120px;
}

.shortterm-support_figure {
  position: relative;
  margin-bottom: 60px;
}

.shortterm-support_top {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 54px;
}
@media screen and (max-width: 1400px) {
  .shortterm-support_top {
    width: 100%;
    margin: 0 auto 3.8vw;
  }
}

.shortterm-support_top .shortterm-support_img {
  margin: 0 auto;
}

.shortterm-support_bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.shortterm-support_img {
  width: 288px;
}
@media screen and (max-width: 1400px) {
  .shortterm-support_img {
    width: 34.7%;
  }
}

.shortterm-support_item {
  position: absolute;
}
.shortterm-support_item span {
  font-size: 15px;
  font-weight: 500;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  line-height: 1.8;
}
@media screen and (max-width: 1400px) {
  .shortterm-support_item span {
    font-size: 14px;
  }
}

.shortterm-support_arrow {
  width: 130px;
}
@media screen and (max-width: 1400px) {
  .shortterm-support_arrow {
    width: 9.3vw;
  }
}

.shortterm-support_item:nth-child(1) {
  bottom: 420px;
  right: 620px;
}
@media screen and (max-width: 1400px) {
  .shortterm-support_item:nth-child(1) {
    bottom: 30vw;
    right: 44.3vw;
  }
}
.shortterm-support_item:nth-child(1) .shortterm-support_arrow {
  position: absolute;
  bottom: -92px;
  right: -60px;
  transform: rotate(-45deg);
}

.shortterm-support_item:nth-child(2) {
  width: 100%;
  left: 0;
  bottom: 0;
}
.shortterm-support_item:nth-child(2) span {
  text-align: center;
  margin: 0 auto;
}
.shortterm-support_item:nth-child(2) .shortterm-support_arrow {
  margin: 8px auto;
}

.shortterm-support_item:nth-child(3) {
  bottom: 382px;
  left: 610px;
}
@media screen and (max-width: 1400px) {
  .shortterm-support_item:nth-child(3) {
    bottom: 27.3vw;
    left: 43.6vw;
  }
}
.shortterm-support_item:nth-child(3) .shortterm-support_arrow {
  position: absolute;
  transform: rotate(-135deg);
  bottom: -48px;
  left: -80px;
}
@media screen and (max-width: 1400px) {
  .shortterm-support_item:nth-child(3) .shortterm-support_arrow {
    bottom: -3.4vw;
    left: -5.7vw;
  }
}

.shortterm-support_note {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
ground
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
ground-about
-----------------------------------------------------------------------*/
.ground-about_wrap {
  padding: 64px 0 80px;
}

.ground-about_bg {
  background-color: #fff;
  border-radius: 8px;
  padding: 64px 146px 56px;
  margin-bottom: 64px;
}

.ground-about_heading {
  font-size: 24px;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 64px;
}

.ground-about_inner {
  display: grid;
  grid-template-columns: 50% 1fr;
  align-items: flex-start;
  gap: 36px;
}

.ground-about_right {
  position: relative;
}

.ground-about_img {
  margin-bottom: 8px;
}

.ground-about_note {
  font-size: 12px;
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  margin-left: auto;
}

.ground-about_bubble {
  width: 130px;
  position: absolute;
  top: -60px;
  right: -36px;
}

.ground-about_txt {
  margin-bottom: 28px;
}

.ground-about_txt p {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

.ground-about_figure {
  display: grid;
  grid-template-columns: 25fr 13fr 25fr 13fr 25fr;
  gap: 16px;
  align-items: center;
}

.ground-about_arrow_bottom img {
  width: 90%;
  margin: 6px auto;
}
.ground-about_arrow_bottom span {
  font-size: 14px;
  font-weight: 700;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  line-height: 1.8;
  text-align: center;
}

/* --------------------------------------------------------------------- 
ground-data
-----------------------------------------------------------------------*/
.ground-data_wrap {
  padding: 72px 0 100px;
}

.ground-data_list {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}

.ground-data_item {
  height: 110px;
  background-color: #F5F5F5;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 26px 0;
  width: -moz-fit-content;
  width: fit-content;
}

.ground-data_ttl {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 18px;
  font-weight: 700;
  margin: 0 auto 6px;
}

.ground-data_num {
  display: flex;
  align-items: center;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.ground-data_num span {
  font-family: "Gotham, sans-serif";
  font-size: 40px;
  font-weight: 500;
  display: inline-block;
  padding: 0 2px;
  line-height: 1;
}

.ground-data_note {
  display: block;
  font-size: 12px;
  margin-left: auto;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: 300;
}

.ground-data_txt {
  margin-bottom: 28px;
}

.ground-data_table table {
  width: 100%;
}

.ground-data_table tr {
  display: grid;
  grid-template-columns: 195px 1fr;
  width: 100%;
  border: 1px solid #BCBCBC;
  border-bottom: none;
}
.ground-data_table tr:last-child {
  border-bottom: 1px solid #BCBCBC;
}

.ground-data_table tr th {
  background-color: #F5F5F5;
  font-size: 18px;
  font-weight: 700;
  padding: 24px;
  border-right: 1px solid #BCBCBC;
  line-height: 1.6;
}

.ground-data_table tr td {
  background-color: #fff;
  padding: 24px 28px;
  line-height: 1.8;
}

/* --------------------------------------------------------------------- 
ground-flow
-----------------------------------------------------------------------*/
.ground-flow {
  background-color: #fff;
}

.ground-flow_wrap {
  padding: 64px 0 80px;
}

.ground-flow_heading {
  font-size: 24px;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 40px;
}

.ground-flow_content {
  display: grid;
  grid-template-columns: 600px 1fr;
  gap: 8px;
  width: 700px;
  margin: 0 auto;
}

.ground-flow_top {
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: relative;
  margin-bottom: 16px;
}

.ground-flow_arrow {
  width: 50px;
  background-color: #969696;
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
}
.ground-flow_arrow::after {
  content: "";
  position: absolute;
  width: calc(100% + 12px);
  height: 18px;
  bottom: -15px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #969696;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

.ground-flow_item {
  background-color: #BCBCBC;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  font-weight: 700;
  position: relative;
  z-index: 3;
}

.ground-flow_top_arrow {
  opacity: 0;
  height: 10px;
}

.move .ground-flow_top_arrow {
  animation: ground-flow_top_arrow 0.5s 0.2s linear forwards;
}

@keyframes ground-flow_top_arrow {
  0% {
    height: 10px;
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  100% {
    height: 137px;
    opacity: 1;
  }
}
.ground-flow_top_item {
  background-color: #BCBCBC;
  opacity: 0;
}

.move .ground-flow_top_item:nth-child(1) {
  animation: item-opacity 0.5s 0.2s linear forwards;
}
.move .ground-flow_top_item:nth-child(2) {
  animation: item-opacity 0.5s 0.5s linear forwards;
}
.move .ground-flow_top_item:nth-child(3) {
  animation: item-opacity 0.5s 0.8s linear forwards;
}

@keyframes item-opacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.ground-flow_middle {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 8px;
}

.ground-flow_middle_ttl {
  font-weight: 700;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 16px;
  opacity: 0;
}

.move .ground-flow_middle_ttl {
  animation: item-opacity 0.5s 1.4s linear forwards;
}

.ground-flow_middle_inner {
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
  height: 284px;
}

.ground-flow_middle_arrow {
  height: 10px;
  opacity: 0;
}

.move .ground-flow_middle_arrow {
  animation: ground-flow_middle_arrow 0.8s 1.6s linear forwards;
}

@keyframes ground-flow_middle_arrow {
  0% {
    height: 10px;
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  100% {
    height: calc(100% - 23px);
    opacity: 1;
  }
}
.ground-flow_middle_item {
  background-color: #E7E7E7;
  opacity: 0;
}

.move .ground-flow_middle_item:nth-child(1) {
  animation: item-opacity 0.5s 1.6s linear forwards;
}
.move .ground-flow_middle_item:nth-child(2) {
  animation: item-opacity 0.5s 1.9s linear forwards;
}
.move .ground-flow_middle_item:nth-child(3) {
  animation: item-opacity 0.5s 2.2s linear forwards;
}
.move .ground-flow_middle_item:nth-child(4) {
  animation: item-opacity 0.5s 2.5s linear forwards;
}

.ground-flow_right {
  height: 36px;
  width: 100%;
  background-color: #939393;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 26px), 50% 100%, 0 calc(100% - 26px));
  opacity: 0;
}

.move .ground-flow_right {
  animation: ground-flow_right 1.2s 2.4s linear forwards;
}

@keyframes ground-flow_right {
  0% {
    height: 36px;
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  100% {
    height: 100%;
    opacity: 1;
  }
}
.ground-flow_bottom {
  background-color: #E7E7E7;
  opacity: 0;
}

.move .ground-flow_bottom {
  animation: item-opacity 0.6s 2.6s linear forwards;
}

/* --------------------------------------------------------------------- 
ground-faq
-----------------------------------------------------------------------*/
.ground-faq {
  padding: 110px 0 150px;
}

.ground-faq_group:not(:last-child) {
  margin-bottom: 40px;
}

.ground-faq_ttl {
  background-color: #292929;
  padding: 26px 32px;
  border-radius: 4px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 24px;
}

.ground-faq_item:not(:last-child) {
  margin-bottom: 40px;
}

.ground-faq_q {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.8;
  width: 100%;
  border-bottom: 1px solid #464646;
  padding-bottom: 10px;
  margin-bottom: 12px;
}

/* --------------------------------------------------------------------- 
ground-service
-----------------------------------------------------------------------*/
.ground-service {
  background-color: #E2E2E2;
}

.ground-service_wrap {
  padding: 80px 0;
}

.ground-service_img {
  width: 68%;
  margin-bottom: 8px;
}

.ground-service_list {
  margin-bottom: 32px;
}

.ground-service_item {
  padding: 24px 0;
  display: grid;
  grid-template-columns: 46px 1fr;
  align-items: center;
  border-bottom: 1px solid #292929;
}

.ground-service_num {
  font-size: 14px;
  font-weight: 500;
  font-family: "Gotham, sans-serif";
}

.ground-service_desc {
  font-size: 18px;
}

.ground-service_txt {
  display: block;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 24px;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
termites
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
termites-about
-----------------------------------------------------------------------*/
.termites-about_wrap {
  max-width: 740px;
  padding: 74px 0;
  margin: 0 auto;
}

.termites-about_heading {
  font-size: 32px;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 40px;
}

.termites-about_txt {
  margin-bottom: 48px;
}

.termites-about_top {
  width: 100%;
  background-color: #292929;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  padding: 12px 0;
  margin-bottom: 4px;
}

.termites-about_inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
}

.termites-about_item {
  display: grid;
  grid-template-columns: 20fr 16fr;
  gap: 4px;
}
.termites-about_item:not(:last-child) {
  margin-bottom: 4px;
}

.termites-about_ttl {
  background-color: #E7E7E7;
  display: flex;
  align-items: center;
  padding: 0 18px 0 18px;
  font-weight: 500;
  width: 100%;
  height: 70px;
  line-height: 1.5;
}

.termites-about_desc {
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 70px;
  font-weight: 500;
  position: relative;
}
.termites-about_desc::after {
  content: "";
  width: 60px;
  height: 60px;
  background-size: 100% 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.termites-about_desc span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  text-align: center;
  line-height: 1.5;
  position: relative;
  z-index: 3;
}

.termites-about_desc.dubble::after {
  background-image: url(../images/common/dubble_icon.webp);
}

.termites-about_desc.circle::after {
  background-image: url(../images/common/circle_icon.webp);
}

.termites-about_desc.triangle::after {
  background-image: url(../images/common/triangle_icon.webp);
}

/* --------------------------------------------------------------------- 
termites-case
-----------------------------------------------------------------------*/
.termites-case {
  background-color: #fff;
}

.termites-case_wrap {
  max-width: 820px;
  margin: 0 auto;
  padding: 60px 0 90px;
}

.termites-case_heading {
  font-size: 32px;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 40px;
}

.termites-case_txt {
  margin-bottom: 32px;
}

.termites-case_table {
  margin-bottom: 40px;
}

.termites-case_table table {
  border-collapse: collapse;
}

.termites-case_table td {
  width: 310px;
  height: 50px;
  border: 1px solid #BCBCBC;
  padding: 10px 16px;
  font-size: 14px;
  vertical-align: middle;
  background-attachment: #fff;
}

.termites-case_table td.termites-case_table_ttl {
  font-size: 16px;
  font-weight: 700;
  padding: 0 24px;
  background-color: #F5F5F5;
  border-color: #BCBCBC;
  width: 200px;
  min-width: 200px;
}

.termites-case_list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
}

.termites-case_item h4 {
  width: 100%;
  font-weight: 700;
  padding: 20px 0;
  border-top: 1px solid #464646;
  border-bottom: 1px solid #464646;
  margin-bottom: 16px;
}

.termites-service_wrap {
  padding: 90px 0 64px;
}

.termites-service_txt {
  margin-bottom: 40px;
}

.termites-service_top {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 14px;
}

.termites-service_table table {
  width: 100%;
}

.termites-service_table tr {
  display: grid;
  grid-template-columns: 195px 1fr;
  width: 100%;
  border: 1px solid #BCBCBC;
  border-bottom: none;
}
.termites-service_table tr:last-child {
  border-bottom: 1px solid #BCBCBC;
}

.termites-service_table tr.termites-service_row th {
  padding: 0 24px;
  display: flex;
  align-items: center;
}

.termites-service_table tr th {
  background-color: #F5F5F5;
  font-size: 16px;
  font-weight: 700;
  padding: 24px;
  border-right: 1px solid #BCBCBC;
  line-height: 1.6;
}

.termites-service_table tr td {
  background-color: #fff;
  padding: 24px 28px;
  line-height: 1.8;
}

/* --------------------------------------------------------------------- 
termites-achieve
-----------------------------------------------------------------------*/
.termites-achieve_wrap {
  padding: 64px 0 90px;
}

.termites-achieve_top {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 40px;
}

.termites-achieve_inner {
  display: grid;
  grid-template-columns: 300px 1fr;
  align-items: center;
  gap: 54px;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
must
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
must-about
-----------------------------------------------------------------------*/
.must-about_content {
  background-color: #fff;
  padding: 54px 180px 74px;
  border-radius: 8px;
}

.must-about_heading {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 48px;
}
.must-about_heading h3 {
  font-size: 32px;
  width: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 16px;
}
.must-about_heading span {
  display: block;
  font-size: 18px;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

.must-about_top {
  margin-bottom: 36px;
}

.must-about_ttl {
  padding: 24px 0;
  text-align: center;
  width: 100%;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  background-color: #292929;
  border-radius: 4px;
  margin-bottom: 16px;
}

.must-about_inner {
  display: grid;
  grid-template-columns: 1fr 395px;
  align-items: center;
  gap: 18px;
  margin-bottom: 24px;
}

.must-about_img {
  position: relative;
}

.must-about_list {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
}

.must-about_list li {
  width: 196px;
  height: 42px;
  background-color: rgba(255, 255, 255, 0.9);
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.must-about_list li span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: 700;
}

.must-about_arrow {
  display: block;
  width: 106px;
  height: 18px;
  background-color: #BCBCBC;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  margin: 0 auto 16px;
}

.must-about_result {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-size: 24px;
  font-weight: 700;
}

.must-about_point {
  border-top: 1px dashed #464646;
}

.must-about_point_item {
  padding: 18px 0;
  border-bottom: 1px dashed #464646;
}

.must-about_point_top {
  display: block;
  font-size: 18px;
  margin-bottom: 16px;
}

.must-about_point_bottom {
  display: block;
  font-size: 18px;
  font-weight: 700;
  padding-left: 36px;
  position: relative;
}
.must-about_point_bottom::after {
  content: "";
  position: absolute;
  width: 28px;
  height: 23px;
  background-image: url(../images/common/check_icon.webp);
  background-size: 100% 100%;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}

/* --------------------------------------------------------------------- 
must-service
-----------------------------------------------------------------------*/
.must-service_wrap {
  padding: 80px 0 100px;
}

.must-service_item:not(:last-child) {
  margin-bottom: 46px;
}

.must-service_ttl {
  display: block;
  width: 100%;
  font-size: 24px;
  font-weight: 700;
  padding: 16px 0;
  border-top: 1px solid #464646;
  border-bottom: 1px solid #464646;
  margin-bottom: 16px;
}

.must-service_inner {
  display: grid;
  grid-template-columns: 34fr 36fr;
  gap: 20px;
  align-items: center;
}

.must-service_txt h5 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 8px;
  line-height: 1.7;
}

/* --------------------------------------------------------------------- 
must-case
-----------------------------------------------------------------------*/
.must-case {
  background-color: #E2E2E2;
}

.must-case_wrap {
  padding: 70px 0 100px;
}

.must-case_slider {
  width: 100%;
  margin-bottom: 64px;
  position: relative;
}
.must-case_slider .must-case_swiper {
  width: 100%;
  overflow: hidden;
}
.must-case_slider .swiper-button-prev {
  width: 35px;
  height: 35px;
  background-image: url(../images/common/prev_btn.webp);
  background-size: 100% 100%;
  position: absolute;
  left: -350px !important;
  top: 148px !important;
  transform: none !important;
}
.must-case_slider .swiper-button-prev svg {
  display: none;
}
.must-case_slider .swiper-button-next {
  width: 35px;
  height: 35px;
  background-image: url(../images/common/next_btn.webp);
  background-size: 100% 100%;
  position: absolute;
  top: 148px !important;
  left: -311px !important;
}
.must-case_slider .swiper-button-next svg {
  display: none;
}

.must-case_item img {
  margin-bottom: 16px;
}
.must-case_item span {
  font-weight: 700;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

.must-case_group {
  background-color: #fff;
  width: 100%;
  border-radius: 8px;
  display: grid;
  grid-template-columns: 86px 1fr;
  align-items: flex-start;
  padding: 24px;
}
.must-case_group:not(:last-child) {
  margin-bottom: 8px;
}

.must-case_num {
  font-family: "Gotham, sans-serif";
  font-size: 12px;
  font-weight: 500;
  display: block;
  padding-top: 5px;
}

.must-case_txt h4 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 16px;
}
.must-case_txt span:nth-child(2) {
  display: block;
  line-height: 1.6;
  font-size: 14px;
  margin-bottom: 16px;
}
.must-case_txt span:nth-child(3) {
  font-size: 14px;
  background-color: #AD0000;
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  color: #fff;
  padding: 8px;
}

/* --------------------------------------------------------------------- 
must-period
-----------------------------------------------------------------------*/
.must-period {
  padding: 90px 0 100px;
}

.must-period_wrap {
  max-width: 860px;
}

.must-period_heading {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 64px;
}

.must-period_img {
  display: flex;
  flex-direction: column;
  gap: 64px;
  margin-bottom: 24px;
}

.must-period_note {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 14px;
  margin-left: auto;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
repair
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
repair-flow
-----------------------------------------------------------------------*/
.repair-flow_wrap {
  padding: 64px 0 130px;
}

.repair-flow_list {
  border-top: 1px solid #464646;
  margin-bottom: 50px;
}

.repair-flow_item {
  display: grid;
  grid-template-columns: 84px 1fr;
  align-items: center;
  padding: 26px 0;
  border-bottom: 1px solid #464646;
}

.repair-flow_num {
  font-size: 14px;
  font-family: "Gotham, sans-serif";
  font-weight: 500;
  display: block;
  padding-top: 1px;
}

.repair-flow_txt {
  font-size: 16px;
  font-weight: 700;
}

.repair-flow_bototm {
  padding: 40px 54px 50px;
  background-color: #Fff;
  border-radius: 8px;
}
.repair-flow_bototm h4 {
  font-size: 24px;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 24px;
}

.repair-flow_figure {
  display: grid;
  grid-template-columns: 55fr 5fr;
  gap: 16px;
  align-items: flex-start;
}

.repair-flow_left {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.repair-flow_row {
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  background-color: #E7E7E7;
  padding: 0 10px;
  opacity: 0;
}

.repair-flow_row:nth-child(1) {
  animation: item-opacity 0.6s 0.6s linear forwards;
}
.repair-flow_row:nth-child(2) {
  animation: item-opacity 0.6s 0.8s linear forwards;
}
.repair-flow_row:nth-child(3) {
  animation: item-opacity 0.6s 1s linear forwards;
}
.repair-flow_row:nth-child(4) {
  animation: item-opacity 0.6s 1.2s linear forwards;
}
.repair-flow_row:nth-child(5) {
  animation: item-opacity 0.6s 1.4s linear forwards;
}
.repair-flow_row:nth-child(6) {
  animation: item-opacity 0.6s 1.6s linear forwards;
}
.repair-flow_row:nth-child(7) {
  animation: item-opacity 0.6s 1.8s linear forwards;
}

@keyframes item-opacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.repair-flow_row.repair-flow_row-black {
  background-color: #292929;
}
.repair-flow_row.repair-flow_row-black span:nth-child(2) {
  color: #fff;
}

.repair-flow_row span {
  font-weight: 700;
}
.repair-flow_row span:nth-child(1) {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  width: 146px;
  height: 40px;
  font-weight: 700;
}

.repair-flow_right {
  display: block;
  height: 100%;
  width: 100%;
  background-color: #969696;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 18px), 50% 100%, 0 calc(100% - 18px));
  height: 36px;
  opacity: 0;
}

.move .repair-flow_right {
  animation: ground-flow_right 1.8s 0.4s linear forwards;
}

@keyframes ground-flow_right {
  0% {
    height: 36px;
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  100% {
    height: 100%;
    opacity: 1;
  }
}
/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
about
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
about-concept
-----------------------------------------------------------------------*/
.about-concept_wrap {
  padding: 80px 0;
}

.about-concept_heading {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 48px;
}

.about-concept_txt {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 80px;
}

.about-concept_figure {
  width: 720px;
  margin: 0 auto;
}

.about-concept_top {
  display: grid;
  grid-template-columns: 26fr 18fr 26fr;
  gap: 8px;
}
.about-concept_top .about-concept_arrow {
  padding-top: 18px;
}

.about-concept_name {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #fff;
  font-weight: 700;
  height: 56px;
  background-color: #969696;
  margin-bottom: 12px;
}

.about-concept_desc {
  line-height: 1.8;
}

.about-concept_home {
  width: 168px;
}

.about-concept_middle {
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 40px;
  padding-bottom: 50px;
}

.about-concept_middle .about-concept_arrow {
  width: 140px;
}
.about-concept_middle .about-concept_arrow:nth-child(1) {
  transform: translateY(-20px) rotate(-120deg);
}
.about-concept_middle .about-concept_arrow:nth-child(3) {
  transform: translateY(-20px) rotate(-60deg);
}

.about-concept_bottom {
  padding: 14px 36px;
  background-color: #292929;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.about-concept_bottom span {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 12px;
}
.about-concept_bottom img {
  width: 300px;
}

/* --------------------------------------------------------------------- 
about-message
-----------------------------------------------------------------------*/
.about-message_wrap {
  padding: 100px 0 140px;
}

.about-message_heading {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 100px;
}

.about-message_content {
  display: grid;
  grid-template-columns: 50% 1fr;
  align-items: flex-start;
  gap: 46px;
  margin-bottom: 70px;
}

.about-message_btn {
  margin: 0 auto;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
blueprint
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
blueprint-about
-----------------------------------------------------------------------*/
.blueprint-about_wrap {
  max-width: 740px;
  margin: 0 auto;
  padding: 60px 0 80px;
}

.blueprint-about_txt {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 36px;
}

.blueprint-about_list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 40px;
}

.blueprint-about_item {
  width: 228px;
  border-radius: 50%;
  aspect-ratio: 1/1;
  background-color: #292929;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  line-height: 1.6;
  text-align: center;
}

.blueprint-about_bottom {
  background-color: #E7E7E7;
  width: 100%;
  text-align: center;
  padding: 42px 0;
}
.blueprint-about_bottom p {
  font-size: 24px;
  line-height: 1.6;
  font-weight: 700;
}

/* --------------------------------------------------------------------- 
blueprint-reaosn
-----------------------------------------------------------------------*/
.blueprint-reason {
  background-color: #E2E2E2;
}

.blueprint-reason_wrap {
  padding: 70px 0 80px;
}

.blueprint-reason_item {
  background-color: #F5F5F5;
  padding: 24px;
  border-radius: 8px;
  display: grid;
  grid-template-columns: 54px 1fr;
}
.blueprint-reason_item:not(:last-child) {
  margin-bottom: 24px;
}

.blueprint-reason_num {
  font-size: 12px;
  font-weight: 500;
  font-family: "Gotham, sans-serif";
  display: block;
  padding-top: 8px;
}

.blueprint-reason_ttl {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 10px;
}

/* --------------------------------------------------------------------- 
blueprint-point
-----------------------------------------------------------------------*/
.blueprint-point_wrap {
  padding: 80px 0;
}

.blueprint-point_txt {
  margin-bottom: 20px;
}

.blueprint-point_item {
  display: grid;
  grid-template-columns: 36px 54px 1fr;
  gap: 18px;
  align-items: center;
  background-color: #F5F5F5;
  border-radius: 8px;
  padding: 18px 24px;
}
.blueprint-point_item:not(:last-child) {
  margin-bottom: 16px;
}

.blueprint-point_num {
  font-size: 12px;
  font-weight: 500;
  font-family: "Gotham, sans-serif";
  display: block;
}

.blueprint-point_desc {
  font-size: 24px;
  font-weight: 700;
}

/* --------------------------------------------------------------------- 
blueprint-message
-----------------------------------------------------------------------*/
.blueprint-message_wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 64px 0 150px;
}

.blueprint-message_txt {
  padding-top: 10px;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
extended
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
extended-about
-----------------------------------------------------------------------*/
.extended-about_wrap {
  padding: 64px 0 90px;
}

.extended-about_txt {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 32px;
}

.extended-about_content {
  max-width: 850px;
  margin: 0 auto;
}

.extended-about_bubble {
  width: 198px;
  margin: 0 auto 6px;
}

.extended-about_flow {
  display: grid;
  grid-template-columns: 24fr 64fr;
  height: 110px;
  background-color: #292929;
}

.extended-about_item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.extended-about_item:nth-child(1) {
  background-color: #969696;
  padding-right: 16px;
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 0 100%);
}

.extended-about_period {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 700;
  width: 132px;
  height: 34px;
  background-color: #fff;
  border-radius: 100px;
  margin: 0 auto 12px;
}

.extended-about_desc {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  margin: 0 auto;
}

/* --------------------------------------------------------------------- 
extended-service
-----------------------------------------------------------------------*/
.extended-service_wrap {
  padding-bottom: 110px;
}

.extended-service_content {
  padding-right: calc((100vw - 1300px) / 2);
}

.extended-service_list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  row-gap: 36px;
  -moz-column-gap: 32px;
       column-gap: 32px;
}

.extended-service_img {
  margin-bottom: 12px;
  position: relative;
}
.extended-service_img span {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #292929;
  border-radius: 100px;
  color: #fff;
  font-size: 16px;
  font-family: "Gotham, sans-serif";
  font-weight: 500;
  padding-top: 3px;
  width: 34px;
  aspect-ratio: 1/1;
  position: absolute;
  top: 8px;
  left: 8px;
}

.extended-service_desc {
  display: block;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

/* --------------------------------------------------------------------- 
extended-case
-----------------------------------------------------------------------*/
.extended-case_wrap {
  padding: 80px 0 110px;
}

.extended-case_txt {
  margin-bottom: 48px;
}

.extended-case_list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  row-gap: 16px;
  -moz-column-gap: 8px;
       column-gap: 8px;
}

.extended-case_item {
  background-color: #F5F5F5;
  border-radius: 8px;
  padding: 18px 20px;
}

.extended-case_ttl {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 12px;
  align-items: center;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 8px;
}

.extended-case_desc {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 8px;
}
.extended-case_desc p {
  line-height: 2;
}

.extended-case_free {
  display: flex;
  align-items: center;
  gap: 0;
  width: -moz-fit-content;
  width: fit-content;
  padding-bottom: 4px;
  border-bottom: 1px solid #292929;
}

.extended-case_free span:nth-child(1) {
  font-size: 14px;
}
.extended-case_free span:nth-child(2) {
  font-size: 18px;
  font-weight: 700;
  color: #AD0000;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
excellent
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
excellent-support
-----------------------------------------------------------------------*/
.excellent-support_wrap {
  padding: 80px 0 100px;
}

.excellent-support_top {
  font-size: 24px;
  font-weight: 700;
  display: block;
  margin-bottom: 40px;
}

.excellent-support_item:not(:last-child) {
  margin-bottom: 40px;
}

.excellent-support_ttl {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 20px;
  padding: 16px 0;
  border-top: 1px solid #464646;
  border-bottom: 1px solid #464646;
}

.excellent-support_inner {
  display: grid;
  grid-template-columns: 34fr 36fr;
  gap: 20px;
  align-items: flex-start;
  margin-bottom: 40px;
}

.excellent-support_desc {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.excellent-support_desc span {
  font-size: 18px;
  display: block;
  font-weight: 700;
}

.excellent-support_detail {
  background-color: #F5F5F5;
  padding: 28px 24px;
}
.excellent-support_detail span {
  font-weight: 700;
}

/* --------------------------------------------------------------------- 
excellent-point
-----------------------------------------------------------------------*/
.excellent-point {
  background-color: #E2E2E2;
}

.excellent-point_wrap {
  padding: 100px 0 110px;
}

.excellent-point_top {
  display: flex;
  align-items: center;
  gap: 126px;
  margin-bottom: 80px;
}
.excellent-point_top span {
  font-size: 24px;
  font-weight: 700;
}

.excellent-point_item {
  padding: 60px 0 60px 64px;
  border-left: 1px solid #464646;
}
.excellent-point_item:first-child {
  padding: 0 0 60px 64px;
}
.excellent-point_item:last-child {
  padding: 60px 0 0 64px;
}
.excellent-point_item:not(:first-child) {
  border-top: 1px solid #464646;
}

.excellent-point_inner {
  display: grid;
  grid-template-columns: 48fr 50fr;
  align-items: flex-start;
  gap: 40px;
}

.excellent-point_num {
  display: block;
  font-size: 14px;
  font-weight: 500;
  font-family: "Gotham, sans-serif";
  margin-bottom: 28px;
}

.excellent-point_ttl {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.7;
  margin-bottom: 24px;
}

p.excellent-point_desc {
  line-height: 2;
}

p.excellent-point_note {
  font-size: 12px;
  font-weight: 300;
  line-height: 2;
  margin-top: 20px;
}

.excellent-point_img span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  font-size: 12px;
  margin-left: auto;
  margin-bottom: 4px;
}
.excellent-point_img p {
  font-size: 12px;
  font-weight: 300;
  line-height: 1.4;
  margin-top: 6px;
}

.excellent-point_detail {
  background-color: #F5F5F5;
  padding: 28px 24px;
  margin-top: 36px;
  width: 100%;
}
.excellent-point_detail span {
  font-weight: 700;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
emergency
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
emergency-call
-----------------------------------------------------------------------*/
.emergency-call_wrap {
  padding: 64px 0 80px;
}

.emergency-call_txt {
  margin-bottom: 24px;
}

.emergency-call_border {
  padding: 16px 22px;
  border: 1px solid #292929;
  width: 100%;
}

/* --------------------------------------------------------------------- 
emergency-rush
-----------------------------------------------------------------------*/
.emergency-rush_wrap {
  padding: 64px 0 160px;
}

.emergency-rush_txt {
  margin-bottom: 40px;
}

.emergency-rush_top {
  display: block;
  width: 100%;
  background-color: #292929;
  padding: 24px 32px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  border-radius: 4px;
  margin-bottom: 24px;
}

.emergency-rush_list {
  margin-bottom: 24px;
}

.emergency-rush_item {
  display: grid;
  grid-template-columns: 34fr 36fr;
  align-items: center;
  gap: 20px;
}
.emergency-rush_item:not(:last-child) {
  margin-bottom: 24px;
}

.emergency-rush_ttl {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 20px;
}

.emergency-rush_check {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.emergency-rush_check li {
  padding-left: 30px;
  position: relative;
}
.emergency-rush_check li::after {
  content: "";
  position: absolute;
  width: 24px;
  height: 20px;
  background-image: url(../images/common/check_icon.webp);
  background-size: 100% 100%;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}

.emergency-rush_border {
  padding: 16px 22px;
  border: 1px solid #292929;
  width: 100%;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
periodic
-----------------------------------------------------------------------*/
/* --------------------------------------------------------------------- 
periodic-about
-----------------------------------------------------------------------*/
.periodic-about_wrap {
  padding: 64px 0 84px;
}

.periodic-about_heading {
  font-size: 24px;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 40px;
}

.periodic-about_txt {
  max-width: 730px;
  margin: 0 auto 50px;
}

.periodic-about_list {
  display: grid;
  grid-template-columns: repeat(3, 330px);
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

.periodic-about_item:nth-child(2) {
  border-left: 1px solid #BCBCBC;
  border-right: 1px solid #BCBCBC;
}

.periodic-about_img {
  width: 74px;
  margin: 0 auto 20px;
}

.periodic-about_desc {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}

.periodic-about_top {
  display: block;
  font-size: 18px;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 10px;
}

.periodic-about_ttl {
  display: block;
  font-size: 18px;
  font-weight: 700;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.periodic-about_ttl span {
  font-size: 32px;
}
.periodic-about_ttl span.num_txt {
  font-size: 40px;
  font-family: "Gotham, sans-serif";
}

.periodic-about_note {
  font-weight: 300;
  font-size: 12px;
  display: block;
  margin-left: auto;
  width: -moz-fit-content;
  width: fit-content;
}

/* --------------------------------------------------------------------- 
periodic-service
-----------------------------------------------------------------------*/
.periodic-service_wrap {
  padding: 54px 0 84px;
}

.periodic-service_bg {
  background-color: #fff;
  padding: 62px 132px;
}

.periodic-service_heading {
  font-size: 32px;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: 700;
  margin: 0 auto 36px;
}

.periodic-service_table {
  margin-bottom: 24px;
}

.periodic-service_table table {
  width: 100%;
}

.periodic-service_table tr {
  display: grid;
  grid-template-columns: 282px 1fr;
  width: 100%;
  border: 1px solid #BCBCBC;
  border-bottom: none;
  height: 64px;
}
.periodic-service_table tr:last-child {
  border-bottom: 1px solid #BCBCBC;
}

.periodic-service_table tr th {
  background-color: #F5F5F5;
  font-size: 18px;
  font-weight: 700;
  padding: 0 24px;
  border-right: 1px solid #BCBCBC;
  line-height: 1.5;
  display: flex;
  align-items: center;
}

.periodic-service_table tr td {
  background-color: #fff;
  padding: 0 28px;
  font-size: 14px;
  line-height: 1.7;
  display: flex;
  align-items: center;
}

.periodic-service_list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
  margin-bottom: 8px;
}

.periodic-service_item {
  border-radius: 4px;
  overflow: hidden;
  background-color: #F5F5F5;
}
.periodic-service_item h4 {
  display: block;
  width: 100%;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  padding: 15px 0;
}
.periodic-service_item span {
  display: block;
  padding: 20px 0;
  width: 100%;
  text-align: center;
  font-size: 14px;
}

.periodic-service_item:nth-child(1) h4 {
  background-color: #BCBCBC;
}

.periodic-service_item:nth-child(2) h4 {
  background-color: #969696;
}

.periodic-service_item:nth-child(3) h4 {
  background-color: #292929;
}

.periodic-service_note {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  font-size: 14px;
}

/* --------------------------------------------------------------------- 
periodic-point
-----------------------------------------------------------------------*/
.periodic-merit_wrap {
  padding-bottom: 100px;
}

.periodic-merit_list {
  border-top: 1px dashed #464646;
}

.periodic-merit_txt p {
  font-size: 18px;
  margin-bottom: 24px;
}

.periodic-merit_list {
  margin-bottom: 36px;
}

.periodic-merit_item {
  padding: 16px 0 20px;
  border-bottom: 1px dashed #464646;
}

.periodic-merit_top {
  display: block;
  font-size: 18px;
  margin-bottom: 16px;
}

.periodic-merit_bottom {
  display: flex;
  align-items: center;
  gap: 8px;
}

.periodic-merit_bottom span:nth-child(1) {
  display: block;
  font-size: 18px;
  font-weight: 700;
  padding-left: 36px;
  position: relative;
}
.periodic-merit_bottom span:nth-child(1)::after {
  content: "";
  position: absolute;
  width: 28px;
  height: 23px;
  background-image: url(../images/common/check_icon.webp);
  background-size: 100% 100%;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}

.periodic-merit_bottom span:nth-child(2) {
  display: block;
  font-size: 12px;
}

/* --------------------------------------------------------------------- 
periodic-check
-----------------------------------------------------------------------*/
.periodic-check_wrap {
  padding: 100px 0 90px;
}

.periodic-check_group:not(:last-child) {
  margin-bottom: 24px;
}

.periodic-check_top {
  background-color: #292929;
  border-radius: 4px;
  padding: 26px 32px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 24px;
}

.periodic-check_item {
  display: grid;
  grid-template-columns: 34fr 36fr;
  gap: 20px;
  align-items: center;
}
.periodic-check_item:not(:last-child) {
  margin-bottom: 24px;
}

.periodic-check_ttl {
  display: block;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 6px;
}
.periodic-check_ttl:not(:first-child) {
  margin-top: 20px;
}

.periodic-check_desc {
  display: block;
  font-size: 14px;
  line-height: 2;
  padding-left: 32px;
  position: relative;
}
.periodic-check_desc::after {
  content: "";
  position: absolute;
  width: 24px;
  height: 20px;
  background-image: url(../images/common/check_icon.webp);
  background-size: 100% 100%;
  top: 4px;
  left: 0;
}

/* --------------------------------------------------------------------- 
periodic-case
-----------------------------------------------------------------------*/
.periodic-case {
  background-color: #E2E2E2;
}

.periodic-case_wrap {
  padding: 80px 0 90px;
}

.periodic-case_top {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
}

.periodic-case_top span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  padding: 8px;
  color: #fff;
  font-size: 14px;
}
.periodic-case_top span:nth-child(1) {
  background-color: #969696;
}
.periodic-case_top span:nth-child(2) {
  background-color: #292929;
}

.periodic-case_txt {
  margin-bottom: 48px;
}
.periodic-case_txt span {
  display: block;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 6px;
}
.periodic-case_txt p {
  line-height: 1.7;
}

.periodic-case_slider {
  width: 100%;
  margin-bottom: 64px;
  position: relative;
}
.periodic-case_slider .periodic-case_swiper {
  width: 100%;
  overflow: hidden;
}
.periodic-case_slider .swiper-button-prev {
  width: 35px;
  height: 35px;
  background-image: url(../images/common/prev_btn.webp);
  background-size: 100% 100%;
  position: absolute;
  left: -350px !important;
  top: -48px !important;
  transform: none !important;
}
.periodic-case_slider .swiper-button-prev svg {
  display: none;
}
.periodic-case_slider .swiper-button-next {
  width: 35px;
  height: 35px;
  background-image: url(../images/common/next_btn.webp);
  background-size: 100% 100%;
  position: absolute;
  top: -48px !important;
  left: -311px !important;
}
.periodic-case_slider .swiper-button-next svg {
  display: none;
}

.periodic-case_item img {
  margin-bottom: 24px;
}
.periodic-case_item span {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
  font-size: 18px;
  font-weight: 700;
}

/* --------------------------------------------------------------------- 
periodic-flow
-----------------------------------------------------------------------*/
.periodic-flow_wrap {
  padding: 86px 0 130px;
}

.periodic-flow_bg {
  background-color: #fff;
  border-radius: 8px;
  padding: 40px 115px 72px;
  margin-bottom: 36px;
}

.periodic-flow_heading {
  background-color: #292929;
  padding: 24px 0;
  border-radius: 4px;
  font-size: 24px;
  color: #fff;
  font-weight: 700;
  text-align: center;
  width: 100%;
  margin-bottom: 48px;
}

.periodic-flow_item {
  position: relative;
  z-index: 2;
  padding-bottom: 32px;
}

.periodic-flow_inner {
  display: grid;
  grid-template-columns: 160px 1fr;
  align-items: flex-start;
}

.periodic-flow_under {
  margin-top: 24px;
  margin-left: 12px;
  border-top: 1px solid #BCBCBC;
  padding: 8px 12px;
  font-size: 14px;
  color: #969696;
}

.periodic-flow_item-line::after {
  content: "";
  position: absolute;
  height: 100%;
  width: 1px;
  left: 11px;
  top: 8px;
  background-color: #000;
}

.periodic-flow_year {
  position: relative;
  font-size: 18px;
  font-weight: 700;
  padding-left: 35px;
}
.periodic-flow_year::after {
  content: "";
  width: 22px;
  height: 22px;
  position: absolute;
  background-color: #292929;
  border-radius: 50%;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}

.periodic-flow_txt {
  display: grid;
  grid-template-columns: 50px 1fr;
  align-items: flex-start;
  gap: 12px;
}

.periodic-flow_desc span {
  display: block;
  font-size: 18px;
  line-height: 1.6;
  font-weight: 700;
  margin-bottom: 6px;
}
.periodic-flow_desc span:not(:first-child) {
  margin-top: 12px;
}
.periodic-flow_desc p {
  line-height: 2;
}

.periodic-flow_bottom {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.periodic-flow_point {
  width: 140px;
  aspect-ratio: 1/1;
  background-color: #292929;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 1.5;
  padding-top: 6px;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
event
-----------------------------------------------------------------------*/
.event_wrap {
  padding: 80px 0 200px;
}

.event_img {
  margin-bottom: 10px;
  aspect-ratio: 3/2;
  border-radius: 4px;
  overflow: hidden;
}
.event_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.event_date {
  font-size: 14px;
  font-family: "Gotham, sans-serif";
  font-weight: 500;
  display: block;
  margin-bottom: 10px;
}

.event_ttl {
  font-size: 16px;
  line-height: 1.7;
  font-weight: 700;
  margin-bottom: 12px;
}

.event_place {
  display: grid;
  grid-template-columns: 14px 1fr;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}

/* --------------------------------------------------------------------- 
event-archive
-----------------------------------------------------------------------*/
.event .page-top_head {
  padding-bottom: 24px;
}

.event_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  row-gap: 48px;
  -moz-column-gap: 40px;
       column-gap: 40px;
}

/* --------------------------------------------------------------------- 
event-single
-----------------------------------------------------------------------*/
.event_heading {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 32px;
}

.event_tag {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
}

.event_tag_item {
  display: grid;
  grid-template-columns: 20px 1fr;
  align-items: center;
  gap: 6px;
}
.event_tag_item:nth-child(2) {
  grid-template-columns: 14px 1fr;
}

.event_content {
  padding-top: 60px;
  max-width: 820px;
}

.event_group:not(:last-child) {
  margin-bottom: 54px;
}

.event_group .event_ttl {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.4;
  padding-bottom: 20px;
  width: 100%;
  border-bottom: 1px solid #464646;
  margin-bottom: 24px;
}

.event_group-grid {
  display: grid;
  grid-template-columns: 208px 1fr;
  align-items: center;
  gap: 32px;
}

.event_table {
  margin-bottom: 32px;
}

.event_table table {
  width: 100%;
}

.event_table tr {
  display: grid;
  grid-template-columns: 282px 1fr;
  width: 100%;
  border: 1px solid #BCBCBC;
  border-bottom: none;
  min-height: 64px;
}
.event_table tr:last-child {
  border-bottom: 1px solid #BCBCBC;
}

.event_table tr th {
  background-color: #F5F5F5;
  font-size: 16px;
  font-weight: 700;
  padding: 0 24px;
  border-right: 1px solid #BCBCBC;
  line-height: 1.5;
  display: flex;
  align-items: center;
}

.event_table tr td {
  background-color: #fff;
  padding: 12px 28px;
  line-height: 1.7;
  font-size: 14px;
  display: flex;
  align-items: center;
}

.event_btn {
  margin: 0 auto;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
voice
-----------------------------------------------------------------------*/
.voice_wrap {
  padding: 80px 0 200px;
}

.voice_img {
  margin-bottom: 12px;
  aspect-ratio: 3/2;
}
.voice_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.voice_ttl {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 8px;
}

.voice_name {
  font-size: 14px;
}

/* --------------------------------------------------------------------- 
voice-archive
-----------------------------------------------------------------------*/
.voice .page-top_head {
  padding-bottom: 24px;
}

.voice_list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  row-gap: 64px;
  -moz-column-gap: 56px;
       column-gap: 56px;
}

.voice_head {
  display: grid;
  grid-template-columns: 330px 1fr;
  height: 330px;
  max-width: 820px;
  margin: 0 auto;
  background-color: #292929;
  margin-bottom: 64px;
}

.voice_head .voice_img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.voice_txt {
  width: 100%;
  height: 100%;
  padding: 0 54px;
  display: flex;
  align-items: center;
}

.voice_heading {
  font-size: 32px;
  font-weight: 700;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 32px;
}

.voice_txt .voice_name {
  display: block;
  color: #fff;
  font-weight: 700;
  font-size: 24px;
}

.voice_content {
  max-width: 820px;
  margin: 0 auto;
}

.voice_video {
  width: 100%;
  aspect-ratio: 560/315;
  margin-bottom: 48px;
}
.voice_video iframe {
  width: 100%;
  height: 100%;
}

.voice_btn {
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 44px 0 20px;
  margin: 0 auto;
}

.voice_desc > *:not(:last-child) {
  margin-bottom: 16px;
}

.voice_desc > *:last-child {
  margin-bottom: 60px;
}

.voice_desc h1,
.voice_desc h2,
.voice_desc h3,
.voice_desc h4,
.voice_desc h5,
.voice_desc h6 {
  font-size: 24px;
  font-weight: 700;
  padding-bottom: 16px;
  border-bottom: 1px solid #464646;
  width: 100%;
  line-height: 1.4;
}

/* mediaquery
----------------------------------------------------------------- */
.pc_LL_display {
  display: none;
}
@media screen and (max-width: 1524px) {
  .pc_LL_display {
    display: block;
  }
}

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

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

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

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

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

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

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

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

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

@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Gotham, sans-serif";
  src: url("./font/gotham-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
/* --------------------------------------------------------------------- 
form
-----------------------------------------------------------------------*/
.form .page-top_head {
  padding-bottom: 24px;
}

.form_wrap {
  padding: 80px 0 200px;
}

.form_txt {
  margin-bottom: 40px;
}

.form_list {
  margin-bottom: 24px;
}

.form_item {
  display: grid;
  grid-template-columns: 218px 1fr;
  align-items: flex-start;
  padding: 24px 0;
  border-top: 1px dashed #BCBCBC;
}
.form_item:last-child {
  border-bottom: 1px dashed #BCBCBC;
}

.form_item.form_item-center {
  align-items: center;
}

.form_item-pt .form_ttl {
  padding-top: 18px;
}

.form_ttl {
  display: flex;
  align-items: center;
  gap: 8px;
}
.form_ttl h3 {
  font-size: 18px;
  line-height: 1.5;
}
.form_ttl span {
  display: block;
  font-size: 12px;
  color: #fff;
  background-color: #575757;
  padding: 5px 4px 4px;
  width: -moz-fit-content;
  width: fit-content;
}

.form_input input,
.form_input textarea {
  width: 100%;
  background-color: #fff;
  line-height: 1.4;
  padding: 20px 24px;
  border: 1px solid #DDDDDD;
}
.form_input input::-moz-placeholder, .form_input textarea::-moz-placeholder {
  color: #DDDDDD;
}
.form_input input::placeholder,
.form_input textarea::placeholder {
  color: #DDDDDD;
}

.form_input-name {
  display: grid;
  grid-template-columns: 220px 220px;
  gap: 8px;
}

.form_input-sm {
  max-width: 328px;
}

.form_input-num {
  display: grid;
  grid-template-columns: 28px 300px;
  align-items: center;
  margin-bottom: 8px;
}

.form_input-mark {
  font-size: 20px;
}

.form_radio {
  align-items: center;
}
.form_radio .form_ttl {
  padding-top: 0;
}

.form_policy {
  margin-bottom: 40px;
}

.form_policy_txt {
  font-size: 18px;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 40px;
}

.form_policy_link {
  display: inline-block;
  position: relative;
}
.form_policy_link span {
  color: #004EFF;
  text-decoration: underline;
}
.form_policy_link::after {
  content: "";
  width: 18px;
  height: 16px;
  background-image: url(../images/common/policy_icon.webp);
  background-size: 100% 100%;
  position: absolute;
  right: 8px;
  top: 54%;
  transform: translateY(-50%);
}

.form_btn {
  display: block;
  max-width: 500px;
  width: 100%;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  font-size: 20px;
  background-color: #292929;
  border: 1px solid #292929;
  margin: 0 auto;
  transition: all 0.4s;
}

.form_btn:hover {
  background-color: #fff;
  color: #292929;
}

/* --------------------------------------------------------------------- 
CF7
-----------------------------------------------------------------------*/
.form_input-radio .wpcf7-list-item label {
  display: flex;
  align-items: center;
  font-size: 18px;
  cursor: pointer;
}

/* 元のラジオを非表示 */
.wpcf7-list-item input[type=radio] {
  display: none;
}

/* テキスト側 */
.form_input-radio .wpcf7-list-item-label {
  position: relative;
  padding-left: 38px;
}

/* 外側の丸 */
.form_input-radio .wpcf7-list-item-label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  border: 1px solid #DDDDDD;
  border-radius: 50%;
  background-color: #fff;
}

/* 選択時の中の丸 */
.form_input-radio .wpcf7-list-item input[type=radio]:checked + .wpcf7-list-item-label::after {
  content: "";
  position: absolute;
  left: 9px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  background: #575757;
  border-radius: 50%;
}

.form_input-check .wpcf7-form-control {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.form_input-check .wpcf7-list-item label {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

/* 元のチェックボックスを消す */
.form_input-check .wpcf7-list-item input[type=checkbox] {
  display: none;
}

/* テキスト側に余白 */
.form_input-check .wpcf7-list-item-label {
  position: relative;
  padding-left: 38px;
  font-size: 18px;
}

/* 外枠（25px） */
.form_input-check .wpcf7-list-item-label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  border: 1px solid #DDDDDD;
  box-sizing: border-box;
  background-color: #fff;
}

/* チェックマーク */
.form_input-check .wpcf7-list-item input[type=checkbox]:checked + .wpcf7-list-item-label::after {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-60%) rotate(45deg);
  width: 10px;
  height: 16px;
  border-right: 2px solid #575757;
  border-bottom: 2px solid #575757;
}

/* --------------------------------------------------------------------- 
form-maintenance
-----------------------------------------------------------------------*/
.maintenance .form_list {
  margin-bottom: 0;
}

.maintenance .form_item {
  display: grid;
  grid-template-columns: 270px 1fr;
}

.form_box .box-group {
  margin-top: 100px;
}

.form_box .box-title {
  display: block;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 24px;
}

.form_box_btn {
  margin: 30px auto 64px;
}
.form_box_btn button {
  display: block;
  max-width: 328px;
  height: 48px;
  border-radius: 4px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  color: #fff;
  font-size: 16px;
  border: 1px solid #969696;
}
.form_box_btn button.btn-delete {
  background-color: #AD0000;
  margin: 0 auto 8px;
}
.form_box_btn button.btn-add {
  background-color: #292929;
}

.form_submit {
  margin-top: 40px;
}

.form_note {
  background-color: #fff;
  padding: 20px 28px;
  border: 1px solid #EBEBEB;
}
.form_note span {
  font-weight: 500;
  font-size: 14px;
  display: block;
  margin-bottom: 8px;
}
.form_note p {
  line-height: 1.8;
}

.form_input-radio {
  padding-top: 4px;
}

.radio_group {
  display: flex;
  align-items: center;
  -moz-column-gap: 28px;
       column-gap: 28px;
  row-gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.radio_item {
  display: flex;
  align-items: center;
  font-size: 18px;
}

.radio_item input[type=radio] {
  display: none;
  width: -moz-fit-content;
  width: fit-content;
}

.radio_item span {
  position: relative;
  padding-left: 38px;
  cursor: pointer;
}

/* 外側の丸 */
.radio_item span::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  border: 1px solid #DDDDDD;
  border-radius: 50%;
  background-color: #fff;
}

/* 選択時の中の丸 */
.radio_item input[type=radio]:checked + span::after {
  content: "";
  position: absolute;
  left: 9px;
  top: 50%;
  transform: translateY(-50%);
  width: 12px;
  height: 12px;
  background: #575757;
  border-radius: 50%;
}

.file-upload-item:not(:last-child) {
  margin-bottom: 8px;
}

.file-upload-item input {
  background-color: unset;
  border: none;
  padding: 0;
  font-size: 14px;
}

p.file-note {
  margin-top: 12px;
  line-height: 1.6;
}

.check_item {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  font-size: 18px;
  margin-bottom: 16px;
}

.check_item input[type=checkbox] {
  display: none;
}

.check_item span {
  position: relative;
  padding-left: 45px;
  line-height: 1.5;
}

/* 外側の四角 */
.check_item span::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 25px;
  height: 25px;
  border: 1px solid #EBEBEB;
  background-color: #fff;
  transform: translateY(-50%);
  box-sizing: border-box;
}

/* チェックマーク */
.check_item input[type=checkbox]:checked + span::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 8px;
  width: 10px;
  height: 14px;
  border-right: 2px solid #3B3B3B;
  border-bottom: 2px solid #3B3B3B;
  transform: translateY(-60%) rotate(45deg);
}/*# sourceMappingURL=style.css.map */