@charset "UTF-8";
/* ---------------------------------------------------
	トップページ：キービジュアル
------------------------------------------------------ */
.top-kv .acms-admin-module-edit {
  left: 0;
  right: auto;
}
.top-kv .kv-slider {
  width: 100%;
  aspect-ratio: 96/47;
}
.top-kv .kv-slider .kv-slider-wrap .kv-slide-item a {
  opacity: 1 !important;
}
.top-kv .kv-slider .kv-slider-wrap .kv-slide-item img {
  width: 100%;
}
.top-kv .kv-slider .kv-pagination {
  bottom: 2rem;
}
.top-kv .kv-slider .kv-pagination .swiper-pagination-bullet {
  width: 1.5rem;
  height: 1.5rem;
  margin: 0 0.75rem;
  background: #fff;
  opacity: 0.3;
}
.top-kv .kv-slider .kv-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  opacity: 1;
}
.top-kv .kv-slider .kv-paa, .top-kv .kv-slider .kv-naa {
  width: 5rem;
  height: 3rem;
  filter: drop-shadow(0 0 1rem #fff);
}
.top-kv .kv-slider .kv-paa::after, .top-kv .kv-slider .kv-naa::after {
  content: "";
  width: 100%;
  height: 100%;
  background: linear-gradient(125deg, #0d367c 0%, #1e64db 100%);
}
.top-kv .kv-slider .kv-naa::after {
  clip-path: polygon(0% 20%, 60% 20%, 60% 0%, 100% 50%, 60% 100%, 60% 80%, 0% 80%);
}
.top-kv .kv-slider .kv-paa::after {
  clip-path: polygon(40% 0%, 40% 20%, 100% 20%, 100% 80%, 40% 80%, 40% 100%, 0% 50%);
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-kv {
    margin-top: 6rem;
  }
  .top-kv .kv-slider {
    aspect-ratio: 375/692;
  }
  .top-kv .kv-slider .kv-slider-wrap .kv-slide-item img {
    width: 100%;
  }
  .top-kv .kv-slider .kv-paa, .top-kv .kv-slider .kv-naa {
    bottom: 10%;
    top: auto;
  }
}
/* ---------------------------------------------------
	トップページ：オープニング
------------------------------------------------------ */
.top-op {
  position: fixed;
  z-index: 99999;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #fff;
}
.top-op .wrap {
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.top-op .wrap .op-txt {
  text-align: center;
  font-size: 4rem;
  margin: auto auto 2rem 2.5rem;
  font-family: "Noto Serif JP", serif;
  display: flex;
  justify-content: center;
}
.top-op .wrap .op-txt.ch {
  display: block;
}
.top-op .wrap .op-logo {
  width: 58.2rem;
  margin: auto;
  display: block;
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-op .wrap .op-txt {
    font-size: 2rem;
  }
}
/* ---------------------------------------------------
	トップページ：キービジュアル：再構築
------------------------------------------------------ */
.top-kv.re {
  position: relative;
  z-index: 1;
  aspect-ratio: 1920/940;
  background: #fff;
  margin-bottom: 5rem;
}
.top-kv.re .illustration {
  margin: auto;
  width: 80%;
  position: relative;
  z-index: 1;
  aspect-ratio: 1538/882;
  overflow: hidden;
}
.top-kv.re .illustration .kv-inner .kv-parts {
  position: absolute;
  max-width: 100%;
  z-index: 1;
}
.top-kv.re .illustration .kv-inner .kv-parts.nc {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.top-kv.re .illustration .kv-inner .kv-parts.bg {
  width: calc(100% - 3.6rem);
  left: 3.6rem;
  bottom: 0;
  z-index: 1;
  pointer-events: none;
}
.top-kv.re .illustration .kv-inner .kv-parts.back {
  width: calc(100% - 2.8rem);
  top: 5.1rem;
  left: 2.4rem;
  z-index: 2;
}
.top-kv.re .illustration .kv-inner .kv-parts.container-img {
  aspect-ratio: 206/107;
  width: 20.6rem;
  top: 23.1rem;
  left: 57.3rem;
  z-index: 7;
}
.top-kv.re .illustration .kv-inner .kv-parts.center-road {
  aspect-ratio: 337/209;
  width: 33.7rem;
  top: 32.9rem;
  left: 80.9rem;
  z-index: 7;
}
.top-kv.re .illustration .kv-inner .kv-parts.lift-box {
  top: 0;
  left: 1.5rem;
}
.top-kv.re .illustration .kv-inner .kv-parts.lift-box img {
  position: absolute;
  width: 100%;
  max-width: 100%;
}
.top-kv.re .illustration .kv-inner .kv-parts.lift-box .car {
  aspect-ratio: 148/116;
  width: 14.8rem;
  height: 11.6rem;
  top: 24.8rem;
  left: 81.7rem;
}
.top-kv.re .illustration .kv-inner .kv-parts.lift-box .lift {
  position: relative;
}
.top-kv.re .illustration .kv-inner .kv-parts.tr-box {
  bottom: 0;
  z-index: 19;
  pointer-events: none;
  width: 100%;
  max-width: 100%;
}
.top-kv.re .illustration .kv-inner .kv-parts.tr-box img {
  position: absolute;
  bottom: 0;
  left: 2.4rem;
  width: 100%;
  max-width: 100%;
}
.top-kv.re .illustration .kv-inner .kv-parts.tr-box .track {
  z-index: 1;
  left: 0;
}
.top-kv.re .illustration .kv-inner .kv-parts.tr-box .truck1 {
  z-index: 4;
  left: 0;
}
.top-kv.re .illustration .kv-inner .kv-parts.tr-box .truck2 {
  z-index: 2;
  left: 0;
}
.top-kv.re .illustration .kv-inner .kv-parts.tr-box .truck3 {
  z-index: 4;
  left: auto;
  right: -1.5rem;
}
.top-kv.re .illustration .kv-inner .kv-parts.tr-box .track-front {
  z-index: 5;
  position: relative;
  width: 95.5%;
}
.top-kv.re .illustration .kv-inner .item {
  position: absolute;
  width: 30rem;
  z-index: 1;
  overflow: hidden;
  transition: none;
  opacity: 0;
  visibility: hidden;
}

.is_tablet .top-kv.re .illustration .kv-inner .item{pointer-events: none;}

.top-kv.re .illustration .kv-inner .item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  position: absolute;
}
.top-kv.re .illustration .kv-inner .item:hover {
  opacity: 1;
}
.top-kv.re .illustration .kv-inner .item.i1 {
  aspect-ratio: 481/439;
  width: 48.1rem;
  bottom: 11.5rem;
  left: 50.4rem;
  z-index: 10;
  border-radius: 33% 40% 47% 70%;
}
.top-kv.re .illustration .kv-inner .item.i1 .ca1 {
  height: auto;
  width: 14rem;
  top: 3rem;
}
.top-kv.re .illustration .kv-inner .item.i1 .ca2 {
  height: auto;
  width: 14rem;
  right: 0;
  top: 8rem;
}
.top-kv.re .illustration .kv-inner .item.i1 .ca {
  height: auto;
  width: 32.6rem;
  left: 6rem;
  top: 0;
}
.top-kv.re .illustration .kv-inner .item.i1 .ca3 {
  height: auto;
  width: 12.5rem;
  bottom: 2rem;
  right: 20rem;
}
.top-kv.re .illustration .kv-inner .item.i2 {
  aspect-ratio: 500/507;
  width: 50rem;
  bottom: 20.2rem;
  left: 11.6rem;
  z-index: 8;
  border-radius: 33% 43% 28% 37%;
}
.top-kv.re .illustration .kv-inner .item.i2 .te1 {
  width: 100%;
  height: auto;
}
.top-kv.re .illustration .kv-inner .item.i2 .te2 {
  width: 37.8rem;
  height: auto;
  position: absolute;
  bottom: 0;
  right: 0;
}
.top-kv.re .illustration .kv-inner .item.i3 {
  aspect-ratio: 632/546;
  width: 63.2rem;
  bottom: 0;
  right: 10.1rem;
  z-index: 9;
  border-radius: 71% 19% 85% 32%;
}
.top-kv.re .illustration .kv-inner .item.i3 .ce {
  position: absolute;
  bottom: 0;
  left: 0;
  height: auto;
  width: 96.5%;
}
.top-kv.re .illustration .kv-inner .item.i3 .ce1 {
  position: absolute;
  top: 2.5rem;
  right: 0;
  height: auto;
  width: 10.5rem;
}
.top-kv.re .illustration .kv-inner .item.i3 .ce2 {
  position: absolute;
  top: 0;
  right: 9.8rem;
  height: auto;
  width: 12rem;
}
.top-kv.re .illustration .kv-inner .item.i3 .ce3 {
  position: absolute;
  bottom: 8.4rem;
  left: 4.2rem;
  height: auto;
  width: 10rem;
}
.top-kv.re .illustration .kv-inner .item.i4 {
  border-radius: 0 80% 0 0;
  aspect-ratio: 967/611;
  width: 96.7rem;
  top: 4.7rem;
  right: -1.4rem;
  z-index: 6;
}
.top-kv.re .illustration .kv-inner .item.i4 img {
  position: absolute;
  top: 0;
  left: 0;
}
.top-kv.re .illustration .kv-inner .item.i4 .rail {
  aspect-ratio: 1342/838;
  width: 134.2rem;
  height: 83.8rem;
  max-width: none;
  left: auto;
  border-radius: 0 80% 0 0;
  right: 0;
  top: 5rem;
  z-index: 3;
}
.top-kv.re .illustration .kv-inner .item.i4 .ent {
  aspect-ratio: 77/79;
  width: 7.7rem;
  height: 7.9rem;
  left: 26.5rem;
  top: 10rem;
  z-index: 2;
}
.top-kv.re .illustration .kv-inner .item.i4 .train {
  aspect-ratio: 1538/882;
  width: 153.8rem;
  height: 88.2rem;
  top: -4.7rem;
  left: auto;
  right: 0;
  max-width: none;
  z-index: 4;
  border-radius: 0 80% 0 0;
}
.top-kv.re .illustration .kv-inner .item.i4 .tunnel {
  z-index: 6;
  aspect-ratio: 1440/838;
  width: 144rem;
  height: 83.8rem;
  top: 0;
  right: -0.05rem;
  left: auto;
  max-width: none;
  border-radius: 0 65% 0 0;
}
.top-kv.re .illustration .kv-inner .item.i4 .car {
  aspect-ratio: 148/116;
  width: 14.8rem;
  height: 11.6rem;
  top: 20.1rem;
  left: 26.1rem;
}
.top-kv.re .illustration .kv-inner .item.i4 .lift {
  position: absolute;
  max-width: none;
  aspect-ratio: 1538/882;
  width: 153.8rem;
  height: 88.2rem;
  left: auto;
  right: 0;
  top: -4.9rem;
  border-radius: 0 80% 0 0;
}
.top-kv.re .illustration .kv-inner .item.i5 {
  aspect-ratio: 253/167;
  width: 25.3rem;
  top: 15.5rem;
  right: 28.9rem;
  z-index: 7;
  border-radius: 0 0 0 70%;
}
.top-kv.re .illustration .kv-inner .item.i5 img {
  width: 100%;
  border-radius: 0 0 0 70%;
}
.top-kv.re .illustration .kv-inner .item.i6 {
  aspect-ratio: 377/299;
  width: 37.7rem;
  height: 29.9rem;
  top: -0.3rem;
  left: 54.3rem;
  z-index: 6;
  border-radius: 25% 0 30% 0;
}
.top-kv.re .illustration .kv-inner .item.i6 img {
  width: 100%;
  border-radius: 25% 0 30% 0;
}
.top-kv.re .illustration .kv-inner .item.i7 {
  aspect-ratio: 233/195;
  width: 23.2rem;
  left: 33.7rem;
  top: 7.2rem;
  z-index: 7;
}
.top-kv.re .illustration .kv-inner .item.i7 img {
  width: 100%;
}
.top-kv.re .illustration .txt-box {
  pointer-events: none;
}
.top-kv.re .illustration .txt-box .item-txt {
  position: absolute;
  z-index: 20;
  transition: none;
  opacity: 0;
  border-radius: 1rem;
  background: #fff;
  border: 0.5rem solid #205AA9;
  padding: 2rem;
}
.top-kv.re .illustration .txt-box .item-txt::before {
  content: "";
  position: absolute;
  bottom: -3rem;
  left: 50%;
  transform: translateX(-50%);
  clip-path: polygon(0 0, 50% 100%, 100% 0);
  background: #205AA9;
  width: 2.9rem;
  height: 2.9rem;
  z-index: 2;
}
.top-kv.re .illustration .txt-box .item-txt::after {
  content: "";
  position: absolute;
  bottom: -1.9rem;
  left: 50%;
  transform: translateX(-50%);
  clip-path: polygon(0 0, 50% 100%, 100% 0);
  background: #fff;
  width: 2rem;
  height: 2rem;
  z-index: 3;
}
.top-kv.re .illustration .txt-box .item-txt .txt {
  position: relative;
  font-size: 2.5rem;
  color: #205AA9;
  text-align: center;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.1em;
  font-family: "Zen Maru Gothic", sans-serif;
}
.top-kv.re .illustration .txt-box .item-txt .txt .char {
  position: relative;
  display: inline-block;
  opacity: 0;
  visibility: hidden;
  margin: 0 0.05em;
}
.top-kv.re .illustration .txt-box .item-txt .more {
  font-size: 2rem;
  letter-spacing: 0.05em;
}
.top-kv.re .illustration .txt-box .item-txt.t1 {
  top: 30rem;
  left: 69rem;
}
.top-kv.re .illustration .txt-box .item-txt.t2 {
  top: 9.6rem;
  left: 29.9rem;
}
.top-kv.re .illustration .txt-box .item-txt.t3 {
  top: 35rem;
  right: 36.5rem;
}
.top-kv.re .illustration .txt-box .item-txt.t4 {
  top: 17.8rem;
  right: 55.5rem;
}
.top-kv.re .illustration .txt-box .item-txt.t5 {
  top: 11.8rem;
  right: 23.5rem;
}
.top-kv.re .illustration .txt-box .item-txt.t6 {
  top: 2.8rem;
  left: 68.9rem;
}
.top-kv.re .illustration .txt-box .item-txt.t7 {
  top: 6rem;
  left: 0;
}
.top-kv.re .illustration .txt-box .item-txt.t7::before {
  bottom: auto;
  top: 50%;
  right: -2.9rem;
  left: auto;
  transform: translateY(-50%);
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
}
.top-kv.re .illustration .txt-box .item-txt.t7::after {
  bottom: auto;
  top: 50%;
  right: -1.9rem;
  left: auto;
  transform: translateY(-50%);
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
}
.top-kv.re .scroll-anim {
  position: absolute;
  right: 2.45rem;
  bottom: 4.9rem;
  display: flex;
  flex-direction: row-reverse;
}
.top-kv.re .scroll-anim .txt {
  writing-mode: vertical-lr;
  font-weight: 700;
  font-family: "Roboto";
  font-size: 1.6rem;
  color: #222;
  text-transform: uppercase;
}
.top-kv.re .scroll-anim .bar {
  background: rgba(34, 34, 34, 0.1490196078);
  width: 0.3rem;
  height: 14.6rem;
  margin-right: 1.35rem;
  position: relative;
}
.top-kv.re .scroll-anim .bar::after {
  content: "";
  display: inline-block;
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  left: 0;
  background: #205AA9;
  animation: liner 2s cubic-bezier(1, 0, 0, 1) infinite;
}

@keyframes liner {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  45% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  55% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}
@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-kv.re {
    aspect-ratio: 375/502;
    margin-top: 1.6rem;
    margin-bottom: 0;
  }
  .top-kv.re .illustration {
    width: 100%;
    aspect-ratio: auto;
  }
}
/* ---------------------------------------------------
	トップページ：キャッチコピー：再構築
------------------------------------------------------ */
.top-catch {
  background: #fff;
  margin-bottom: 14rem;
  position: relative;
}
.top-catch .catch {
  padding: 6.3rem 0 3.1rem;
  width: 61.5%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 2;
  position: relative;
}
.top-catch .catch h2 {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 900;
  font-size: 8rem;
  letter-spacing: 0.05em;
  line-height: 1.6;
}
.top-catch .catch p {
  font-size: 1.8rem;
  letter-spacing: 0.05em;
  line-height: 3;
  font-weight: 500;
}
.top-catch .deco {
  position: relative;
  z-index: 1;
}
.top-catch .deco .bg {
  width: 100%;
  max-width: 100%;
}
.top-catch .deco .anim-box {
  display: flex;
  overflow: hidden;
  position: absolute;
  bottom: 2.2rem;
  width: 100%;
  z-index: 1;
}
.top-catch .deco .anim-box .anim-txt {
  font-family: "Roboto Condensed";
  color: #fff;
  font-size: 12rem;
  white-space: nowrap;
  animation: loop_t 30s linear infinite;
}
.top-catch .deco::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 33.8rem;
  top: -33.7rem;
  left: 0;
  background: url(../images/top/catch-deco.png) no-repeat bottom center/100%;
  z-index: 1;
}
.top-catch .deco .decop {
  width: 15.5rem;
  height: 14.7rem;
  display: block;
  position: absolute;
  position: absolute;
  right: 4.1rem;
  bottom: -3.5rem;
  z-index: 2;
}

@keyframes loop_t {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}
@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-catch {
    margin-bottom: 7rem;
  }
  .top-catch .catch {
    padding: 2.95rem 0 0;
    width: calc(100% - 5.6rem);
    display: block;
  }
  .top-catch .catch h2 {
    font-size: 4rem;
    letter-spacing: 0.05em;
    white-space: nowrap;
    margin-bottom: 7rem;
  }
  .top-catch .catch p {
    font-size: 1.6rem;
    line-height: 1.8;
    font-weight: 700;
  }
  .top-catch .deco {
    position: relative;
    z-index: 1;
  }
  .top-catch .deco .bg {
    width: 100%;
    max-width: 100%;
  }
  .top-catch .deco .anim-box {
    bottom: 0.25rem;
  }
  .top-catch .deco .anim-box .anim-txt {
    font-size: 6rem;
  }
  .top-catch .deco::before {
    height: 28.5rem;
    top: -28.5rem;
    background: url(../images/top/catch-deco-sp.png) no-repeat bottom center/100% 100%;
  }
  .top-catch .deco::after {
    width: 9.7rem;
    height: 9.2rem;
    right: 1.9rem;
    bottom: -0.72rem;
  }
  .top-catch .deco .decop {
    width: 9.7rem;
    height: 9.2rem;
    right: 1.9rem;
    bottom: -0.72rem;
  }
}
/* ---------------------------------------------------
	トップページ：私たちについて
------------------------------------------------------ */
.top-about {
  position: relative;
  background: url("../images/top/about_back.png") no-repeat bottom/100%;
  padding: 20.3rem 0 15.9rem;
}
.top-about .entit {
  font-family: "Roboto", serif;
  font-weight: 700;
  font-size: 17rem;
  color: rgba(13, 54, 124, 0.0784313725);
  display: block;
  width: fit-content;
  position: absolute;
  top: 7.6rem;
  left: 10rem;
}
.top-about .wrap {
  max-width: 120rem;
  margin: auto;
}
.top-about .wrap .jptit {
  font-weight: 700;
  font-size: 3.6rem;
  letter-spacing: 0.1em;
  margin-bottom: 6.3rem;
}
.top-about .wrap .jptit span {
  font-size: 2rem;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 2rem;
  font-weight: 400;
  color: #ED6B1F;
  display: block;
  margin-top: 1rem;
  letter-spacing: 0;
}
.top-about .wrap .catch {
  font-size: 10rem;
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
  margin-bottom: 8.3rem;
  letter-spacing: 0.015em;
  line-height: 1.2;
  width: fit-content;
  background: url("../images/top/about-catchback.png") no-repeat center/cover;
  background-clip: text;
  color: transparent;
}
.top-about .wrap .desc {
  font-size: 1.8rem;
  line-height: 2;
  color: #222;
}
.top-about .pic {
  position: absolute;
  top: 28.4rem;
  right: 0;
  width: 82.1rem;
  height: 48rem;
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-about {
    position: relative;
    background: url("../images/top/about_back.png") no-repeat bottom/100%;
    padding: 10rem 0 15.9rem;
  }
  .top-about .entit {
    font-size: 7rem;
    width: 100%;
    top: 5.6rem;
    left: auto;
    text-align: center;
  }
  .top-about .wrap {
    max-width: 120rem;
    margin: auto;
  }
  .top-about .wrap .jptit {
    text-align: center;
    font-weight: 700;
    font-size: 3.6rem;
    letter-spacing: 0.1em;
    margin-bottom: 3rem;
  }
  .top-about .wrap .jptit span {
    font-size: 2rem;
    font-weight: 400;
    margin-top: 1rem;
    letter-spacing: 0;
  }
  .top-about .wrap .catch {
    padding: 0 1rem;
    font-size: 10rem;
    font-weight: 400;
    margin-bottom: 3rem;
    width: 100%;
  }
  .top-about .wrap .desc {
    font-size: 1.8rem;
    padding: 0 1rem;
    margin-bottom: 2rem;
  }
  .top-about .pic {
    top: auto;
    right: auto;
    position: relative;
    width: 100%;
    height: auto;
  }
}
/* ---------------------------------------------------
	トップページ：つなぐ 運ぶ 保管する リンク集　再編集
------------------------------------------------------ */
.top-link {
  display: flex;
  gap: 2rem;
  width: calc(100% - 12rem);
  margin: 0 auto 14rem;
}
.top-link .links {
  width: calc(33.3333333333% - 1.3333333333rem);
  padding: 8rem 0 8rem 0;
  position: relative;
  z-index: 1;
  background: #33A4DE;
  border-radius: 2rem;
  overflow: hidden;
}
.top-link .links::before {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 74, 200, 0.4980392157);
  z-index: -1;
  transition: all ease-in-out 0.3s;
}
.top-link .links:hover::before {
  background: rgba(0, 74, 200, 0.6980392157);
}
.top-link .links:hover .ico-box {
  outline-width: 50rem;
}
.top-link .links:hover .ico-box .ico {
  transform: scale(1.1);
}
.top-link .links .ico-box {
  aspect-ratio: 1/1;
  width: 24rem;
  margin: 0 auto 2.7rem;
  overflow: hidden;
  border-radius: 50%;
  transition: all ease 0.3s;
  outline: 0 solid #4173B6;
  background: #fff;
}
.top-link .links .ico-box .ico {
  display: block;
  width: 100%;
  height: 100%;
  transition: all ease 0.3s;
}
.top-link .links .tit {
  color: #fff;
  font-size: 3rem;
  text-align: center;
  letter-spacing: 0.2em;
  font-weight: 700;
  margin-bottom: 2.8rem;
  position: relative;
}
.top-link .links .link-item {
  position: relative;
  display: block;
  color: #fff;
  font-size: 1.8rem;
  font-weight: 400;
  background: rgba(255, 255, 255, 0.2980392157);
  border: 0.1rem solid #fff;
  border-radius: 6rem;
  width: 32rem;
  padding: 1.7rem 3rem 1.6rem;
  margin: 0 auto 2rem;
  text-align: center;
  backdrop-filter: blur(0.3rem);
  transition: all ease-in-out 0.3s;
}
.top-link .links .link-item:last-of-type {
  margin-bottom: 0;
}
.top-link .links .link-item::after {
  content: "";
  background: url("../images/top/links-arroww.png") no-repeat center/contain;
  width: 0.8rem;
  height: 1.4rem;
  display: block;
  position: absolute;
  right: 3rem;
  top: 50%;
  transform: translateY(-50%);
  transition: all ease-in-out 0.3s;
}
.top-link .links .link-item:hover {
  background: #fff;
  color: #0D367C;
  opacity: 1;
}
.top-link .links .link-item:hover::after {
  background: url("../images/top/links-arrowb.png") no-repeat center/contain;
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-link {
    display: block;
    width: calc(100% - 3.8rem);
  }
  .top-link .links {
    width: 100%;
    padding: 2.9rem 0 4rem 0;
    position: relative;
    z-index: 1;
    margin-bottom: 1.9rem;
  }
  .top-link .links:last-of-type {
    margin-bottom: 0;
  }
  .top-link .links .ico-box {
    width: 21rem;
  }
  .top-link .links .tit {
    color: #fff;
    font-size: 2.8rem;
    text-align: center;
    letter-spacing: 0.2em;
    margin-bottom: 2.8rem;
  }
  .top-link .links .link-item {
    position: relative;
    display: block;
    color: #fff;
    font-size: 1.8rem;
    font-weight: 400;
    background: rgba(255, 255, 255, 0.2980392157);
    border: 0.1rem solid #fff;
    border-radius: 6rem;
    width: 29.7rem;
    padding: 1.7rem 3rem 1.6rem;
    margin: 0 auto 2rem;
    text-align: center;
    backdrop-filter: blur(0.3rem);
    transition: all ease-in-out 0.3s;
  }
  .top-link .links .link-item:last-of-type {
    margin-bottom: 0;
  }
  .top-link .links .link-item::after {
    content: "";
    background: url("../images/top/links-arroww.png") no-repeat center/contain;
    width: 0.8rem;
    height: 1.4rem;
    display: block;
    position: absolute;
    right: 3rem;
    top: 50%;
    transform: translateY(-50%);
    transition: all ease-in-out 0.3s;
  }
  .top-link .links .link-item:hover {
    background: #fff;
    color: #0D367C;
    opacity: 1;
  }
  .top-link .links .link-item:hover::after {
    background: url("../images/top/links-arrowb.png") no-repeat center/contain;
  }
}
/* ---------------------------------------------------
	トップページ：バナー表示セクション
------------------------------------------------------ */
.top-banner {
  margin: 0 auto 14rem;
  max-width: 120rem;
}
.top-banner .item {
  display: block;
  margin: 0 auto 2.5rem;
  width: fit-content;
  max-width: 100%;
}
.top-banner .item:last-of-type {
  margin-bottom: 0;
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-banner {
    margin: 7rem auto;
    max-width: 100%;
    padding: 0 1.9rem;
  }
}
/* ---------------------------------------------------
	トップページ：ニーズから探す：再編集
------------------------------------------------------ */
.top-needs {
  position: relative;
  padding: 9rem 0 14.1rem;
}
.top-needs .entit {
  font-family: "Roboto", serif;
  font-weight: 700;
  font-size: 15rem;
  color: rgba(92, 182, 229, 0.4);
  display: block;
  width: fit-content;
  position: absolute;
  top: -1.5rem;
  left: 50%;
  transform: translateX(-50%);
}
.top-needs .jptit {
  text-align: center;
  font-weight: 700;
  font-size: 3.6rem;
  letter-spacing: 0.1em;
  margin-bottom: 6rem;
  position: relative;
  z-index: 1;
}
.top-needs .jptit span {
  font-size: 2rem;
  /* font-family: "Poppins", sans-serif; */
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
  color: #FFA838;
  letter-spacing: 0.05em;
  display: block;
  margin-top: 1rem;
  letter-spacing: 0;
}
.top-needs .needslinks {
  max-width: 120rem;
  margin: 0 auto 6rem;
  display: flex;
  justify-content: space-between;
}
.top-needs .needslinks .items {
  border-radius: 2rem;
  padding: 2rem 3rem;
  width: 37.4rem;
  background: #fff;
  border: 0.2rem solid #6B6B6B;
  display: flex;
  align-items: center;
  font-size: 2rem;
  font-weight: 400;
}
.top-needs .needslinks .items .ico {
  display: block;
  width: 8rem;
  height: 8rem;
  margin-right: 2rem;
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-needs {
    padding: 10rem 0 6rem;
  }
  .top-needs .entit {
    text-align: center;
    font-size: 7rem;
    display: block;
    width: 100%;
    top: 4.5rem;
    left: auto;
    transform: none;
  }
  .top-needs .jptit {
    text-align: center;
    font-size: 3.6rem;
    letter-spacing: 0.1em;
    margin-bottom: 3rem;
  }
  .top-needs .jptit span {
    font-size: 2rem;
    font-weight: 400;
    display: block;
    margin-top: 1rem;
    letter-spacing: 0;
  }
  .top-needs .needslinks {
    max-width: 100%;
    margin: 0 auto 6rem;
    display: block;
    padding: 0 1.9rem;
  }
  .top-needs .needslinks .items {
    margin-bottom: 2rem;
    font-size: 1.7rem;
    padding: 2rem 3rem;
    width: 100%;
  }
}
/* ---------------------------------------------------
	トップページ：実績:再編集
------------------------------------------------------ */
.top-works {
  background: #33A4DE;
  padding: 31.4rem 0 34.5rem 12.2rem;
  position: relative;
  margin-bottom: 30.8rem;
  width: calc(100% - 6rem);
  margin-left: auto;
  border-radius: 3rem 0 0 3rem;
  position: relative;
}
.top-works .bg-img {
  position: absolute;
  top: 6.6rem;
  right: 12rem;
  width: 90.2rem;
  height: 44.4rem;
  z-index: 1;
}
.top-works .entit {
  font-family: "Roboto", serif;
  font-weight: 700;
  font-size: 15rem;
  color: rgba(255, 255, 255, 0.6);
  display: block;
  width: fit-content;
  position: absolute;
  top: 13rem;
  left: 12.2rem;
}
.top-works .wrap .jptit {
  font-weight: 700;
  font-size: 3.6rem;
  letter-spacing: 0.1em;
  color: #fff;
}
.top-works .wrap .jptit span {
  font-size: 2rem;
  /* font-family: "Poppins", sans-serif; */
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
  color: #FFA838;
  letter-spacing: 0.05em;
  display: block;
  margin-top: 1rem;
  letter-spacing: 0;
}
.top-works .works-prev {
  width: 8rem;
  height: 8rem;
  left: 26.2rem;
  right: auto;
  bottom: 15.1rem;
  top: auto;
  z-index: 3;
}
.top-works .works-prev::after {
  content: "";
  width: 8rem;
  height: 8rem;
  background: url("../images/top/works-prev.png") no-repeat center/contain;
}
.top-works .works-next {
  width: 8rem;
  height: 8rem;
  left: 36.2rem;
  right: auto;
  bottom: 15.1rem;
  top: auto;
  z-index: 3;
}
.top-works .works-next::after {
  content: "";
  width: 8rem;
  height: 8rem;
  background: url("../images/top/works-next.png") no-repeat center/contain;
}
.top-works .ws-area {
  padding: 6rem 5rem 0 5rem;
  background: #fff;
  position: absolute;
  bottom: -21.75rem;
  width: 136rem;
  right: 0;
  border-radius: 3rem 0 0 3rem;
  z-index: 2;
}
.top-works .ws-area .works-slider .works-slider-wrap {
  width: 40rem;
}
.top-works .ws-area .works-slider .works-slider-wrap .works-slide-item {
  padding: 0 1rem;
}
.top-works .ws-area .works-slider .works-slider-wrap .works-slide-item img {
  width: 100%;
  margin-bottom: 2rem;
  aspect-ratio: 40/29;
  object-fit: cover;
}
.top-works .ws-area .works-slider .works-slider-wrap .works-slide-item .category {
  width: fit-content;
  background: #FFA838;
  color: #fff;
  padding: 0.2rem 0.8rem;
  line-height: 1.5;
  font-size: 1.6rem;
  font-weight: 400;
  margin-bottom: 1rem;
}
.top-works .ws-area .works-slider .works-slider-wrap .works-slide-item .tit {
  font-size: 2rem;
  font-weight: 500;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-works {
    padding: 10rem 0 0;
    margin-bottom: 0;
    width: calc(100% - 1.9rem);
    background: #33A4DE;
  }
  .top-works .bg-img {
    top: 22rem;
    right: 1rem;
    width: 95%;
    height: auto;
  }
  .top-works .mtit {
    font-size: 4.5rem;
    padding-left: 1rem;
    margin-bottom: 5rem;
  }
  .top-works .entit {
    font-size: 7rem;
    display: block;
    width: fit-content;
    top: 2rem;
    left: 1.9rem;
  }
  .top-works .wrap {
    max-width: 100%;
    margin: auto;
  }
  .top-works .wrap .jptit {
    font-weight: 700;
    font-size: 3.6rem;
    letter-spacing: 0.1em;
    padding-left: 1.9rem;
    margin-bottom: 17rem;
  }
  .top-works .wrap .jptit span {
    font-size: 2rem;
    display: block;
    margin-top: 1rem;
    letter-spacing: 0;
  }
  .top-works .ws-area {
    padding: 1rem 1rem 12rem 1rem;
    background: #fff;
    position: relative;
    bottom: auto;
    width: 100%;
    right: auto;
    border-radius: 0;
  }
  .top-works .ws-area .works-slider .works-slider-wrap {
    width: 100%;
  }
  .top-works .ws-area .works-slider .works-slider-wrap .works-slide-item {
    padding: 0;
  }
  .top-works .ws-area .works-slider .works-slider-wrap .works-slide-item img {
    width: 100%;
    margin-bottom: 2rem;
  }
  .top-works .ws-area .works-slider .works-slider-wrap .works-slide-item .category {
    font-size: 1.4rem;
  }
  .top-works .ws-area .works-slider .works-slider-wrap .works-slide-item .tit {
    font-size: 1.8rem;
  }
  .top-works .ws-area .works-prev {
    width: 8rem;
    height: 8rem;
    left: 10rem;
    right: auto;
    bottom: 2rem;
    top: auto;
  }
  .top-works .ws-area .works-prev::after {
    content: "";
    width: 8rem;
    height: 8rem;
    background: url("../images/top/works-prev.png") no-repeat center/contain;
  }
  .top-works .ws-area .works-next {
    width: 8rem;
    height: 8rem;
    left: auto;
    right: 10rem;
    bottom: 2rem;
    top: auto;
  }
  .top-works .ws-area .works-next::after {
    content: "";
    width: 8rem;
    height: 8rem;
    background: url("../images/top/works-next.png") no-repeat center/contain;
  }
  .top-works .works-prev {
    width: 8rem;
    height: 8rem;
    right: auto;
    left: 0;
    bottom: 2rem;
    top: auto;
    background-color: #33A4DE;
    z-index: 3;
    border-radius: 50%;
  }
  .top-works .works-next {
    width: 8rem;
    height: 8rem;
    left: auto;
    right: 2.8rem;
    bottom: 2rem;
    top: auto;
    background-color: #33A4DE;
    z-index: 3;
    border-radius: 50%;
  }
}
/* ---------------------------------------------------
	トップページ：NEWS
------------------------------------------------------ */
.top-news {
  padding: 24.3rem 0 0 0;
  position: relative;
  max-width: 110rem;
  margin: 0 auto 13rem;
}
.top-news .entit {
  font-family: "Roboto", serif;
  font-weight: 700;
  font-size: 15rem;
  color: rgba(92, 182, 229, 0.4);
  display: block;
  width: fit-content;
  position: absolute;
  top: 13.5rem;
  left: 50%;
  transform: translateX(-50%);
}
.top-news .jptit {
  text-align: center;
  font-weight: 700;
  font-size: 3.6rem;
  letter-spacing: 0.1em;
  margin-bottom: 6rem;
  position: relative;
  z-index: 1;
}
.top-news .jptit span {
  font-size: 2rem;
  /* font-family: "Poppins", sans-serif; */
  font-family: "Roboto Condensed", sans-serif;
  font-size: 2rem;
  font-weight: 400;
  color: #FFA838;
  display: block;
  margin-top: 1rem;
  letter-spacing: 0;
}
.top-news .news-wrap {
  margin-bottom: 6rem;
  border-top: 0.1rem solid #CCC;
}
.top-news .news-wrap .item {
  display: flex;
  align-items: center;
  border-bottom: 0.1rem solid #CCC;
  padding: 2.1rem 0;
}
.top-news .news-wrap .item .date {
  font-family: "Roboto Condensed", sans-serif;
  font-size: 1.8rem;
  color: #222;
  margin-right: 4rem;
  line-height: 1.4;
}
.top-news .news-wrap .item .tit {
  font-size: 1.8rem;
  color: #222;
  font-weight: 400;
  line-height: 1.6;
}
.top-news .news-wrap .item:hover .tit {
  text-decoration: underline;
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-news {
    padding: 13rem 0 0 0;
    max-width: 100%;
    margin: 0 auto 6rem;
  }
  .top-news .entit {
    text-align: center;
    font-size: 7rem;
    display: block;
    width: 100%;
    position: absolute;
    top: 8.5rem;
    left: auto;
    transform: none;
  }
  .top-news .jptit {
    text-align: center;
    font-size: 3.6rem;
    letter-spacing: 0.1em;
    margin-bottom: 3rem;
  }
  .top-news .jptit span {
    font-size: 2rem;
    font-weight: 400;
    display: block;
    margin-top: 1rem;
    letter-spacing: 0;
  }
  .top-news .news-wrap {
    margin-bottom: 3rem;
    border-top: 0.1rem solid #CCC;
    width: calc(100% - 2rem);
    margin-left: auto;
    margin-right: auto;
  }
  .top-news .news-wrap .item {
    display: block;
    border-bottom: 0.1rem solid #CCC;
    padding: 1.5rem 0;
  }
  .top-news .news-wrap .item .date {
    font-size: 1.6rem;
    margin-right: 0;
    line-height: 1.4;
  }
  .top-news .news-wrap .item .tit {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.6;
  }
  .top-news .news-wrap .item:hover .tit {
    text-decoration: underline;
  }
}
/* ---------------------------------------------------
	トップページ：企業情報
------------------------------------------------------ */
.top-company {
  margin-bottom: 18rem;
  position: relative;
  width: 156rem;
  max-width: 100%;
}
.top-company .entit {
  position: absolute;
  top: 0;
  right: -20rem;
  writing-mode: vertical-rl;
  text-orientation: sideways;
  font-family: "Roboto";
  font-size: 15rem;
  font-weight: 700;
  color: rgba(92, 182, 229, 0.4);
}
.top-company .wrap {
  position: relative;
  border-radius: 0 3rem 0 0;
  overflow: hidden;
}
.top-company .wrap .bgpic {
  width: 100%;
}
.top-company .wrap .box {
  background: #fff;
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 10rem 0 0 10rem;
  border-radius: 3rem 0 0 0;
}
.top-company .wrap .box .jptit {
  font-weight: 700;
  font-size: 3.6rem;
  letter-spacing: 0.1em;
  margin-bottom: 5rem;
}
.top-company .wrap .box .jptit span {
  font-size: 2rem;
  /* font-family: "Poppins", sans-serif; */
  font-family: "Roboto Condensed", sans-serif;
  font-size: 2rem;
  font-weight: 400;
  color: #FFA838;
  display: block;
  margin-top: 1rem;
  letter-spacing: 0;
}
.top-company .wrap .box .links {
  border-top: 0.1rem solid #CCC;
}
.top-company .wrap .box .links .items {
  width: 60rem;
  position: relative;
  display: block;
  /*font-size: 2.6rem;*/
  font-size: 1.8rem;
  line-height: 1.507;
  font-weight: 400;
  padding: 2rem 0 1.7rem;
  /*padding: 3.2rem 0 3rem;*/
  border-bottom: 0.1rem solid #CCC;
}
.top-company .wrap .box .links .items .btnico {
  position: absolute;
  right: 4rem;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
  width: 0.6rem;
  height: 0.6rem;
  z-index: 1;
}
.top-company .wrap .box .links .items .btnico::before {
  content: "";
  background: url("../images/top/company_arrow.png") no-repeat center/contain;
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 50%;
  width: 0.6rem;
  height: 1.2rem;
  opacity: 0;
  transition: all ease 0.3s;
  transform: translate(-50%, -50%);
}
.top-company .wrap .box .links .items .btnico::after {
  content: "";
  background: #205AA9;
  border-radius: 50%;
  width: 100%;
  height: 100%;
  display: block;
  transition: all ease 0.3s;
}
.top-company .wrap .box .links .items:hover {
  opacity: 0.9;
}
.top-company .wrap .box .links .items:hover .btnico::before {
  opacity: 1;
}
.top-company .wrap .box .links .items:hover .btnico::after {
  transform: scale(6);
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-company {
    margin-bottom: 10rem;
  }
  .top-company .wrap {
    width: 100%;
    border-radius: 0;
  }
  .top-company .wrap .bgpic {
    width: 100%;
  }
  .top-company .wrap .entit {
    position: absolute;
    top: 22rem;
    right: 0;
    writing-mode: unset;
    font-family: "Roboto";
    font-size: 7rem;
    font-weight: 700;
    color: rgba(13, 54, 124, 0.0784313725);
    left: 50%;
    right: auto;
    transform: translateX(-50%);
  }
  .top-company .wrap .box {
    width: 100%;
    position: relative;
    right: 0;
    top: 0;
    padding: 7rem 1rem 1rem 1rem;
    background: none;
  }
  .top-company .wrap .box .jptit {
    text-align: center;
    font-size: 3.6rem;
    letter-spacing: 0.1em;
    margin-bottom: 3rem;
  }
  .top-company .wrap .box .jptit span {
    font-size: 2rem;
    font-weight: 400;
    margin-top: 1rem;
    letter-spacing: 0;
  }
  .top-company .wrap .box .links .items {
    width: 100%;
    font-size: 1.8rem;
    padding: 2.7rem 0 2.5rem;
  }
  .top-company .wrap .box .links .items .btnico {
    position: absolute;
    right: 4rem;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
    width: 0.6rem;
    height: 0.6rem;
    z-index: 1;
  }
  .top-company .wrap .box .links .items .btnico::before {
    content: "";
    background: url("../images/top/company_arrow.png") no-repeat center/contain;
    position: absolute;
    z-index: 2;
    left: 50%;
    top: 50%;
    width: 0.6rem;
    height: 1.2rem;
    opacity: 0;
    transition: all ease 0.3s;
    transform: translate(-50%, -50%);
  }
  .top-company .wrap .box .links .items .btnico::after {
    content: "";
    background: #205AA9;
    border-radius: 50%;
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
  }
  .top-company .wrap .box .links .items:hover {
    opacity: 0.9;
  }
  .top-company .wrap .box .links .items:hover .btnico::before {
    opacity: 1;
  }
  .top-company .wrap .box .links .items:hover .btnico::after {
    transform: scale(6) translate(-3%, -3%);
  }
}
/* ---------------------------------------------------
	トップページ：採用情報：再編集
------------------------------------------------------ */
.top-recruit {
  position: relative;
  background: #DAF4FC;
  padding: 24.9rem 0 13.6rem;
}
.top-recruit .box {
  position: relative;
  background: #fff;
  padding: 20.3rem 0 9.9rem;
  width: 100%;
  max-width: 120.8rem;
  margin: auto;
  border-radius: 3rem;
}
.top-recruit .box .deco {
  display: block;
  width: 27rem;
  height: 21rem;
  position: absolute;
  top: -16.8rem;
  left: 50%;
  transform: translateX(-50%);
}
.top-recruit .box .entit {
  font-family: "Roboto", serif;
  font-weight: 700;
  font-size: 15rem;
  color: rgba(92, 182, 229, 0.4);
  display: block;
  width: fit-content;
  position: absolute;
  top: 9.6rem;
  left: 50%;
  transform: translateX(-50%);
}
.top-recruit .box .jptit {
  text-align: center;
  font-weight: 700;
  font-size: 3.6rem;
  letter-spacing: 0.1em;
  margin-bottom: 4rem;
  position: relative;
  z-index: 1;
}
.top-recruit .box .jptit span {
  font-size: 2rem;
  /* font-family: "Poppins", sans-serif; */
  font-family: "Roboto Condensed", sans-serif;
  font-size: 2rem;
  font-weight: 400;
  color: #FFA838;
  display: block;
  margin-top: 1rem;
  letter-spacing: 0;
}
.top-recruit .box .desc {
  text-align: center;
  font-size: 1.8rem;
  line-height: 1.8;
  margin: 0 auto 5.9rem;
}
.top-recruit .box .btn-wrap {
  display: flex;
  width: 100%;
  max-width: 68rem;
  margin: auto;
  justify-content: space-between;
}
.top-recruit .box .btn-wrap .hv-btn {
  margin: 0;
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-recruit {
    position: relative;
    margin-bottom: 0;
    padding-bottom: 0;
  }
  .top-recruit .bgpic {
    display: block;
    width: 100%;
  }
  .top-recruit .box {
    position: relative;
    top: 0;
    left: auto;
    transform: none;
    background: #fff;
    padding: 6rem 0 4rem;
    width: 100%;
    max-width: 100%;
    margin: auto;
    border-radius: 0;
  }
  .top-recruit .box::before {
    top: -19.8rem;
  }
  .top-recruit .box.deco {
    top: -19.8rem;
  }
  .top-recruit .box .entit {
    text-align: center;
    font-size: 7rem;
    width: 100%;
    position: absolute;
    top: 1.6rem;
    left: auto;
    transform: none;
  }
  .top-recruit .box .jptit {
    text-align: center;
    font-weight: 700;
    font-size: 3.6rem;
    letter-spacing: 0.1em;
    margin-bottom: 4rem;
  }
  .top-recruit .box .jptit span {
    font-size: 2rem;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 2rem;
    font-weight: 400;
    color: #ED6B1F;
    display: block;
    margin-top: 1rem;
    letter-spacing: 0;
  }
  .top-recruit .box .desc {
    text-align: center;
    font-size: 1.8rem;
    line-height: 1.8;
    margin: 0 auto 5.9rem;
    padding: 0 1rem;
  }
  .top-recruit .box .btn-wrap {
    display: block;
    width: 100%;
    max-width: 68rem;
    margin: auto;
    justify-content: space-between;
  }
  .top-recruit .box .btn-wrap .hv-btn {
    margin: 2rem auto;
  }
}
/* ---------------------------------------------------
	部品
------------------------------------------------------ */
.hv-btn {
  display: block;
  border: 0.2rem solid #6B6B6B;
  background: #FFF;
  width: 32rem;
  margin: auto;
  text-align: center;
  padding: 1.7rem 4rem 1.6rem;
  position: relative;
  font-size: 1.8rem;
  overflow: hidden;
  z-index: 1;
  border-radius: 6rem;
  transition: all ease-in-out 0.3s;
}
.hv-btn span {
  position: relative;
}
.hv-btn::before {
  content: "";
  border-radius: 50%;
  background: #205AA9;
  position: absolute;
  width: 0.6rem;
  height: 0.6rem;
  left: 2.6rem;
  top: 50%;
  transform: translateY(-50%);
  transition: all ease-in-out 0.3s;
  z-index: -1;
}
.hv-btn:hover {
  color: #fff;
  opacity: 0.9;
}
.hv-btn:hover::before {
  transform: translateY(-50%) scale(200);
}
.hv-btn[target=_blank] span {
  display: flex;
  justify-content: center;
  align-items: center;
}
.hv-btn[target=_blank] span::after {
  content: "";
  flex-shrink: 0;
  transition: all ease-in-out 0.3s;
  background: url("../images/top/ico-blank-black.png") no-repeat center/contain;
  width: 1.6rem;
  height: 1.6rem;
  margin-left: 1rem;
  display: block;
}
.hv-btn[target=_blank]:hover span::after {
  background: url("../images/top/ico-blank-white.png") no-repeat center/contain;
}

