@charset "UTF-8";

/* ----------------------------------------
トップ メインビジュアル
------------------------------------------*/
.topsec-firstview {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.top-firstview__main {
  position: relative;
  width: 100%;
  height: 80vh;
  height: 800px;
  overflow: hidden;
}

/* ----------------------------------------
スライダー
------------------------------------------*/
.top-firstview__main .topslider {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.top-firstview__main .topslider .slick-list,
.top-firstview__main .topslider .slick-track {
  height: 100%;
}

.top-firstview__main .topslider .slideitem {
  width: 100%;
  height: 100%;
  min-height: 560px;
}

/* 背景画像の上に薄い白を重ねる */
.top-firstview__main::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.95) 0%,
    rgba(255, 255, 255, 0.7) 25%,
    rgba(255, 255, 255, 0.3) 50%,
    rgba(255, 255, 255, 0) 75%,
    rgba(255, 255, 255, 0) 100%
  );
}

/* ----------------------------------------
キャッチコピー
------------------------------------------*/
.top-firstview__overlay {
  position: relative;
  z-index: 5;
  width: min(1440px, calc(100% - 80px));
  height: 100%;
  margin: 0 auto;
  pointer-events: none;
}

.top-firstview__catch {
  position: absolute;
    top: 55%;
    left: 0;
    width: min(800px, 70%);
  transform: translateY(-58%);
}

.top-firstview__lead {
  margin: 0 0 14px;
  color: #006eac;
  font-size: clamp(32px, 3.2vw, 58px);
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: .08em;
}

.top-firstview__title {
  margin: 0 0 24px;
  color: #006eac;
  font-size: clamp(70px, 7.5vw, 120px);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: .04em;
}

.top-firstview__title span {
  font-size: .7em;
}

.top-firstview__text {
  margin: 0;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.8;
  letter-spacing: .06em;
}

/* ----------------------------------------
波
------------------------------------------*/
.top-firstview__wave {
  position: absolute;
  right: 0;
  bottom: 20px;
  left: 0;
  z-index: 4;
  width: 100%;
  pointer-events: none;
}

.top-firstview__wave img {
  display: block;
  width: 100%;
  height: auto;
}

/* ----------------------------------------
お問い合わせエリア
------------------------------------------*/
.top-firstview__contact {
  position: absolute;
  right: 5%;
  bottom: 120px;
  z-index: 6;
  width: min(500px, 90%);
  margin: 0 auto;
}
@media screen and (max-width: 820px) {
.top-firstview__contact {
  position: relative;
  right: 0;
  bottom: 0px;
  z-index: 6;
  width: min(500px, 90%);
  margin: 0 auto;
}
}
@media screen and (max-width: 480px) {
.top-firstview__contact {
  width: 95%;
  margin-left: 5%;
}
}



.top-firstview__person {
  position: absolute;
  bottom: 0px;
  left: -20px;
  z-index: 2;
}

.top-firstview__person img {
  display: block;
  width: 180px;
  height: auto;
}

@media screen and (max-width: 480px) {
.top-firstview__person img {
  width: 100px;
}
}

.top-firstview__contact-box {
  position: relative;
  z-index: 1;
  padding: 10px;
  border: 2px solid #f17822;
  border-radius: 8px;
  background: #fff;
}

.top-firstview__contact-content {
  padding: 20px 20px 18px 42px;
  width: calc(100% - 110px);
  margin-left: 110px;
}
@media screen and (max-width: 480px) {
.top-firstview__contact-content {
  padding: 0px 0px 0px 40px;
  width: calc(100% - 30px);
  margin-left: 30px;
}
}

.top-firstview__contact-title {
  margin: 0 0 10px;
  color: #006eac;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.5;
  text-align: left;
  letter-spacing: .04em;
}

.top-firstview__contact-text {
  margin: 0 0 14px;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.6;
  text-align: left;
}

.top-firstview__contact-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  width: 100%;
  min-height: 58px;
  padding: 10px 18px;
  color: #fff;
  text-decoration: none;
  background: #f5781d;
  transition: opacity .3s ease;
}

.top-firstview__contact-btn:hover {
  color: #fff;
  opacity: .75;
}

.top-firstview__contact-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  flex-shrink: 0;
}

.top-firstview__contact-icon img {
  display: block;
  width: 100%;
  height: auto;
}

.top-firstview__contact-label {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .04em;
}

/* ----------------------------------------
1180px
------------------------------------------*/
@media screen and (max-width: 1180px) {

  .top-firstview__main {
    height: 620px;
    min-height: 620px;
  }

  .top-firstview__main .topslider .slideitem {
    min-height: 620px;
  }

  .top-firstview__overlay {
    width: calc(100% - 50px);
  }

  .top-firstview__catch {
    width: 51%;
  }

  .top-firstview__contact-title {
    font-size: 18px;
  }
}

/* ----------------------------------------
1024px
------------------------------------------*/
@media screen and (max-width: 1024px) {

  .top-firstview__main {
    height: 580px;
    min-height: 580px;
  }

  .top-firstview__main .topslider .slideitem {
    min-height: 580px;
  }

  .top-firstview__catch {
  top: 50%;
  width: 60%;
  }

  .top-firstview__lead {
    font-size: 28px;
  }

  .top-firstview__title {
    font-size: 62px;
  }

  .top-firstview__text {
    font-size: 16px;
  }

  .top-firstview__contact-title {
    margin-bottom: 6px;
    font-size: 17px;
  }

  .top-firstview__contact-text {
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 1.6;
  }

  .top-firstview__contact-btn {
    min-height: 50px;
  }

  .top-firstview__contact-label {
    font-size: 14px;
  }
}

