@charset "UTF-8";
.mincho {
  font-family: var(--font-serif);
}

.sans {
  font-family: var(--font-sans);
}

.en {
  font-family: var(--font-en);
}

.green {
  color: var(--color-green);
  font-weight: 500;
}

.pink {
  color: var(--color-pink);
}

.suseco p {
  font-feature-settings: normal;
}
.suseco img {
  display: inline;
}
.suseco-kv {
  background: url(../img/suseco/kv_sp.webp) no-repeat center top/cover;
  aspect-ratio: 375/380;
}
@media screen and (min-width: 768px) {
  .suseco-kv {
    aspect-ratio: 1600/467;
    background-image: url(../img/suseco/kv.webp);
  }
}
.suseco-kv h1 {
  padding-top: 25.3333333333vw;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .suseco-kv h1 {
    padding-top: 9.4rem;
  }
}
.suseco-kv img {
  width: 89.8666666667vw;
}
@media screen and (min-width: 768px) {
  .suseco-kv img {
    width: 54rem;
  }
}
.suseco-kv .breadclumbs {
  margin-top: 0;
  padding-top: 1.2rem;
  color: #fff;
}
.suseco-kv .breadclumbs li {
  opacity: 1;
}
.suseco-kv .breadclumbs a {
  color: currentColor;
}
@media screen and (min-width: 768px) {
  .suseco-inner {
    max-width: 143.4rem;
    margin: 0 auto;
  }
}
@media screen and (min-width: 768px) {
  .suseco-wrap {
    max-width: 143.4rem;
    margin: 0 auto;
    padding: 0 4.5rem;
  }
}
.suseco-about {
  background: url(../img/suseco/block1_bg_sp.webp) no-repeat center top/cover;
  padding: 21.3333333333vw 0;
}
@media screen and (min-width: 768px) {
  .suseco-about {
    padding: 12rem 0 13rem;
    background-image: url(../img/suseco/block1_bg.webp);
  }
}
.suseco-about_block {
  display: flex;
  flex-direction: column;
  row-gap: 13.3333333333vw;
}
@media screen and (min-width: 768px) {
  .suseco-about_block {
    row-gap: 0;
    justify-content: space-between;
  }
}
.suseco-about_block figure img {
  filter: drop-shadow(0 2.6666666667vw 8vw rgba(4, 0, 0, 0.1));
}
@media screen and (min-width: 768px) {
  .suseco-about_block figure img {
    filter: drop-shadow(0 1rem 3rem rgba(4, 0, 0, 0.1));
  }
}
@media screen and (min-width: 768px) {
  .suseco-about_block:nth-child(odd) {
    flex-direction: row-reverse;
  }
}
@media screen and (min-width: 768px) {
  .suseco-about_block:nth-child(even) {
    flex-direction: row;
  }
}
@media screen and (min-width: 768px) {
  .suseco-about_block-1 {
    align-items: flex-end;
  }
}
.suseco-about_block-1 figure {
  padding-left: 5.3333333333vw;
  display: flex;
  flex-direction: column;
  row-gap: 12.2666666667vw;
}
@media screen and (min-width: 768px) {
  .suseco-about_block-1 figure {
    padding-left: 0;
    row-gap: 5.6rem;
    transform: translateY(1rem);
  }
}
.suseco-about_block-1 figure img {
  width: 80vw;
}
@media screen and (min-width: 768px) {
  .suseco-about_block-1 figure img {
    width: 36rem;
  }
}
.suseco-about_block-1 figure img:first-child {
  margin-left: auto;
}
@media screen and (min-width: 768px) {
  .suseco-about_block-1 figure img:last-child {
    margin-right: 13rem;
  }
}
.suseco-about_block-2 {
  margin-top: 32vw;
}
@media screen and (min-width: 768px) {
  .suseco-about_block-2 {
    margin-top: 15rem;
  }
}
.suseco-about_block-2 > figure {
  text-align: center;
}
@media screen and (min-width: 768px) {
  .suseco-about_block-2 > figure {
    width: 40rem;
    text-align: left;
    margin-left: 4.4rem;
  }
}
.suseco-about_block-2 > figure img {
  width: 72.8vw;
}
@media screen and (min-width: 768px) {
  .suseco-about_block-2 > figure img {
    width: 40rem;
  }
}
@media screen and (min-width: 768px) {
  .suseco-about_block-2 .suseco-about_contents {
    margin-top: 8rem;
  }
}
.suseco-about_block-3 {
  margin-top: 21.3333333333vw;
}
@media screen and (min-width: 768px) {
  .suseco-about_block-3 {
    margin-top: 10rem;
    align-items: center;
  }
}
@media screen and (min-width: 768px) {
  .suseco-about_block-3 figure {
    padding-right: 4.5rem;
  }
}
.suseco-about_block-3 figure img {
  width: 94.9333333333vw;
}
@media screen and (min-width: 768px) {
  .suseco-about_block-3 figure img {
    width: 50.8rem;
  }
}
.suseco-about_contents {
  background-color: #fff;
  margin: 0 5.0666666667vw;
  position: relative;
  padding: 10.6666666667vw 5.3333333333vw 13.3333333333vw;
  filter: drop-shadow(0 2.6666666667vw 8vw rgba(4, 0, 0, 0.1));
  border-top: 1.3333333333vw solid #EFF4F5;
  font-family: var(--font-serif);
}
@media screen and (min-width: 768px) {
  .suseco-about_contents {
    width: 80rem;
    margin: 0;
    padding: 5.5rem 8rem 7rem;
    filter: drop-shadow(0 1rem 3rem rgba(4, 0, 0, 0.1));
    border-top-width: 0.5rem;
  }
}
.suseco-about_contents:before {
  content: "";
  width: 16.5333333333vw;
  height: 1.3333333333vw;
  background-color: var(--color-green);
  position: absolute;
  top: -1.3333333333vw;
  left: 0;
}
@media screen and (min-width: 768px) {
  .suseco-about_contents:before {
    width: 16rem;
    height: 0.5rem;
    top: -0.5rem;
  }
}
.suseco-about_contents h2 {
  display: flex;
  flex-direction: column;
}
.suseco-about_contents h2 small {
  font-size: 2.6666666667vw;
  color: var(--color-pink);
  font-weight: 600;
  letter-spacing: 0.4em;
}
@media screen and (min-width: 768px) {
  .suseco-about_contents h2 small {
    font-size: 1.2rem;
  }
}
.suseco-about_contents h2 strong {
  font-size: 6.9333333333vw;
  font-weight: 400;
  line-height: 1.4;
  margin: 2.6666666667vw 0 8vw;
  color: var(--color-green);
}
@media screen and (min-width: 768px) {
  .suseco-about_contents h2 strong {
    font-size: 4rem;
    margin: 1.5rem 0 4.8rem;
    line-height: 1.5;
  }
}
.suseco-about_contents h2 strong i {
  font-style: normal;
  text-indent: -4.2666666667vw;
  display: inline-block;
}
@media screen and (min-width: 768px) {
  .suseco-about_contents h2 strong i {
    text-indent: -2.2rem;
  }
}
.suseco-about_contents p {
  font-size: 3.4666666667vw;
  line-height: 2;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 768px) {
  .suseco-about_contents p {
    font-size: 1.5rem;
    line-height: 2.1;
  }
}
.suseco-about_contents p .pink {
  font-weight: 500;
}
.suseco-about_contents p + p {
  margin-top: 4vw;
}
@media screen and (min-width: 768px) {
  .suseco-about_contents p + p {
    margin-top: 2.5rem;
  }
}
.suseco-about_contents h3 {
  font-size: 5.8666666667vw;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 9.3333333333vw;
  color: var(--color-green);
}
@media screen and (min-width: 768px) {
  .suseco-about_contents h3 {
    font-size: 3.2rem;
    margin-bottom: 3rem;
  }
}
.suseco-about_list {
  width: 61.3333333333vw;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  row-gap: 9.8666666667vw;
}
@media screen and (min-width: 768px) {
  .suseco-about_list {
    width: fit-content;
    gap: 0 1.6rem;
    flex-direction: row;
  }
}
.suseco-about_list li {
  counter-increment: num;
  position: relative;
}
@media screen and (min-width: 768px) {
  .suseco-about_list li {
    width: 20.3rem;
  }
}
.suseco-about_list li:before {
  content: counter(num);
  width: 9.6vw;
  height: 9.6vw;
  font-size: 6.6666666667vw;
  font-family: var(--font-en);
  color: #fff;
  background-color: var(--color-green);
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (min-width: 768px) {
  .suseco-about_list li:before {
    width: 3.6rem;
    height: 3.6rem;
    font-size: 2.4rem;
  }
}
.suseco-about_list li figure {
  background-color: #EFF4F5;
}
.suseco-about_list li figure img {
  width: 100%;
}
.suseco-about_list li h4 {
  text-align: center;
  font-size: 4.2666666667vw;
  font-weight: 500;
  font-family: var(--font-sans);
  line-height: 1.5;
  margin-top: 2.6666666667vw;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 768px) {
  .suseco-about_list li h4 {
    font-size: 1.8rem;
    margin-top: 2rem;
  }
}
.suseco-about_list li h4 span {
  font-weight: 700;
}

.reason {
  padding: 21.3333333333vw 0 0;
}
@media screen and (min-width: 768px) {
  .reason {
    padding: 12rem 0;
  }
}
.reason_head {
  margin-bottom: 11.4666666667vw;
}
@media screen and (min-width: 768px) {
  .reason_head {
    margin-bottom: 2rem;
  }
}
.reason_head h2 {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 2.1333333333vw;
  margin-bottom: 4vw;
}
@media screen and (min-width: 768px) {
  .reason_head h2 {
    row-gap: 1rem;
    margin-bottom: 3rem;
  }
}
.reason_head h2 small {
  font-size: 2.6666666667vw;
  font-weight: 600;
  letter-spacing: 0.4em;
  color: var(--color-pink);
}
@media screen and (min-width: 768px) {
  .reason_head h2 small {
    font-size: 1.2rem;
  }
}
.reason_head h2 strong {
  font-size: 6.9333333333vw;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.6;
  color: var(--color-green);
}
@media screen and (min-width: 768px) {
  .reason_head h2 strong {
    font-size: 4rem;
    letter-spacing: 0.1em;
  }
}
.reason_head h3 {
  font-size: 3.4666666667vw;
  color: var(--color-green);
  font-weight: 400;
  letter-spacing: 0.2em;
  padding: 1.6vw;
  text-align: center;
  width: 79.2vw;
  margin: 0 auto;
  border-top: 1px solid var(--color-green);
  border-bottom: 1px solid var(--color-green);
}
@media screen and (min-width: 768px) {
  .reason_head h3 {
    font-size: 1.4rem;
    padding: 0.6rem 0;
    width: 30rem;
  }
}
.reason_main {
  position: relative;
}
.reason_main figure img {
  width: 100%;
}
.reason_pop {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: 0.3s;
}
@media screen and (max-width: 767px) {
  .reason_pop {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  .reason_pop {
    border: 1px solid var(--color-green);
    background: #EFF4F5;
    position: relative;
    padding: 1.5rem;
    width: 38rem;
    text-align: center;
  }
}
.reason_pop a {
  display: block;
}
.reason_pop .num {
  width: 3.6rem;
  height: 3.6rem;
  background-color: var(--color-green);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  font-size: 2.6rem;
  font-weight: 800;
  font-family: var(--font-en);
}
.reason_pop .pop_close {
  width: 3.2rem;
  height: 3.2rem;
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  outline: 0;
  padding: 0;
  position: absolute;
  top: -1.6rem;
  right: -1.6rem;
  z-index: 1;
  background-color: transparent;
  cursor: pointer;
}
.reason_pop h4 {
  font-size: 2rem;
  line-height: 1.5;
  color: var(--color-green);
  letter-spacing: 0.1em;
  margin-bottom: 0.5rem;
}
.reason_pop p {
  font-size: 1.3rem;
  color: var(--color-green);
  margin-bottom: 1.2rem;
  line-height: 1.46;
}
.reason_num {
  background: url(../img/suseco/mag_glass.svg) no-repeat center/100% auto;
  font-family: var(--font-en);
  font-weight: 800;
  color: var(--color-pink);
  font-family: var(--font-en);
  width: 14.4vw;
  height: 14.4vw;
  font-size: 5.3333333333vw;
  padding: 0 2.1333333333vw 2.4vw 0;
  cursor: pointer;
}
@media screen and (min-width: 768px) {
  .reason_num {
    width: 9.3rem;
    height: 9.3rem;
    font-size: 3rem;
    padding: 0 1.5rem 1.5rem 0;
    margin: 1.7rem 0 0 10rem;
    pointer-events: visible;
  }
}
@media (hover) {
  .reason_num:hover {
    opacity: 0.7;
  }
}
.reason_item {
  position: absolute;
}
@media screen and (min-width: 768px) {
  .reason_item {
    pointer-events: none;
  }
}
.reason_item.active .reason_pop {
  opacity: 1;
  visibility: visible;
  pointer-events: visible;
}
.reason_item1 {
  top: 16vw;
  left: 16vw;
}
@media screen and (min-width: 768px) {
  .reason_item1 {
    top: 10.5rem;
    left: 18.5rem;
  }
}
.reason_item2 {
  top: 33.8666666667vw;
  right: 15.2vw;
}
@media screen and (min-width: 768px) {
  .reason_item2 {
    top: 37rem;
    right: 5.7rem;
  }
}
.reason_item3 {
  bottom: -0.8vw;
  left: 28.5333333333vw;
}
@media screen and (min-width: 768px) {
  .reason_item3 {
    bottom: 5.2rem;
    left: 42.8rem;
    z-index: 2;
  }
}
@media screen and (min-width: 768px) {
  .reason_item3 .reason_pop {
    transform: translateX(-14rem);
  }
}
.reason_item4 {
  top: 22.9333333333vw;
  left: 48vw;
}
@media screen and (min-width: 768px) {
  .reason_item4 {
    top: 18.6rem;
    left: 60.8rem;
    z-index: 1;
  }
}
.reason_item5 {
  top: 4vw;
  left: 49.6vw;
}
@media screen and (min-width: 768px) {
  .reason_item5 {
    top: -6.5rem;
    left: 60.8rem;
  }
}
.reason_item6 {
  bottom: -0.8vw;
  right: 28.8vw;
}
@media screen and (min-width: 768px) {
  .reason_item6 {
    bottom: 5.2rem;
    right: 26.8rem;
  }
}
.reason_item7 {
  bottom: 13.6vw;
  left: 41.3333333333vw;
}
@media screen and (min-width: 768px) {
  .reason_item7 {
    bottom: 21rem;
    left: 48.5rem;
    z-index: 1;
  }
}
@media screen and (min-width: 768px) {
  .reason_list {
    display: grid;
    row-gap: 6rem;
  }
}
.reason_list > li {
  border-bottom: 1px solid rgba(0, 73, 93, 0.5);
  background-color: #fff;
  counter-increment: list_num;
}
@media screen and (min-width: 768px) {
  .reason_list > li {
    border: 1px solid rgba(0, 73, 93, 0.5);
    border-radius: 0.5rem;
    overflow: hidden;
  }
}
@media screen and (min-width: 768px) {
  .reason_list > li.active .reason_list_ttl:after {
    background-image: url(../img/suseco/icon-minus.svg);
  }
}
@media screen and (max-width: 767px) {
  .reason_list > li.active .reason_list_ttl h4 small {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .reason_list > li.active .reason_list_ttl .btn_more {
    display: none;
  }
}
.reason_list_ttl {
  padding: 6.9333333333vw 5.0666666667vw 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .reason_list_ttl {
    padding: 5rem 0;
    display: grid;
    grid-template-columns: 11.3rem 1fr 9rem;
    cursor: pointer;
    background-color: #fff;
    transition: 0.3s;
  }
}
@media (hover) {
  .reason_list_ttl:hover {
    background-color: #EFF4F5;
  }
}
@media screen and (min-width: 768px) {
  .reason_list_ttl:before {
    content: counter(list_num);
    width: 4.6rem;
    height: 4.6rem;
    background-color: var(--color-green);
    color: #fff;
    font-weight: 800;
    font-family: var(--font-en);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    margin: 0.3rem 0 0 4.2rem;
  }
}
@media screen and (min-width: 768px) {
  .reason_list_ttl:after {
    content: "";
    width: 2.7rem;
    height: 2.7rem;
    background: url(../img/suseco/icon-plus.svg) no-repeat center/cover;
    margin-top: 1.7rem;
  }
}
.reason_list_ttl h4 {
  color: var(--color-green);
}
@media screen and (min-width: 768px) {
  .reason_list_ttl h4 {
    display: flex;
    flex-direction: column;
    row-gap: 0.6rem;
    padding-right: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .reason_list_ttl h4 small {
    display: none;
    font-size: 3.4666666667vw;
    margin-top: 1.2rem;
  }
}
@media screen and (min-width: 768px) {
  .reason_list_ttl h4 small {
    font-size: 1.4rem;
    letter-spacing: 0.2em;
  }
}
.reason_list_ttl h4 strong {
  font-size: 5.8666666667vw;
  font-weight: 400;
  line-height: 1.5;
  font-family: var(--font-serif);
}
@media screen and (min-width: 768px) {
  .reason_list_ttl h4 strong {
    font-size: 3rem;
    letter-spacing: 0.1em;
  }
}
@media screen and (max-width: 767px) {
  .reason_list_ttl h4::before {
    content: counter(list_num);
    width: 5.8666666667vw;
    height: 5.8666666667vw;
    background-color: var(--color-green);
    color: #fff;
    font-size: 4.2666666667vw;
    font-weight: 800;
    font-family: var(--font-en);
    display: inline-block;
    text-align: center;
    line-height: 5.8666666667vw;
    transform: translateY(-0.8vw);
    margin-right: 2.1333333333vw;
  }
}
.reason_list_ttl .btn_more {
  width: 48vw;
  font-size: 3.7333333333vw;
  height: 9.0666666667vw;
  margin-top: 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .reason_list_ttl .btn_more {
    display: none;
  }
}
.reason_list_detail {
  display: none;
}
@media screen and (min-width: 768px) {
  .reason_list_detail {
    padding: 0 3.6rem;
  }
}
.reason_list_in {
  padding: 5.0666666667vw;
  display: flex;
  flex-direction: column;
  row-gap: 16vw;
}
@media screen and (min-width: 768px) {
  .reason_list_in {
    padding: 8rem 4rem 0;
    row-gap: 8rem;
    border-top: 1px solid #7FA2AD;
  }
}
@media screen and (max-width: 767px) {
  .reason_list_close {
    padding: 8vw 0;
    display: flex;
    justify-content: center;
  }
}
@media screen and (min-width: 768px) {
  .reason_list_close {
    margin: 8rem -3.6rem 0;
    border-top: 1px solid rgba(0, 73, 93, 0.5);
  }
}
.reason_list_close button {
  -webkit-appearance: none;
  appearance: none;
  outline: none;
}
@media screen and (max-width: 767px) {
  .reason_list_close button {
    height: 9.0666666667vw;
    width: 48vw;
    background-color: var(--color-pink);
    color: #fff;
    font-size: 3.2vw;
    border-radius: 9.0666666667vw;
    letter-spacing: 0.02em;
  }
}
@media screen and (min-width: 768px) {
  .reason_list_close button {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    letter-spacing: 0.02em;
    color: var(--color-green);
    background-color: #fff;
    cursor: pointer;
    transition: 0.3s;
    font-size: 1.4rem;
    column-gap: 1.5rem;
    padding: 1.4rem 0;
  }
}
@media (hover) {
  .reason_list_close button:hover {
    background-color: #EFF4F5;
  }
}
.reason_list_close button:after {
  content: "";
  width: 3.2vw;
  height: 3.2vw;
  background: url(../img/suseco/icon-minus.svg) no-repeat center/100% auto;
}
@media screen and (min-width: 768px) {
  .reason_list_close button:after {
    width: 1.2rem;
    height: 1.2rem;
  }
}
.reason_footer {
  background: url(../img/suseco/consultation_bg_sp.webp) no-repeat center/cover;
  padding: 14.6666666667vw 5.0666666667vw 16vw;
  margin-top: 16vw;
}
@media screen and (min-width: 768px) {
  .reason_footer {
    background-image: url(../img/suseco/consultation_bg.webp);
    padding: 6rem 0;
    margin-top: 8rem;
  }
}
.reason_footer-ttl {
  font-size: 5.0666666667vw;
  font-weight: 700;
  line-height: 1.47;
  margin-bottom: 5.3333333333vw;
  font-feature-settings: normal;
  letter-spacing: 0.02em;
  color: var(--color-green);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .reason_footer-ttl {
    font-size: 2.4rem;
    margin-bottom: 3.2rem;
  }
}
@media screen and (min-width: 768px) {
  .reason_footer .acc_def_txt {
    text-align: center;
  }
}
.reason_footer a {
  border: 1px solid var(--color-green);
  background-color: #fff;
  width: 74.6666666667vw;
  height: 13.3333333333vw;
  font-size: 3.7333333333vw;
  font-weight: 500;
  padding-left: 2.6666666667vw;
  letter-spacing: 0.02em;
  color: var(--color-green);
  border-radius: 13.3333333333vw;
  display: flex;
  justify-content: center;
  align-items: center;
  font-feature-settings: normal;
  margin: 8vw auto 0;
}
@media screen and (min-width: 768px) {
  .reason_footer a {
    width: 31.6rem;
    height: 5rem;
    font-size: 1.4rem;
    padding-left: 1rem;
    border-radius: 5rem;
    margin: 5.5rem auto 0;
  }
}
.reason_footer a:after {
  content: "";
  width: 3.2vw;
  height: 3.2vw;
  background: url(../img/suseco/icon_arrow.svg) no-repeat center/100% auto;
  margin-left: 3.7333333333vw;
}
@media screen and (min-width: 768px) {
  .reason_footer a:after {
    width: 1.2rem;
    height: 1.2rem;
    margin-left: 1.4rem;
  }
}
.reason_footer .dot_list {
  border: none;
  width: fit-content;
  margin: 0 auto;
}
.reason_footer .dot_list li {
  color: #333;
}
.reason_footer .dot_list li:before {
  background-color: #333;
}
.reason_footer .dot_list li + li {
  margin-top: 0.6rem;
}

.design_box_ttl {
  border-top: 1px solid rgba(0, 73, 93, 0.5);
  border-bottom: 1px solid rgba(0, 73, 93, 0.5);
  text-align: center;
  font-size: 4.8vw;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 2.1333333333vw 0;
  color: var(--color-green);
  margin-bottom: 6.6666666667vw;
}
@media screen and (min-width: 768px) {
  .design_box_ttl {
    font-size: 2rem;
    margin: 0 auto 3.5rem;
    width: fit-content;
    padding: 1rem 4rem;
  }
}
@media screen and (min-width: 768px) {
  .design_box .acc_def_txt {
    text-align: center;
  }
}

.img_col2 {
  margin-top: 6.6666666667vw;
  display: grid;
  gap: 8vw 0;
}
@media screen and (min-width: 768px) {
  .img_col2 {
    gap: 0 4rem;
    grid-template-columns: 1fr 1fr;
    width: fit-content;
    margin: 4.4rem auto 0;
  }
}
@media screen and (min-width: 768px) {
  .img_col2 figure {
    width: 45rem;
  }
}
.img_col2 figcaption {
  padding-top: 1.3333333333vw;
  font-size: 3.2vw;
  line-height: 2;
}
@media screen and (min-width: 768px) {
  .img_col2 figcaption {
    padding-top: 1rem;
    font-size: 1.3rem;
  }
}

.btn_more {
  width: 16rem;
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 1rem;
  margin: 0 auto;
  text-align: center;
  height: 2.8rem;
  color: #fff;
  background-color: var(--color-pink);
  border-radius: 2.8rem;
  font-size: 1.2rem;
}
.btn_more:before {
  content: "";
  width: 1.2rem;
  height: 1.2rem;
  background: url(../img/suseco/icon_more.svg) no-repeat center/100% auto;
}

.num_nav {
  color: #fff;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  column-gap: 1px;
  margin-top: 6.9333333333vw;
}
@media screen and (min-width: 768px) {
  .num_nav {
    display: none;
  }
}
.num_nav a {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 7.4666666667vw;
  font-weight: 800;
  font-family: var(--font-en);
  aspect-ratio: 1/1;
  color: #fff;
  background-color: var(--color-green);
}

.col2 {
  display: flex;
  flex-direction: column;
  gap: 8vw 0;
}
@media screen and (min-width: 768px) {
  .col2 {
    flex-direction: row;
    gap: 0 6.2rem;
    align-items: flex-start;
  }
}
.col2-img {
  position: relative;
}
@media screen and (min-width: 768px) {
  .col2-img {
    width: 45rem;
  }
}
.col2-img figure {
  position: relative;
}
.col2-img figcaption {
  position: absolute;
  right: 2.1333333333vw;
  bottom: 2.1333333333vw;
  font-size: 2.6666666667vw;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 768px) {
  .col2-img figcaption {
    right: 1rem;
    bottom: 1rem;
    font-size: 1.2rem;
  }
}
.col2-img figcaption.pos-left {
  right: auto;
  left: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .col2-img figcaption.pos-left {
    left: 1rem;
  }
}
.col2-img figcaption.c-w {
  color: #fff;
}
@media screen and (min-width: 768px) {
  .col2-main {
    flex: 1;
  }
}

@media screen and (min-width: 768px) {
  .col2-rev {
    flex-direction: row-reverse;
    align-items: flex-start;
  }
}

@media screen and (min-width: 768px) {
  .col2-center {
    align-items: center;
  }
}

.col2-wide {
  gap: 9.3333333333vw 0;
}
@media screen and (min-width: 768px) {
  .col2-wide {
    gap: 0 9.2rem;
  }
}

.col2-thin {
  gap: 8vw 0;
}
@media screen and (min-width: 768px) {
  .col2-thin {
    gap: 0 4rem;
  }
}

.col2-list + .col2-list {
  margin-top: 8vw;
}
@media screen and (min-width: 768px) {
  .col2-list + .col2-list {
    margin-top: 4rem;
  }
}

.acc_def_ttl {
  background-color: #EFF4F5;
  border-left: 3px solid var(--color-green);
  font-size: 5.0666666667vw;
  letter-spacing: 0.02em;
  font-weight: 700;
  line-height: 1.47;
  padding: 2.9333333333vw 4.5333333333vw;
  color: var(--color-green);
  letter-spacing: 0.02em;
  margin-bottom: 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .acc_def_ttl {
    font-size: 2.4rem;
    padding: 0.8rem 1.7rem;
    margin-bottom: 3rem;
  }
}
.acc_def_ttl sup {
  font-size: 2.6666666667vw;
  vertical-align: top;
}
@media screen and (min-width: 768px) {
  .acc_def_ttl sup {
    font-size: 1.2rem;
  }
}
.acc_def_txt {
  font-size: 3.4666666667vw;
  line-height: 2;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 768px) {
  .acc_def_txt {
    font-size: 1.5rem;
  }
}
.acc_def_txt + .acc_def_txt {
  margin-top: 0.8em;
}
@media screen and (min-width: 768px) {
  .acc_def_txt + .acc_def_txt {
    margin-top: 1em;
  }
}
.acc_def_txt .pink {
  font-weight: 500;
}
.acc_def_txt strong {
  font-weight: 700;
}
.acc_def_txt small {
  display: block;
  font-size: 80%;
}

.acc_def_ttl-center {
  text-align: center;
  border-top: 3px solid var(--color-green);
  border-left: none;
  padding: 2.1333333333vw 0 2.6666666667vw;
}
@media screen and (min-width: 768px) {
  .acc_def_ttl-center {
    padding: 0.6rem 0 0.8rem;
  }
}

.acc_mid_ttl {
  font-size: 4.2666666667vw;
  font-weight: 700;
  letter-spacing: 0.02em;
  display: flex;
  align-items: flex-start;
  column-gap: 2.4vw;
  color: var(--color-green);
  margin-bottom: 4.8vw;
}
@media screen and (min-width: 768px) {
  .acc_mid_ttl {
    font-size: 2rem;
    column-gap: 1rem;
    margin-bottom: 2.5rem;
  }
}
.acc_mid_ttl:before {
  content: "";
  width: 3.2vw;
  height: 3.2vw;
  background: var(--color-pink);
  border-radius: 50%;
  margin-top: 1.0666666667vw;
}
@media screen and (min-width: 768px) {
  .acc_mid_ttl:before {
    width: 1.6rem;
    height: 1.6rem;
    margin-top: 0.4rem;
  }
}

.dot_list {
  border: 1px solid var(--color-green);
  padding: 6.9333333333vw 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .dot_list {
    padding: 3.6rem 4rem;
  }
}
.dot_list li {
  font-size: 3.4666666667vw;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--color-green);
  display: grid;
  grid-template-columns: 1.6vw 1fr;
  column-gap: 1.3333333333vw;
  line-height: 2;
  font-feature-settings: normal;
}
@media screen and (min-width: 768px) {
  .dot_list li {
    font-size: 1.5rem;
    column-gap: 1rem;
    grid-template-columns: 1.5rem 1fr;
  }
}
.dot_list li + li {
  margin-top: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .dot_list li + li {
    margin-top: 1rem;
  }
}
.dot_list li:before {
  content: "";
  width: 1.6vw;
  height: 1.6vw;
  background: #00495D;
  border-radius: 50%;
  margin-top: 2.6666666667vw;
}
@media screen and (min-width: 768px) {
  .dot_list li:before {
    width: 1.5rem;
    height: 1.5rem;
    margin-top: 0.8rem;
  }
}

.img-full {
  width: 100%;
}

.img-cap {
  text-align: center;
  font-size: 3.4666666667vw;
  margin-top: 1.3333333333vw;
}
@media screen and (min-width: 768px) {
  .img-cap {
    font-size: 1.5rem;
    margin-top: 1rem;
  }
}

.img-border {
  border: 1px solid #ddd;
}

.mt-2 {
  margin-top: 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .mt-2 {
    margin-top: 1.8rem;
  }
}

.mt-3 {
  margin-top: 9.3333333333vw;
}
@media screen and (min-width: 768px) {
  .mt-3 {
    margin-top: 3.5rem;
  }
}

.mt-6 {
  margin-top: 13.3333333333vw;
}
@media screen and (min-width: 768px) {
  .mt-6 {
    margin-top: 6rem;
  }
}

.mb-3 {
  margin-bottom: 9.3333333333vw;
}
@media screen and (min-width: 768px) {
  .mb-3 {
    margin-bottom: 3.5rem;
  }
}

.border_box {
  margin-top: 8vw;
  margin-bottom: 10.1333333333vw;
}
@media screen and (min-width: 768px) {
  .border_box {
    border: 1px solid var(--color-green);
    padding: 2.2rem 3rem;
    width: fit-content;
    margin-top: 3.5rem;
    margin-bottom: 5.4rem;
  }
}
.border_box h3 {
  font-size: 3.4666666667vw;
  font-weight: 500;
  color: var(--color-green);
  margin-bottom: 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .border_box h3 {
    font-size: 1.5rem;
    margin-bottom: 1rem;
  }
}
.border_box h3 strong {
  font-size: 4.2666666667vw;
}
@media screen and (min-width: 768px) {
  .border_box h3 strong {
    font-size: 1.8rem;
  }
}
.border_box p {
  font-size: 2.6666666667vw;
  line-height: 2;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 768px) {
  .border_box p {
    font-size: 1.2rem;
  }
}

.sp-full {
  padding: 0;
}

@media screen and (max-width: 767px) {
  .scroll_table {
    overflow-x: scroll;
  }
}
.scroll_table + figure {
  margin-top: 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .scroll_table + figure {
    margin-top: 1.5rem;
  }
}
.scroll_table table {
  width: fit-content;
  white-space: nowrap;
  border: #01495D 1px solid;
  border-collapse: collapse;
}
@media screen and (min-width: 768px) {
  .scroll_table table {
    white-space: wrap;
    width: 100%;
  }
}
.scroll_table table th, .scroll_table table td {
  font-size: 3.4666666667vw;
  padding: 4.8vw 6.9333333333vw;
  text-align: center;
  border: #01495D 1px solid;
}
@media screen and (min-width: 768px) {
  .scroll_table table th, .scroll_table table td {
    font-size: 1.4rem;
    padding: 1.6rem 1.5rem;
  }
}
.scroll_table table th {
  font-weight: 700;
  color: var(--color-green);
}
.scroll_table table td:first-child {
  text-align: left;
}
.scroll_table table td strong {
  font-weight: 700;
  color: var(--color-green);
}
.scroll_table table td em {
  font-weight: 700;
}

.fit_table {
  margin-bottom: 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .fit_table {
    margin-bottom: 2rem;
  }
}
.fit_table table {
  width: fit-content;
  border: #01495D 1px solid;
  border-collapse: collapse;
}
@media screen and (min-width: 768px) {
  .fit_table table {
    width: 100%;
  }
}
.fit_table table th,
.fit_table table td {
  font-size: 3.4666666667vw;
  padding: 4.8vw 4vw;
  text-align: center;
  border: #01495D 1px solid;
  line-height: 1.46;
}
@media screen and (min-width: 768px) {
  .fit_table table th,
  .fit_table table td {
    font-size: 1.3rem;
    padding: 1.6rem 1.5rem;
  }
}
.fit_table table th {
  font-weight: 700;
  color: var(--color-green);
}
.fit_table table th:first-child {
  white-space: nowrap;
}
.fit_table table td {
  text-align: left;
}
.fit_table table td:first-child {
  white-space: nowrap;
  vertical-align: top;
}
.fit_table table td strong {
  font-weight: 700;
  color: var(--color-green);
}

@media screen and (min-width: 768px) {
  .col-center .acc_def_txt {
    text-align: center;
  }
}
@media screen and (min-width: 768px) {
  .col-center .acc_mid_ttl {
    text-align: center;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (min-width: 768px) {
  .col-center .border_box {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
}

.inner_block {
  margin-top: 7.4666666667vw;
}
@media screen and (min-width: 768px) {
  .inner_block {
    margin-top: 4.6rem;
  }
}

.txt-left {
  text-align: left !important;
}

.num_ttl {
  border-bottom: 1px solid rgba(0, 73, 93, 0.5);
  font-size: 4.8vw;
  font-weight: 700;
  color: var(--color-green);
  letter-spacing: 0.02em;
  display: grid;
  grid-template-columns: 5.8666666667vw 1fr;
  column-gap: 1.8666666667vw;
  line-height: 1.4;
  padding-bottom: 2.1333333333vw;
  margin-bottom: 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .num_ttl {
    font-size: 2rem;
    grid-template-columns: 2.2rem 1fr;
    column-gap: 0.7rem;
    padding-bottom: 1rem;
    margin-bottom: 2.2rem;
  }
}
.num_ttl span {
  width: 5.8666666667vw;
  height: 5.8666666667vw;
  font-size: 3.7333333333vw;
  font-family: var(--font-en);
  font-weight: 800;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-pink);
  border-radius: 50%;
  transform: translateY(0.2em);
}
@media screen and (min-width: 768px) {
  .num_ttl span {
    width: 2.2rem;
    height: 2.2rem;
    font-size: 1.4rem;
    transform: translateY(0.3em);
  }
}

.table_txt {
  display: grid;
  grid-template-columns: auto 1fr;
  font-size: 3.4666666667vw;
  line-height: 2;
  letter-spacing: 0.02em;
  margin-top: 1em;
  gap: 1rem 0.5rem;
}
@media screen and (min-width: 768px) {
  .table_txt {
    font-size: 1.5rem;
  }
}
.table_txt dd:before {
  content: "：";
}
.table_txt strong {
  color: var(--color-green);
  font-size: 4vw;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .table_txt strong {
    font-size: 1.8rem;
  }
}
.table_txt b {
  font-weight: 500;
}

@media screen and (min-width: 768px) {
  .fit_contents {
    width: fit-content;
    margin: 0 auto;
  }
}

.wide_img {
  text-align: center;
}
@media screen and (min-width: 768px) {
  .wide_img img {
    width: 87.9rem;
  }
}

.half_img {
  text-align: center;
  margin: 8vw 0;
}
@media screen and (min-width: 768px) {
  .half_img {
    margin: 5rem 0;
  }
}
@media screen and (min-width: 768px) {
  .half_img img {
    width: 46rem;
  }
}

@media screen and (min-width: 768px) {
  .box_ecoboron {
    width: 68rem;
    margin: 0 auto;
  }
}
.box_ecoboron .acc_mid_ttl {
  margin-left: 0;
}

.pro {
  background-color: #EFF4F5;
  padding: 20vw 0 2.1333333333vw;
}
@media screen and (min-width: 768px) {
  .pro {
    padding: 12rem 0;
  }
}
@media screen and (max-width: 767px) {
  .pro .suseco-wrap {
    padding: 0 1.9rem;
  }
}
.pro_ttl {
  display: flex;
  flex-direction: column;
  row-gap: 2.1333333333vw;
  margin-bottom: 12vw;
}
@media screen and (min-width: 768px) {
  .pro_ttl {
    row-gap: 1.3rem;
    margin-bottom: 9rem;
  }
}
.pro_ttl small {
  font-size: 2.6666666667vw;
  letter-spacing: 0.4em;
  color: var(--color-pink);
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .pro_ttl small {
    font-size: 1.2rem;
  }
}
.pro_ttl strong {
  font-size: 6.9333333333vw;
  font-weight: 400;
  line-height: 1.38;
  color: var(--color-green);
}
@media screen and (min-width: 768px) {
  .pro_ttl strong {
    font-size: 4rem;
  }
}
.pro_key {
  margin: 12.8vw 0 5.3333333333vw;
  text-align: center;
  font-size: 5.8666666667vw;
  line-height: 1.55;
  color: var(--color-green);
}
@media screen and (min-width: 768px) {
  .pro_key {
    letter-spacing: -0.02em;
  }
}
@media screen and (min-width: 768px) {
  .pro_key {
    font-size: 2.8rem;
    margin: 9rem 0 3.7rem;
  }
}
.pro_key_txt {
  font-size: 3.4666666667vw;
  line-height: 2;
  letter-spacing: 0.02em;
  font-feature-settings: normal;
}
@media screen and (min-width: 768px) {
  .pro_key_txt {
    font-size: 1.5rem;
    text-align: center;
  }
}
.pro_key_txt + .pro_key_txt {
  margin-top: 0.8em;
}
@media screen and (min-width: 768px) {
  .pro_key_txt + .pro_key_txt {
    margin-top: 1.2em;
  }
}
.pro_item {
  display: grid;
  row-gap: 2.6666666667vw;
  margin-top: 9.0666666667vw;
}
@media screen and (min-width: 768px) {
  .pro_item {
    gap: 4rem;
    grid-template-columns: 1fr 1fr;
    margin-top: 5.8rem;
  }
}
.pro_item li {
  background-color: #fff;
  border-radius: 2.6666666667vw;
  padding: 5.3333333333vw 5.6vw;
  display: grid;
  grid-template-columns: 14.9333333333vw 1fr;
  grid-template-rows: auto 1fr;
  column-gap: 5.3333333333vw;
  align-items: center;
}
@media screen and (min-width: 768px) {
  .pro_item li {
    border-radius: 1rem;
    padding: 2rem 4rem;
    grid-template-columns: 10rem 1fr;
    column-gap: 4rem;
  }
}
.pro_item li figure {
  border-right: 1px solid rgba(1, 73, 93, 0.3);
  grid-area: 1/1/3/2;
}
.pro_item li figure img {
  width: 9.6vw;
}
@media screen and (min-width: 768px) {
  .pro_item li figure img {
    width: 6rem;
  }
}
.pro_item li h4 {
  font-size: 3.4666666667vw;
  line-height: 1.7;
  font-weight: 700;
  color: var(--color-green);
  letter-spacing: 0.02em;
}
@media screen and (min-width: 768px) {
  .pro_item li h4 {
    font-size: 1.6rem;
  }
}
.pro_item li p {
  font-size: 2.6666666667vw;
  line-height: 1.4;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 768px) {
  .pro_item li p {
    font-size: 1.2rem;
  }
}
.pro_card {
  margin-top: 7.4666666667vw;
}
@media screen and (min-width: 768px) {
  .pro_card {
    margin-top: 8rem;
  }
}
.pro_card dt {
  background-color: var(--color-pink);
  color: #fff;
  font-size: 4.8vw;
  text-align: center;
  font-weight: 400;
  line-height: 1.55;
  padding: 4vw 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .pro_card dt {
    font-size: 2.4rem;
    padding: 1.5rem 2rem;
    font-feature-settings: normal;
    letter-spacing: 0.1em;
  }
}
.pro_card dd {
  background-color: #fff;
  padding: 6.9333333333vw 5.3333333333vw;
}
@media screen and (min-width: 768px) {
  .pro_card dd {
    padding: 4.6rem 4rem 5.6rem;
  }
}
.pro_card dd p {
  font-size: 3.4666666667vw;
  line-height: 2;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 768px) {
  .pro_card dd p {
    font-size: 1.5rem;
    text-align: center;
    line-height: 2.1;
  }
}
.pro_card dd p + p {
  margin-top: 1em;
}

.grid-center {
  display: grid;
  row-gap: 6.4vw;
}
@media screen and (min-width: 768px) {
  .grid-center {
    display: flex;
    align-items: center;
    gap: 0 7.3rem;
  }
}
@media screen and (min-width: 768px) {
  .grid-center dt {
    width: 64rem;
  }
}
.grid-center dt img {
  width: 100%;
}
@media screen and (min-width: 768px) {
  .grid-center dd {
    flex: 1;
  }
}
.grid-center dd h3 {
  font-size: 5.8666666667vw;
  line-height: 1.55;
  margin-bottom: 4.8vw;
  color: var(--color-green);
}
@media screen and (min-width: 768px) {
  .grid-center dd h3 {
    font-size: 2.8rem;
    margin-bottom: 5rem;
    letter-spacing: 0.1em;
  }
}
.grid-center dd p {
  font-size: 3.4666666667vw;
  line-height: 2;
  letter-spacing: 0.02em;
  font-feature-settings: normal;
}
@media screen and (min-width: 768px) {
  .grid-center dd p {
    font-size: 1.5rem;
  }
}
.grid-center dd p + p {
  margin-top: 0.8em;
}
.grid-center + .grid-center {
  margin-top: 16vw;
}
@media screen and (min-width: 768px) {
  .grid-center + .grid-center {
    margin-top: 8rem;
  }
}
@media screen and (min-width: 768px) {
  .grid-center-rev {
    flex-direction: row-reverse;
  }
}

.voice {
  padding: 21.3333333333vw 0;
}
@media screen and (min-width: 768px) {
  .voice {
    padding: 0 0 12rem;
    position: relative;
  }
}
.voice_img1 {
  margin-top: 12.5333333333vw;
}
@media screen and (min-width: 768px) {
  .voice_img1 {
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 0;
  }
}
.voice_img1 img {
  width: 89.6vw;
}
@media screen and (min-width: 768px) {
  .voice_img1 img {
    width: 61.6rem;
  }
}
.voice_block1 {
  margin: 12.5333333333vw 0 9.3333333333vw;
  display: flex;
  flex-direction: column-reverse;
  row-gap: 6.9333333333vw;
}
@media screen and (min-width: 768px) {
  .voice_block1 {
    margin: 0 auto 8rem;
    flex-direction: row-reverse;
    align-items: flex-start;
    row-gap: 0;
    max-width: 160rem;
    padding-top: 17.2rem;
  }
}
@media screen and (min-width: 768px) {
  .voice_block1 dt {
    width: 99.3rem;
  }
}
.voice_block1 dt img {
  width: 100%;
}
.voice_block1 dd {
  margin: 0 5.0666666667vw;
}
@media screen and (min-width: 768px) {
  .voice_block1 dd {
    margin: 0;
    width: 60.7rem;
    padding-left: 8.3rem;
    padding-top: 30rem;
  }
}
.voice_block1 dd h2 {
  display: flex;
  flex-direction: column;
  row-gap: 2.1333333333vw;
  margin-bottom: 7.2vw;
}
@media screen and (min-width: 768px) {
  .voice_block1 dd h2 {
    row-gap: 1rem;
    margin-bottom: 4.8rem;
    white-space: nowrap;
  }
}
.voice_block1 dd h2 small {
  color: var(--color-pink);
  font-weight: 600;
  letter-spacing: 0.4em;
  font-size: 2.6666666667vw;
}
@media screen and (min-width: 768px) {
  .voice_block1 dd h2 small {
    font-size: 1.2rem;
  }
}
.voice_block1 dd h2 strong {
  font-size: 6.9333333333vw;
  color: var(--color-green);
  font-weight: 400;
  line-height: 1.38;
}
@media screen and (min-width: 768px) {
  .voice_block1 dd h2 strong {
    font-size: 4rem;
  }
}
@media screen and (min-width: 768px) {
  .voice_block1 dd p {
    padding-right: 5.6rem;
  }
}
.voice_block2 {
  display: flex;
  flex-direction: column-reverse;
  row-gap: 10.1333333333vw;
}
@media screen and (min-width: 768px) {
  .voice_block2 {
    row-gap: 0;
    flex-direction: row;
    align-items: center;
  }
}
@media screen and (min-width: 768px) {
  .voice_block2 dt {
    width: 84rem;
  }
}
.voice_block2 dd {
  margin: 0 5.0666666667vw;
}
@media screen and (min-width: 768px) {
  .voice_block2 dd {
    margin: 0;
    flex: 1;
    padding: 0 8.3rem;
  }
}
.voice p {
  font-size: 3.4666666667vw;
  letter-spacing: 0.02em;
  line-height: 2;
}
@media screen and (min-width: 768px) {
  .voice p {
    font-size: 1.5rem;
  }
}
.voice p + p {
  margin-top: 0.8em;
}
@media screen and (min-width: 768px) {
  .voice p + p {
    margin-top: 1em;
  }
}

.start {
  background-color: #EFF4F5;
  padding: 21.3333333333vw 5.0666666667vw 18.6666666667vw;
}
@media screen and (min-width: 768px) {
  .start {
    padding: 12rem 11.5rem 10rem;
    max-width: 134.4rem;
    margin: 0 auto;
  }
}
@media screen and (min-width: 768px) {
  .start_contents {
    display: flex;
    column-gap: 13rem;
    align-items: center;
    flex-direction: row-reverse;
  }
}
@media screen and (min-width: 768px) {
  .start dt {
    width: 38.6rem;
  }
}
.start dt img {
  width: 100%;
}
.start dd {
  margin-top: 9.8666666667vw;
}
@media screen and (min-width: 768px) {
  .start dd {
    margin-top: 0;
    flex: 1;
  }
}
.start dd h2 {
  display: flex;
  flex-direction: column;
  row-gap: 2.1333333333vw;
  margin-bottom: 8vw;
}
@media screen and (min-width: 768px) {
  .start dd h2 {
    row-gap: 1rem;
    margin-bottom: 4.8rem;
    letter-spacing: 0.1em;
  }
}
.start dd h2 small {
  color: var(--color-pink);
  font-size: 2.6666666667vw;
  letter-spacing: 0.4em;
  font-weight: 600;
}
@media screen and (min-width: 768px) {
  .start dd h2 small {
    font-size: 1.2rem;
  }
}
.start dd h2 strong {
  font-size: 6.9333333333vw;
  line-height: 1.38;
  color: var(--color-green);
}
@media screen and (min-width: 768px) {
  .start dd h2 strong {
    font-size: 4rem;
  }
}
.start dd p {
  font-size: 3.4666666667vw;
  line-height: 2;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 768px) {
  .start dd p {
    font-size: 1.5rem;
  }
}
.start dd p + p {
  margin-top: 0.8em;
}

@media screen and (min-width: 768px) {
  .grid-full {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}

.suseco_contact {
  padding: 21.3333333333vw 5.0666666667vw 16vw;
}
@media screen and (min-width: 768px) {
  .suseco_contact {
    padding: 6rem 12rem;
    display: flex;
    flex-direction: column;
  }
}
.suseco_contact h2 {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 2.1333333333vw;
  padding: 4.8vw 0 4vw;
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  margin-bottom: 9.6vw;
}
@media screen and (min-width: 768px) {
  .suseco_contact h2 {
    row-gap: 1rem;
    padding: 1.9rem 0 1.5rem;
    height: 14.7rem;
    margin-bottom: 3.6rem;
  }
}
.suseco_contact h2 small {
  font-size: 2.6666666667vw;
  font-weight: 600;
  letter-spacing: 0.4em;
}
@media screen and (min-width: 768px) {
  .suseco_contact h2 small {
    font-size: 1.2rem;
  }
}
.suseco_contact h2 strong {
  font-size: 6.1333333333vw;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.6;
}
@media screen and (min-width: 768px) {
  .suseco_contact h2 strong {
    font-size: 3.2rem;
  }
}
.suseco_contact p {
  font-size: 3.4666666667vw;
  line-height: 2;
  letter-spacing: 0.02em;
}
@media screen and (min-width: 768px) {
  .suseco_contact p {
    font-size: 1.5rem;
    margin-bottom: 6.4rem;
  }
}
.suseco_contact a {
  width: 74.6666666667vw;
  margin: 8vw auto 0;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 13.3333333333vw;
  border-radius: 13.3333333333vw;
  font-size: 3.7333333333vw;
  font-weight: 500;
  column-gap: 3.7333333333vw;
}
@media screen and (min-width: 768px) {
  .suseco_contact a {
    width: 35rem;
    margin: auto auto 0;
    height: 5.7rem;
    font-size: 1.5rem;
    column-gap: 1.3rem;
  }
}
.suseco_contact a:before {
  content: "";
  width: 4.8vw;
  height: 4.8vw;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  transform: translateY(0.5333333333vw);
}
@media screen and (min-width: 768px) {
  .suseco_contact a:before {
    width: 2rem;
    height: 2rem;
    transform: translateY(0.2rem);
  }
}
.suseco_contact:first-child {
  background-color: var(--color-pink);
  color: #fff;
}
.suseco_contact:first-child a {
  color: var(--color-pink);
}
.suseco_contact:first-child a:before {
  background-image: url(../img/suseco/icon_contact.svg);
}
.suseco_contact:last-child {
  background-color: #333;
  color: #fff;
}
.suseco_contact:last-child a {
  color: #333;
}
.suseco_contact:last-child a:before {
  background-image: url(../img/suseco/icon_second.svg);
}

#suseco_contact {
  position: relative;
}
@media screen and (min-width: 768px) {
  #suseco_contact:after {
    content: "";
    width: 143.4rem;
    height: 12rem;
    margin: 0 auto;
    display: block;
    background-color: #EFF4F5;
  }
}

@keyframes scroll-hint-appear {
  0% {
    transform: translateX(40px);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  50%, 100% {
    transform: translateX(-40px);
    opacity: 0;
  }
}
.scroll-hint-icon {
  position: absolute;
  top: calc(50% - 2.5rem);
  left: calc(50% - 6rem);
  box-sizing: border-box;
  width: 7rem;
  height: auto;
  border-radius: 0.5rem;
  transition: opacity 0.3s;
  opacity: 0;
  background: rgba(0, 73, 93, 0.75);
  text-align: center;
  padding: 0.8rem 1.2rem;
}

.scroll-hint-icon-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-height: 100%;
  pointer-events: none;
}

.scroll-hint-text {
  font-size: 10px;
  color: #FFF;
  margin-top: 5px;
  display: none;
}

.scroll-hint-icon-wrap.is-active .scroll-hint-icon {
  opacity: 0.8;
}

.scroll-hint-icon:before {
  display: inline-block;
  width: 3.2rem;
  height: 4.2rem;
  color: #FFF;
  vertical-align: middle;
  text-align: center;
  content: "";
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url(../img/suseco/swipe_finger.svg);
  margin-top: 1rem;
}

.scroll-hint-icon:after {
  content: "";
  width: 4.6rem;
  height: 1rem;
  display: block;
  position: absolute;
  top: 1rem;
  left: 50%;
  margin-left: -2.3rem;
  background-repeat: no-repeat;
  background-image: url(../img/suseco/swipe_arrow.svg);
  transition-delay: 2.4s;
}

.scroll-hint-icon-wrap.is-active .scroll-hint-icon:after {
  opacity: 1;
}

.scroll-hint-icon-wrap.is-active .scroll-hint-icon:before {
  animation: scroll-hint-appear 1.2s linear;
  animation-iteration-count: 2;
}

.scroll-hint-icon-white {
  background-color: #FFF;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.4);
}

.scroll-hint-icon-white:before {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNS43NyIgaGVpZ2h0PSIzMC41MiIgdmlld0JveD0iMCAwIDI1Ljc3IDMwLjUyIj48dGl0bGU+44Ki44K744OD44OIIDQ8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxwYXRoIGQ9Ik0yMS4zMywzMC41Mkg3Ljg1QTEuNTUsMS41NSwwLDAsMSw2LjMsMjlhMTIuNDYsMTIuNDYsMCwwLDAtLjYzLTQuNDIsMjUuMTYsMjUuMTYsMCwwLDAtNC4yNS01bC0uMDYtLjA2QTUsNSwwLDAsMSwwLDE1Ljg2YTMuNjQsMy42NCwwLDAsMSwxLjE3LTIuNjIsMy42MywzLjYzLDAsMCwxLDUuMTQuMDdWMy43N2EzLjc3LDMuNzcsMCwxLDEsNy41NCwwVjguMzNhMy4zNSwzLjM1LDAsMCwxLDEuMjYsMCwzLDMsMCwwLDEsMiwxLjIyLDMuNSwzLjUsMCwwLDEsMi0uMDYsMy4yMSwzLjIxLDAsMCwxLDIsMS41NCwzLjc0LDMuNzQsMCwwLDEsMywuNDdBNC4yMSw0LjIxLDAsMCwxLDI1Ljc0LDE1YzAsLjExLDAsLjI3LDAsLjQ2YTE5LjI2LDE5LjI2LDAsMCwxLS44NCw3Yy0uMTQuMzgtLjM2LjgxLS41NiwxLjIybC0uMTEuMjJjMCwuMDctLjA5LjE0LS4xNC4yMWE3LjEzLDcuMTMsMCwwLDAtMS4xNywyLjE3Yy0uMDYuNTYtLjA2LDIuMTUtLjA1LDIuNzFBMS41NSwxLjU1LDAsMCwxLDIxLjMzLDMwLjUyWk04LjYxLDI4LjIxaDEyYzAtLjcxLDAtMS43MS4wNy0yLjIzYTguNzQsOC43NCwwLDAsMSwxLjU5LTMuMjVsLjA2LS4xMmExMCwxMCwwLDAsMCwuNDYtMSwxNi44LDE2LjgsMCwwLDAsLjctNi4xMmMwLS4yMywwLS40MSwwLS41NGgwYTIsMiwwLDAsMC0uNjQtMS41MiwxLjMzLDEuMzMsMCwwLDAtMS41NS4wOCwxLjEzLDEuMTMsMCwwLDEtMS4xOC4yOCwxLjE1LDEuMTUsMCwwLDEtLjc4LS45NCwxLjI2LDEuMjYsMCwwLDAtLjc1LTEuMTEsMSwxLDAsMCwwLTEuMTEuMjhsLS4xLjFhMS4xNSwxLjE1LDAsMCwxLTEuMTkuMjksMS4xNiwxLjE2LDAsMCwxLS43OC0uOTVjLS4wOS0uNjgtLjIxLS43Ny0uNy0uODdhLjgyLjgyLDAsMCwwLTEsLjQ4LDEuMTYsMS4xNiwwLDAsMS0yLjE2LS41OFYzLjc3YTEuNDYsMS40NiwwLDEsMC0yLjkyLDB2Ny44NWwwLDQuMzNhMS4xNywxLjE3LDAsMCwxLS44MywxLjExLDEuMTUsMS4xNSwwLDAsMS0xLjItLjM1bC0xLS45MWMtLjQ3LS40Mi0uNzMtLjY2LS44NC0uNzdhMS4zNSwxLjM1LDAsMCwwLTItLjEyTDIuNywxNWExLjMyLDEuMzIsMCwwLDAtLjM5LDFBMi41NywyLjU3LDAsMCwwLDMsMTcuODVsMCwwYTI3LjI0LDI3LjI0LDAsMCwxLDQuNyw1LjYyQTEyLjYzLDEyLjYzLDAsMCwxLDguNjEsMjguMjFaTTIzLjIsMjMuMzVaTTYuNTEsMTYuNTlaIi8+PC9nPjwvZz48L3N2Zz4=);
}

.scroll-hint-icon-white:after {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMy4yOSIgaGVpZ2h0PSIxMi4wMiIgdmlld0JveD0iMCAwIDMzLjI5IDEyLjAyIj48dGl0bGU+44Ki44K744OD44OIIDI8L3RpdGxlPjxnIGlkPSLjg6zjgqTjg6Tjg7xfMiIgZGF0YS1uYW1lPSLjg6zjgqTjg6Tjg7wgMiI+PGcgaWQ9IuODrOOCpOODpOODvF8xLTIiIGRhdGEtbmFtZT0i44Os44Kk44Ok44O8IDEiPjxsaW5lIHgxPSIxLjg1IiB5MT0iNi4wMSIgeDI9IjEwLjQiIHkyPSI2LjAxIi8+PHBhdGggZD0iTTEwLjQsNy4xN0gxLjg1YTEuMTYsMS4xNiwwLDEsMSwwLTIuMzFIMTAuNGExLjE2LDEuMTYsMCwxLDEsMCwyLjMxWiIvPjxwYXRoIGQ9Ik03LjQsMTJhMS4xNSwxLjE1LDAsMCwxLS43Mi0uMjVsLTYuMjUtNUExLjIsMS4yLDAsMCwxLDAsNS44NywxLjE0LDEuMTQsMCwwLDEsLjQ2LDVMNi43LjIzQTEuMTYsMS4xNiwwLDAsMSw4LjEsMi4wOEwzLDUuOTEsOC4xMiwxMEExLjE2LDEuMTYsMCwwLDEsNy40LDEyWiIvPjxsaW5lIHgxPSIzMS40NSIgeTE9IjYuMDEiIHgyPSIyMi44OSIgeTI9IjYuMDEiLz48cGF0aCBkPSJNMzEuNDUsNy4xN0gyMi44OWExLjE2LDEuMTYsMCwxLDEsMC0yLjMxaDguNTZhMS4xNiwxLjE2LDAsMCwxLDAsMi4zMVoiLz48cGF0aCBkPSJNMjUuOSwxMmExLjE4LDEuMTgsMCwwLDEtLjkxLS40M0ExLjE3LDEuMTcsMCwwLDEsMjUuMTcsMTBsNS4wOS00LjA1TDI1LjIsMi4wOEExLjE2LDEuMTYsMCwwLDEsMjYuNTkuMjNMMzIuODQsNWExLjE2LDEuMTYsMCwwLDEsLjQ1LjkxLDEuMTQsMS4xNCwwLDAsMS0uNDMuOTJsLTYuMjQsNUExLjE3LDEuMTcsMCwwLDEsMjUuOSwxMloiLz48L2c+PC9nPjwvc3ZnPg==);
}

.scroll-hint-icon-white .scroll-hint-text {
  color: #000;
}

.scroll-hint-shadow-wrap {
  position: relative;
}

.scroll-hint-shadow-wrap::after {
  content: "";
  width: 20px;
  height: 100%;
  background: linear-gradient(270deg, rgba(0, 0, 0, 0.15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
  position: absolute;
  top: 0;
  right: 0;
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}

.scroll-hint-shadow-wrap::before {
  content: "";
  width: 20px;
  height: 100%;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}

.scroll-hint-shadow-wrap:has(.scroll-hint.is-right-scrollable)::after,
.scroll-hint-shadow-wrap.is-right-scrollable::after {
  opacity: 1;
  visibility: visible;
}

.scroll-hint-shadow-wrap:has(.scroll-hint.is-left-scrollable)::before,
.scroll-hint-shadow-wrap.is-left-scrollable::before {
  opacity: 1;
  visibility: visible;
}/*# sourceMappingURL=suseco.css.map */