@charset "UTF-8";

html {
  scroll-behavior: smooth;
}

.sh-PR {
    position: relative;
}
.sh-gradient-wrapper {
    padding-bottom: 40px;
    background-color: #e9e6e0;
}
.sh-contents {
    max-width: 1000px;
    text-align: center;
}

.sh-page-title {
    margin-bottom: 0;
    padding-bottom: 0;
}
.sh-page-title h1 {
    display: block;
    border: 15px solid transparent;
    border-image: url("images/bg_01.png") 15 fill / 15px round;
    width: 80%;
    max-width: 800px;
    margin-inline: auto;
    color: #fff;
    padding: 5px 10px;
    letter-spacing: 1px;
    box-sizing: border-box;
}

.sh-2LDK-box1 {
    background-color: #fff;
    padding: 40px 20px;
}
.sh-2LDK-box2 {
    background-color: #fff;
    padding-top: 30px;
    padding-bottom: 40px;
}
.sh-2LDK-box3 {
    display: flex;
    justify-content: space-between;
    max-width: 710px;
    margin-inline: auto;
    width: calc(100% - 20px);
}
.sh-2LDK-box3 > div {
    width: 47.8873239%;
    max-width: 340px;
}



.__title1 a {
    display: block;
    background-color: #3a5460;
    color: #fff;
    margin-inline: auto;
    max-width: 600px;
    padding: 13px 10px;
    position: relative;
    box-sizing: border-box;
    position: relative;
}
.__title1 > a ,
html .__title1 > a:hover {
    color: #fff;
    text-decoration: none;
}
.__title1 > a:hover {
    opacity: 0.9;
}
.__title2 {
    border: 15px solid transparent;
    border-image: url("images/bg_02.png") 15 fill / 15px round;
    max-width: 680px;
    margin-inline: auto;
    padding: 5px 10px;
    box-sizing: border-box;
    color: #817867;
}
.__title3 {
    background-color: #dad4cd;
    color: #534028;
    max-width: 600px;
    margin-inline: auto;
    padding: 10px 10px;
}
.__title4 {
    border: 10px solid transparent;
    border-image: url("images/bg_03.png") 15 fill / 10px round;
    width: 70%;
    max-width: 400px;
    margin-inline: auto;
    padding: 2px 10px;
    box-sizing: border-box;
    color: #fff;
}
.__title5 {
    border: 10px solid transparent;
    border-image: url("images/bg_04.png") 15 fill / 10px round;
    width: 70%;
    max-width: 400px;
    margin-inline: auto;
    padding: 2px 10px;
    box-sizing: border-box;
    color: #fff;
}

.__arrow {
  position: relative;
  display: inline-block;
  width: 2px;
  height: 90px;
  margin-right: 19.8px;
  border-radius: 9999px;
  background-color: #969b9a;
  top: -10px;
}
.__arrow::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: calc(50% - 1px);
  width: 2px;
  height: 20px;
  border-radius: 9999px;
  background-color: #969b9a;
  transform: rotate(40deg);
  transform-origin: 50% calc(100% - 1px);
}

.__link1 {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 2px;
  margin-top: 11.6px;
  border-radius: 9999px;
  background-color: #fff;
}

.__link1::before {
  content: "";
  position: absolute;
  top: calc(50% - 1px);
  right: 0;
  width: 20px;
  height: 2px;
  border-radius: 9999px;
  background-color: #fff;
  transform: rotate(40deg);
  transform-origin: calc(100% - 1px) 50%;
}


.__color1 {
    color: #817867;
}
.__color2 {
    color: #3a5460;
}
.__color3 {
    color: #4f7a81;
}
.__color4 {
    color: #a65868;
}

.__link_arrow {
  position: absolute;
  display: inline-block;
  width: 50px;
  height: 1px;
  border-radius: 9999px;
  background-color: #fff;
  top: 50%;
  right: 7%;
  transform: translateY(-50%);
}

.__link_arrow::before {
  content: "";
  position: absolute;
  top: calc(50% - 1px);
  right: 0;
  width: 20px;
  height: 1px;
  border-radius: 9999px;
  background-color: #fff;
  transform: rotate(40deg);
  transform-origin: calc(100% - 1px) 50%;
}

.sh-img1 {
    max-width: 600px;
    margin-inline: auto;
}
.sh-img2 {
    max-width: 680px;
    margin-inline: auto;
}
.sh-subimg1 {
    position: absolute;
    top: 40px;
    right: 0%;
    width: 21%;
    max-width: 200px;
}
.sh-subimg2 {
    position: absolute;
    top: -70%;
    left: 10%;
    width: 20%;
    max-width: 120px;
}
.sh-subimg3 {
    position: absolute;
    bottom: 3%;
    right: 10%;
    width: 20%;
    max-width: 120px;
}
.sh-subimg4 {
    position: absolute;
    top: 40px;
    right: 0%;
    width: 21%;
    max-width: 200px;
}

.show-ptrt {
    display: none;
}

.MT30_pc {
    margin-top: 30px;
}


.sh-contents-comment {
    text-align: left;
    margin: 0 auto;
    padding-left: 10px;
    padding-right: 10px;
}


@media screen and (min-width: 768px) {
    .sh-page-title h1 {
        font-size: 33px;
    }
}


@media screen and (min-width: 1040px) {
    .sh-subimg1 ,
    .sh-subimg4 {
        right: -2%;
    }
}


@media screen and (max-width: 767px) {
    .sh-page-title {
        padding-left: 5px;
        padding-right: 5px;
    }
    .sh-page-title h1 {
        width: 100%;
    }
    .sh-contents-comment {
        background-image: none;
        border-bottom: none;
    }
}


@media screen and (max-width: 450px) and (orientation:portrait) {
    div , p {
        font-feature-settings: "palt";
    }
    .show-ptrt {
        display: inline;
    }

    .sh-subimg4 ,
    .sh-subimg1 {
        width: 30%;
        top: -2%;
    }
    .sh-subimg2 {
        top: -20%;
        left: -1%;
    }
    .sh-subimg3 {
        bottom: 0%;
        right: 0%;
    }

    .__link_arrow {
        width: 40px;
        right: 2%;
    }
    .__link_arrow::before {
      width: 15px;
    }

    .MT30_pc {
        margin-top: initial;
    }

}