/* ----------------------------------------
820px
スライダー内はキャッチコピーのみ
お問い合わせはスライダー下
波は非表示
------------------------------------------*/
@media screen and (max-width: 820px) {

  .topsec-firstview {
    overflow: visible;
  }

  .top-firstview__main {
    height: auto;
    min-height: 0;
    overflow: visible;
    background: #fff;
  }

  .top-firstview__main .topslider {
    position: relative;
    inset: auto;
    width: 100%;
    height: 520px;
  }

  .top-firstview__main .topslider .slick-list,
  .top-firstview__main .topslider .slick-track {
    height: 520px;
  }

  .top-firstview__main .topslider .slideitem {
    height: 520px;
    min-height: 520px;
  }

  .top-firstview__main::after {
    bottom: auto;
    height: 520px;
    background: linear-gradient(
      90deg,
      rgba(255, 255, 255, .96) 0%,
      rgba(255, 255, 255, .86) 43%,
      rgba(255, 255, 255, .25) 78%,
      rgba(255, 255, 255, 0) 100%
    );
  }

  .top-firstview__overlay {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: calc(100% - 40px);
    height: 520px;
    margin: 0 auto;
  }

  .top-firstview__catch {
    top: 50%;
    left: 0;
    width: 70%;
    transform: translateY(-50%);
  }

  .top-firstview__lead {
    margin-bottom: 10px;
    font-size: 27px;
    line-height: 1.55;
  }

  .top-firstview__title {
    margin-bottom: 18px;
    font-size: 58px;
  }

  .top-firstview__text {
    font-size: 16px;
    line-height: 1.8;
  }

  .top-firstview__wave {
    bottom: 250px;
  }

  .top-firstview__contact-title {
    font-size: 19px;
  }

  .top-firstview__contact-text {
    font-size: 14px;
    line-height: 1.8;
  }

  .top-firstview__contact-btn {
    min-height: 56px;
  }

  .top-firstview__contact-label {
    font-size: 15px;
  }
}

/* ----------------------------------------
767px
------------------------------------------*/
@media screen and (max-width: 767px) {

  .top-firstview__main .topslider,
  .top-firstview__main .topslider .slick-list,
  .top-firstview__main .topslider .slick-track {
    height: 480px;
  }

  .top-firstview__main .topslider .slideitem {
    height: 480px;
    min-height: 480px;
    background-position: center center !important;
  }

  .top-firstview__main::after {
    height: 480px;
  }

  .top-firstview__overlay {
    width: calc(100% - 32px);
    height: 480px;
  }

  .top-firstview__catch {
    width: 77%;
  }

  .top-firstview__lead {
    font-size: 24px;
  }

  .top-firstview__title {
    font-size: 60px;
  }

  .top-firstview__text br {
    display: none;
  }
    .top-firstview__wave {
      bottom: 255px;
  }
}

/* ----------------------------------------
480px
------------------------------------------*/
@media screen and (max-width: 480px) {

  .top-firstview__main .topslider,
  .top-firstview__main .topslider .slick-list,
  .top-firstview__main .topslider .slick-track {
    height: 350px;
  }

  .top-firstview__main .topslider .slideitem {
    height: 350px;
    min-height: 350px;
  }

  .top-firstview__main::after {
    height: 420px;
    background: linear-gradient(
      90deg,
      rgba(255, 255, 255, .96) 0%,
      rgba(255, 255, 255, .82) 60%,
      rgba(255, 255, 255, .18) 100%
    );
  }

  .top-firstview__overlay {
    width: calc(100% - 30px);
    height: 350px;
  }

  .top-firstview__catch {
    width: 100%;
    top: 55%;
  }

  .top-firstview__lead {
    margin-bottom: 8px;
    font-size: 18px;
    line-height: 1.55;
    letter-spacing: .05em;
  }

  .top-firstview__title {
    margin-bottom: 16px;
    font-size: 45px;
  }

  .top-firstview__text {
    font-size: 14px;
    line-height: 1.8;
    letter-spacing: .03em;
  }

  .top-firstview__contact-title {
    margin-bottom: 5px;
    font-size: 20px;
  }

  .top-firstview__contact-text {
    margin-bottom: 9px;
    font-size: 14px;
    line-height: 1.6;
  }

  .top-firstview__contact-btn {
    gap: 8px;
    min-height: 48px;
    padding: 8px 10px;
  }

  .top-firstview__contact-icon {
    width: 24px;
  }

  .top-firstview__contact-label {
    font-size: 16px;
  }

  .top-firstview__wave {
    bottom: 200px;
  }
}

/* ----------------------------------------
このようなお不安はありませんか？
------------------------------------------*/
.top-worries {
  padding: 20px 0 80px;
  background: #F7FAFE;
}

/* ----------------------------------------
見出し
------------------------------------------*/
.top-title {
  margin: 0 0 42px;
  color: #005B96;
  font-size: 33px;
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
  letter-spacing: .1em;
}

.top-worries__emphasis {
  position: relative;
  display: inline-block;
  font-weight: 700;
}

.top-worries__emphasis::before {
  content: "";
  position: absolute;
  top: -7px;
  left: 50%;
  width: 7px;
  height: 7px;
  top: -10px;
  left: 50%;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #F27823;
  transform: translateX(-50%);
}
@media screen and (max-width: 820px) {
.top-worries__emphasis::before {
  top: -7px;
  left: 50%;
  width: 7px;
  height: 7px;
}
}
@media screen and (max-width: 480px) {
.top-worries__emphasis::before {
  top: -5px;
  left: 50%;
  width: 5px;
  height: 5px;
}
}


/* ----------------------------------------
カード一覧
------------------------------------------*/
.top-worries__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
width: min(1200px, 100%);
margin: 50px auto 20px;
}

/* ----------------------------------------
カード
------------------------------------------*/
.top-worries__item {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 24px 14px 20px;
  border: 1px solid #91ADCA;
  border-radius: 5px;
  background: #fff;
  box-shadow: 3px 4px 6px rgba(0, 0, 0, .18);
}

.top-worries__item-title {
  margin: 0 0 12px;
  color: #005B96;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}

/* ----------------------------------------
画像
------------------------------------------*/
.top-worries__image {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
  margin: 20px auto;
}

.top-worries__image img {
  display: block;
  width: auto;
  max-width: 100%;
  height: 100%;
  object-fit: contain;
}

/* ----------------------------------------
本文
------------------------------------------*/
.top-worries__text {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;
  text-align: left;
}

/* ----------------------------------------
1180px
------------------------------------------*/
@media screen and (max-width: 1180px) {

  .top-worries__list {
    gap: 16px;
  }

  .top-worries__item {
    padding: 22px 12px 18px;
  }

  .top-worries__item-title {
    font-size: 18px;
  }
  .top-worries__text {
    font-size: 15px;
  }
}

/* ----------------------------------------
1024px
------------------------------------------*/
@media screen and (max-width: 1024px) {

  .top-worries {
    padding: 60px 0 70px;
  }

  .top-worries__list {
    gap: 14px;
  }

  .top-worries__item {
    padding: 20px 10px 18px;
  }

  .top-worries__item-title {
    font-size: 17px;
  }

  .top-worries__text {
    font-size: 14px;
  }
}

/* ----------------------------------------
820px
2カラム
------------------------------------------*/
@media screen and (max-width: 820px) {

  .top-worries {
    padding: 52px 0 60px;
  }

  .top-title {
    margin-bottom: 32px;
    font-size: 24px;
  }

  .top-worries__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    width: 100%;
  }

  .top-worries__item {
    padding: 24px 16px 20px;
  }

  .top-worries__item-title {
    font-size: 19px;
  }
}

