@charset "UTF-8";
/*----------------------------------
  about（XD: export_0014）
-----------------------------------*/
.p-top-about {
  position: relative;
  padding-block: 5rem 11rem;
}
@media (min-width: 768px) {
  .p-top-about {
    padding-block: 7.1875rem 4.75rem;
  }
}

.p-top-about__inner {
  position: relative;
  z-index: 1;
}

.p-top-about__contents {
  display: flex;
  flex-direction: column;
  row-gap: 0.3125rem;
  margin-block-start: 1.8125rem;
}
@media (min-width: 768px) {
  .p-top-about__contents {
    margin-block-start: 2.3125rem;
  }
}
@media (min-width: 1024px) {
  .p-top-about__contents {
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: flex-start;
    column-gap: 2.5rem;
  }
}

.p-top-about__img {
  width: 19.0625rem;
  margin-inline: auto;
  aspect-ratio: 644/486;
}
@media (min-width: 768px) {
  .p-top-about__img {
    width: min(100%, 40.25rem);
  }
}
@media (min-width: 1024px) {
  .p-top-about__img {
    flex: 0 0 min(40.25rem, 48%);
    margin-inline: 0;
    margin-inline-end: calc(-1 * clamp(0px, (100vw - 84rem) / 2 - 1rem, 6rem));
  }
}

@media (min-width: 768px) {
  .p-top-about__body {
    width: min(100%, 47.5rem);
    margin-inline: auto;
  }
}
@media (min-width: 1024px) {
  .p-top-about__body {
    flex: 0 1 42rem;
    width: auto;
    min-width: 0;
    margin-inline: 0;
  }
}

.p-top-about__lead {
  color: #0a5da7;
  font-size: max(1.125rem, 14.4px);
}
@media (min-width: 0px) {
  .p-top-about__lead {
    font-size: 1.125rem;
  }
}
.p-top-about__lead {
  font-weight: 500;
  line-height: 1.7777777778;
}
@media (min-width: 768px) {
  .p-top-about__lead {
    font-size: max(1.5rem, 19.2px);
    font-weight: 500;
    line-height: 1.3333333333;
  }
}
@media (min-width: 768px) and (min-width: 0px) {
  .p-top-about__lead {
    font-size: 1.5rem;
  }
}

.p-top-about__text {
  margin-block-start: 1.5625rem;
  color: #606060;
  font-size: max(0.875rem, 11.2px);
}
@media (min-width: 0px) {
  .p-top-about__text {
    font-size: 0.875rem;
  }
}
.p-top-about__text {
  font-weight: 400;
  line-height: 1.7142857143;
}
@media (min-width: 768px) {
  .p-top-about__text {
    margin-block-start: 2rem;
    font-size: max(1rem, 12.8px);
    font-weight: 400;
    line-height: 1.75;
  }
}
@media (min-width: 768px) and (min-width: 0px) {
  .p-top-about__text {
    font-size: 1rem;
  }
}

.p-top-about__btn {
  margin-block-start: 2.5rem;
}

.p-top-about__boat {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  width: 24.375rem;
}
@media (min-width: 768px) {
  .p-top-about__boat {
    width: min(44.125rem, 55%);
  }
}
.p-top-about__boat img {
  display: block;
  aspect-ratio: 706/219;
}

/*----------------------------------
  選ばれる理由（XD: export_0015）
-----------------------------------*/
.p-top-reason {
  padding-block: 6.125rem 4.125rem;
  background-color: #f4f6fc;
}
@media (min-width: 768px) {
  .p-top-reason {
    padding-block: 2.5rem 2.9375rem;
  }
}

.p-top-reason__list {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 2rem;
  margin-block-start: 2.875rem;
}
@media (min-width: 768px) {
  .p-top-reason__list {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    gap: 2.5rem min(5rem, 5%);
    margin-block-start: 2.5rem;
  }
}

.p-top-reason__item {
  width: 100%;
  text-align: center;
}
@media (min-width: 768px) {
  .p-top-reason__item {
    flex: 0 1 20.6875rem;
  }
}

.p-top-reason__img {
  width: 10rem;
  margin-inline: auto;
  aspect-ratio: 1/1;
}
@media (min-width: 768px) {
  .p-top-reason__img {
    width: 12.5rem;
  }
}

