@charset "utf-8";


/* outline
------------------------------*/
.l-page * {
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN','Meiryo', sans-serif;
    box-sizing: border-box;
}

#path,
.h1_section {
    display: none;
}

#contents {
    width: 100%;
    margin-top: -150px;
    padding: 0;
}

/*---------------------------------------------------------
main
---------------------------------------------------------*/

/* 共通 */
.l-page a {
    text-decoration: none;
}

a:hover,
.tab_content_button:hover{
    opacity: 0.8;
}

.l-page a:hover {
    color: #FFF;
}

.sales_contact_bg a:hover {
    color: #000000;
}

.sales_title,
.sales_banner,
.sales_new_pickup,
.sales_search_area,
.sales_search_line {
    text-align: center;
    width: 1080px;
    margin: 0 auto 89px;
}

.sales_banner .sales-banner-ttl,
.sales_new_pickup h2 {
    font-family: 'Noto Serif JP', 'Noto Sans JP', sans-serif;
    font-size: 35px;
    letter-spacing: 0.2em;
    line-height: 1.1;
    padding-left: 8px;
}


/* メイン背景 */
.mv_bg{
    height: 1548px;
    background-image: url(../images/sales_bg_top_PC.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    margin: 0 0 181px;
}
.sales_bg {
    position: relative;
    width: 100%;
    z-index: 0;
}

.sales_bg_msk {
    position: absolute;
    width: 100%;
    height: 68.5vw;
    overflow: hidden;
    z-index: -1;
}

.sales_bg_img {
    width: 100.5%;
    height: 68.9vw;
    filter: blur(3px) brightness(98%);
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
}

.sales_wrap {
    width: 100%;
}

/* タイトル */
.sales_title * {
    font-family: 'Noto Serif JP', 'Noto Sans JP', sans-serif;
    font-weight: 400;
    color: #FFFFFF;
}

.sales_title .main-ttl {
    font-size: 60px;
    letter-spacing: 0.1em;
    line-height: 1.33;
    margin: 0 auto;
    padding: 307px 0px 20px 6px;
}

.sales_title .sales-title-text {
    font-size: 20px;
    letter-spacing: 0.2em;
    line-height: 1.5;
    width: 593px;
    margin: 0px auto 52px auto;
    padding-left: 5px;
}

.sales_a_flex {
    display: flex;
    justify-content: space-between;
}

.sales_title a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 40px 0 40px;
    font-size: 32px;
    font-weight: 500;
    line-height: 1.34;
    background-color: #A59871;
    width: 530px;
    height: 131px;
    border-radius: 6px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px;
    margin-bottom: 50px;
}

.sales_title a:hover {
    opacity: 0.8;
}
.sales_title a.sales_a_flex--area{
    padding-right: 45px;
}
.sales_title .icon_area {
    width: 37px;
}

.sales_title .icon_line {
    width: 42px;
}


/* 人気のエリア・人気の沿線 */
.sales_banner * {
    font-family: 'Noto Serif JP', 'Noto Sans JP', sans-serif;
    font-weight: 400;
}

.sales_banner {
    margin-bottom: 0;
}

.banner_area,
.banner_line {
    width: 100%;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px;
    padding: 95px 50px 98px;
}

.banner_area {
    border-radius: 6px 6px 0 0;
    background-color: #E6E6E6;
}

.banner_line {
    border-radius: 0 0 6px 6px;
    background-color: #FFFFFF;
}

.banner_flex {
    display: flex;
    justify-content: space-between;
}

.sales_banner .sales-banner-ttl {
    margin-bottom: 50px;
}

.banner_com {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    line-height: 1.33;
    color: #FFFFFF;
    text-decoration: none;
    width: 230px;
    height: 140px;
    border-radius: 10px;
    border: 2px solid #D1C5A0;
    background-size: cover;
    overflow: hidden;
    z-index: 2;
}

.banner_onfoot {
    background-image: url(../images/sales_icon_onfoot_PC.jpg);
}

.banner_price {
    background-image: url(../images/sales_icon_price_PC.jpg);
}

.banner_floorplan {
    background-image: url(../images/sales_icon_floorplan_PC.jpg);
}

.banner_recommend {
    background-image: url(../images/sales_icon_recommend_PC.jpg);
}

.banner_com::before {
    position: absolute;
    content: '';
    background: inherit;
    filter: blur(3px);
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    z-index: 1;
}

.banner_com::after {
    position: absolute;
    content: '';
    background-color: #8F8F8F;
    filter: brightness(46%) opacity(29%);
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 3;
}

.banner_com span {
    position: absolute;
    z-index: 4;
}


/* 新着物件・ピックアップ物件 */
.sales_new {
    /* margin-top: 91px; */
    margin-bottom: 86px;
}

.sales_pickup {
    margin-bottom: 87px;
}

.sales_new_pickup .sales-new-ttl {
    margin-bottom: 50px;
}

