/*-------------------------------
    modelroom keyvisual
-------------------------------*/

.modelroom_keyvisual {
    width:100%;
    height:max(64.3rem,47.1vw);
    position:relative;
    border-radius:0 0 10rem 10rem;
}

.key_img {
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
}

.key_img::after {
    content:"";
    display: block;
    width:max(59rem,43.2%);
    height:max(28rem,43.6%);
    background:url(../images/model_room/bg_keyvisual_nami.svg) no-repeat right bottom / contain;
    position:absolute;
    right:0;
    bottom:0;
}


.modelroom_keyvisual .inner {
    max-width:120rem;
    height:100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position:relative;
}

.modelroom_keyvisual_txt {
    width:28.4rem;
    height:28.4rem;
    border-radius:50%;
    background:#fff;
    padding:5rem 0 0;
}

.modelroom_keyvisual_txt .h_title {
    margin-bottom:2.5rem;
}

.modelroom_keyvisual_txt .h_title::before {
    width:4.5rem;
    height:1.6rem;
}

.modelroom_keyvisual_txt .h_title span {
    color:var(--maincolor);
    font-size:3.5rem;
}

.modelroom_keyvisual_txt .h_title span::before {
    font-size:2.9rem;
    margin-bottom:0.5em;
}

.modelroom_keyvisual_txt p {
    max-width:20.5rem;
    margin:0 auto;
    padding-top:0.35em;
    border-top:1px solid var(--blackcolor);
    text-align: center;
    line-height:1.5;
}

/*-------------------------------
    ar model
-------------------------------*/

.ar_model {
    background:#E8F6FF;
    padding:3rem 0;
}

.model_wrap {
    padding:8rem 7.5rem 15rem;
    background:#fff;
}

.model_data_wrap {
    width:46.4%;
    max-width:51rem;
}

.model_txt {
    padding-left:5rem;
}

.model_txt h3 {
    font-size:2.2rem;
    font-weight:700;
    color:var(--blueblack);
    letter-spacing: 0.01em;
    margin-bottom:1.5em;
}

.model_txt p {
    line-height:2.5;
}

.model_data {
    margin-top:4rem;
    padding-left:5rem;
}

.model_data h4 span {
    display: inline-block;
    font-size:1.4rem;
    font-weight:500;
    color:var(--maincolor);
    letter-spacing: 0.01em;
    padding:0.4em 2.3em;
    border-radius:3rem;
    border:1px solid var(--maincolor);
    text-align: center;
}

.model_data h2 {
    font-size:2.2rem;
    font-weight:700;
    color:var(--maincolor);
    letter-spacing: 0.01em;
    margin:1.5em 0 0.5em;
}

.model_data .dl_list dt {
    width:10rem;
    font-weight:700;
    color:var(--maincolor);
    letter-spacing: 0.01em;
    padding:1em 0 1em;
}

.model_data .dl_list dd {
    width:calc(100% - 10rem);
    padding:1em 0 1em;
}

.model_data .dl_list dt:not(:last-of-type),
.model_data .dl_list dd:not(:last-of-type) {
    border-bottom:1px solid #AEBEC9;
}

.model_concept {
    padding-left:5rem;
    margin:3rem 0 7.5rem;
}

.model_concept h3 {
    margin-bottom:1em;
    font-weight:700;
    letter-spacing: 0.01em;
}

.model_concept p {
    line-height:2.5;
    font-weight:400;
}

.model_img_wrap {
    width:46.4%;
    max-width:51rem;
}

/*-------------------------------
    floor_plan    
-------------------------------*/

.floor_plan .yukinyan_yatta {
    width:10.4rem;
}

.floor_plan_img {
    width:calc(100% - 10.4rem);
    padding:0 9.5rem 0 6rem;
    position:relative;
}

.floor_plan_img::after {
    content:"";
    display: block;
    /*width:9rem;
    height:10.6rem;*/
    width:4.5rem;
    height:5.3rem;
    position:absolute;
    /*right:0;*/
    right:4rem;
    bottom:0;
}

.direction_north_northwest::after {
    background:url(../images/model_room/icon_direction_north_northwest.svg) no-repeat top center / contain;
}

.direction_north_northeast::after {
    background:url(../images/model_room/icon_direction_north_northeast.svg) no-repeat top center / contain;
}

/*-------------------------------
    yukinyan comment    
-------------------------------*/

.yukinyan_comment_wrap {
    margin:5.5rem auto 0;
}

.yukinyan_comment {
    background:url(../images/model_room/bg_comment.svg) no-repeat center / contain;
    display: flex;
    align-items: center;
    justify-content: center;
    width:25.7rem;
    height:21rem;
}

.yukinyan_comment p {
    line-height:1.875;
    text-align: center;
}

.yukinyan_comment_wrap .yukinyan_onegai {
    width:11.7rem;
    margin-top:10.5rem;
    margin-left:2rem;
}

/*-------------------------------
    model img
-------------------------------*/

.model_img_wrap {
    max-height:170rem;
    overflow-y:scroll;
    /*スクロールバー非表示（IE・Edge）*/
    -ms-overflow-style: none;
    /*スクロールバー非表示（Firefox）*/
    scrollbar-width: none;
}

.model_img_wrap::-webkit-scrollbar {
    display: none;
}

.model_img img {
    border-radius:2rem;
}

.model_img,
.model_img_flex {
    margin-bottom:4.5rem;
}

.model_img_flex .model_img {
    width:47.2%;
    max-width:24rem;
    margin-bottom:0;
}

.model_img figcaption,
.model_img_caption {
    width:100%;
    font-size:1.6rem;
    font-weight:500;
    letter-spacing: 0.01em;
    text-align: center;
    line-height:1.35;
    display: block;
    padding-top:0.65em;
}

