@charset "UTF-8";
/* CSS Document */

.planlist{ display: grid; grid-template-columns: repeat(3,1fr); gap: 0 2%;}
.planlist article{ margin: 1.0rem 0 0 0; }
.planlist a{ display: block; background: #796c52; color: #FFF; text-decoration: none; padding: 1.0em 0; height: 100%;}
.planlist h3{ margin: 0; padding: 0 1.0rem; text-align: center; font-size: 128%; display: flex; justify-content: center; align-items: baseline; line-height: 1.0; }
.planlist h3 strong{ font-size: 250%; margin-right: 0.5rem;}
.planlist h3 span{ margin: 0 0 0 1.0rem; font-size: 146%;}
.planlist .area{ margin: 1.0rem 1.0rem 0 1.0rem; border: 1px rgba(255,255,255,0.8); border-style: solid none; text-align: center; padding: 0 0;}
.planlist .area span{ font-size: 148%; padding-left: 1.0rem;}
.planlist .body{ margin: 0.5rem 0.5rem 0 0.5rem; font-size: 86%; line-height: 1.5;}
.planlist article.tp a{ background: #231815; color: #c7bda0;}
@media screen and ( max-width: 480px ) {
  .planlist{ grid-template-columns: repeat(1,1fr);}
}

.ev{ display: grid; grid-template-columns: repeat(4,1fr); gap: 0 2%; }
.ev figcaption{ text-align: center;}
@media screen and ( max-width: 480px ) {
  .ev{ grid-template-columns: repeat(2,1fr);}
}
.fd{ display: grid; grid-template-columns: repeat(2,1fr); gap: 0 2%; }
.fd figcaption{ text-align: center;}

.planbox{ display: grid; grid-template-columns: 240px 1fr; gap: 0 2.0rem;}
.plan h3{ margin: 0; font-size: 148%; color: #796c52; text-align: center;}
.plan h3 strong{ font-size: 196%;}
.plan .floor{ margin: 0; padding: 0.4rem 0; font-size: 172%; color: #796c52; border: 1px #796c52; border-style: solid none; text-align: center;}
.plan .area{ margin: 0; text-align: center;font-size: 128%;}
.plan .area span{ font-size: 148%;}
.plan .body{ font-size: 86%; line-height: 1.5;}
.plan figure{ width: 80%; margin: 1.0rem auto 0 auto;}
.zumen h3.section_title{ margin: 0; color: #796c52;}
.zumen figure{ background: #fff;}
.zumen img{ display: block;}
.zumen ul{}
.zumen ul li{ margin: 0; font-size: 93%; line-height: 1.5; padding-left: 1.0em; text-indent: -1.0em;}
.zumen .evi{ display: none;}
.tf .plan{ background: #231815; color: #c7bda0;}
.tf .info{ margin: 0; padding: 0; background: #4f4c4b; padding-bottom: 2.0rem;}
.tf .body,
.tf .area{ padding: 0 0.5rem;}
.tf h3{ color: #c7bda0;}
.tf .floor{ color: #c7bda0; border-color:#c7bda0; }
.tf .evi{ margin-top: 2.0rem;}
.tf .zumen .section_title{ padding: 1.0rem; background: #c7bda0; color: #FFF;}
.tf .zumen .section_title img{ display: block; height: 1.9rem; width: auto; margin-top: 1.0rem;}
@media screen and ( max-width: 480px ) {
  .planbox{ display: block;}
  .plan .evi{ display: none;}
  .zumen .evi{ display: block;  padding: 2.0em 0;}
  .tf .zumen .evi{ background: #231815;}
  .zumen .evi img{ max-width: 50%; display: block; margin: 0 auto;}
}

.vr{ padding: 56.25% 0 0 0; position: relative;}
.vr iframe{ margin: 0; padding: 0; border: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.plan_note{ font-size: 86%; line-height: 1.5; padding-left: 1.0em; text-indent: -1.0em;}

.lnav{ display: grid; grid-template-columns: repeat(6,1fr); gap: 4px 1px;}
.lnav li{ margin: 0; padding: 0;}
.lnav li a{ display: block; background: rgba(113,107,84,0.5); color: #fff; text-decoration:none; line-height: 1.3; padding: 0.5em 0.3em;}
.lnav li.tf a{ background: rgba(79,76,75,0.7); color: #c7bda0;}
.lnav li a.active{ background: rgba(113,107,84,1.0);}
.lnav li.tf a.active{ background: rgba(79,76,75,1.0); }
.lnav li h3{ margin: 0; text-align: center; border-bottom: solid 1px rgba(255,255,255,0.7);}
.lnav li h3 strong{ font-size: 128%;}
.lnav li p{ margin: 0; text-align: center;}
@media screen and ( max-width: 480px ) {
  .lnav{ grid-template-columns: repeat(4,1fr);}
  
}