@charset "UTF-8";

body {
    background-color: #FFFFFF;
    overflow-x: hidden;
}

/* Reset and Base */
.l-contents * {
    box-sizing: border-box;
    font-family: "Zen Old Mincho", serif;
    color: #333;
    font-weight: 400;
}

.l-main {
    width: 100%;
    padding-bottom: 0;
    position: relative;
}

.l-contents a {
    transition: .3s;
}

.l-contents a:hover,
.l-contents button:hover {
    opacity: 1;
}

.pg__inner,
.main__inner {
    width: 1140px;
    margin: 0 auto;
    position: relative;
    z-index: 0;
}

.l-contents .ui-full-screen {
    margin-bottom: 0;
}

[class*=cmn__section--] {
    padding: 120px 0;
    position: relative;
}

[class*=cmn__ttl--] {
    font-family: "Cardo", serif;
    font-size: 78px;
    position: relative;
    color: #fff;
    line-height: 1.55;
    width: 1140px;
}
[class*=cmn__ttl--]:before {
    content: '';
    width: 100%;
    height: 1px;
    position: absolute;
    top: 56px;
    right: 1180px;
    background: #fff;
}

[class*=cmn__ttl--] span {
    font-size: 20px;
    color: #fff;
    font-weight: 500;
    font-family: "Zen Old Mincho", serif;
    position: absolute;
}

.cmn__more a {
    width: 250px;
    height: 50px;
    background-color: rgba(0, 0, 0, 0.3);
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: 20px;
    transition: .3s;
    color: #fff;
    overflow: hidden;
    border-radius: 100px;
    border: 1px solid #fff;
    padding-bottom: 5px;
}


.cmn__more a::before {
    content: '';
    display: inline-block;
    width: 21px;
    height: 5px;
    mask-image: url(/images/top/more-arrow.svg);
    -webkit-mask-image: url(/images/top/more-arrow.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    background-color: currentColor;
    transition: .3s;
    position: absolute;
    right: 22px;
    bottom: 21px;
}
.cmn__more a:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: #fff;
    transform-origin: 100% 50%;
    transform: scaleX(0);
    transition: transform ease .3s;
}
.cmn__more a:hover::after {
    transform-origin: 0% 50%;
    transform: scaleX(1);
}
.cmn__more a:hover{
    color: #333;
    background: transparent;
}
/*---------------------------------------------------
メイン
-----------------------------------------------------*/

.main__img img {
    width: 100%;
    height: auto;
    object-fit: cover;
}
.main__catch {
    position: absolute;
    top: 100px;
    color: #fff;
    font-size: 44px;
    font-weight: 500;
    line-height: 1.6;
    text-shadow: 0 0 28px rgba(0, 0, 0, 0.60);
    z-index: 1;
}
/*---------------------------------------------------
企業理念
-----------------------------------------------------*/
.cmn__section--philosophy {
    background: url(/images/top/philosophy.webp) center top;
    height: 700px;
    padding: 95px 0;
}
.cmn__ttl--philosophy {
    color: #162545;
    margin-bottom: 34px;
}
    .cmn__ttl--philosophy span {
        color: #162545;
        bottom: 32px;
        left: 388px;
    }
    .cmn__ttl--philosophy:before {
        background: #162545;
    }
.philosophy__text__wrap {
    position: relative;
    width: 740px;
}
    .philosophy__text__wrap:after {
        content: '';
        background: url(/images/top/list_img.webp);
        width: 711px;
        height: 540px;
        position: absolute;
        right: -789px;
        top: -168px;
    }
.philosophy__text {
    font-size: 15px;
    line-height: 2.05;
}
.philosophy__text:not(:last-child) {
    margin-bottom: 26px;
}

/*---------------------------------------------------
更新情報
-----------------------------------------------------*/
.cmn__section--news {
    background: url(/images/top/news.webp) no-repeat center top / cover;
    padding: 105px 0;
    height: 744px;
}
.cmn__ttl--news {
    line-height: 1.2;
    margin-bottom: 24px;
}
    .cmn__ttl--news span {
        bottom: 24px;
        left: 210px;
    }
.cmn__section--news [class*=cmn__ttl--]:before {
    top: 42px;
}
.contents__area__inner {
    overflow: hidden;
}
.history__list {
    width: 1106px;
    max-height: 403px;
}
.history__item__block {
    background-color: rgba(255, 255, 255, 0.9);
    padding: 25px 50px;
    display: flex;
    align-items: center;
    gap: 0 50px;
}
.history__item__block:not(:last-of-type) {
    margin-bottom: 8px;
}
.history__date {
    width: 66px;
}
.history__date--year {
    font-size: 14px; /* 小さめ */
    color: #212121;
}
.history__date--md {
    font-size: 22px; /* 大きめ */
    color: #212121;
    line-height: 1.2;
}