.p-top-reason__title {
  margin-block-start: 0.75rem;
  color: #0a5da7;
  font-size: max(1rem, 12.8px);
}
@media (min-width: 0px) {
  .p-top-reason__title {
    font-size: 1rem;
  }
}
.p-top-reason__title {
  font-weight: 500;
  line-height: 1.5;
}
@media (min-width: 768px) {
  .p-top-reason__title {
    margin-block-start: 0.0625rem;
    font-size: max(1.25rem, 16px);
    font-weight: 500;
    line-height: 1.4;
  }
}
@media (min-width: 768px) and (min-width: 0px) {
  .p-top-reason__title {
    font-size: 1.25rem;
  }
}

.p-top-reason__text {
  margin-block-start: 0.375rem;
  color: #606060;
  font-size: max(0.875rem, 11.2px);
}
@media (min-width: 0px) {
  .p-top-reason__text {
    font-size: 0.875rem;
  }
}
.p-top-reason__text {
  font-weight: 400;
  line-height: 1.7142857143;
}
@media (min-width: 768px) {
  .p-top-reason__text {
    margin-block-start: 0.25rem;
    font-size: max(1rem, 12.8px);
    font-weight: 400;
    line-height: 1.75;
  }
}
@media (min-width: 768px) and (min-width: 0px) {
  .p-top-reason__text {
    font-size: 1rem;
  }
}

/*----------------------------------
  products（XD: export_0016）
-----------------------------------*/
.p-top-products {
  overflow: hidden;
  padding-block: 5.125rem 1.3125rem;
}
@media (min-width: 768px) {
  .p-top-products {
    padding-block: 7.5rem 2.5rem;
  }
}
.p-top-products .c-product-slider {
  margin-block-start: 3.75rem;
}
@media (min-width: 768px) {
  .p-top-products .c-product-slider {
    margin-block-start: 2.5rem;
  }
}

/*----------------------------------
  こんなご相談はお任せください（XD: export_0017）
-----------------------------------*/
.p-top-consult {
  padding-block: 2.5rem 3.1875rem;
  background-color: #f4f6fc;
}
@media (min-width: 768px) {
  .p-top-consult {
    padding-block: 2rem 3.5625rem;
  }
}

.p-top-consult__list {
  display: flex;
  flex-direction: column;
  row-gap: 2.0625rem;
  margin-block-start: 1.875rem;
  padding-inline: 1.125rem;
}
@media (min-width: 768px) {
  .p-top-consult__list {
    row-gap: 2.5rem;
    width: min(100%, 40.75rem);
    margin-inline: auto;
    padding-inline: 0;
  }
}

.p-top-consult__item {
  position: relative;
  padding-inline-start: 2.3125rem;
  padding-block-end: 0.8125rem;
  color: #0a5da7;
  border-bottom: 2px solid #0a5da7;
  font-size: max(1rem, 12.8px);
}
@media (min-width: 0px) {
  .p-top-consult__item {
    font-size: 1rem;
  }
}
.p-top-consult__item {
  font-weight: 500;
  line-height: 1.75;
}
@media (min-width: 768px) {
  .p-top-consult__item {
    padding-inline-start: 3.375rem;
    padding-block-end: 0.875rem;
    font-size: max(1.125rem, 14.4px);
    font-weight: 500;
    line-height: 1.6111111111;
  }
}
@media (min-width: 768px) and (min-width: 0px) {
  .p-top-consult__item {
    font-size: 1.125rem;
  }
}
.p-top-consult__item::before {
  content: "";
  position: absolute;
  top: 0.1875rem;
  left: 0;
  width: 1.375rem;
  aspect-ratio: 33/28;
  background: url("https://tadmngt.com/system_panel/uploads/images/icon-check.png") no-repeat center/contain;
  pointer-events: none;
}
@media (min-width: 768px) {
  .p-top-consult__item::before {
    top: 0;
    width: 2.0625rem;
  }
}

/*----------------------------------
  CTA（XD: export_0018）
-----------------------------------*/
.p-top-cta {
  padding-block-start: 3.3125rem;
}
@media (min-width: 768px) {
  .p-top-cta {
    padding-block-start: 4rem;
  }
}

/*----------------------------------
  company（XD: export_0019）
-----------------------------------*/
.p-top-company {
  padding-block: 8.1875rem 7.4375rem;
}
@media (min-width: 768px) {
  .p-top-company {
    padding-block: 7.5rem 13.9375rem;
  }
}