/* ----------------------------------------
767px
2カラム維持
------------------------------------------*/
@media screen and (max-width: 767px) {
  .top-title {
    font-size: 22px;
    letter-spacing: .06em;
  }

  .top-worries__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .top-worries__item {
    padding: 20px 10px 17px;
  }

  .top-worries__item-title {
    font-size: 17px;
  }

  .top-worries__text br {
    display: none;
  }
}

/* ----------------------------------------
480px
スマホも2カラム固定
------------------------------------------*/
@media screen and (max-width: 480px) {

  .top-worries {
    padding: 42px 0 20px;
  }

  .top-title {
    margin-bottom: 26px;
    font-size: 18px;
    line-height: 1.6;
    letter-spacing: .03em;
  }
  .top-worries__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .top-worries__item {
    padding: 16px 7px 14px;
    border-radius: 4px;
    box-shadow: 2px 3px 5px rgba(0, 0, 0, .16);
  }

  .top-worries__item-title {
    margin-bottom: 8px;
    font-size: 15px;
    line-height: 1.5;
  }
}



/* ----------------------------------------
3つの強み
------------------------------------------*/
.top-strength {
  padding: 80px 0 10px;
  background: #F7FAFE;
  position: relative;
}

.top-strength:before {
position: absolute;
content: "";
background-image: url(../images/top/bgitem01.webp);
background-repeat: no-repeat;
display: inline-block;
background-size: cover;
width: min(600px, 100%);
aspect-ratio: 5 / 4;
left: 0;
top: 0;
z-index: 0;
}
.top-strength::after {
position: absolute;
content: "";
background-image: url(../images/top/bgitem02.webp);
background-repeat: no-repeat;
display: inline-block;
background-size: cover;
width: min(600px, 100%);
aspect-ratio: 5 / 4;
right: 0;
bottom: 0;
z-index: 0;
}

/* ----------------------------------------
セクション見出し
------------------------------------------*/
.top-strength__heading {
  position: relative;
  min-height: 240px;
  z-index: 1;
}

.top-strength__person {
  position: absolute;
  bottom: 0px;
  left: 0;
  z-index: 2;
  width: 280px;
}

.top-strength__person img {
  display: block;
  width: 100%;
  height: auto;
}

.top-strength .top-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0;
  color: #005995;
  text-align: center;
  position: relative;
    z-index: 3;
}

.top-strength__lead {
  display: block;
  margin-bottom: 24px;
  font-size: 33px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .06em;
}

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

.top-strength__number {
  color: #FF6600;
  font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 130px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .02em;
}

.top-strength__main-text {
  color: #005995;
  font-size: 70px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .05em;
}

/* ----------------------------------------
葉の装飾
------------------------------------------*/
.top-strength__main {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.top-strength__leaf {
  width: 80px;
  flex-shrink: 0;
}
@media screen and (max-width: 480px) {
.top-strength__leaf {
  width: 60px;
  flex-shrink: 0;
}
}

.top-strength__leaf--left {
  margin-right: 0px;
}
.top-strength__leaf--right {
  margin-left: 0px;
}

/* ----------------------------------------
強み一覧
------------------------------------------*/
.top-strength__list {
  display: grid;
  gap: 20px;
  position: relative;
    z-index: 1;
}

/* ----------------------------------------
強みカード
------------------------------------------*/
.top-strength__item {
  display: grid;
  grid-template-columns: 34% minmax(0, 1fr);
  align-items: stretch;
  min-height: 255px;
  padding: 12px;
  border: 1px solid #C6DDF2;
  border-radius: 9px;
  background: #fff;
}

.top-strength__item--reverse {
  grid-template-columns: minmax(0, 1fr) 34%;
}

.top-strength__item--reverse .top-strength__image {
  order: 2;
}

.top-strength__item--reverse .top-strength__contents {
  order: 1;
}

/* ----------------------------------------
カード画像
------------------------------------------*/
.top-strength__image {
  overflow: hidden;
  border-radius: 8px;
}

.top-strength__image img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 5 / 3;
  object-fit: cover;
}
@media screen and (max-width: 1180px) {
.top-strength__image img {
  width: 100%;
  height: 100%;
  aspect-ratio: unset;
}
}




/* ----------------------------------------
カード内容
------------------------------------------*/
.top-strength__contents {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  align-items: center;
  gap: 20px;
  min-width: 0;
  padding: 25px 30px;
}

