@charset 'utf-8';


/*========== 固定コンタクト ==========*/
.property_contact_fixed { position: fixed; bottom: 0; left: 0; right: 0; display: flex; justify-content: center; align-items: center; gap: 12px; padding: 12px; z-index: 10; }
.property_contact_fixed .button { width: 200px; height: 48px; margin: 0; }
.property_contact_fixed .button .button_arrow { width: 6px; right: 18px; }
.property_contact_fixed .line_icon { height: 48px; aspect-ratio: 1 / 1; }
.property_contact_fixed .contact_tel { display: flex; align-items: center; gap: 0.2em; font-size: 36px; }
.property_contact_fixed .contact_tel .icon_tel { display: flex; justify-content: center; align-items: center; height: 48px; aspect-ratio: 1 / 1; padding: 8px; background: #FFF; border-radius: 8px; }
.property_contact_fixed .contact_tel .freedial { height: 0.8em; filter: invert(100%); }
@media screen and (min-width:768px) {
    .property_contact_fixed { gap: 20px; }
    .property_contact_fixed .contact_tel { font-size: 40px; }
    .property_contact_fixed .contact_tel .icon_tel { display: none; }
}


/*========== タイトル ==========*/
.property_flag_wrap { position: absolute; top: -22px; left: 0; }
.h2_wrap h2 { font-size: 14px; line-height: 1em; font-weight: 700; }


/*========== トップ ==========*/
.property_top_wrap { display: flex; flex-direction: column; gap: 40px; margin-top: 20px; }
@media screen and (min-width:1025px) {
    .property_top_wrap { flex-direction: row; margin-top: 40px; }
}

/*----- トップ上（左） -----*/
.property_top_left { display: flex; flex-direction: column; gap: 12px; }
/* メイン画像 */
.property_img_main_wrap { position: relative;  }
.property_img_wrap { position: relative; width: 100%; height: calc(min(60vw, 800px) + 60px); margin: 0 auto; border: 1px solid #B4B4B4; overflow: hidden; }
.property_img_item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }
.property_img_item.is_active { opacity: 1; pointer-events: auto; z-index: 1; }
.property_img{ width: 100%; aspect-ratio: 3 / 2; object-fit: contain; vertical-align: bottom; }
.property_img_text { position: absolute; bottom: 0; right: 0; left: 0; display: flex; align-items: flex-end; gap: 8px; width: 100%; padding: 8px; color: #FFF; font-size: 12px; line-height: 1.5em; font-weight: 700; background: #00000066; z-index: 1; }
/* ボタン */
.img_slider_arrow_left, .img_slider_arrow_right { position: absolute; top: calc(min(30vw, 400px) + 30px); width: 32px; aspect-ratio: 1 / 1; padding: 6px; border: 2px solid #000; background: #FFF; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 1; transition: all .3s; }
.img_slider_arrow_left { left: -8px; transform: translateY(-16px) rotate(180deg); }
.img_slider_arrow_right { right: -8px; transform: translateY(-16px); }
.img_slider_arrow_left img, .img_slider_arrow_right img { width: 7px; transform: translateX(1px); transition: all .3s; }
/* サムネイル */
.property_img_slider_wrap { position: relative; width: 100%; overflow-x: auto; overflow-y: hidden; scroll-behavior: smooth; }
.property_img_slider_wrap::-webkit-scrollbar { display: none; }
.property_img_slider_wrap { scrollbar-width: none; }
.property_thumb_track { display: flex; gap: 8px; flex-wrap: nowrap; }
.property_img_thumb { flex: 0 0 auto; cursor: pointer; }
.property_img_thumb { width: calc((100% - 16px) / 3); }
.property_img_thumb img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: contain; border: 1px solid #676767; opacity: 0.5; transition: all .3s; }
.property_img_thumb.is_active img { outline: 1px solid #000; outline-offset: -1px; opacity: 1; }
.property_img_no_photo { display: flex; justify-content: center; align-items: center; width: 100%; aspect-ratio: 3 / 2; background: #B4B4B4; color: #676767; font-size: 20px; font-weight: 700; }
/* hover */
.img_slider_arrow_left:hover, .img_slider_arrow_right:hover { background: #000; }
.img_slider_arrow_left:hover img, .img_slider_arrow_right:hover img { filter: invert(100%); }
.property_img_thumb:hover img { outline: 1px solid #000; outline-offset: -1px; opacity: 1; }
@media screen and (min-width: 500px) {
    /* サムネイル */
    .property_img_thumb { width: calc((100% - 24px) / 4); }
}
@media screen and (min-width: 768px) {
    /* サムネイル */
    .property_img_thumb { width: calc((100% - 32px) / 5); }
}
@media screen and (min-width: 1025px) {
    .property_top_left { width: calc(calc(100% - 40px)/2); }
    /* メイン画像 */
    .property_img_wrap { height: auto; aspect-ratio: 3 / 2; }
    /* ボタン */
    .img_slider_arrow_left, .img_slider_arrow_right { top: 50%; width: 40px; }
    .img_slider_arrow_left { left: -20px; transform: translateY(-20px) rotate(180deg); }
    .img_slider_arrow_right { right: -20px; transform: translateY(-20px); }
    .img_slider_arrow_left img, .img_slider_arrow_right img { width: 8px; }
    /* サムネイル */
    .property_img_thumb { width: calc((100% - 16px) / 3); }
}
@media screen and (min-width: 1200px) {
    /* サムネイル */
    .property_img_thumb { width: calc((100% - 24px) / 4); }
}

/*----- トップ下（右） -----*/
.property_top_right { display: flex; flex-direction: column; gap: 20px; }
.property_info_wrap { display: flex; flex-direction: column; gap: 12px; width: 100vw; margin: 0 -5vw; padding: 20px 5vw; background: #EEE; }
.property_info_wrap dl { display: flex; align-items: baseline; gap: 12px;  }
.property_info_wrap dl dt { width: 70px; flex: 0 0 auto; }
.property_info_wrap dl:first-child dt { line-height: 36px; }
.property_point_wrap { display: flex; flex-direction: column; gap: 8px; }
@media screen and (min-width:1025px) {
    .property_top_right { width: calc(calc(100% - 40px)/2); }
    .property_info_wrap { width: 100%; margin: 0; padding: 20px; }
}


/*========== メイン（コメント・ローン） ==========*/
.property_detail_wrap { display: flex; flex-direction: column; gap: 40px; }
@media screen and (min-width:1025px) {
    .property_detail_wrap { flex-direction: row; gap: 40px; }
    .property_comment_wrap { flex: 1; }
    .property_loan_wrap { flex: 1; }
}
@media screen and (min-width:1200px) {
    .property_detail_wrap { gap: 80px; }
}


/*========== コメント ==========*/
.property_comment_wrap { display: flex; flex-direction: column; gap: 12px; }
.property_comment_wrap .h2_outer { display: flex; justify-content: space-between; }
.property_staff_wrap { position: relative; display: flex; flex-direction: column; align-items: end; gap: 4px; width: 150px; }
.property_staff_photo { width: 100%; }
.property_staff_name { font-size: 14px; line-height: 1em; }
.property_staff_line { display: none; }
.property_comment { margin-top: 20px; }
@media screen and (min-width:500px) {
    .property_comment_wrap .h2_outer { justify-content: left; gap: 40px; }
    .property_staff_wrap { align-items: center; }
    .property_staff_line { position: absolute; top: -25px; right: -150px; display: block; width: 160px; }
}
@media screen and (min-width:1025px) {
    .property_staff_line { display: none; }
}
@media screen and (min-width:1200px) {
    .property_staff_line { display: block; }
}


/*========== ローン（コピペ） ==========*/
.property_accordion_wrap { border: 1px solid #B4B4B4; border-radius: 8px; }
/*----- header -----*/
.property_accordion_header { display: flex; justify-content: center; align-items: center; gap: 12px; width: 100%; padding: 8px 0; margin: 0 auto; font-size: 18px; }
.property_accordion_header .property_accordion_icon { position: relative; display: block; width: 12px; aspect-ratio: 1 / 1; }
.property_accordion_header .property_accordion_icon img { position: absolute; top: 0; bottom: 0; right: 0; left: 0; transition: all .3s ease; }
.property_accordion_header .property_accordion_icon img:last-child { transform: rotate(180deg); }
.property_accordion_wrap.is_open .property_accordion_icon img:last-child { transform:rotate(0deg); }
/* open */
.property_accordion_wrap.is_open .property_accordion_icon img:first-child { opacity:0; transform:rotate(-180deg); }
/*----- panel -----*/
.property_accordion_panel { max-height: 0; padding: 0 16px; border-top: 1px solid #B4B4B4; overflow: hidden; opacity: 0; transition: all .3s ease; transition: all .3s ease; }
/* open */
.property_accordion_wrap.is_open .property_accordion_panel { max-height: none; padding: 16px 24px 24px; opacity: 1; }
@media screen and (min-width: 768px) {
    /*----- panel -----*/
    .property_accordion_panel { padding: 0 20px; }
    /* open */
    .property_accordion_wrap.is_open .property_accordion_panel { padding: 20px 40px 40px; }
}
@media screen and (min-width: 1025px) {
    /*----- header -----*/
    .property_accordion_header { padding: 30px 0 4px; font-size: 24px; }
    .property_accordion_header .property_accordion_icon { display: none; }
    /*----- panel -----*/
    .property_accordion_panel { border-top: none; }
}


.loan { width:100%; display:block; position:relative; }
.loanTitle { width:100%; padding:0 10%; display:block; border:1px solid #ccc; border-radius:7px; position:relative; transition:0.3s;}
.loanTitle.close { transition:0.3s; }
.loanH2 { line-height:50px; }
.loanTitle i { margin-top:-7px; position:absolute; right:10%; top:50%; transition:0.3s; }
.loanTitle.close i { transform:rotate(180deg); transition:0.3s; }
.loanTitle i.fa-plus { opacity:1; transform:rotate(0deg); transition:0.3s; }
.loanTitle i.fa-minus { opacity:0; transform:rotate(0deg); transition:0.3s; }
.loanTitle.close i.fa-plus { opacity:0; transform:rotate(180deg); transition:0.3s; }
.loanTitle.close i.fa-minus { opacity:1; transform:rotate(180deg); transition:0.3s; }
.loanBox { width:100%; }
.loanBox p { margin:10px 0 0 0; display:block; text-align:center; font-size:14px; line-height:1.5; }
.loanBoxDl { width:100%; margin:20px 0 0 0; display:flex; justify-content:space-between; }
.loanBoxDl dt { width:35%; display:flex; align-items:center; justify-content:center; background:#F7F4E6; border-radius:7px; text-align:center; line-height:1.5; }
.loanBoxDl dd { width:60%; padding:10px 0; display:flex; flex-direction:column; align-items:center; justify-content:center; border-top:1px solid #000; }
.loanBoxDlText { width:100%; display:flex; justify-content:left; align-items:flex-end; }
.loanBoxDlTextBox { width:120px; height:40px; margin:0 10px 0 0; padding:0 20px; background:#f6f6f6; border-radius:5px; line-height:40px; }
input.loanBoxDlTextBox::-webkit-outer-spin-button,input.loanBoxDlTextBox::-webkit-inner-spin-button { -webkit-appearance:none;  margin:0; -moz-appearance:textfield; } 
.loanBoxDl input[type=range] { -webkit-appearance:none; background:#F0D29D; height:4px; width:100%; margin:15px 0 0 0; }
.loanBoxDl input[type=range]::-webkit-slider-thumb{ -webkit-appearance:none; background:#F0D29D; height:20px; width:20px; margin:0; border-radius:50%; box-shadow:none; }
.loanBoxDl input[type=range]::-ms-tooltip{ display:none; }
.loanBoxDl input[type=range]::-moz-range-track{ height:0; }
.loanBoxDl input[type=range]::-moz-range-thumb{ background:#F0D29D; height:20px; width:20px; margin:-7px 0 0 0; border:none; border-radius:50%; }
.loanBoxButton { width:100%; margin:20px auto; padding-bottom:20px; display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative; }
.loanBoxButton input { width:60%; height:50px; margin:0 auto 10px auto; display:block; border-radius:10px; background:#F78824; color:#fff; text-align:center; transition:0.3s; }
.loanBoxButton input:hover { opacity:0.7; transition:0.3s; }
.loanBoxButton::after { content:''; width:auto; border-right:20px solid transparent; border-top:20px solid #F78824; border-left:20px solid transparent; position:absolute; bottom:0; left:auto; right:auto; }
.loanBoxResults { width:100%; display:flex; justify-content:space-between; }
.loanBoxResult { width:47.5%; display:flex; flex-direction:column; }
.loanBoxResultTitle { width:100%; font-size:14px; }
.loanBoxResultPrices { width:100%; display:flex; align-items:flex-end; }
.loanBoxResultPrice { width:80%; height:40px; background:#f6f6f6; border-radius:5px; text-align:center; }
.loanBoxResultPrice1 { width:25%; height:40px; background:#f6f6f6; border-radius:5px; text-align:center; }
.loanBoxResultPrice2 { width:55%; height:40px; background:#f6f6f6; border-radius:5px; text-align:center; }
.loanBoxResultPrices span { width:15%; padding:0 0 0 5px; display:flex; }
.loanBoxAlart { width:100%; margin:15px 0 0 0; display:block; }
.loanBoxAlart li { width:100%; display:block; font-size:12px; line-height:1.2; letter-spacing:0; }




/*========== MAP ==========*/
.map { width: 100%; height: 400px; }
.map_link { display: flex; align-items: center; gap: 8px; width: fit-content; border-bottom: 1px solid #000; }
.map_link:hover { border-color: transparent; }


/*========== 物件概要（コピペ） ==========*/
.property_outline_sec .property_accordion_wrap .property_accordion_panel { padding: 0; }
/* open */
.property_outline_sec .property_accordion_wrap.is_open .property_accordion_panel { padding: 0; }
@media screen and (max-width: 1024px) { 
    .property_outline_sec { padding-top: 40px; }
    .property_outline_sec .h_wrap { display: none; }
    .property_outline_sec .content { padding: 0; }
}
@media screen and (min-width: 1025px) {
    .property_outline_sec .property_accordion_wrap { border: none; }
    .property_outline_sec .property_accordion_header { display: none; }
}


.outlineTitle { height:50px; padding:0 10%; display:block; border:1px solid #ccc; border-radius:7px; position:relative; transition:0.3s; }
.outlineTitle.close { transition:0.3s; }
.outlineTitle h2 { line-height:50px; }
.outlineTitle .title_text_st { display:none; }
.outlineTitle i { margin-top:-7px; position:absolute; right:10%; top:50%; transition:0.3s; }
.outlineTitle.close i { transform:rotate(180deg); transition:0.3s; }
.outlineTitle i.fa-plus { opacity:1; transform:rotate(0deg); transition:0.3s; }
.outlineTitle i.fa-minus { opacity:0; transform:rotate(0deg); transition:0.3s; }
.outlineTitle.close i.fa-plus { opacity:0; transform:rotate(180deg); transition:0.3s; }
.outlineTitle.close i.fa-minus { opacity:1; transform:rotate(180deg); transition:0.3s; }
.OUTLINE{ margin:20px 0 0 0; box-sizing: border-box; font-size: 14px; overflow:visible; position:relative; }
.OUTLINE p { line-height:1.5; text-align:justify; margin-top: 5px;}
.WRAP_LIST {width: 100%; display:flex; flex-direction:column; border-bottom: solid #ccc 1px; line-height:1.2; }
.WRAP_LIST dt {width:100%; padding: 10px 2.5%; background: #F6F6F6;  text-align: left; box-sizing: border-box; }
.WRAP_LIST dd {width:100%; padding: 10px 2.5%; background:#fff; text-align: justify; box-sizing: border-box;}
.WRAP_LIST dd .ACCESS span { display:block; }
.WRAP_LIST_AREA { display:block; margin-left:0; }
@media screen and (min-width: 768px) {
	.outlineTitle { height:auto; margin:100px 0 0 0; padding:0; border:none; text-align:center; }
	.outlineTitle h2 { line-height:1.7em; }
	.outlineTitle .title_text_st { display:block; }
	.outlineTitle i { display:none; }
	.outlineTitle i.fa-plus { display:none; }
	.OUTLINE{ margin-bottom: 30px; }
	.TABLE_WRAP {display: flex; flex-wrap: wrap;}
	.WRAP_LIST { flex-direction:row; line-height:1.5;}
	.WRAP_LIST dt {width: 150px; padding: 10px 1.25%; }
	.WRAP_LIST dd {width: calc(100% - 150px); padding: 10px 1.25%; }
	.WRAP_LIST dd .ACCESS span { display:block; }
	.WRAP_LIST_AREA { margin-left:10px; }
	.WRAP_LIST_AREA:hover { text-decoration:underline; }
	.WRAP_LIST_50 {width: 50%; display: flex;}
	.WRAP_LIST_50:nth-child(2n+1):last-child { width: 100%; }
	.WRAP_LIST_50 dt {width:150px; padding: 10px 2.5%; }
	.WRAP_LIST_50 dd {width:calc(100% - 150px); padding: 10px 2.5%; }
	.WRAP_LIST_50:nth-child(2n+1):last-child dt { padding: 10px 1.25%; }
	.WRAP_LIST_50:nth-child(2n+1):last-child dd { padding: 10px 1.25%; }
}
.OUTLINE_TABLE p { padding: 16px; }
@media screen and (min-width: 1025px) {
    .TABLE_WRAP:first-child { border-top: solid #ccc 1px; }
    .OUTLINE_TABLE p { padding: 0; }
}


/*========== LOCATION ==========*/
.location_list { display: flex; flex-wrap: wrap; gap: 20px; }
.location_list li { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.location_list li .location_img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.location_list li .location_noimg { display: flex; justify-content: center; align-items: center; background: #B4B4B4; color: #676767; font-size: 20px; font-weight: 700; }
.location_list li .location_title { line-height: 1.5em; }
@media screen and (max-width: 1024px) { 
    .property_location_sec { padding-top: 40px; }
    .property_location_sec .h_wrap { display: none; }
    .property_location_sec .content { padding: 0; }
}
@media screen and (min-width: 500px) {
    .location_list li { width: calc(calc(100% - 20px) / 2); }
}
@media screen and (min-width: 768px) {
    .location_list li { width: calc(calc(100% - 40px) / 3); }
}
@media screen and (min-width: 1025px) {
    .property_location_sec .property_accordion_wrap { border: none; }
    .property_location_sec .property_accordion_header { display: none; }
    .location_list { gap: 40px 20px; }
    .location_list li { width: calc(calc(100% - 60px) / 4); }
}


/*========== CONTACT ==========*/
.contact_img_wrap { display: flex; justify-content: center; align-items: center; gap: 20px; }
.contact_img { height: 120px; }
.contact_img_text { position: relative; height: fit-content; color: #FFF; font-size: 14px; line-height: 1.5em; }
.contact_img_text::before,.contact_img_text::after { content: ''; position: absolute; left: -10px; display: block; width: 40px; height: 1px; background: #FFF; }
.contact_img_text::before { top: -10px; transform: rotate(-30deg); }
.contact_img_text::after { bottom: -10px; transform: rotate(30deg); }
.contact_link { display: flex; flex-direction: column; gap: 20px; margin-top: 20px; }
.contact_button { display: flex; flex-direction: column; gap: 12px; }
.contact_button .button { max-width: 300px; }
.contact_tel_wrap { display: flex; flex-direction: column; justify-content: end; align-items: center; gap: 8px; }
.contact_tel_wrap .contact_tel { display: flex; align-items: center; gap: 0.2em; font-size: 36px; }
.contact_tel_wrap .contact_tel img { height: 0.8em; filter: invert(100%); }
.contact_tel_wrap span { font-size: 14px; letter-spacing: 0.04em; }
@media screen and (min-width:768px) {
    .property_contact_sec { margin-top: 60px; }
    .contact_img_wrap { align-items: end; gap: 40px; margin-top: -140px; }
    .contact_img { height: 160px; }
    .contact_img_text { margin-bottom: 24px; font-size: 16px; }
    .contact_img_text::before,.contact_img_text::after { left: -20px; }
    .contact_img_text::before { top: -12px; }
    .contact_img_text::after { bottom: -12px; }
    .contact_link { gap: 20px; margin-top: 40px; }
    .contact_link .button { margin: 0; }
    .contact_button { flex-direction: row; justify-content: center; gap: 20px; }
    .contact_tel_wrap .contact_tel { font-size: 40px; }
    .contact_tel_wrap span { font-size: 16px; }
}
@media screen and (min-width:1025px) {
    .contact_link { flex-direction: row; justify-content: center; }
    .contact_button { flex-grow: 1; gap: 20px; width: 0; }
}