.history__text {
    width: 890px;
    font-size: 16px;
}
.history__text a {
    color: #333 !important;
    font-weight: 400;
    font-size: 16px;
    text-decoration: underline;
}
.history__text .history__category {
    background-color: #A1A1A1;
    height: 30px;
    display: flex;
    align-items: center;
    padding: 0 10px;
    color: #fff;
    font-size: 14px;
    width: fit-content;
    margin-bottom: 5px;
}
.simplebar-track.simplebar-vertical {
    right: -34px;
    width: 4px;
    top: 0;
    background: #fff;
    border-radius: 0;
    pointer-events: all;
}
.simplebar-track.simplebar-vertical .simplebar-scrollbar {
    cursor: pointer;
}
.simplebar-track.simplebar-vertical .simplebar-scrollbar::before {
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: #162545;
    opacity: 1;
    border-radius: 0;
}

.cmn__section--news .cmn__more {
    margin-bottom: 0;
    position: absolute;
    right: 0;
    top: 20px;
}
/*---------------------------------------------------
事業内容
-----------------------------------------------------*/
.cmn__section--business {
    background: url(/images/top/business.webp) no-repeat center / cover;
    height: 710px;
    padding: 151px 0;
}
.cmn__ttl--business {
    margin-bottom: 26px;
    line-height: 1.2;
}
.cmn__ttl--business span {
    bottom: 23px;
    left: 295px;
}
.cmn__ttl--business:before {
    top: 42px;
}
.business__catch {
    font-size: 38px;
    font-weight: 500;
    color: #fff;
    line-height: 1.6;
    text-shadow: 0 0 28px rgba(0, 0, 0, 0.60);
}
.business__circle__list {
    width: 846px;
    height: 795px;
    padding: 52px 44px;
}
.business__contents {
    position: absolute;
    right: -103px;
    top: -136px;
    display: flex;
    justify-content: center;
    width: 846px;
    height: 795px;
}
.business__logo {
    width: 271px;
    height: 271px;
    border-radius: 999999px;
    background: radial-gradient(47.86% 47.86% at 50% 50%, rgba(255, 255, 255, 0.80) 0%, rgba(255, 255, 255, 0.32) 69.41%, rgba(255, 255, 255, 0.00) 100%);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 246px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
.business__logo:before,
.business__logo:after {
    border: 2px solid #BA984F;
    border-radius: 50%;
    position: absolute;
    content: '';
}
.business__logo:before {
    width: 274px;
    height: 274px;
}
.business__logo:after {
    width: 258px;
    height: 258px;
    top: 7px;
    left: 7px;
}
.business__circle {
    position: absolute;
    display: flex;
    width: 230px;
    height: 230px;
    padding: 50px 20px 58px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    aspect-ratio: 1/1;
    border-radius: 99999px;
    border: 10px solid rgba(255, 255, 255, 0.20);
    background: rgba(255, 255, 255, 0.50);
    backdrop-filter: blur(14px);
    z-index: 0;
}
    .business__circle:after {
        content: '';
        background: url(/images/top/circle_bg.webp);
        width: 191px;
        height: 191px;
        position: absolute;
        right: 25px;
        top: 5px;
        z-index: -1;
    }
    .business__circle:before {
        content: '';
        border: 1px solid #BA984F;
        border-radius: 50%;
        position: absolute;
        width: 230px;
        height: 230px;
        top: -6px;
        right: -14px;
    }
.business__subttl {
    text-align: center;
    color: #9F7C3A;
    font-size: 16px;
    font-weight: 700;
}
.business__text {
    color: #735825;
    font-size: 13px;
    line-height: 1.7;
}
    .business__circle:nth-child(1) {
        top: 87px;
        right: 308px;
    }
    .business__circle:nth-child(2) {
        bottom: 198px;
        left: 143px;
    }
    .business__circle:nth-child(3) {
        bottom: 198px;
        right: 143px;
    }
/*---------------------------------------------------
募集中物件
-----------------------------------------------------*/
.cmn__section--available {
    background: url(/images/top/available.webp) no-repeat center / cover;
    height: 694px;
    padding: 84px 0;
}
.cmn__ttl--available {
    line-height: 1.2;
    margin-bottom: 11px;
}
    .cmn__ttl--available:before {
        top: 44px;
    }
.cmn__ttl--available span {
    bottom: 23px;
    left: 322px;
}
.card__list {
    margin-bottom: 17px;
}
.slide__item {
    width: 240px;
}
.slide__item a {
    background-color: #fff;
    padding: 10px;
    display: block;
    height: 273px;
}
    .card__image {
        width: 220px;
        height: 147px;
        margin-bottom: 8px;
        overflow: hidden;
        position: relative;
    }
        .card__image img {   
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: all .3s;
        }
        .slide__item a:hover .card__image img {
            transform: scale(1.08);
        }
        .bkn__label {
            position: absolute;
            top: 5px;
            left: 5px;
            background-color: #162545;
            width: 36px;
            height: 18px;
            display: flex;
            justify-content: center;
            align-items: center;
            color: #fff;
            font-size: 12px;
            z-index: 1;
        }
            .card__title {
                font-size: 16px;
                font-weight: 500;
                line-height: 1.7;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .card__info {
                padding: 0 5px;
            }
            .card__info-wrap {
                display: flex;
                align-items: flex-end;
                gap: 10px;
                flex-wrap: wrap;
                margin-bottom: 8px;
            }
                .card__price {
                    font-size: 14px;
                    color: #212121;
                    line-height: 1.1;
                }
                    .card__price .price {
                        font-size: 22px;
                        font-weight: 700;
                        color: #B59862;
                        margin-right: 3px;
                    }
                [class*="card__text"] {
                    font-size: 12px;
                    font-weight: 400;
                    line-height: 1.2;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    color: #747474;
                }

.tab-menu {
    display: flex;
    margin: 0 0 14px;
    border: 1px solid #fff;
    border-radius: 100px;
    width: fit-content;
}
.tab-menu-item {
    width: 320px;
    color: #fff;
    background: transparent;
    font-size: 17px;
    text-align: center;
    height: 49px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.tab-menu-item.active {
    border-radius: 999px;
    background: var(--_, linear-gradient(90deg, #B59862 0%, #BFAB88 100%));
}

.panel-cont__item {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    pointer-events: none;
    right: 0px;
    overflow: hidden;
    width: 1530px;
}
.panel-cont__item.active {
    opacity: 1;
    visibility: visible;
    position: relative;
    pointer-events: auto;
}



/*---------------------------------------------------
募集中物件
-----------------------------------------------------*/
.cmn__section--brokerage {
    background: url(/images/top/brokerage.webp) no-repeat center top / cover;
    height: 682px;
    padding: 118px 0 180px;
}
.cmn__ttl--brokerage span {
    bottom: 34px;
    left: 362px;
}
.cmn__ttl--brokerage {
    margin-bottom: 34px;
}

.brokerage__list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    width: 1140px;
    /* 2 items of 555px + gap 30px */
    justify-content: flex-end;
}

.brokerage__item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 560px;
    height: 119px;
    padding: 34px 40px 40px;
    background: linear-gradient(14.71deg, rgba(181, 152, 98, 0.85) 16.43%, rgba(191, 171, 136, 0.85) 83.66%);
    color: #fff;
    text-decoration: none;
    z-index: 1;
    transition: .3s;
    text-align: center;
    box-sizing: border-box;
    position: relative;
}

.brokerage__item-ttl {
    font-size: 22px;
    margin-bottom: 5px;
    color: #fff;
    transition: .3s;
}

.brokerage__item-txt {
    font-size: 15px;
    line-height: 1.9;
    color: #fff;
    transition: .3s;
}
.brokerage__item:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: #fff;
    transform-origin: 100% 50%;
    transform: scaleX(0);
    transition: transform ease .3s;
}
.brokerage__item:hover::before {
    transform-origin: 0% 50%;
    transform: scaleX(1);
}
.brokerage__item:hover .brokerage__item-ttl,
.brokerage__item:hover .brokerage__item-txt{
    color: #B59862;
}
/*---------------------------------------------------
各種お問い合わせ
-----------------------------------------------------*/
.cmn__section--contact {
    background: url(/images/top/contact.webp) no-repeat center / cover;
    height: 442px;
    padding: 105px 0;
}
.cmn__ttl--contact {
    line-height: 1.2;
    margin-bottom: 23px;
}
.cmn__ttl--contact:before {
    top: 45px;
}
.cmn__ttl--contact span {
    bottom: 21px;
    left: 284px;
}

.contact__contents {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 20px;
}
.contact__info__box {
    width: 360px;
    margin-bottom: 15px;
}
.contact__tel {
    color: #fff;
    font-size: 42px;
    font-weight: 600;
    letter-spacing: 0.7px;
    display: flex;
    gap: 0 8px;
    align-items: baseline;
    line-height: 1.5;
}
    .contact__tel span {
        color: #fff;
        font-size: 21px;
    }

    .contact__info__bottom {
        text-align: center;
        color: #fff;
        font-size: 14px;
        font-weight: 700;
    }
.contact__btn__list {
    display: flex;
    gap: 23px;
}
.contact__btn__item a {
    display: flex;
    width: 370px;
    height: 90px;
    font-size: 18px;
    font-weight: 500;
    justify-content: center;
    align-items: center;
    color: #fff;
    border: 1px solid #fff;
    background: rgba(0, 0, 0, 0.40);
    position: relative;
    transition: .3s;
}
.contact__btn__item a:after {
    content: '';
    display: inline-block;
    width: 21px;
    height: 5px;
    mask-image: url(/images/top/more-arrow.svg);
    -webkit-mask-image: url(/images/top/more-arrow.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    background-color: currentColor;
    transition: all 0.3s ease;
    position: absolute;
    right: 27px;
}
.contact__btn__item a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: #fff;
    transform-origin: 100% 50%;
    transform: scaleX(0);
    transition: transform ease .3s;
}
.contact__btn__item a:hover::before {
    transform-origin: 0% 50%;
    transform: scaleX(1);
}
.contact__btn__item a:hover{
    color: #333;
    background: transparent;
}