.top-strength__point {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.top-strength__point-number {
  display: block;
  color: #A8CDEC;
  font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 76px;
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: .02em;
}

.top-strength__point-label {
  display: block;
  margin-top: -2px;
  color: #FF6600;
  font-family: Impact, "Arial Black", sans-serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 1;
  transform: rotate(-8deg);
  letter-spacing: 2px;
}

.top-strength__text-area {
  min-width: 0;
}

.top-strength__item-title {
  margin: 0 0 14px;
  color: #005995;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .04em;
}
@media screen and (max-width: 1180px) {
.top-strength__item-title {
  font-size: 28px;
}
}
@media screen and (max-width: 1024px) {
.top-strength__item-title {
  font-size: 26px;
}
}

.top-strength__text {
  margin: 0;
  font-size: 16px;
  line-height: 1.8;
}

/* ----------------------------------------
820px
------------------------------------------*/
@media screen and (max-width: 820px) {

  .top-strength {
    padding: 60px 0;
  }

  .top-strength__heading {
    min-height: auto;
    padding: 0;
    margin-bottom: 40px;
    display: block;
    text-align: center;
  }

  .top-strength__person {
    position: static;
    width: 250px;
    margin: 0 auto 20px;
  }

  .top-strength .top-title {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .top-strength__lead {
    margin-bottom: 12px;
    font-size: clamp(26px, 3vw, 22px);
  }

  .top-strength__main {
    gap: 10px;
  }

  .top-strength__number {
    font-size: clamp(58px, 8vw, 72px);
  }

  .top-strength__main-text {
    font-size: clamp(28px, 5vw, 40px);
  }

  .top-strength__leaf {
    transform: scale(.8);
  }

  .top-strength__item,
  .top-strength__item--reverse {
    grid-template-columns: 1fr;
  }

  .top-strength__item--reverse .top-strength__image,
  .top-strength__item--reverse .top-strength__contents {
    order: initial;
  }

  .top-strength__image {
    aspect-ratio: 16 / 9;
    min-height: auto;
  }

  .top-strength__contents {
    grid-template-columns: 80px 1fr;
    gap: 16px;
    padding: 15px 10px;
  }

  .top-strength__point {
    align-items: center;
  }

  .top-strength__point-number {
    font-size: 56px;
  }

  .top-strength__point-label {
    margin-top: -6px;
    font-size: 20px;
  }

  .top-strength__item-title {
    font-size:24px;
  }

  .top-strength__text {
    font-size: 14px;
    line-height: 1.8;
  }

  .top-strength__text br {
    display: none;
  }

}

/* ----------------------------------------
480px
------------------------------------------*/
@media screen and (max-width: 480px) {
    .top-strength__item-title {
    font-size:22px;
  }
  .top-strength__person {
    width: 150px;
  }
  .top-strength__heading {
    margin-bottom: 0px;
  }
    .top-strength__number {
    font-size: clamp(62px, 8vw, 72px);
  }

  .top-strength__main-text {
    font-size: clamp(35px, 5vw, 40px);
  }
    .top-strength__contents {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 15px 10px;
  }
}


/* ----------------------------------------
宅地造成で出来ること
------------------------------------------*/
.top-service {
  position: relative;
  overflow: hidden;
  padding: 130px 0 50px;
  background: #f7fafe;
}
@media screen and (max-width: 1300px) {
.top-service {
  padding: 130px 0 110px;
}
}

@media screen and (max-width: 1180px) {
.top-service {
  padding: 130px 0 180px;
}
}


.top-service__heading {
  position: relative;
  z-index: 2;
  min-height: 125px;
  padding-left: clamp(30px, 7vw, 120px);
}
.top-service__title-wrap {
  position: relative;
  display: inline-block;
}
.top-service__en {
  position: absolute;
  top: 60px;
  left: 0px;
  z-index: 2;
  color: #FF6600;
  font-size: clamp(24px, 2.5vw, 38px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 1px;
  transform: rotate(-8deg);
}
.top-service .top-title {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #005995;
  font-size: clamp(34px, 4vw, 60px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .06em;
}
.top-service__person {
  position: absolute;
  right: 10%;
  bottom: -150px;
  z-index: 3;
  width: min(320px, 100%);
}
.top-service__person img {
  display: block;
  width: 100%;
  height: auto;
}
.top-service__main {
  position: relative;
  margin-top: 20px;
}
.top-service__image {
  width: 62%;
  aspect-ratio: 1947 / 1511;
  overflow: hidden;
  border-radius: 0 6px 6px 0;
}
.top-service__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.top-service__box {
  position: absolute;
  top: 98px;
  right: 4%;
  z-index: 4;
  width: min(50%, 700px);
  padding: clamp(20px, 2vw, 32px);
  background: #fff;
  border: 1px solid #8DAAC2;
  border-radius: 8px;
  box-shadow: 4px 5px 8px rgba(0, 55, 95, .18);
}
.top-service__box-title {
  margin: 0 0 5px;
  color: #005995;
  font-size: clamp(22px, 2vw, 32px);
  font-weight: 700;
  line-height: 1.45;
}
.top-service__box-title span,
.top-service__box-title strong {
  display: block;
}
.top-service__box-title strong {
  color: #FF6600;
  font-size: 1.25em;
  font-weight: 700;
}
.top-service__text {
  font-size: 16px;
  line-height: 1.6;
}
.top-service__text p {
  margin: 0 0 10px;
}
.top-service__message {
  margin: 22px 0 0;
  font-size: clamp(18px, 1.6vw, 24px);
  font-weight: 700;
  line-height: 1.8;
}

/* ----------------------------------------
1024px
------------------------------------------*/
@media screen and (max-width: 1024px) {
  .top-service {
    padding: 100px 0 30px;
  }
  .top-service__heading {
    min-height: auto;
    padding: 0 5%;
    text-align: center;
  }
  .top-service__title-wrap {
    padding-top: 24px;
    z-index: 3;
  }
  .top-service__en {
    top: -10px;
    left: -10px;
    font-size: clamp(24px, 6vw, 34px);
  }
  .top-service .top-title {
    font-size: clamp(28px, 7vw, 42px);
  }
  .top-service__person {
    position: static;
    width: auto;
  }
  .top-service__main {
    display: grid;
    grid-template-columns: 100%;
    align-items: end;
    margin-top: 30px;
    min-height: auto;
  }
  .top-service__image {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    border-radius: 0;
    z-index: 3;
  }
  .top-service__person {
        position: absolute;
        z-index: 2;
        width: 160px;
        margin-left: 0%;
        right: 10%;
        bottom: -50px;
  }
  .top-service__person img {
    width: 100%;
  }
  .top-service__box {
    position: static;
    width: calc(100% - 8%);
    margin: 30px auto 0;
    padding: 26px 5%;
  }
  .top-service__box-title {
    font-size: clamp(20px, 4.8vw, 28px);
  }
  .top-service__text {
    font-size: 14px;
    line-height: 1.8;
  }
  .top-service__message {
    font-size: clamp(16px, 4vw, 21px);
  }
}


@media screen and (max-width: 820px) {
  .top-service .top-title {
    font-size: 26px;
  }
}

@media screen and (max-width: 767px) {
  .top-service__heading {
    min-height: auto;
    padding: 0 5%;
    text-align: left;
  }
}

/* ----------------------------------------
サービスカード
------------------------------------------*/
.top-service-card-area {
    padding: 20px 0 50px;
    background: #f7fafe;
}
.top-service-card-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(16px, 1vw, 28px);
}
.top-service-card {
  display: grid;
  grid-template-columns: 38% 1fr;
  align-items: center;
  min-height: 160px;
  padding: 10px 10px;
  background: #fff;
  border: 1px solid #8DAAC2;
  border-radius: 8px;
  box-shadow: 4px 5px 7px rgba(0, 67, 112, .18);
}
.top-service-card__image {
  display: flex;
  align-items: center;
  justify-content: center;
}
.top-service-card__image img {
  display: block;
  width: 100%;
  aspect-ratio: 6 / 5;
  object-fit: cover;
}
.top-service-card__contents {
  padding-left: 14px;
}
.top-service-card__title {
  margin: 0 0 10px;
  color: #005995;
  font-size: clamp(18px, 1.35vw, 22px);
  font-weight: 700;
  line-height: 1.35;
}
.top-service-card__text {
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
}

/* ----------------------------------------
1024px
------------------------------------------*/
@media screen and (max-width: 1024px) {
  .top-service-card-list {
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
  }
  .top-service-card {
    grid-template-columns: 120px 1fr;
    min-height: 150px;
  }
  .top-service-card__title {
    font-size: clamp(18px, 4vw, 21px);
  }
  .top-service-card__text {
    font-size: 14px;
  }
  .top-service-card__text br {
    display: none;
  }
}
/* ----------------------------------------
820px
------------------------------------------*/
@media screen and (max-width: 820px) {
  .top-service-card-list {
    grid-template-columns: 1fr;
    width: min(560px, 90%);
  }
}
/* ----------------------------------------
480px
------------------------------------------*/
@media screen and (max-width: 480px) {
  .top-service-card-list {
    grid-template-columns: 1fr;
    width: min(560px, 100%);
  }
}
/* ----------------------------------------
共通CTA
------------------------------------------*/
.cta-wrap {
  overflow: hidden;
}
.common-cta {
  position: relative;
  overflow: hidden;
  padding: 30px 0 0;
  background: #F7FAFE;
}
.common-cta .inner3 {
  position: relative;
  z-index: 2;
}
.common-cta__lead {
  margin: 0 0 8px;
  color: #005995;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.8;
  text-align: center;
}
.common-cta .top-title {
  margin: 0 0 35px;
  color: #FF6600;
  font-size: 33px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .08em;
  text-align: center;
}
.common-cta__contact {
  position: relative;
  width: min(860px, 88%);
  margin: 0 auto;
  z-index: 2;
}
.common-cta__person {
  position: absolute;
  left: 0px;
  bottom: 0px;
  z-index: 2;
  width: 180px;
}
.common-cta__person img {
  display: block;
  width: 100%;
  height: auto;
}
.common-cta__box {
  overflow: hidden;
  margin-left: 55px;
  background: #fff;
  border: 1px solid #FFB580;
  border-radius: 7px;
}
.common-cta__box-head {
  margin: 0;
  padding: 8px 20px;
  color: #fff;
  background: #FF6600;
  font-size: 22px;
  line-height: 1.5;
  text-align: center;
}
.common-cta__tel {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: fit-content;
  margin: 14px auto 0;
  color: #111;
  text-decoration: none;
}
.common-cta__tel img {
  display: block;
  width: 40px;
  height: auto;
}
.common-cta__tel span {
  font-size: clamp(30px, 4vw, 50px);
  line-height: 1.1;
  letter-spacing: .03em;
}
.common-cta__time {
  width: min(360px, 80%);
  margin: 5px auto 12px;
  padding: 5px 0;
  border-top: 1px solid #FFC19A;
  border-bottom: 1px solid #FFC19A;
  color: #555;
  font-size: 16px;
  line-height: 1.5;
  text-align: center;
}
.common-cta__mail {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: min(270px, 80%);
  margin: 0 auto 20px;
  padding: 9px 20px;
  background: #FF6600;
  border-radius: 5px;
  transition: opacity .3s;

}
.common-cta__mail span{
  font-size: 16px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .04em;
  color: #fff;
}


.common-cta__mail:hover {
  opacity: .75;
}
.common-cta__mail img {
  display: block;
  width: 24px;
  height: auto;
}
.common-cta__town {
  position: relative;
  z-index: 1;
  width: 100%;
  margin-top: -100px;
  padding: 0 0 50px;
}
@media screen and (max-width: 1024px) {
.common-cta__town {
  margin-top: -70px;
}
}

.common-cta__town::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  height: 72%;
}
.cta-wrap--blue .common-cta__town::before {
  background: #F7FAFE;
}
.cta-wrap--white .common-cta__town::before {
  background: #fff;
}
.common-cta__town img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 820px) {
  .common-cta {
    padding-top: 40px;
  }
  .common-cta__lead {
    width: 100%;
    margin: 0 auto 8px;
    font-size: 18px;
    text-align: left;
  }
  .common-cta .top-title {
    width: 100%;
    margin: 0 auto 28px;
    font-size: 22px;
  }
  .common-cta__contact {
    width: 90%;
  }
  .common-cta__person {
    left: -20px;
    width: 115px;
  }
  .common-cta__box {
    margin-left: 65px;
  }
  .common-cta__box-head {
    padding: 7px 10px;
    font-size: 15px;
  }
  .common-cta__tel {
    margin-top: 12px;
  }
  .common-cta__tel img {
    width: 26px;
  }
  .common-cta__tel span {
    font-size: 34px;
  }
  .common-cta__time {
    font-size: 16px;
  }
  .common-cta__mail {
    width: min(230px, 80%);
    padding: 8px 12px;
    font-size: 16px;
  }
  .common-cta__town {
    margin-top: 0;
  }
}

@media screen and (max-width: 480px) {
  .common-cta {
    padding-top: 0px;
  }
  .common-cta .top-title {
    width: 100%;
    margin: 0 auto 10px;
    font-size: 20px;
  }
  .common-cta__box {
    margin-left: 0px;
  }
  .common-cta__person {
      display: none;
  }
  .common-cta__contact {
      width: 100%;
  }
    .common-cta__lead {
    font-size: 16px;
  }
}
/* ----------------------------------------
選ばれる理由
------------------------------------------*/
.top-strong {
    padding: 40px 0 60px;
    background: #F7FAFE;
}

.top-strong__wrap {
  position: relative;
  overflow: hidden;
  min-height: clamp(420px, 46.8vw, 600px);
  align-content: center;
}

.top-strong__wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background:
        /* 横 */
        linear-gradient(
            90deg,
            rgba(247,250,254,1) 0%,
            rgba(247,250,254,.2) 5%,
            rgba(247,250,254,0) 30%,
            rgba(247,250,254,0) 70%,
            rgba(247,250,254,.3) 95%,
            rgba(247,250,254,1) 100%
        ),

        /* 縦 */
        linear-gradient(
            180deg,
            rgba(247,250,254,1) 0%,
            rgba(247,250,254,.2) 5%,
            rgba(247,250,254,0) 30%,
            rgba(247,250,254,0) 70%,
            rgba(247,250,254,.2) 95%,
            rgba(247,250,254,1) 100%
        );
}


