﻿.owner-contents {
    margin-bottom:6rem
}
.local-nav {
    width:90%;
    max-width:1200px;
    margin-inline:auto;
    margin-top:10rem
}
.local-nav ul {
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:3rem 4rem
}
.local-nav ul a {
    display:block;
    background-color:#ffffff;
    padding:3.5rem 1rem 1rem;
    text-align:center;
    position:relative;
    box-shadow:0 0 1.5rem rgba(0,0,0,0.3);
    transition:filter .3s linear
}
.local-nav ul a:hover {
    filter:brightness(110%)
}
.local-nav ul .number {
    color:#fff;
    background:linear-gradient(90deg, #6e6340, #a19263, #6e6340);
    font-family:"Cinzel", serif;
    letter-spacing:0.15em;
    font-size:1.8rem;
    display:flex;
    justify-content:center;
    align-items:center;
    column-gap:0.5rem;
    width:fit-content;
    padding:0 2rem 0 2.5rem;
    position:absolute;
    top:-4rem;
    left:50%;
    translate:-50% 0
}
.local-nav ul .number span {
    font-size:200%
}
.local-nav ul .catch {
    font-size:2.6rem;
    font-feature-settings:"palt";
    letter-spacing:0.1em;
	line-height: 1.2;
}
.local-nav ul .img {
    margin-top:1.5rem
}
.local-nav ul .detail {
    background-color:#002870;
    color:#ffffff;
    font-size:1.8rem;
    padding:0.6rem 1rem;
    position:relative
}
.local-nav ul .detail::after {
    content:'〉';
    position:absolute;
    right:2rem;
    top:50%;
    translate:0 -50%
}
.section {
    margin-top:10rem
}
.section-header {
    display:grid;
    grid-template-columns:1fr 0.9fr;
    column-gap:8rem;
    align-items:center;
    background-color:#ffffff
}
.section-header .img img {
    height:412px;
    width:100%;
    object-fit:cover
}
.section-header .copy .number {
    color:#fff;
    background:linear-gradient(90deg, #6e6340, #a19263, #6e6340);
    font-family:"Cinzel", serif;
    letter-spacing:0.15em;
    font-size:2rem;
    display:flex;
    justify-content:center;
    align-items:center;
    column-gap:0.5rem;
    width:fit-content;
    padding:0 2rem 0 2.5rem
}
.section-header .copy .number span {
    font-size:200%
}
.section-header .copy .section-title {
    font-size:3.6rem;
    font-feature-settings:"palt";
    letter-spacing:0.1em;
    line-height:1.6;
    margin-top:2rem
}
.section-body {
    width:90%;
    max-width:1200px;
    margin-inline:auto
}
.block {
    margin-top:8rem
}
.block>.text {
    font-size:1.6rem;
    text-align:center;
    line-height:2.2;
    margin-top:3rem
}
.block-title {
    font-size:3.2rem;
    font-feature-settings:"palt";
    letter-spacing:0.1em;
    text-align:center;
    line-height:1.4
}
.block-title .number {
    font-size:156.25%
}
.marker {
    text-decoration:underline;
    text-decoration-thickness:1em;
    text-decoration-color:#f7e935;
    text-underline-offset:-1em;
    text-decoration-skip-ink:none;
    padding:0 2px;
    font-weight:normal
}
@media screen and (max-width: 1000px) {
    .local-nav ul {
        gap:4rem 2rem
    }
    .local-nav ul a .number {
        font-size:1.6rem
    }
    .local-nav ul a .catch {
        font-size:2.2rem
    }
    .local-nav ul a .detail {
        font-size:1.6rem
    }
    .local-nav ul a .detail::after {
        right:0px
    }
    .section-header {
        column-gap:5rem
    }
    .section-header .img img {
        height:300px
    }
    .section-header .copy .number {
        font-size:1.6rem
    }
    .section-header .copy .section-title {
        font-size:3rem
    }
}
@media screen and (max-width: 768px) {
    .local-nav ul {
        grid-template-columns:repeat(2, 1fr)
    }
    .section-header {
        grid-template-columns:1fr
    }
    .section-header .img img {
        height:220px
    }
    .section-header .copy {
        padding:4rem 1rem;
        text-align:center
    }
    .section-header .copy .number {
        margin-inline:auto
    }
    .block {
        margin-top:6rem
    }
}
.main {
    position:relative
}
.main .main-copy {
    width:90%;
    text-align:center;
    position:absolute;
    bottom:2rem;
    left:50%;
    translate:-50% 0;
    color:#002870
}
.main .main-copy .title {
    font-size:7rem;
    font-feature-settings:"palt";
    letter-spacing:0.05em
}
.main .main-copy .title .small {
    font-size:62.85%
}
.main .main-copy .text {
    font-size:2.6rem;
    font-feature-settings:"palt";
    letter-spacing:0.05em;
    line-height:1.8;
    margin-top:3rem
}
@media screen and (max-width: 768px) {
    .main {
        position:relative
    }
    .main .main-copy {
        position:static;
        translate:0;
        margin-inline:auto
    }
    .main .main-copy .title {
        font-size:5rem
    }
    .main .main-copy .text {
        font-size:2rem;
        margin-top:2rem
    }
}
.overview {
    width:90%;
    max-width:1200px;
    margin-inline:auto;
    padding-top:6rem;
    margin-top:0
}
.overview .different {
    margin-top:0
}
.overview .different .list {
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:4rem;
    margin-top:3.5rem
}
.overview .different .list li img {
    width:100%;
    height:auto
}
.overview .different .text {
    font-feature-settings:"palt";
    letter-spacing:0.05em;
    font-size:2.4rem;
    text-align:center;
    line-height:2.2;
    margin-top:5rem
}
.overview .example {
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    align-items:center;
    column-gap:4rem;
    background-color:#ffffff;
    box-shadow:0 0 1.5rem rgba(0,0,0,0.3)
}
.overview .example .img img {
    object-fit:cover;
    height:250px;
    width:100%
}
.overview .example .copy {
    padding:1rem 4rem 1rem 0
}
.overview .example .copy .title {
    font-size:2.4rem;
    font-feature-settings:"palt";
    letter-spacing:0.1em;
    line-height:1.4
}
.overview .example .copy .text {
    font-size:1.6rem;
    line-height:1.8;
    margin-top:2rem
}
.overview .local-nav {
    width:100%;
    margin-top:6rem
}
@media screen and (max-width: 1000px) {
    .overview .different .list {
        gap:2rem
    }
}
@media screen and (max-width: 768px) {
    .overview .different .list {
        grid-template-columns:repeat(2, 1fr);
        gap:1.5rem
    }
    .overview .example {
        grid-template-columns:1fr
    }
    .overview .example .img img {
        height:200px
    }
    .overview .example .copy {
        padding:3rem 4rem 4rem
    }
}
#point01 .simulation {
    margin-top:8rem
}
#point01 .simulation .title {
    font-size:2.4rem;
    text-align:center;
    font-feature-settings:"palt";
    letter-spacing:0.1em
}
#point01 .simulation .img {
    margin-top:3rem
}
@media screen and (max-width: 768px) {
    #point01 .simulation {
        margin-top:6rem
    }
}
#point02 .detail-list {
/*    display:grid;*/
    grid-template-columns:repeat(2, 1fr);
    gap:8rem
}
#point02 .detail-list .title {
    font-size:2rem;
    font-feature-settings:"palt";
    letter-spacing:0.1em
}
#point02 .detail-list .text {
    font-size:1.4rem;
    line-height:2.2;
    margin-top:1.5rem
}
#point02 .detail-list .img {
    margin-top:3rem
}
#point02 .detail-list .img .note {
    margin-top:2rem
}
@media screen and (max-width: 1000px) {
    #point02 .detail-list {
        gap:6rem
    }
}
@media screen and (max-width: 768px) {
    #point02 .detail-list {
        grid-template-columns:1fr
    }
}
#point03 .dissatisfaction .img {
    margin-top:4rem
}
#point03 .dissatisfaction .img .note {
    right:15.5%
}
#point03 .equipment .unit-list {
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:3.9rem;
    margin-top:4rem
}
#point03 .equipment .unit-list .title {
    color:#fff;
    background:linear-gradient(90deg, #6e6340, #a19263, #6e6340);
    font-size:2rem;
    text-align:center;
    font-feature-settings:"palt";
    letter-spacing:0.05em;
    padding:1rem;
    display:flex;
    flex-direction:column;
    justify-content:center
}
#point03 .equipment .unit-list .title .small {
    font-size:75%;
    display:block
}
#point03 .equipment .unit-list .content {
    background-color:#ffffff;
    padding:1.9rem;
    border:1px solid #000000;
    border-width:0 1px 1px 1px
}
#point03 .equipment .unit-list .content .text {
    font-size:13px;
    line-height:1.6
}
#point03 .equipment .unit-list .unit {
    display:grid;
    grid-template-rows:subgrid;
    grid-row:span 2;
    gap:0
}
#point03 .equipment .unit-list .unit:nth-child(-n+3) .content {
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:1rem;
    align-items:flex-start
}
#point03 .equipment .unit-list .unit:nth-child(4) .content {
    display:flex;
    flex-direction:column;
    gap:1rem
}
#point03 .equipment .unit-list .unit:nth-child(n+5) .img {
    max-width:270px;
    margin-inline:auto
}
#point03 .equipment .other {
    text-align:center;
    margin-top:6rem
}
#point03 .equipment .other .title {
    font-size:2rem;
    font-feature-settings:"palt";
    letter-spacing:0.1em;
    line-height:1.4
}
#point03 .equipment .other .link {
    position:relative;
    font-size:1.8rem;
    margin-top:3rem
}
#point03 .equipment .other .link a {
    background-color:#002870;
    color:#ffffff;
    display:inline-block;
    position:relative;
    padding:1rem 6rem 1rem 4rem;
    font-feature-settings:"palt";
    letter-spacing:0.05em;
    transition:filter .3s linear
}
#point03 .equipment .other .link a:hover {
    filter:brightness(120%)
}
#point03 .equipment .other .link a::after {
    content:'〉';
    position:absolute;
    right:3rem;
    top:50%;
    translate:0 -50%
}
#point03 .equipment .other+.note {
    margin-top:6rem
}
#point03 .spec .detail {
    margin-top:3rem;
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:6rem 8rem
}
#point03 .spec .text {
    text-align:left
}
#point03 .pointlist {
    margin-top:20px;
    display:grid;
    gap:10px;
    grid-template-columns:1fr
}
#point03 .pointlist li {
    border:solid 1px #92012D;
    padding:5px
}
#point03 .pointlist li .txt {
    font-size:1.4rem;
    line-height:1.4;
    color:#92012D;
    text-align:center;
    margin-block:calc((1em - 1lh) / 2)
}
@media screen and (max-width: 1000px) {
    #point03 .equipment .unit-list {
        gap:2.6rem
    }
    #point03 .equipment .unit-list .unit:nth-child(-n+3) .content {
        grid-template-columns:1fr
    }
    #point03 .equipment .other .link {
        margin-top:2rem
    }
    #point03 .spec .detail {
        gap:6rem
    }
}
@media screen and (max-width: 768px) {
    #point03 .dissatisfaction .img {
        margin-inline:-5%
    }
    #point03 .equipment .unit-list {
        grid-template-columns:repeat(2, 1fr);
        gap:2rem
    }
    #point03 .equipment .other {
        margin-top:3rem
    }
    #point03 .equipment .other+.note {
        margin-top:3rem
    }
    #point03 .spec .detail {
        grid-template-columns:1fr;
        gap:4rem
    }
}
#point04 .important .detail {
    margin-top:6rem;
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    align-items:flex-start;
    gap:3rem 4rem;
    background-color:#ffffff;
    padding:4rem
}
#point04 .important .detail .img {
    order:2
}
#point04 .important .detail .copy {
    order:1
}
#point04 .important .detail .copy .title {
    font-size:2.6rem;
    color:#91002c;
    line-height:1.4
}
#point04 .important .detail .copy .title .small {
    color:#000000;
    font-size:76.9%;
    display:block;
    margin-bottom:1rem
}
#point04 .important .detail .copy .text {
    font-size:1.6rem;
    line-height:2.2;
    margin-top:3rem
}
#point04 .important .detail .copy .text .marker {
    font-size:125%
}
#point04 .supports .note {
    text-align:center;
    margin-top:3rem
}
@media screen and (max-width: 768px) {
    #point04 .important .detail {
        grid-template-columns:1fr;
        padding:3rem 3rem 4rem;
        margin-top:4rem
    }
    #point04 .important .detail .img {
        order:1
    }
    #point04 .important .detail .copy {
        order:2
    }
    #point04 .important .detail .copy .text {
        line-height:2
    }
}
.come-true {
    width:90%;
    max-width:1200px;
    margin-inline:auto
}
.come-true .section-title {
    text-align:center;
    font-size:4rem;
    color:#002870;
    font-feature-settings:"palt";
    letter-spacing:0.1em
}
.come-true .appeal {
    margin-top:5rem;
    max-width:980px;
    margin-inline:auto;
    position:relative;
    z-index:1
}
.come-true .image-photo {
    max-width:812px;
    margin-inline:auto;
    margin-top:-3rem;
    position:relative;
    z-index:0
}
.come-true .sub-title {
    text-align:center;
    font-size:3.2rem;
    font-feature-settings:"palt";
    letter-spacing:0.1em;
    margin-top:2rem
}
.come-true .mansion-name {
    color:#002870;
    text-align:center;
    font-size:6.6rem;
    font-feature-settings:"palt";
    letter-spacing:0 0.5em;
    margin-top:8rem;
    padding-bottom:10rem
}
.come-true .mansion-name .small {
    display:block;
    font-size:75%;
    margin-bottom:1rem
}
@media screen and (max-width: 768px) {
    .come-true .appeal {
        margin-top:3rem
    }
    .come-true .mansion-name {
        font-size:4.6rem;
        margin-top:6rem;
        padding-bottom:7rem
    }
}