.sales_new_pickup_flex {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.sales_new_pickup_item:not(:nth-child(3n+1)) {
    margin-left: 20px;
}
.js-hide {
    margin-top: 20px;
    display: none;
}
.js-hide.is-show {
    display: flex;
}
.js-hide .sales_new_pickup_item:nth-child(n+4) {
    margin-top: 20px;
}

.sales_new_pickup_item {
    display: block;
    background-color: #FFFFFF;
    width: 346px;
    height: 405px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px;
    overflow: hidden;
}

.sales_new_pickup_item:hover {
    /* opacity: 0.8; */
}
.property_name a,
.property_name a:hover{
    color: #4B4B4B;
}
.bkn_img {
    width: 100%;
    height: 230px;
}
.bkn_img img {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    object-fit: cover;
}

.property_wrap {
    padding: 15px 14px 20px 14px;
}

.property_wrap p {
    text-align: left;
    color: #4B4B4B;
    width: 320px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.property_wrap .property_name {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: 2px;
}

.property_wrap .property_price {
    font-size: 16px;
    font-weight: 700;
    color: #BF3F3F;
    margin-bottom: 13px;
}

.property_wrap .price {
    font-size: 24px;
}

.property_wrap .property_address,
.property_wrap .property_access,
.property_wrap .property_spec {
    font-size: 14px;
    line-height: 1.42;
}

.sales_new_pickup_button {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 22px;
    line-height: 1.45;
    letter-spacing: 0.2em;
    color: #FFFFFF;
    width: 519px;
    height: 80px;
    background-color: #A59871;
    border-radius: 40px;
    margin: 40px auto 0 auto;
    padding-left: 2px;
}
.sales_new_pickup_button.js-close {
    display: none;
}

.sales_new_pickup_button:hover {
    opacity: 0.9;
}

.sales_new_pickup_button::after {
    position: absolute;
    content: "";
    display: inline-block;
    top: 35px;
    right: 30px;
    width: 20px;
    height: 10px;
    background-image: url(../images/icn_more-arrow.png);
    background-repeat: no-repeat;
}
.sales_new_pickup_button.js-close::after {
    transform: rotate(-180deg);
}


/* 探す */
.sales_search_area_bg,
.sales_search_line_bg {
    background-color: #E6E6E6;
    padding-top: 97px;
    padding-bottom: 1px;
}

.sales_search h2 {
    font-family: 'Noto Serif JP', 'Noto Sans JP', sans-serif;
    font-size: 40px;
    letter-spacing: 0.2em;
    line-height: 1;
    padding: 0 0px 51px 0px;
    font-weight: 600;
}
.sales_search h2 .blue {
    
font-family: 'Noto Serif JP', 'Noto Sans JP', sans-serif;
    
color: #014172;
}
.pagelink-ttl:first-child h2 {
    padding-top: 0;
}

.sales_tabs {
    background-size: cover;
    width: 100%;
    border-radius: 6px 0 6px 6px;
    margin: 0px auto 0 auto;
}

.pagelink-ttl {
    margin-bottom: 97px;
    margin-top: -160px;
    padding-top: 160px;
}

.area_onfoot,
.line_onfoot {
    background: url(../images/sales_bg_onfoot_PC.jpg) no-repeat center top /cover;
    background-position-x: -1px;
}

.area_price,
.line_price {
    background: url(../images/sales_bg_price_PC.jpg) no-repeat center top /cover;
    background-position-x: -1px;
}

.area_floorplan,
.line_floorplan {
    background: url(../images/sales_bg_floorplan_PC.jpg) no-repeat center top / cover;
    background-position-x: -1px;
}

.area_recommend,
.line_recommend {
    background: url(../images/sales_bg_recommend_PC.jpg) no-repeat center top / cover;
    background-position-x: -1px;
}

.tab_items{
    display: flex;
    justify-content: center;
    align-items: center;
    float: left;
    font-size: 18px;
    letter-spacing: 0.1em;
    color: #FFFFFF;
    width: calc(100% / 13);
    height: 70px;
    background-color: #707070;
    border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
    border-left: 1px solid #FFFFFF;
}
.sales_search_line_bg .tab_items{
   width: calc(100% / 7);
}

.tab_item1:hover,
.tab_item2:hover,
.tab_item3:hover,
.tab_item4:hover,
.tab_item5:hover,
.tab_item6:hover,
.tab_item7:hover,
.tab_item8:hover {
    opacity: 0.9;
    cursor: pointer;
}

.tab_list li:first-child{
    border-radius: 6px 0px 0px 0px;
}

.sales_tabs .tab_item1:last-of-type,
.sales_tabs .tab_item2:last-of-type,
.sales_tabs .tab_item3:last-of-type,
.sales_tabs .tab_item4:last-of-type,
.sales_tabs .tab_item5:last-of-type,
.sales_tabs .tab_item6:last-of-type,
.sales_tabs .tab_item7:last-of-type,
.sales_tabs .tab_item8:last-of-type {
    border-right: 1px solid #FFFFFF;
}

.sales_tabs input[name="tab_item1"],
.sales_tabs input[name="tab_item2"],
.sales_tabs input[name="tab_item3"],
.sales_tabs input[name="tab_item4"],
.sales_tabs input[name="tab_item5"],
.sales_tabs input[name="tab_item6"],
.sales_tabs input[name="tab_item7"],
.sales_tabs input[name="tab_item8"] {
    display: none;
}

.tab_content {
    display: none;
    clear: both;
    background: rgba(67, 67, 67, 0.91);
    width: 100%;
    border-radius: 0px 0px 6px 6px;
    padding: 50px;
}

/*沿線タブ*/

.tab_item5,
.tab_item6,
.tab_item7,
.tab_item8 {
    display: flex;
    justify-content: center;
    align-items: center;
    float: left;
    font-size: 22px;
    letter-spacing: 0.1em;
    color: #FFFFFF;
    width: calc(100% / 7);
    height: 70px;
    background-color: #707070;
    border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
    border-left: 1px solid #FFFFFF;
}

/*沿線タブ終わり*/

.tab_content.is-active {
    display: block;
}

.tab_items.active {
    background: rgba(67, 67, 67, 0.91);
    border: 0px;
    font-size: 18px;
}
.line_onfoot .tab_items.active,
.line_price .tab_items.active, 
.line_floorplan .tab_items.active,
.line_recommend .tab_items.active{
    background: rgba(133, 133, 133, 0.91);
    border: 0px;
    font-size: 24px;
}

.tab_content_innner {
    display: flex;
    justify-content: space-between;
}

.area_recommend .tab_content_innner,
.line_recommend .tab_content_innner {
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
}
.area_recommend .tab_content_innner + .tab_content_button,
.line_recommend .tab_content_innner + .tab_content_button {
    margin-top: 20px;
}

.tab_content_innner a,
.tab_content_innner label {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-weight: 500;
    color: #707070;
    width: 188px;
    background-color: #FFFFFF;
    border-radius: 6px;
}

.tab_content_innner a:hover,
.tab_content_innner label:hover {
    opacity: 0.9;
}

.tab_content_innner label {
    width: auto;
    padding: 0px 31px 0 12px;
    margin: 0px 10px 10px 0px;
}

.area_floorplan .tab_content_innner a,
.area_onfoot .tab_content_innner a,
.area_recommend .tab_content_innner a,
.line_floorplan .tab_content_innner a,
.line_onfoot .tab_content_innner a,
.line_recommend .tab_content_innner a,
.tab_content_innner label {
    font-size: 18px;
    height: 60px;
    color: #434343;
}

.area_price .tab_content_innner a,
.line_price .tab_content_innner a {
    font-size: 18px;
    height: 100px;
    color: #434343;
}

.sales_tabs input[type="checkbox"] {
    width: 20px;
    height: 20px;
    margin-right: 17px;
}

.tab_content_button {
    font-family: 'Noto Serif JP', 'Noto Sans JP', sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    letter-spacing: 0.2em;
    line-height: 1.35;
    color: #FFFFFF;
    width: 400px;
    height: 60px;
    background: rgba(0, 0, 0, 0);
    border: 3px solid #FFFFFF;
    border-radius: 30px;
    margin: 30px auto 0px auto;
}


/* 沿線で探す 背景色変更 */
.sales_search_line_bg {
    background-color: #FFFFFF;
}

.sales_search_line .tab_content {
    background: rgba(133, 133, 133, 0.91);
}

.sales_search_line .sales_tabs input:checked+.tab_item1,
.sales_search_line .sales_tabs input:checked+.tab_item2,
.sales_search_line .sales_tabs input:checked+.tab_item3,
.sales_search_line .sales_tabs input:checked+.tab_item4,
.sales_search_line .sales_tabs input:checked+.tab_item5,
.sales_search_line .sales_tabs input:checked+.tab_item6,
.sales_search_line .sales_tabs input:checked+.tab_item7,
.sales_search_line .sales_tabs input:checked+.tab_item8 {
    background: rgba(133, 133, 133, 0.91);
}


/* 問い合わせ */
.sales_contact {
    background-image: url(../images/sales_bg_contact_PC.jpg);
    background-repeat: no-repeat;
    background-position: center;
    text-align: center;
}

.sales_contact_bg {
    background-color: rgba(25, 25, 25, 0.63);
    padding: 116px 0px 140px 0px;
    width: 100%;
}

.sales_contact h2 {
    font-family: 'Noto Serif JP', 'Noto Sans JP', sans-serif;
    font-size: 40px;
    color: #FFFFFF;
    letter-spacing: 0.1em;
    line-height: 1.325;
    padding-bottom: 31px;
}

.sales_contact a {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 22px;
    color: #000000;
    font-weight: 500;
    line-height: 1.45;
    letter-spacing: 0.1em;
    width: 720px;
    height: 80px;
    background-color: #FFFFFF;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px;
    border-radius: 40px;
    margin: 0px auto;
}

.sales_contact a:hover {
    opacity: 0.9;
}