.top-strong__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.top-strong__content {
    position: relative;
    z-index: 3;
    width: 60%;
    padding: 50px;
}

.top-strong__heading {
  position: relative;
  display: inline-block;
  margin-bottom: clamp(55px, 6vw, 90px);
}

.top-title {
  margin: 0;
  color: #005995;
  font-size: clamp(25px, 3vw, 45px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .06em;
}

.top-strong__en {
  position: absolute;
  top: 50px;
  left: 0px;
  z-index: 2;
  color: #FF6600;
  font-size: clamp(24px, 2.5vw, 38px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 1px;
  transform: rotate(-8deg);
}

.top-strong__text {
  font-size: 16px;
  line-height: 1.8;
}

.top-strong__text p {
  margin: 0;
}

.top-strong__text p + p {
  margin-top: 24px;
}

@media screen and (max-width: 1024px) {
  .top-strong {
    padding: 30px 0;
  }

  .top-strong__wrap {
    overflow: visible;
    min-height: 0;
    background: #fff;
    display: flex;
    flex-direction: column-reverse;
  }

  .top-strong__image {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
  }

  .top-strong__content {
    width: 100%;
    padding: 35px 25px 40px;
    background: #f7fafe;
  }

  .top-strong__heading {
    margin-bottom: 50px;
  }

  .top-title {
    font-size: clamp(30px, 8vw, 42px);
  }

  .top-strong__en {
    top: -28px;
    left: -10px;
    font-size: clamp(24px, 6vw, 34px);
  }


  .top-strong__text {
    font-size: 14px;
    line-height: 1.8;
  }

  .top-strong__text br {
    display: none;
  }

  .top-strong__text p + p {
    margin-top: 20px;
  }
}
@media screen and (max-width: 820px) {
  .top-title {
    font-size: 26px;
  }
}

@media screen and (max-width: 767px) {
  .top-strong__content {
    padding: 0px 0px 20px;
  }
  .top-strong__heading {
    margin-bottom: 20px;
  }
}


/* ----------------------------------------
施工実績
------------------------------------------*/
.top-works {
  position: relative;
  padding: 40px 0 60px;
  background: #F7FAFE;
}


.top-works:before {
position: absolute;
content: "";
background-image: url(../images/top/bgitem01.webp);
background-repeat: no-repeat;
display: inline-block;
background-size: cover;
width: min(600px, 100%);
aspect-ratio: 5 / 4;
left: 0;
top: 30%;
z-index: 0;
}
.top-works::after {
position: absolute;
content: "";
background-image: url(../images/top/bgitem02.webp);
background-repeat: no-repeat;
display: inline-block;
background-size: cover;
width: min(600px, 100%);
aspect-ratio: 5 / 4;
right: 0;
bottom: 5%;
z-index: 0;
}


.top-works__wrap {
  display: grid;
  grid-template-columns: 5fr 6fr;
  align-items: center;
  gap: 20px;
  position: relative;
    z-index: 0;
}

.top-works__content {
  min-width: 0;
  padding: 0px 0px 0px 50px;
}
@media screen and (max-width: 1024px) {
.top-works__content {
  padding: 35px 25px 40px;
}
}
@media screen and (max-width: 767px) {
.top-works__content {
  padding: 0px 0px 20px;
}
}

.top-works__text {
  color: #333;
  font-size: 16px;
  line-height: 1.8;
}

.top-works__text p {
  margin: 0;
}

.top-works__text p + p {
  margin-top: 10px;
}

.top-works__image {
  overflow: hidden;
  border-radius: 8px;
}

.top-works__image img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 1024px) {
  .top-works {
    padding: 30px 0;
  }

  .top-works__wrap {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .top-works__text {
    font-size: 14px;
  }

  .top-works__text br {
    display: none;
  }
  .top-works__image img {
    display: block;
    width: 100%;
    aspect-ratio: 5 / 2;
    object-fit: cover;
    object-position: bottom;
}
}



/*****************************
施工実績 共通
*****************************/

.top-products{
  padding: 60px 0 10px;
background: #f7fafe;
}

.top-products.page_style{
  padding: 60px 0 10px;
background: #ffffff;
}


.top-products__heading,
.products-archive__heading {
  position: relative;
  margin-bottom: 90px;
}

.top-products .top-title,
.products-archive .top-title {
  margin: 0;
  color: #005995;
  font-size: 60px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .06em;
}

.top-products__en,
.products-archive__en {
  position: absolute;
  top: 60px;
  left: 0;
  z-index: 2;
  margin: 0;
  color: #FF6600;
  font-family: Impact, sans-serif;
  font-size: 38px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 1px;
  transform: rotate(-8deg);
}

.products-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  position: relative;
  z-index: 1;
}

.products-card {
  overflow: hidden;
  background: #fff;
  border: 1px solid #9CC6F5;
  border-radius: 8px;
  box-shadow: 3px 4px 8px rgba(0, 0, 0, .15);
}

.products-card a {
  display: block;
  height: 100%;
  color: #333;
  text-decoration: none;
  transition: opacity .3s;
}

.products-card a:hover {
  opacity: .75;
}

.products-card__image {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  margin: 15px 15px 0;
  background: #eee;
}
@media screen and (max-width: 767px) {
.products-card__image {
  aspect-ratio: 16 / 9;
  margin: 10px 10px 0;
}
}

.products-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.products-card__noimage {
  display: block;
  width: 100%;
  height: 100%;
  background: #eee;
}

.products-card__content {
  padding: 14px 14px 18px;
}

.products-card__title {
  margin: 0 0 16px;
  color: #005995;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.6;
}
@media screen and (max-width: 1024px) {
.products-card__title {
  font-size: 16px;
}
}



.products-card__info {
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
}

.products-card__info div {
  display: grid;
  grid-template-columns: 65px 1fr;
  gap: 8px;
}

.products-card__info div + div {
  margin-top: 5px;
}

.products-card__info dt,
.products-card__info dd {
  margin: 0;
}

.products-card__info dt {
  font-weight: bold;
  color: #005995;
}

.top-products__button {
  margin-top: 45px;
  text-align: center;
  position: relative;
  z-index: 1;
}

.top-products__button a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 300px;
  min-height: 54px;
  padding: 12px 30px;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  background: #005995;
  border-radius: 7px;
  transition: opacity .3s;
}

