@charset "UTF-8";
/*==========================================
変数 inc.scss
===========================================*/
/*==========================================
変数 fonts.scss
===========================================*/
/*===================================
userSS 追加
=====================================*/
/*==========================================
　共通
===========================================*/
.sec-ttlR {
  text-align: center;
  font-size: clamp(2rem, 2.8vw, 3.6rem);
  font-weight: bold;
  letter-spacing: 0.2em;
  margin-bottom: clamp(40px, 8vw, 80px); }

.sec-ttlR_en {
  text-align: center;
  font-family: "Poppins", "Noto Sans JP", "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
  font-size: clamp(3rem, 5vw, 6.9rem);
  letter-spacing: 0.1em;
  font-weight: 500;
  line-height: 1;
  margin-bottom: clamp(40px, 8vw, 80px); }

/*==========================================
　FV
===========================================*/
.fv-block {
  background: url("../img/real-estate/mainimg.jpg") no-repeat center/cover;
  overflow-x: clip; }
  .fv-block .wrapW-L {
    position: relative; }
  .fv-block .deco-txt {
    position: absolute;
    right: 0;
    top: 0;
    font-family: "Poppins", "Noto Sans JP", "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
    -webkit-text-stroke: 1px #fff;
    line-height: 1;
    color: transparent;
    font-weight: 500;
    font-size: clamp(6rem, 10vw, 20rem);
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl; }
    .fv-block .deco-txt span {
      display: block; }
  .fv-block .fv-main {
    text-align: center;
    padding: clamp(40px, 8vw, 80px) 0 clamp(150px, 25vw, 250px); }
  .fv-block .fv-logo {
    max-width: 290px;
    width: 26%;
    padding: 2% 3.5%;
    margin: 0 auto clamp(25px, 4vw, 40px);
    background: #fff; }
  .fv-block .fv-lead {
    text-align: center;
    font-size: clamp(1.6rem, 2.8vw, 3.6rem);
    letter-spacing: 0.2em;
    font-weight: bold; }
    .fv-block .fv-lead .lead-txt:not(:last-child) {
      margin-bottom: 0.3em; }
    .fv-block .fv-lead .lead-txt .bg {
      display: inline-block;
      position: relative;
      color: #fff;
      padding: 0.1em 0.5em; }
      .fv-block .fv-lead .lead-txt .bg::before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 0;
        height: 100%;
        transition: 0.3s ease-in-out;
        background: #c1bcad; }
    .fv-block .fv-lead .lead-txt .txt {
      position: relative;
      opacity: 0;
      transition: 0.3s ease-in-out; }
    .fv-block .fv-lead .lead-txt.show .bg::before {
      width: 100%; }
    .fv-block .fv-lead .lead-txt.show .txt {
      opacity: 1;
      transition-delay: 0.9s; }

/*==========================================
　工務店が不動産をやると、
  ここまでスムーズになる。
===========================================*/
.sec-promise {
  margin-top: clamp(80px, 15vw, 150px); }
  .sec-promise .promise-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; }
    .sec-promise .promise-list .promise-item {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 32%;
      max-width: 510px;
      border-radius: 50px;
      border: 0px solid #000;
      box-shadow: 0px 0px 10px 0px rgba(136, 155, 124, 0.8);
      padding: clamp(20px, 4vw, 60px) 2%;
      font-size: clamp(1.6rem, 1.8vw, 3rem);
      line-height: 1.8;
      font-weight: bold;
      text-align: center; }
      .sec-promise .promise-list .promise-item:not(:nth-of-type(3n+1)) {
        margin-left: 2%; }
      .sec-promise .promise-list .promise-item:nth-of-type(n+4) {
        margin-top: 2%; }
      @media screen and (max-width: 960px) {
        .sec-promise .promise-list .promise-item {
          width: 48%;
          max-width: none; }
          .sec-promise .promise-list .promise-item:not(:nth-of-type(3n+1)) {
            margin-left: 0; }
          .sec-promise .promise-list .promise-item:nth-of-type(2n) {
            margin-left: 4%; }
          .sec-promise .promise-list .promise-item:nth-of-type(n+3) {
            margin-top: 4%; } }
      @media screen and (max-width: 767px) {
        .sec-promise .promise-list .promise-item {
          border-radius: 25px; } }
      .sec-promise .promise-list .promise-item .item-ttl {
        word-break: keep-all;
        overflow-wrap: anywhere; }
  .sec-promise .promise-balloon {
    max-width: 678px;
    width: 100%;
    margin: clamp(40px, 10vw, 100px) auto 40px;
    display: flex;
    justify-content: space-between; }
    .sec-promise .promise-balloon li {
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 45%; }
  .sec-promise .promise-bottomLead {
    text-align: center;
    font-size: clamp(2.2rem, 4vw, 6rem);
    font-weight: bold;
    letter-spacing: 0.1em; }