.p-top-company__contents {
  margin-block-start: 2.25rem;
}
@media (min-width: 768px) {
  .p-top-company__contents {
    margin-block-start: 2.5rem;
  }
}
@media (min-width: 1024px) {
  .p-top-company__contents {
    display: grid;
    grid-template-columns: minmax(0, 39.9375rem) minmax(0, 39.0625rem);
    justify-content: space-between;
    align-items: start;
    column-gap: min(5rem, 6%);
  }
}

.p-top-company__img {
  overflow: hidden;
  width: 21.875rem;
  border-radius: 0.75rem;
  aspect-ratio: 350/207;
}
@media (min-width: 768px) {
  .p-top-company__img {
    width: min(100%, 39.9375rem);
    margin-inline: auto;
    border-radius: 1.25rem;
    aspect-ratio: 639/378;
  }
}
@media (min-width: 1024px) {
  .p-top-company__img {
    margin-inline: 0;
  }
}

.p-top-company__body {
  margin-block-start: 1.9375rem;
}
@media (min-width: 768px) {
  .p-top-company__body {
    width: min(100%, 47.5rem);
    margin-block-start: 2.25rem;
    margin-inline: auto;
  }
}
@media (min-width: 1024px) {
  .p-top-company__body {
    width: auto;
    margin-block-start: 0;
    margin-inline: 0;
  }
}

.p-top-company__lead {
  color: #0a5da7;
  font-size: max(1.125rem, 14.4px);
}
@media (min-width: 0px) {
  .p-top-company__lead {
    font-size: 1.125rem;
  }
}
.p-top-company__lead {
  font-weight: 500;
  line-height: 1.7777777778;
}
@media (min-width: 768px) {
  .p-top-company__lead {
    font-size: max(1.5rem, 19.2px);
    font-weight: 500;
    line-height: 1.3333333333;
  }
}
@media (min-width: 768px) and (min-width: 0px) {
  .p-top-company__lead {
    font-size: 1.5rem;
  }
}

.p-top-company__text {
  margin-block-start: 0.875rem;
  color: #606060;
  font-size: max(0.875rem, 11.2px);
}
@media (min-width: 0px) {
  .p-top-company__text {
    font-size: 0.875rem;
  }
}
.p-top-company__text {
  font-weight: 400;
  line-height: 1.7142857143;
}
@media (min-width: 768px) {
  .p-top-company__text {
    margin-block-start: 1.25rem;
    font-size: max(1rem, 12.8px);
    font-weight: 400;
    line-height: 1.75;
  }
}
@media (min-width: 768px) and (min-width: 0px) {
  .p-top-company__text {
    font-size: 1rem;
  }
}

.p-top-company__btn {
  margin-block-start: 3rem;
}
@media (min-width: 768px) {
  .p-top-company__btn {
    margin-block-start: 2rem;
  }
}

/*----------------------------------
  縦横比を固定した画像枠（reset の img{height:auto} を上書き）
-----------------------------------*/
.p-top-company__img img {
  height: 100%;
  object-fit: cover;
}

/*----------------------------------
  改行（br）
  CMS では br にクラスを指定できないため、親要素から入れ子で指定する
  SP 用・PC 用の改行が混在する箇所は、何番目の br かで指定する
-----------------------------------*/
.p-top-about__lead br {
  display: none;
}

.p-top-about__lead br:nth-of-type(1) {
  display: inline;
}
@media (min-width: 768px) {
  .p-top-about__lead br:nth-of-type(1) {
    display: none;
  }
}

@media (min-width: 768px) {
  .p-top-about__lead br:nth-of-type(2),
  .p-top-about__lead br:nth-of-type(4) {
    display: inline;
  }
}


@media (min-width: 768px) {
  .p-top-about__text br:nth-of-type(-n + 2) {
    display: inline;
  }
}

@media (min-width: 768px) {
  .p-top-consult__item br {
    display: none;
  }
}

@media (min-width: 768px) {
  .p-top-company__text br:nth-of-type(1),
  .p-top-company__text br:nth-of-type(3) {
    display: none;
  }
}

.p-top-company__text br:nth-of-type(2),
.p-top-company__text br:nth-of-type(7) {
  display: none;
}
@media (min-width: 768px) {
  .p-top-company__text br:nth-of-type(2),
  .p-top-company__text br:nth-of-type(7) {
    display: inline;
  }
}