@charset "UTF-8";

/*-------------------------
__hoge_style
-------------------------*/

#page_ttl{background-image: url("images/page_ttl_bg.jpg");}

.block:not(:last-of-type){padding-bottom: 20px;}
#block01.detail{padding-top: 70px;border-top: solid 1px #eee;}
.block_ttl2{margin-bottom: 80px;}

.forsale_list{margin: calc(var(--inner_p) * -0.5) calc(var(--inner_p) * -0.5) calc(var(--inner_p) * -1);display: flex;flex-wrap: wrap;}
.forsale_list .forsale_box{width: calc(100% / 3);margin-bottom: var(--inner_p);padding: calc(var(--inner_p) / 4);box-sizing: border-box;}
.forsale_list .forsale_box a{display: block;}
.forsale_list .forsale_box .box_inner{padding: calc(var(--inner_p) / 4);border-radius: calc(var(--inner_p) / 1.5);transition: box-shadow .3s;display: block;}
.forsale_list .forsale_box .box_inner .pic{width: 100%;height: auto;aspect-ratio: 4 / 3;border: solid 1px #ccc;border-radius: calc(var(--inner_p) / 2);box-sizing: border-box;overflow: hidden;}
.forsale_list .forsale_box .box_inner .pic img{width: 100%;height: 100%;object-fit: contain;transition: all .3s;}
.forsale_list .forsale_box .box_inner .info{padding: 2em 1em 1em;}
.forsale_list .forsale_box .box_inner .info dl dt,
.forsale_list .forsale_box .box_inner .info dl dd{overflow: hidden;display: -webkit-box;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 2;max-height: 4em;}

.pic_txt{height: 510px;margin: 0 -30px;display: flex;align-items: flex-start;justify-content: center;}
.pic_txt.main{height: auto;flex-direction: row!important;}
.pic_txt:nth-of-type(2n - 1){flex-direction: row-reverse;}
.pic_txt:not(:first-of-type) {padding-top: 60px;}
.pic_txt>div{margin: 0 30px;}
.pic_txt .pic_wrap{max-width: calc(100% - 580px);height: 100%;max-height: 510px;border-radius: var(--inner_p);overflow: hidden;}
.pic_txt .pic_wrap img{width: 100%;height: 100%;object-fit: contain;}
.pic_txt .txt_wrap{width: 460px;padding-top: var(--inner_p);}
.pic_txt .txt_wrap.none{display: none;}
.pic_txt .txt_wrap .detail_ttl1{font-size: 24px;line-height: 1.5em;text-align: left;font-weight: 600;padding-bottom: 20px;position: relative;}
.pic_txt .txt_wrap .detail_ttl1::before{content: "";width: 60px;height: 4px;background-color: var(--blue);position: absolute;left: 0;bottom: 0;}
.pic_txt .txt_wrap .detail_ttl1 + .txt{padding-top: 1em;}
.pic_txt .txt_wrap>.txt{text-align: left;}

.location_list{margin: -20px;display: flex;flex-wrap: wrap;}
.location_list .box{width: calc(25% - 40px);margin: 20px;}
.location_list .box .pic{width: 100%;height: auto;aspect-ratio: 4 / 3;border: solid 1px #ccc;border-radius: 20px;overflow: hidden;}
.location_list .box .pic img{width: 100%;height: 100%;object-fit: contain;}
.location_list .box .pic a{width: 100%;height: 100%;display: block;}
.location_list .box .pic a img{transition: all .3s;}
.location_list .box .pic a:hover img{transform: scale(1.1);}
.location_list .box>.pic_cap{font-size: 1.4em;line-height: 1.5em;text-align: left;padding-top: 1em;display: flex;align-items: flex-end;justify-content: space-between;}

.access_map{width: 100%;height: 600px;border-radius: var(--inner_p);overflow: hidden;position: relative;}
.access_map iframe{border: none;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

.outline{display: flex;}
.outline2 .info{padding: 0;}
.outline .info{width: calc((100% - var(--inner_p)) / 2);padding: 0;}
.outline .info:nth-child(2){padding-left: var(--inner_p);}
.outline2 .info dl,
.outline .info dl{border-bottom: solid 1px #eee;}
.outline .info dl dt,
.outline2 .info dl dt{width: 7em;}
.outline .info dl dd{width: calc(100% - 7em);}
.outline .info dl dt, 
.outline2 .info dl dt, 
.outline .info dl dd,
.outline2 .info dl dd{margin-top: 1em;}

.page_back{padding: 60px 0 120px;}

@media only screen and (min-width: 768px) {
    .forsale_list .forsale_box a:hover .box_inner{box-shadow: 0 0 calc(var(--inner_p) / 2) rgba(0,0,0,0.1);}
    .forsale_list .forsale_box a:hover .box_inner .pic img{transform: scale(1.1);}
}
@media only screen and (max-width: 1279px) {
    .pic_txt{height: auto;margin: 0 -40px;}
    .pic_txt>div{margin: 0 20px;}
    .pic_txt .pic_wrap{max-width: calc(100% - 480px);max-height: inherit;}
    .pic_txt .txt_wrap{width: 360px;}
    .location_list .box{width: calc(33.333% - 40px);}
}
@media only screen and (max-width: 999px) {
    .forsale_list .forsale_box{width: calc(100% / 2);}
    .pic_txt,
    .pic_txt.main{margin: 0;flex-direction: column!important;}
    .pic_txt>div{margin: 0 auto;}
    .pic_txt .pic_wrap{max-width: inherit;}
    .pic_txt .txt_wrap{width: 100%;}
    .location_list{margin: -15px;}
    .location_list .box{width: calc(50% - 30px);margin: 15px;}
    .access_map{height: 510px;}
    .outline{flex-direction: column;}
    .outline .info{width: 100%;}
    .outline .info:nth-child(2){padding-left: 0;}
    .page_back{padding: 50px 0 100px;}
}
@media only screen and (max-width: 767px) {
    #block01.detail{padding-top: 40px;}
    .block_ttl2{margin-bottom: 50px;}
    .forsale_list .forsale_box{width: 100%;}
    .forsale_list .forsale_box .box_inner .info {padding: 2em 0 1em;}
    .pic_txt .txt_wrap .detail_ttl1{font-size: 20px;}
    .location_list .box{width: calc(100% - 30px);}
    .access_map{height: 280px;}
    .outline .info dl,
    .outline2 .info dl{border-bottom: none;}
    .outline2 .info dl{flex-direction: column;}
    .outline .info:nth-child(1) dl dd{margin-bottom: 15px !important;}
    .outline2 .info dl dt, 
    .outline2 .info dl dd {width: auto !important;margin: 0 !important;}
    .outline2 .info dl dt {text-align: center;background-color: #eee;padding: 0.5em 1em;}
    .page_back{padding: 30px 0 60px;}
    .outline2 .info dl dd{margin: 0.5em 0 !important;padding: 0;display: flex;justify-content: center;}
    .outline2 .info dl dd::before{content: none;}
}

/*magnific-popup*/
.mfp-bg {opacity: 0;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.mfp-bg.mfp-ready {opacity: 0.8;}
.mfp-bg.mfp-removing {opacity: 0;}
.mfp-wrap .mfp-content {max-width: calc(100% - 28px)!important;opacity: 0;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.mfp-wrap.mfp-ready .mfp-content {opacity: 1;}
.mfp-wrap.mfp-removing .mfp-content {opacity: 0;}
.mfp-arrow-left:before,
.mfp-arrow-right:before{content: none!important;}








.narrow {padding:50px 0 0;}
.narrow ul {display: flex;
list-style: none;
justify-content: center;}
.narrow ul li {font-size: 1.4em;
font-weight: 600;line-height: 3; border: 1px solid #999;margin: 0 20px 0 0;width: 10em;text-align: center;border-radius:50vh;opacity: .5;}
.narrow ul li:hover {background: #999;transition: all .3s;}
.narrow ul li.check {color: #fff; background-color: var(--blue);opacity: 1; border: 1px solid var(--blue);}
.narrow ul li.check:hover {background: var(--blue);;transition: all .3s;}
.narrow ul li:last-child {margin: 0;}
.narrow ul li a {display: block;}
@media only screen and (max-width: 767px) {
.narrow { width: 90%;margin: auto; padding:20px 0 0;}
.narrow ul {display: flex;
list-style: none;
justify-content: center;
margin: auto;}
.narrow ul li {font-size: 1.4em;
font-weight: 600;line-height: 3; border: 1px solid #999;margin: 0 2.5% 0 0;width: 10em;text-align: center;border-radius:50vh;opacity: .5;}
.narrow ul li:hover {background: #999;transition: all .3s;}
.narrow ul li.check {color: #fff; background-color: var(--blue);opacity: 1; border: 1px solid var(--blue);}
.narrow ul li.check:hover {background: var(--blue);;transition: all .3s;}
.narrow ul li:last-child {margin: 0;}
.narrow ul li a {display: block;}
}