/*-------------------------------
    個別設定
-------------------------------*/

/*-------------------------------
    myprecious
-------------------------------*/

/*-------------------------------
    responsive
-------------------------------*/

@media screen and (max-width:960px) {

.model_txt,
.model_data,
.model_concept {
    padding-left:0;
}

.model_concept h3,
.model_data .dl_list dt,
.model_data .dl_list dd {
    font-size:1.8rem;
}

.model_img figcaption,
.model_img_caption {
    font-size:1.7rem;
}

} /* end 960px */



/*-------------------------------
    ver sp
-------------------------------*/

@media screen and (max-width:768px) {

/*-------------------------------
    modelroom keyvisual
-------------------------------*/

.modelroom_keyvisual {
    width:100%;
    height:auto;
    position:relative;
    border-radius:0;
}

.key_img {
    margin-top:13.4rem;
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    height:72rem;
    border-radius:0 0 10rem 10rem;
    overflow: hidden;
}

.key_img::after {
    width:49.2rem;
    height:17rem;
}

.modelroom_keyvisual .inner {
    max-width:100%;
    height:auto;
    display:block;
}

.modelroom_keyvisual_txt {
    width:45.6rem;
    height:45.6rem;
    border:1px solid var(--maincolor);
    padding:8.5rem 0 0;
    margin:8.5rem auto 8rem;
}

.modelroom_keyvisual_txt .h_title {
    margin-bottom:3rem;
}

.modelroom_keyvisual_txt .h_title::before {
    width:5.1rem;
    height:1.6rem;
}

.modelroom_keyvisual_txt .h_title span {
    font-size:5.6rem;
}

.modelroom_keyvisual_txt .h_title span::before {
    font-size:4.5rem;
    margin-bottom:0.45em;
}

.modelroom_keyvisual_txt p {
    max-width:33rem;
    padding-top:0.35em;
}

/*-------------------------------
    ar model
-------------------------------*/

.ar_model {
    padding:6rem 0;
}

.model_wrap {
    padding:9rem 6rem 8rem;
}

.model_data_wrap {
    width:100%;
    max-width:100%;
}

.model_txt {
    padding-left:0rem;
}

.model_txt h3 {
    font-size:3rem;
    text-align: center;
    margin-bottom:1.5em;
    line-height:1.5;
}

.model_txt p {
    line-height:2;
}

.model_data {
    margin-top:6rem;
    padding-left:0rem;
}

.model_data h4 {
    text-align: center;
}

.model_data h4 span {
    font-size:2.4rem;
    padding:0.45em 1.3em;
    border-radius:3rem;
}

.model_data h2 {
    text-align: center;
    font-size:4rem;
    margin:0.85em 0 0.25em;
}

.model_data .dl_list dt {
    font-size:2.8rem;
    width:21rem;
    padding:0.65em 0 0.65em 0.5em;
    line-height:1.5;
    font-weight:700;
}

.model_data .dl_list dd {
    font-size:2.8rem;
    width:calc(100% - 21rem);
    padding:0.65em 0 0.65em;
    line-height:1.5;
    font-weight:500;
}

.model_data .dl_list dt:not(:last-of-type),
.model_data .dl_list dd:not(:last-of-type) {
    border-bottom:1px solid #AEBEC9;
}

.model_data .dl_list dt:last-of-type,
.model_data .dl_list dd:last-of-type {
    border-bottom:1px solid #AEBEC9;
}

.model_concept {
    padding-left:0rem;
    margin:4rem 0 8rem;
}

.model_concept h3 {
    font-size:2.8rem;
    margin-bottom:1em;
    font-weight:700;
    letter-spacing: 0.01em;
}

.model_concept p {
    line-height:2;
    font-weight:400;
}

.model_img_wrap {
    width:100%;
    max-width:100%;
}

/*-------------------------------
    floor_plan    
-------------------------------*/

.floor_plan .yukinyan_yatta {
    width:15.7rem;
}

.floor_plan_img {
    width:100%;
    max-width:37rem;
    padding:0;
    position:relative;
    margin:6rem auto 0;
}

.floor_plan_img::after {
    width:13rem;
    height:15.7rem;
    position:absolute;
    right:0;
    bottom:100%;
}

.direction_north_northwest::after {
    background:url(../images/model_room/icon_direction_north_northwest.svg) no-repeat top center / contain;
}

/*-------------------------------
    yukinyan comment    
-------------------------------*/

.yukinyan_comment_wrap {
    margin:8.5rem auto 0;
}

.yukinyan_comment {
    width:33.6rem;
    height:27.5rem;
}

.yukinyan_comment p {
    line-height:1.45;
    font-size:2.4rem;
}

.yukinyan_comment_wrap .yukinyan_onegai {
    width:15.7rem;
    margin-top:10.5rem;
    margin-left:1rem;
}

/*-------------------------------
    model img
-------------------------------*/

.model_img_wrap {
    margin-top:15.5rem;
    max-height:100%;
    overflow-y:hidden;
}

.model_img,
.model_img_flex {
    margin-bottom:3rem;
}

.model_img_flex .model_img {
    width:47.2%;
    max-width:24.2rem;
    margin-bottom:0;
}

.model_img figcaption,
.model_img_caption {
    width:100%;
    font-size:2.4rem;
    padding-top:0.65em;
}

/*-------------------------------
    個別設定
-------------------------------*/

/*-------------------------------
    myprecious
-------------------------------*/

#myprecious .key_img img {
    object-position: 57% 50%;
}

/*-------------------------------
    villa aoi
-------------------------------*/

#villaaoi .key_img img {
    object-position: 59% 50%;
}


} /* end 768px */