.top-products__button a:hover {
  opacity: .75;
}

/* ----------------------------------------
アーカイブ
------------------------------------------*/
.products-pagination {
  margin-top: 60px;
}

.products-pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}

.products-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  color: #005995;
  text-decoration: none;
  background: #fff;
  border: 1px solid #005995;
}

.products-pagination .page-numbers.current {
  color: #fff;
  background: #005995;
}

.products-empty {
  margin: 0;
  font-size: 16px;
  line-height: 1.8;
}

/* ----------------------------------------
施工実績 詳細
------------------------------------------*/
.products-single {
  padding: 90px 0;
  background: #fff;
}

.products-single__header {
  margin-bottom: 30px;
  padding-bottom: 5px;
  border-bottom: 3px solid #00B9EF;
  position: relative;
}

.products-single__header::after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 95px;
  height: 3px;
  background: #0068b7;
}

.products-single__title {
  margin: 0;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.5;
}

.products-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.products-gallery__image {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #eee;
}

.products-gallery__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.products-gallery__caption {
    margin: 7px 0 0;
    font-size: 16px;
    line-height: 1.4;
}

.products-single__body {
  margin-top: 60px;
  font-size: 16px;
  line-height: 1.4;
}

.products-single__body > *:first-child {
  margin-top: 0;
}