/*==========================================
　工務店が不動産をやると、
  ここまでスムーズになる。
===========================================*/
.sec-smooth {
  margin-top: clamp(80px, 15vw, 150px); }
  .sec-smooth .smooth-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    .sec-smooth .smooth-list .smooth-item {
      width: 32%;
      max-width: 510px;
      border-radius: 50px;
      border: 0px solid #000;
      box-shadow: 0px 0px 10px 0px rgba(136, 155, 124, 0.8);
      padding: clamp(20px, 4vw, 60px) 2% clamp(20px, 7vw, 100px);
      font-size: clamp(1.6rem, 1.8vw, 2.1rem);
      letter-spacing: 0.1em;
      line-height: 1;
      font-weight: bold; }
      .sec-smooth .smooth-list .smooth-item:nth-of-type(n+4) {
        margin-top: clamp(40px, 8vw, 80px); }
      @media screen and (max-width: 960px) {
        .sec-smooth .smooth-list .smooth-item {
          width: 48%; }
          .sec-smooth .smooth-list .smooth-item:nth-of-type(n+3) {
            margin-top: clamp(40px, 8vw, 80px); } }
      @media screen and (max-width: 576px) {
        .sec-smooth .smooth-list .smooth-item {
          width: 100%;
          padding: clamp(30px, 4vw, 60px) 8% clamp(30px, 7vw, 100px); }
          .sec-smooth .smooth-list .smooth-item:nth-of-type(n+2) {
            margin-top: clamp(20px, 8vw, 80px); } }
      .sec-smooth .smooth-list .smooth-item .item-ttlEn {
        font-family: "Poppins", "Noto Sans JP", "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
        -webkit-text-stroke: 1px #000;
        line-height: 1;
        color: transparent;
        font-weight: 500;
        font-size: clamp(2rem, 2.4vw, 4rem);
        text-align: center; }
      .sec-smooth .smooth-list .smooth-item .item-ttlJa {
        text-align: center;
        min-height: 3em;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: clamp(1.8rem, 2vw, 2.8rem);
        letter-spacing: 0.2em;
        font-weight: bold;
        margin: 1em 0;
        word-break: keep-all;
        overflow-wrap: anywhere; }
        @media screen and (max-width: 576px) {
          .sec-smooth .smooth-list .smooth-item .item-ttlJa {
            margin: 0; } }
      .sec-smooth .smooth-list .smooth-item .item-txt {
        line-height: 2; }

/*==========================================
　工務店が不動産をやると、
  ここまでスムーズになる。
===========================================*/
.sec-core {
  margin-top: clamp(80px, 15vw, 150px);
  font-size: clamp(1.6rem, 2vw, 2.8rem);
  font-weight: bold;
  letter-spacing: 0.2em;
  text-align: center; }
  .sec-core .core-main {
    max-width: 1081px;
    width: 92%;
    margin: 0 auto 0;
    position: relative;
    font-size: clamp(1.1rem, 2vw, 3.2rem); }
    .sec-core .core-main .arw-left, .sec-core .core-main .arw-right {
      position: absolute;
      width: min(4vw, 100px);
      top: calc(50% - 2.5px); }
      .sec-core .core-main .arw-left::before, .sec-core .core-main .arw-right::before {
        content: "";
        display: block;
        width: 100%;
        height: 5px;
        background: #000; }
      @media screen and (max-width: 767px) {
        .sec-core .core-main .arw-left, .sec-core .core-main .arw-right {
          top: calc(50% - 1.5px); }
          .sec-core .core-main .arw-left::before, .sec-core .core-main .arw-right::before {
            height: 3px; } }
    .sec-core .core-main .arw-left {
      left: calc(0px - min(4vw,100px)); }
    .sec-core .core-main .arw-right {
      right: calc(0px - min(4vw,100px)); }
      .sec-core .core-main .arw-right::after {
        content: "";
        display: block;
        width: min(3vw, 60px);
        aspect-ratio: 1/1;
        border-top: 5px solid #000;
        border-right: 5px solid #000;
        position: absolute;
        top: calc(50% - min(1.7vw, 32.5px));
        right: min(0.3vw, 7px);
        transform: rotate(45deg); }
      @media screen and (max-width: 767px) {
        .sec-core .core-main .arw-right::after {
          border-width: 3px; } }
  .sec-core .core-circle {
    position: relative;
    display: flex;
    justify-content: center; }
    .sec-core .core-circle li {
      width: min(37%, 400px);
      aspect-ratio: 1/1;
      border: 5px solid #000;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 100vmax; }
      .sec-core .core-circle li:nth-of-type(n+2) {
        margin-left: -5%; }
      @media screen and (max-width: 767px) {
        .sec-core .core-circle li {
          border-width: 3px; } }
  .sec-core .core-txt {
    margin-top: 2em;
    line-height: 2;
    word-break: keep-all;
    overflow-wrap: anywhere; }

/*# sourceMappingURL=real-estate.css.map */