/* ---------------------------------------------------
	トップページ：Instagram
------------------------------------------------------ */
.top-instagram {
  position: relative;
  padding: 14rem 0 14rem;
  text-align: center;
}
.top-instagram .entit {
  font-family: "Roboto", serif;
  font-weight: 700;
  font-size: 15rem;
  color: rgba(92, 182, 229, 0.4);
  display: block;
  width: fit-content;
  position: absolute;
  top: -1.5rem;
  left: 50%;
  transform: translateX(-50%);
}
.top-instagram .jptit {
  text-align: center;
  font-weight: 700;
  font-size: 3.6rem;
  letter-spacing: 0.1em;
  margin-bottom: 3rem;
  position: relative;
  z-index: 1;
  word-break: auto-phrase;
}
.top-instagram .jptit span {
  font-size: 2rem;
  /* font-family: "Poppins", sans-serif; */
  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
  color: #FFA838;
  letter-spacing: 0.05em;
  display: block;
  margin-top: 1rem;
  letter-spacing: 0;
}
.top-instagram .desc {
  font-size: 1.8rem;
  line-height: 1.8;
  margin: 0 auto 4rem;
  position: relative;
  z-index: 1;
  word-break: auto-phrase;
}
.top-instagram .ig-btn{
  width: fit-content;
  min-width: 32rem;
}
.top-instagram .ig-btn span {
  display: flex;
  align-items: center;
  justify-content: center;
}
.top-instagram .ig-btn .ico {
  width: 2.6rem;
  height: 2.6rem;
  margin-right: 1rem;
  display: block;
}

@media screen and (max-width: 767px), (max-width: 896px) and (orientation: landscape) {
  .top-instagram {
    padding: 10rem 0 6rem;
  }
  .top-instagram .entit {
    text-align: center;
    font-size: 7rem;
    display: block;
    width: 100%;
    top: 4.5rem;
    left: auto;
    transform: none;
  }
  .top-instagram .jptit {
    font-size: 3.6rem;
    letter-spacing: 0.1em;
    margin-bottom: 3rem;
  }
  .top-instagram .jptit span {
    font-size: 2rem;
    font-weight: 400;
    display: block;
    margin-top: 1rem;
    letter-spacing: 0;
  }
  .top-instagram .desc {
    font-size: 1.6rem;
    padding: 0 1.9rem;
    margin-bottom: 3rem;
  }
  .top-instagram .ig-btn .ico {
    width: 2.2rem;
    height: 2.2rem;
  }
}