.products-single__body > *:last-child {
  margin-bottom: 0;
}

.products-single__navigation {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  margin-top: 70px;
}

.products-single__navigation a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 100px;
  min-height: 44px;
  padding: 8px 20px;
  color: #333;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid #333;
  transition: opacity .3s;
}

.products-single__navigation a:hover {
  opacity: .75;
}

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

.products-single__next {
  text-align: left;
}

.products-single__archive {
  grid-column: 2;
}


/* ----------------------------------------
820px以下
------------------------------------------*/
@media screen and (max-width: 820px) {
.products-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}
.products-gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
}



/* ----------------------------------------
600px以下
------------------------------------------*/
@media screen and (max-width: 600px) {
  .top-products,
  .products-archive__main {
    padding: 60px 0;
  }

  .top-products__heading,
  .products-archive__heading {
    margin-bottom: 75px;
  }

  .top-products .top-title,
  .products-archive .top-title {
    font-size: 34px;
  }

  .top-products__en,
  .products-archive__en {
    top: 45px;
    font-size: 25px;
  }

  .products-list {
    grid-template-columns: 1fr;
    gap: 25px;
  }

  .products-card__title {
    font-size: 16px;
  }

  .top-products__button {
    margin-top: 35px;
  }

  .top-products__button a {
    min-width: 260px;
    font-size: 14px;
  }

  .products-single {
    padding: 60px 0;
  }

  .products-single__header {
    margin-bottom: 35px;
  }

  .products-single__title {
    font-size: 25px;
  }

  .products-gallery {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .products-gallery__image {
    aspect-ratio: auto;
  }

  .products-gallery__image img {
    height: auto;
    object-fit: contain;
  }

  .products-gallery__caption {
    font-size: 13px;
  }

  .products-single__body {
    margin-top: 45px;
    font-size: 14px;
  }

  .products-single__navigation {
    grid-template-columns: repeat(3, 1fr);
    margin-top: 50px;
  }

  .products-single__navigation a {
    width: 100%;
    min-width: 0;
    padding: 8px 10px;
    font-size: 13px;
  }
}


/*----------------------------------------
施工の流れ
----------------------------------------*/
.top-flow {
    padding: 50px 0;
    background: #fff;
}

.top-flow .top-strong__heading {
    position: relative;
    text-align: center;
    width: fit-content;
    margin: 0 auto 70px;
    display: block;
}

.top-flow__lead {
    margin: 0 auto 70px;
    text-align: center;
}

.top-flow__lead p {
    margin: 0;
    font-size: 16px;
    line-height: 2;
}

.top-flow__lead p + p {
    margin-top: 8px;
}

.top-flow__list {
    display: grid;
    grid-template-columns: repeat(5,1fr);
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.top-flow__item {
    text-align: center;
}

.top-flow__line {
    position: relative;
}

.top-flow__line::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 2px;
    background: #0D4A8C;
}

.top-flow__number {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  color: #fff;
  font-size: 22px;
  font-weight: 400;
  background: #093A6D;
  border-radius: 50%;
  letter-spacing: 2px;
  line-height: 1;
  font-family: "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}

.top-flow__image {
    margin-top: 20px;
    margin-bottom: 20px;
}
@media screen and (max-width: 767px){
.top-flow__image {
    margin-bottom: 0px;
}
}


.top-flow__image img {
    display: block;
    width: 100%;
    margin: 0 auto;
}

.top-flow__item h3 {
    margin: 0 0 12px;
    color: #005995;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.5;
}

.top-flow__item p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
}

@media screen and (max-width: 820px){
.top-flow {
    padding: 30px 0;
}

.top-flow .top-strong__heading {
    margin-bottom: 60px;
}

.top-flow__lead {
    margin-bottom: 40px;
    text-align: left;
}

.top-flow__lead p {
    font-size: 14px;
}

.top-flow__list {
  grid-template-columns: repeat(3, 1fr);
}

.top-flow__line {
    margin-bottom: 20px;
}

.top-flow__image img {
    max-width: 140px;
}

.top-flow__item h3 {
    font-size: 20px;
}

.top-flow__item p {
    font-size: 13px;
}
}


@media screen and (max-width: 600px){
.top-flow__list {
  grid-template-columns: repeat(2, 1fr);
 gap: 20px 10px;
}
.top-flow .top-strong__heading {
    margin-bottom: 30px;
}
.top-flow__line {
    margin-bottom: 0px;
}
}

/*****************************
  topsec-news
*****************************/
.topsec-news{
  margin: 30px 0 0;
  padding: 30px 0 0;
}
.topsec-news input[type="radio"] {
  display: none;
}
.topsec-news .tab_area{
  margin-bottom: 3rem;
}
.topsec-news .tab_area .ftab{
  background: #F7FAFE;
  border: 1px solid #8DAAC2;
  border-radius: 5px;
  margin-right: 10px;
  position: relative;
  text-align: center;
  width: calc(15% - 10px);
}
.topsec-news .tab_area .ftab label{
  cursor: pointer;
  display: block;
  font-weight: bold;
  padding: .3rem 0;
  position: relative;
  width: 100%;
  z-index: 1;
}
.topsec-news .tab_panel{
  display: none;
}
.topsec-news .tab_area .ftab:hover,
.topsec-news #tnewstab1:checked ~ .tab_area .tnewsftab1{
  background: #005995;
  color: #fff;
}
.topsec-news .tab_area .tnewsftab2:hover,
.topsec-news #tnewstab2:checked ~ .tab_area .tnewsftab2{
  background: #FF6600;
  color: #fff;
}
.topsec-news .tab_area .tnewsftab3:hover,
.topsec-news #tnewstab3:checked ~ .tab_area .tnewsftab3{
  background: #4E8DE1;
  color: #fff;
}

.topsec-news #tnewstab1:checked ~ .panel_area #tnewspanel1,
.topsec-news #tnewstab2:checked ~ .panel_area #tnewspanel2,
.topsec-news #tnewstab3:checked ~ .panel_area #tnewspanel3{
  display:block;
}

@media only screen and (max-width: 1024px) {
  .topsec-news .tab_area {
    margin-bottom: 4rem;
  }
}
@media only screen and (max-width: 820px) {
  .topsec-news .tab_area .ftab{
    margin: 1rem 1rem 0 0;
    width: calc(30% - 10px);
  }
}
@media only screen and (max-width: 767px) {
  .topsec-news .t-newsttlbox,
  .topsec-news .tab_area .ftab label{
    font-size: 1.4rem;
  }
  .topsec-news .tab_area .ftab{
    width: calc(33% - 10px);
  }
}





/*----------------------------------------
よくある質問
----------------------------------------*/
.top-faq {
  position: relative;
    padding: 50px 0;
    background: #fff;
}

.top-faq:before {
position: absolute;
content: "";
background-image: url(../images/top/bgitem01.webp);
background-repeat: no-repeat;
display: inline-block;
background-size: cover;
width: min(600px, 100%);
aspect-ratio: 5 / 4;
left: 0;
top: 0;
z-index: 0;
}
.top-faq::after {
position: absolute;
content: "";
background-image: url(../images/top/bgitem02.webp);
background-repeat: no-repeat;
display: inline-block;
background-size: cover;
width: min(600px, 100%);
aspect-ratio: 5 / 4;
right: 0;
bottom: 0;
z-index: 0;
}

.top-faq .top-strong__heading {
    position: relative;
    text-align: center;
    width: fit-content;
    margin: 0 auto 70px;
    display: block;
}

.top-faq__lead {
    margin: 0 auto 70px;
    text-align: center;
}

.top-faq__lead p {
    margin: 0;
    font-size: 16px;
    line-height: 2;
}

.top-faq__lead p + p {
    margin-top: 8px;
}


@media screen and (max-width: 820px){

.top-faq {
    padding: 60px 0;
}

.top-faq .top-strong__heading {
    margin-bottom: 60px;
}

.top-faq__lead {
    margin-bottom: 40px;
    text-align: left;
}

.top-faq__lead p {
    font-size: 14px;
}
}

.faq_list{
  position: relative;
  z-index: 1;
}

@media screen and (max-width: 600px){
.top-faq .top-strong__heading {
    margin-bottom: 30px;
}
}



/*****************************
  お知らせ一覧
*****************************/
.topsec-news .top-strong__heading {
    position: relative;
    text-align: center;
    width: fit-content;
    margin: 0 auto 80px;
    display: block;
}

@media screen and (max-width: 800px) {
.topsec-news .top-strong__heading {
    margin: 0 auto 60px;
}
}
@media screen and (max-width: 600px) {
.topsec-news .top-strong__heading {
    margin: 0 auto 30px;
}
}

.newslist{
  margin-bottom: 60px;
}
.newslinktab{
  margin-bottom: 5rem;
}
.newslinktab li{
  width: calc(15% - 10px);
}
.newslinktab  a.label{
  background: #F7FAFE;
  border: 1px solid #8DAAC2;
  border-radius: 5px;
  display: block;
  font-weight: bold;
  margin-right: 10px;
  opacity: 1 !important;
  padding: .3rem 0;
  position: relative;
  text-align: center;
}
.newslinktab  a.label:hover,
.newslinktab  a.label.label_cr{
  background: #005995;
  color: #fff;
}
.newslinktab  a.label.label_cr{
  pointer-events: none;
}
.newslinktab  a.label2:hover,
.newslinktab a.label2.label_cr{
  background: #FF6600;
}
.newslinktab  a.label3:hover,
.newslinktab a.label3.label_cr{
  background: #4E8DE1;
}

.newslist li{
  margin-top: 1rem;
}
.newslist a{
  opacity: 1 !important;
  position: relative;
}
.newslist a::before,
.newslist a::after{
  content: "";
  background: #c8c8c8;
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  width: 100%;
}
.newslist a::after{
background: #0068b7;
  transition: 0.3s;
  width: 7%;
  z-index: 1;
}
.newslist a:hover::after{
  width: 100%;
}
.newslist a .cat,
.singlehead .cat{
  background: #005995;
  border-radius: 5px;
  color: #fff;
  margin-right: 1rem;
  text-align: center;
  width: 100px;
  line-height: 1.7;
}
.newslist a .cat-cat01,
.singlehead .cat-cat01{
  background: #FF6600;
}
.newslist a .cat-cat02,
.singlehead .cat-cat02{
  background: #4E8DE1;
}
.newslist a .ttl{
  padding: 1rem 0;
}
@media only screen and (max-width: 820px) {
  .newslinktab li{
    margin: 1rem 1rem 0 0;
    width: calc(30% - 10px);
  }
}
@media only screen and (max-width: 767px) {
  .newslinktab li{
    width: calc(50% - 10px);
  }
  .newslist a .cat{
    font-size: 1.2rem;
    line-height: 2;
    width: 110px;
  }
  .newslist a .date{
    font-size: 1.4rem;
  }
  .singlehead .ttl{
    font-size: 2rem;
  }
}
.newscont{
  width: 100%;
}

.white_halfmoon{
  position: relative;
  z-index: 0;
  width: 100%;
  margin-top: -100px;
  background: #f7fafe;
  padding: 0 0 0px;
}
@media screen and (max-width: 1180px) {
.white_halfmoon{
  margin-top: -50px;
}
}
@media screen and (max-width: 1024px) {
.white_halfmoon{
  margin-top: -30px;
}
}
@media screen and (max-width: 820px) {
.white_halfmoon{
  margin-top: -20px;
}
}
@media screen and (max-width: 480px) {
.white_halfmoon{
  margin-top: 0px;
}
}

.white_halfmoon img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: auto;
}



/*----------------------------------------
会社概要
----------------------------------------*/
.top-company {
    padding: 100px 0 50px;
    background: #F7FAFE;
}

.top-company__wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.top-company__map {
    aspect-ratio: 600 / 420;
    overflow: hidden;
    border-radius: 8px;
}

.top-company__map iframe {
    width: 100%;
    height: 100%;
    display: block;
}

.top-company__content {
    max-width: 420px;
}

.top-company .top-strong__heading {
    margin-bottom: 40px;
}

.top-company .top-company__lead {
    margin: 0;
}

.top-company .top-company__lead p {
    margin: 0;
    font-size: 16px;
    line-height: 1.8;
}

.top-company .top-company__lead p:nth-child(1) {
    margin-bottom: 25px;
}

@media screen and (max-width: 820px) {

.top-company {
    padding: 60px 0;
}

.top-company__wrap {
    grid-template-columns: 1fr;
    gap: 40px;
}

.top-company__content {
    max-width: none;
}

.top-company .top-strong__heading {
    margin-bottom: 60px;
    margin-top: 30px;
}

.top-company .top-company__lead p {
    font-size: 16px;
}

}

@media screen and (max-width: 600px) {
.top-company .top-strong__heading {
    margin-bottom: 30px;
    margin-top: 20px;
}
}