@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200");
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-optical-sizing: auto;
  font-style: normal;
  /*
  -webkit-transform: rotate(0.02deg);
  transform: rotate(0.02deg);
  */
}
*:before, *:after {
  pointer-events: none;
}

html {
  font-size: 62.5%;
}

body {
  font-size: 1.6rem;
  line-height: 1.8;
  position: relative;
  text-align: center;
  font-family: "Noto Serif JP", serif;
  font-weight: 400;
  letter-spacing: -0.05em;
  font-feature-settings: "palt";
}

ul li {
  list-style: none;
}

table {
  border-collapse: collapse;
}

picture {
  display: block;
}
picture.caption {
  position: relative;
  z-index: 1;
}
picture.caption::before, picture.caption::after {
  color: #000;
  text-shadow: -1px 0 5px #FFF, 1px 0 5px #FFF, 0 -1px 5px #FFF, 0 1px 5px #FFF, -1px 0 5px #FFF, 1px 0 5px #FFF, 0 -1px 5px #FFF, 0 1px 5px #FFF;
  font-size: 1.1rem;
  font-weight: bold;
  position: absolute;
  bottom: 3px;
  letter-spacing: -0.015em;
}
@media screen and (max-width: 960px) {
  picture.caption::before, picture.caption::after {
    bottom: 7px;
    font-size: 1rem;
  }
}
picture.caption::before {
  content: attr(data-left);
  left: 6px;
}
picture.caption::after {
  content: attr(data-right);
  right: 6px;
}
picture.caption.blackshadow::before, picture.caption.blackshadow::after {
  color: #FFF;
  text-shadow: -1px 0 5px #000, 1px 0 5px #000, 0 -1px 5px #000, 0 1px 5px #000;
}
picture.caption.nonshadow::before, picture.caption.nonshadow::after {
  text-shadow: none !important;
}
picture.caption.nonshadowwhite::before, picture.caption.nonshadowwhite::after {
  color: #FFF;
  text-shadow: none !important;
}

img {
  vertical-align: bottom;
  max-width: 100%;
}

sup {
  font-size: 50%;
}

.pc,
.tb,
.sp {
  display: none;
}

@media screen and (min-width: 1423.2222222222px) {
  .pc {
    display: inline-block;
  }
}
@media screen and (min-width: 1001px) and (max-width: 1422.2222222222px) {
  .pc {
    display: inline-block;
  }
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  .tb {
    display: inline-block;
  }
}
@media screen and (max-width: 960px) {
  .sp {
    display: inline-block;
  }
}
.large {
  font-size: 2.2rem;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 960px) {
  .large {
    font-size: 1.8rem;
  }
}

.medium {
  font-size: 1.6rem;
}

.small {
  font-size: 1.2rem;
}

.initBox,
.initBox2,
.initBox3 {
  margin: 0 auto;
  width: 90%;
  max-width: 1280px;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  .initBox,
  .initBox2,
  .initBox3 {
    width: 95%;
  }
}
@media screen and (max-width: 960px) {
  .initBox,
  .initBox2,
  .initBox3 {
    width: 90%;
  }
}

.initBox2 {
  margin: 0 auto;
  width: 80%;
  max-width: 1024px;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  .initBox2 {
    width: 95%;
  }
}
@media screen and (max-width: 960px) {
  .initBox2 {
    width: 90%;
  }
}

.initBox3 {
  margin: 0 auto;
  width: 80%;
  max-width: 1000px;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  .initBox3 {
    width: 95%;
  }
}
@media screen and (max-width: 960px) {
  .initBox3 {
    width: 90%;
  }
}

.inlineBox {
  display: inline-block;
}

.flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.flex.itemcenter {
  align-items: center;
}
.flex.left {
  justify-content: left;
  align-items: center;
}
.flex.left > *:not(:last-child) {
  margin-right: 1em;
}
.flex.center {
  justify-content: center;
}
.flex.center > * {
  margin-right: 0.5em;
  margin-left: 0.5em;
}
.flex.c2 > * {
  width: 48%;
  margin-bottom: 1rem;
}
.flex.c2 > *:nth-last-child(1), .flex.c2 > *:nth-last-child(2) {
  margin-bottom: 0;
}
.flex.c2 > *.wide {
  width: 100%;
}
.flex.c2max {
  flex-wrap: nowrap;
}
.flex.c2max > * {
  width: 50%;
}
.flex.c1-2 > *, .flex.c3 > * {
  width: 30%;
  margin-bottom: 1rem;
}
.flex.c1-2 > *:nth-last-child(1), .flex.c1-2 > *:nth-last-child(2), .flex.c1-2 > *:nth-last-child(3), .flex.c3 > *:nth-last-child(1), .flex.c3 > *:nth-last-child(2), .flex.c3 > *:nth-last-child(3) {
  margin-bottom: 0;
}
.flex.c3 > *.wide2 {
  width: 65%;
}
.flex.c1-2 > *:nth-child(2n+1) {
  width: 30%;
}
.flex.c1-2 > *:nth-child(2n) {
  width: 65%;
}
.flex.c2-1 > *:nth-child(2n+1) {
  width: 65%;
}
.flex.c2-1 > *:nth-child(2n) {
  width: 30%;
}
.flex.c4 > * {
  width: 22%;
  margin-bottom: 1rem;
}
.flex.c4 > *:nth-last-child(1), .flex.c4 > *:nth-last-child(2), .flex.c4 > *:nth-last-child(3), .flex.c4 > *:nth-last-child(4) {
  margin-bottom: 0;
}
@media screen and (max-width: 960px) {
  .flex.c2.spone, .flex.c3.spone, .flex.c1-2.spone, .flex.c2-1.spone, .flex.c4.spone {
    flex-wrap: wrap;
  }
  .flex.c2.spone > *, .flex.c3.spone > *, .flex.c1-2.spone > *, .flex.c2-1.spone > *, .flex.c4.spone > * {
    width: 100%;
  }
  .flex.c2.spone > *:not(:last-child), .flex.c3.spone > *:not(:last-child), .flex.c1-2.spone > *:not(:last-child), .flex.c2-1.spone > *:not(:last-child), .flex.c4.spone > *:not(:last-child) {
    margin-bottom: 1em;
  }
}

.grid {
  display: grid;
}
.grid.g2 {
  grid-template-columns: repeat(2, 1fr);
}
.grid > *.wide2 {
  grid-column: span 2;
}

.mt0 {
  margin-top: 0;
}

.mt05 {
  margin-top: 0.5em;
}

.mt1 {
  margin-top: 1em;
}

.mt2 {
  margin-top: 2em;
}

.mt4 {
  margin-top: 4em;
}

.mb0 {
  margin-bottom: 0;
}

.mb05 {
  margin-bottom: 0.5em;
}

.mb1 {
  margin-bottom: 1em;
}

.mb2 {
  margin-bottom: 2em;
}

.mb4 {
  margin-bottom: 4em;
}

.mbL {
  margin-bottom: 7rem;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  .mbL {
    margin-bottom: 4rem;
  }
}
@media screen and (max-width: 960px) {
  .mbL {
    margin-bottom: 4rem;
  }
}

.mpL {
  padding-bottom: 7rem;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  .mpL {
    padding-bottom: 4rem;
  }
}
@media screen and (max-width: 960px) {
  .mpL {
    padding-bottom: 4rem;
  }
}

.mtM {
  margin-top: 4rem;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  .mtM {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 960px) {
  .mtM {
    margin-top: 2rem;
  }
}

.mbM {
  margin-bottom: 4rem;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  .mbM {
    margin-bottom: 2rem;
  }
}
@media screen and (max-width: 960px) {
  .mbM {
    margin-bottom: 2rem;
  }
}

.mbS {
  margin-bottom: 1rem;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  .mbS {
    margin-bottom: 0.5rem;
  }
}
@media screen and (max-width: 960px) {
  .mbS {
    margin-bottom: 0.5rem;
  }
}

.maincolor {
  color: #391b09;
}

.subcolor1 {
  color: #8d7642;
}

.subcolor2 {
  color: yellow;
}

.subcolor3 {
  color: #5882a7;
}

.left {
  text-align: left;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.redcolor {
  color: #c60f28;
}

.cautionUl li {
  text-align: left;
  list-style: none;
  margin-left: 1em;
  text-indent: -1em;
}

a {
  transition: 0.5s;
}
a.tel {
  text-decoration: none;
  pointer-events: none;
  color: black;
}
@media screen and (max-width: 960px) {
  a.tel {
    text-decoration: underline;
    color: #8d7642;
    pointer-events: all;
  }
}

.ggmap {
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
}
@media screen and (max-width: 960px) {
  .ggmap {
    padding-bottom: 75%;
  }
}
.ggmap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 960px) {
  .spscroll {
    position: relative;
    width: 100%;
    overflow-x: scroll;
  }
  .spscroll::before, .spscroll::after {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .spscroll::before {
    content: "";
    width: 7rem;
    height: 7rem;
    background: rgba(0, 0, 0, 0.75);
  }
  .spscroll::after {
    font-family: "Material Symbols Outlined";
    content: "\e9ec";
    vertical-align: middle;
    line-height: 1.6;
    font-size: 5rem;
    color: white;
    animation: spscrollicon_after ease-in 1s infinite;
  }
  .spscroll.isactive::before, .spscroll.isactive::after {
    animation: spscrollicon 1s forwards;
  }
}
@keyframes spscrollicon_after {
  0% {
    transform: translate(-50%, -50%) rotate(-20deg);
  }
  50% {
    transform: translate(-50%, -50%) rotate(20deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(-20deg);
  }
}
@keyframes spscrollicon {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease;
  z-index: 10;
}
.modal-overlay .modal-content {
  position: relative;
  max-width: 1920px;
  box-shadow: 0 2rem 4rem rgba(0, 0, 0, 0.6);
  transform: translateY(-3rem);
  opacity: 0;
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.modal-overlay.active {
  opacity: 1;
  pointer-events: auto;
}
.modal-overlay.active .modal-content {
  transform: translateY(0);
  opacity: 1;
}
.modal-overlay .modal-close {
  position: absolute;
  top: 1rem;
  right: 1.5rem;
  font-size: 1.5rem;
  color: rgba(255, 255, 255, 0.3);
  cursor: pointer;
  transition: color 0.5s;
  z-index: 9;
}
.modal-overlay .modal-close:hover {
  color: rgba(255, 255, 255, 0.8);
}

.globalnav {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  line-height: 1;
  padding: 1.5rem 0;
  transition: 0.5s;
  max-width: 1400px;
  margin: 0 auto;
}
.globalnav li {
  /*
  width: calc($maxwidth / 11);
  */
  flex-grow: 1;
  border-right: 1px solid black;
}
.globalnav li a {
  display: block;
  text-decoration: none;
  color: black;
  /*
  font-size: 1.2rem;
  */
  font-size: clamp(1.2rem, 1vw, 1.5rem);
  white-space: nowrap;
  padding: 0.4rem 0;
  position: relative;
}
.globalnav li a:after {
  content: "";
  width: 0%;
  height: 3px;
  position: absolute;
  bottom: -8px;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  transition: 0.3s;
}
@media screen and (max-width: 960px) {
  .globalnav li a:after {
    bottom: 0;
  }
}
.globalnav li a:hover:not(.nowpage) {
  color: #8d7642;
  font-weight: bold;
}
.globalnav li a:hover:after {
  width: 100%;
}
.globalnav li a.nowpage:after {
  width: 100%;
  background: #8d7642;
}
.globalnav li:first-child {
  border-left: 1px solid black;
}
.globalnav li.map_mr, .globalnav li.map, .globalnav li.outline {
  display: none;
}
@media screen and (max-width: 960px) {
  .globalnav li.map_mr, .globalnav li.map, .globalnav li.outline {
    display: block;
  }
}
@media screen and (max-width: 960px) {
  .globalnav {
    display: none;
    grid-template-columns: repeat(2, 1fr);
    position: fixed;
    bottom: 6rem;
    left: 0;
    width: 100%;
    z-index: 10;
    transition: 0.5s;
    background: black;
    padding: 0;
  }
  .globalnav li {
    border-right: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  }
  .globalnav li:first-child {
    border-left: none;
  }
  .globalnav li:nth-child(2n) {
    border-left: 1px solid rgba(255, 255, 255, 0.5);
  }
  .globalnav li a {
    padding: 1.5em 0;
    color: white;
  }
}

nav:has(.globalnav) {
  background: #f0f0f0;
}

#headerBox {
  line-height: 1;
  box-shadow: 0 0.5rem 0.5rem rgba(0, 0, 0, 0.2);
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 5;
  background: rgba(255, 255, 255, 0.9);
}
#headerBox > .flex {
  padding: 2rem 0 1rem 0;
  text-align: left;
  transition: 0.5s;
}
@media screen and (max-width: 960px) {
  #headerBox > .flex {
    padding: 1rem 0;
    display: block;
  }
}
#headerBox > .flex h1 {
  margin-left: 2%;
}
#headerBox > .flex h1 img {
  height: 4.5rem;
  transition: 0.5s;
}
@media screen and (max-width: 960px) {
  #headerBox > .flex h1 {
    text-align: center;
    margin-left: 0;
    line-height: 1;
  }
  #headerBox > .flex h1 .logo img {
    height: 4rem;
  }
  #headerBox > .flex h1 .title img {
    height: 3.5rem;
  }
}
#headerBox > .flex nav {
  flex: 1;
}
@media screen and (max-width: 960px) {
  #headerBox > .flex nav {
    display: none;
  }
}
#headerBox > .flex nav .flex {
  flex-wrap: nowrap;
  justify-content: right;
}
#headerBox > .flex nav .flex a {
  display: inline-block;
}
#headerBox > .flex nav .flex .telbox {
  margin-right: 1rem;
}
#headerBox > .flex nav .flex .telbox img {
  height: 4.5rem;
  transition: 0.5s;
}
#headerBox > .flex nav .flex .submenu {
  margin-right: 1rem;
  display: flex;
  align-items: flex-end;
}
#headerBox > .flex nav .flex .submenu ul {
  display: flex;
  justify-content: left;
  /*
  li {
  	a {
  		color: black(1);
  		text-decoration: none;
  		font-size: calc(50px / 4);
  		&:hover {
  			color: subcolor1(1);
  		}
  		&:before {
  			@include wf('\f591');
  			line-height: 1;
  		}
  	}
  }
  */
}
#headerBox > .flex nav .flex .submenu ul li:not(:last-child) {
  margin-right: 1rem;
}
#headerBox > .flex nav .flex .submenu ul li a {
  background: #c1c1c1;
  padding: 0.5em 2em;
  line-height: 1;
  white-space: nowrap;
  font-size: 1.2rem;
  text-decoration: none;
  color: white;
}
#headerBox > .flex nav .flex .submenu ul li a:hover {
  background: #c60f28;
}
#headerBox > .flex nav .flex .request a,
#headerBox > .flex nav .flex .appointment a {
  margin-top: -2rem;
  display: block;
  height: calc(100% + 2rem);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 3rem;
  text-decoration: none;
  transition: 0.5s;
  /*
  color: white(1);
  background: maincolor(1);
  &:hover {
  	background: hovercolor(1);
  }
  */
}
#headerBox > .flex nav .flex .request a {
  /*background: subcolor1b(1);*/
  color: black;
  background: linear-gradient(-75deg, #a18d7f, #d9c69c 50%, #a18d7f);
}
#headerBox > .flex nav .flex .request a:hover {
  background: linear-gradient(-125deg, #a18d7f, #d9c69c 50%, #a18d7f);
}
#headerBox > .flex nav .flex .appointment a {
  color: white;
  background: linear-gradient(-75deg, #391b09, #8e4418 50%, #391b09);
}
#headerBox > .flex nav .flex .appointment a:hover {
  background: linear-gradient(-125deg, #391b09, #8e4418 50%, #391b09);
}
@media screen and (min-width: 1001px) {
  #headerBox.slim .globalnav {
    padding: 1rem 0;
  }
  #headerBox.slim .globalnav li.toppage a:before {
    top: calc((1rem + 0.5em + 0.125em) * -1);
  }
  #headerBox.slim > .flex {
    padding: 1rem 0;
  }
  #headerBox.slim > .flex h1 img {
    height: 3rem;
  }
  #headerBox.slim > .flex nav .flex .telbox img {
    height: 3rem;
  }
  #headerBox.slim > .flex nav .flex .request a,
  #headerBox.slim > .flex nav .flex .appointment a {
    margin-top: -1rem;
    height: calc(100% + 1rem);
    font-size: 1.4rem;
  }
}

#footerBox {
  /*margin-top: 4em;*/
}
@media screen and (max-width: 960px) {
  #footerBox {
    position: relative;
    z-index: 1;
  }
}
#footerBox .flex {
  flex-wrap: nowrap;
  align-items: center;
  padding: 1em 0;
}
#footerBox .flex .lefttext dl {
  display: flex;
  flex-wrap: nowrap;
  justify-content: left;
  align-items: center;
}
#footerBox .flex .lefttext dl dt {
  font-size: 1.4rem;
  margin-right: 1em;
  white-space: nowrap;
}
#footerBox .flex .lefttext dl dd {
  width: 22.5vw;
  max-width: 270px;
}
#footerBox .flex .lefttext dl dd a:hover {
  opacity: 0.5;
}
#footerBox .flex .righttext a {
  display: block;
  width: 55.8333333333vw;
  max-width: 670px;
}
@media screen and (max-width: 960px) {
  #footerBox .flex {
    flex-wrap: wrap;
  }
  #footerBox .flex .lefttext {
    width: 100%;
    margin-bottom: 1em;
  }
  #footerBox .flex .lefttext dl dt {
    font-size: 1.2rem;
  }
  #footerBox .flex .lefttext dl dd {
    width: 100%;
  }
  #footerBox .flex .righttext {
    width: 100%;
  }
  #footerBox .flex .righttext a {
    width: 100%;
  }
}
#footerBox small {
  margin-top: 2rem;
  border-top: 1px solid black;
  padding: 2rem 0;
  display: block;
}
#footerBox #pagetop {
  opacity: 0;
  pointer-events: none;
}
#footerBox #pagetop.isactive {
  opacity: 1;
  pointer-events: all;
  position: fixed;
  bottom: 10em;
  right: 0;
  z-index: 2;
}
#footerBox #pagetop.isactive a {
  background: #391b09;
  color: white;
  transform: rotate(-90deg);
  text-decoration: none;
  display: inline-block;
  padding: 0.5em 1em;
  letter-spacing: 0.05em;
  font-size: 1.4rem;
  transform-origin: right bottom;
}
#footerBox #pagetop.isactive a:after {
  font-family: "Material Symbols Outlined";
  content: "\e5cc";
  vertical-align: middle;
  line-height: 1.6;
}
#footerBox #pagetop.isactive a:hover {
  background: #8d7642;
}
@media screen and (max-width: 960px) {
  #footerBox #pagetop.isactive {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
  }
}
#footerBox .request,
#footerBox .appointment,
#footerBox .subtel,
#footerBox #spmenuchecklabel {
  display: none;
}
@media screen and (max-width: 960px) {
  #footerBox .request,
  #footerBox .appointment,
  #footerBox .subtel,
  #footerBox #spmenuchecklabel {
    display: block;
    position: fixed;
    bottom: 0;
    width: 25%;
    height: 6.1rem;
    border-top: 1px solid black;
  }
  #footerBox .request a,
  #footerBox .appointment a,
  #footerBox .subtel a,
  #footerBox #spmenuchecklabel a {
    line-height: 1;
    display: block;
    padding: 1rem 0;
    font-size: 1.2rem;
    background: white;
    text-decoration: none;
  }
  #footerBox .request a::before,
  #footerBox .appointment a::before,
  #footerBox .subtel a::before,
  #footerBox #spmenuchecklabel a::before {
    font-size: 2.8rem;
    display: block;
  }
}
#footerBox .request {
  border-right: 1px solid black;
  left: 0;
}
#footerBox .request a {
  /*background: maincolor(1);*/
  color: black;
  background: linear-gradient(-75deg, #a18d7f, #d9c69c 50%, #a18d7f);
}
#footerBox .request a::before {
  font-weight: 200;
  font-family: "Material Symbols Outlined";
  content: "\e158";
  vertical-align: middle;
  line-height: 1.6;
  line-height: 1;
}
#footerBox .appointment {
  border-right: 1px solid black;
  left: 25%;
}
#footerBox .appointment a {
  /*background: subcolor1(1);*/
  background: linear-gradient(-75deg, #391b09, #8e4418 50%, #391b09);
  color: white;
}
#footerBox .appointment a::before {
  font-family: "Material Symbols Outlined";
  content: "\f540";
  vertical-align: middle;
  line-height: 1.6;
  line-height: 1;
}
#footerBox .subtel {
  border-right: 1px solid black;
  left: 50%;
}
#footerBox .subtel a {
  color: black;
}
#footerBox .subtel a::before {
  font-family: "Material Symbols Outlined";
  content: "\e0b0";
  vertical-align: middle;
  line-height: 1.6;
  line-height: 1;
}
#footerBox #spmenuchecklabel {
  line-height: 1;
  padding: calc(1rem - 1px) 0 1rem;
  background: #c1c1c1;
  left: 75%;
}
#footerBox #spmenuchecklabel span {
  padding-top: 2.8rem;
  font-size: 1.2rem;
  position: relative;
  display: inline-block;
}
#footerBox #spmenuchecklabel span::before, #footerBox #spmenuchecklabel span::after {
  content: "";
  width: 100%;
  height: 3px;
  background: black;
  position: absolute;
  left: 0;
  transition: 0.3s;
}
#footerBox #spmenuchecklabel span::before {
  top: 9px;
}
#footerBox #spmenuchecklabel span::after {
  top: 15px;
}
#footerBox #spmenucheck {
  display: none;
}
#footerBox #spmenucheck:checked ~ #spmenuchecklabel span::before {
  top: 12px;
  transform: rotate(-225deg);
}
#footerBox #spmenucheck:checked ~ #spmenuchecklabel span::after {
  top: 12px;
  transform: rotate(225deg);
}
#footerBox #spmenucheck:checked ~ nav .globalnav {
  display: grid;
}
@media screen and (max-width: 960px) {
  #footerBox {
    margin-bottom: 6rem;
  }
}

@keyframes fadeUtoD {
  from {
    opacity: 0;
    transform: translateY(-20px);
    filter: brightness(10);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    filter: brightness(1);
  }
}
@keyframes fadeLtoR {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
/*
.scrollin {
	opacity: 0;
	&.isactive {
		animation: fadeLtoR 2s ease 0s 1 normal forwards;
	}
}
*/
#top {
  margin-top: -12.5rem;
  padding-bottom: 12.5rem;
}
@media screen and (max-width: 960px) {
  #top {
    margin-top: -6rem;
    padding-bottom: 6rem;
  }
}

#mainContentsBox {
  color: #595757;
  margin-top: 12.5rem;
}
@media screen and (max-width: 960px) {
  #mainContentsBox {
    margin-top: 6rem;
  }
}
#mainContentsBox h3 {
  font-size: 3.6rem;
  letter-spacing: 0.05em;
  font-weight: 400;
}
#mainContentsBox h3 .smaller {
  font-size: 83.3333333333%;
}
#mainContentsBox h3.linetitle {
  padding-bottom: 0.5em;
  border-bottom: 1px solid black;
  position: relative;
  margin-bottom: 0.5em;
}
#mainContentsBox h3.linetitle::after {
  content: "";
  width: 21.5053763441%;
  height: 3px;
  background: #8d7642;
  position: absolute;
  bottom: -2px;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 960px) {
  #mainContentsBox h3 {
    font-size: 2.4rem;
    line-height: 1.5;
  }
}
#mainContentsBox h4 {
  font-size: 2rem;
  letter-spacing: 0.25em;
  font-weight: 400;
}
#mainContentsBox #pagetitle {
  /*aspect-ratio: 1920 / 630;*/
  aspect-ratio: 1920/470;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  text-shadow: 0 0 8px rgba(0, 0, 0, 0.8);
}
#mainContentsBox #pagetitle picture {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
}
#mainContentsBox #pagetitle picture img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#mainContentsBox #pagetitle picture::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  /*
  background: linear-gradient(90deg, rgba(#756860, 0), rgba(#756860, 0.65) 50%, rgba(#756860, 0));
  mix-blend-mode: multiply;
  */
  background: rgba(0, 0, 0, 0.5);
}
#mainContentsBox #pagetitle h2 {
  font-size: 4rem;
  letter-spacing: 0.2em;
  color: white;
  font-weight: normal;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 960px) {
  #mainContentsBox #pagetitle h2 {
    font-size: 2rem;
  }
}
#mainContentsBox #breadcrumb {
  text-align: left;
}
#mainContentsBox #breadcrumb ul {
  padding: 2rem 0 3rem;
  display: flex;
  flex-wrap: nowrap;
  justify-content: left;
}
#mainContentsBox #breadcrumb ul li {
  color: rgba(0, 0, 0, 0.5);
  font-size: 1.2rem;
}
#mainContentsBox #breadcrumb ul li a {
  text-decoration: none;
  color: rgba(0, 0, 0, 0.5);
}
#mainContentsBox #breadcrumb ul li a:after {
  font-family: "Material Symbols Outlined";
  content: "\e5cc";
  vertical-align: middle;
  line-height: 1.6;
  margin: 0 0.25em;
}
#mainContentsBox #breadcrumb ul li a:hover {
  color: #8d7642;
}
@media screen and (max-width: 960px) {
  #mainContentsBox #breadcrumb ul {
    padding: 1rem 0 2rem;
  }
}
#mainContentsBox a {
  color: #391b09;
}
#mainContentsBox a.btn2, #mainContentsBox a.btn {
  display: inline-block;
  color: black;
  text-decoration: none;
  padding: 0.75em 3em;
  background: linear-gradient(-75deg, #a18d7f, #d9c69c 50%, #a18d7f);
  position: relative;
  letter-spacing: 0.05em;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  margin: 0 0.5em;
}
@media screen and (max-width: 960px) {
  #mainContentsBox a.btn2, #mainContentsBox a.btn {
    margin-top: 1rem;
  }
}
#mainContentsBox a.btn2::after, #mainContentsBox a.btn::after {
  font-family: "Material Symbols Outlined";
  content: "\e5cc";
  vertical-align: middle;
  line-height: 1.6;
  position: absolute;
  top: calc(50% - 0.75em);
  right: 1em;
  transition: 0.3s;
}
#mainContentsBox a.btn2:hover, #mainContentsBox a.btn:hover {
  background: linear-gradient(-125deg, #a18d7f, #d9c69c 50%, #a18d7f);
  box-shadow: none;
}
#mainContentsBox a.btn2:hover::after, #mainContentsBox a.btn:hover::after {
  right: 0.5em;
}
#mainContentsBox a.btn2.normal, #mainContentsBox a.btn.normal {
  background: #c1c1c1;
}
#mainContentsBox a.btn2 {
  color: white;
  background: linear-gradient(-75deg, #391b09, #8e4418 50%, #391b09);
}
#mainContentsBox a.btn2:hover {
  background: linear-gradient(-125deg, #391b09, #8e4418 50%, #391b09);
}
#mainContentsBox #footerconversion {
  padding: 7rem 0;
}
#mainContentsBox #footerconversion .flex.center > * {
  margin-right: 0;
  margin-left: 0;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  #mainContentsBox #footerconversion {
    padding: 4rem 0;
  }
}
@media screen and (max-width: 960px) {
  #mainContentsBox #footerconversion {
    padding: 4rem 0;
  }
}
#mainContentsBox .pointlists,
#mainContentsBox .equipmentlists2,
#mainContentsBox .equipmentlists4,
#mainContentsBox .equipmentlists {
  display: grid;
}
#mainContentsBox .pointlists li h4,
#mainContentsBox .equipmentlists2 li h4,
#mainContentsBox .equipmentlists4 li h4,
#mainContentsBox .equipmentlists li h4 {
  margin-bottom: 1rem;
}
#mainContentsBox .pointlists li h5,
#mainContentsBox .equipmentlists2 li h5,
#mainContentsBox .equipmentlists4 li h5,
#mainContentsBox .equipmentlists li h5 {
  font-size: 1.8rem;
  margin-bottom: 0.5rem;
  font-weight: normal;
  text-align: left;
}
@media screen and (max-width: 960px) {
  #mainContentsBox .pointlists li h5,
  #mainContentsBox .equipmentlists2 li h5,
  #mainContentsBox .equipmentlists4 li h5,
  #mainContentsBox .equipmentlists li h5 {
    font-size: 1.6rem;
    line-height: 1.25;
    margin-bottom: 0.5em;
  }
}
#mainContentsBox .pointlists li .detail,
#mainContentsBox .equipmentlists2 li .detail,
#mainContentsBox .equipmentlists4 li .detail,
#mainContentsBox .equipmentlists li .detail {
  font-size: 1.4rem;
  text-align: left;
  text-align: justify;
}
@media screen and (max-width: 960px) {
  #mainContentsBox .pointlists li .detail,
  #mainContentsBox .equipmentlists2 li .detail,
  #mainContentsBox .equipmentlists4 li .detail,
  #mainContentsBox .equipmentlists li .detail {
    line-height: 1.5;
  }
}
#mainContentsBox .pointlists li .flex:has(.caption),
#mainContentsBox .equipmentlists2 li .flex:has(.caption),
#mainContentsBox .equipmentlists4 li .flex:has(.caption),
#mainContentsBox .equipmentlists li .flex:has(.caption) {
  align-items: flex-start;
}
#mainContentsBox .pointlists li .flex:has(.caption) picture,
#mainContentsBox .equipmentlists2 li .flex:has(.caption) picture,
#mainContentsBox .equipmentlists4 li .flex:has(.caption) picture,
#mainContentsBox .equipmentlists li .flex:has(.caption) picture {
  display: inline-block;
}
#mainContentsBox .pointlists,
#mainContentsBox .equipmentlists {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5rem 3rem;
}
@media screen and (max-width: 960px) {
  #mainContentsBox .pointlists,
  #mainContentsBox .equipmentlists {
    grid-template-columns: repeat(2, 1fr);
    gap: 2.5rem 1.5rem;
  }
  #mainContentsBox .pointlists picture img,
  #mainContentsBox .equipmentlists picture img {
    margin-bottom: 0.5rem;
  }
}
#mainContentsBox .equipmentlists2 {
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem 1.5rem;
}
#mainContentsBox .equipmentlists4 {
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem 3rem;
}
@media screen and (max-width: 960px) {
  #mainContentsBox .equipmentlists4 {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem 1.5rem;
  }
}
#mainContentsBox .equipmentlists4 li.w3h2 {
  grid-row: span 2;
  grid-column: span 3;
}
@media screen and (max-width: 960px) {
  #mainContentsBox .equipmentlists4 li.w3h2 {
    grid-column: span 1;
  }
}
#mainContentsBox .equipmentlists4 li.wide {
  grid-column: span 2;
}
@media screen and (max-width: 960px) {
  #mainContentsBox .equipmentlists4 li.wide {
    grid-column: span 1;
  }
}
#mainContentsBox .anchornav ul {
  display: flex;
  justify-content: center;
}
#mainContentsBox .anchornav ul li {
  display: inline-block;
  margin: 0 1em;
}
#mainContentsBox .anchornav ul li a {
  text-decoration: none;
  padding: 0.5em 1em;
  letter-spacing: 0.05em;
  border-top: 1px solid #391b09;
  border-bottom: 1px solid #391b09;
  position: relative;
}
#mainContentsBox .anchornav ul li a:hover {
  /*	letter-spacing: 0.5em; */
}
#mainContentsBox .anchornav ul li a:hover::after {
  content: "";
  width: 0;
  height: 0;
  border: 0.5em solid transparent;
  border-top-color: #391b09;
  position: absolute;
  bottom: -1em;
  left: 50%;
  transform: translateX(-50%);
}
#mainContentsBox .brown {
  background: #391b09;
  color: white;
}

#attention {
  font-size: 1.2rem;
  padding-bottom: 7rem;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  #attention {
    padding-bottom: 4rem;
  }
}
@media screen and (max-width: 960px) {
  #attention {
    padding-bottom: 4rem;
  }
}
#attention .advancenoticeads {
  display: inline-block;
}
#attention .advancenoticeads dl {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}
#attention .advancenoticeads dl dt {
  width: 8em;
  border: 1px solid black;
  display: flex;
  justify-content: center;
  align-items: center;
  letter-spacing: 0.1em;
}
#attention .advancenoticeads dl dd {
  flex: 1;
  padding-left: 1em;
  text-align: left;
}
@media screen and (max-width: 960px) {
  #attention .advancenoticeads {
    padding: 0 5%;
  }
  #attention .advancenoticeads dl {
    flex-wrap: wrap;
  }
  #attention .advancenoticeads dl dt {
    width: 100%;
    margin-bottom: 1em;
  }
  #attention .advancenoticeads dl dd {
    width: 100%;
    padding-left: 0;
  }
}
#attention .cautionUl.inline {
  display: flex;
  justify-content: left;
  flex-wrap: wrap;
}
#attention .cautionUl.inline li {
  display: inline-block;
}
#attention .cautionUl.inline li + li {
  margin-left: 2em;
}
@media screen and (max-width: 960px) {
  #attention .cautionUl.inline li + li {
    margin-left: 1em;
  }
}
#attention .cautionUl.inline li.w100 {
  width: 100%;
  margin-left: 1em;
}
#attention.brown .advancenoticeads dl dt {
  border-color: white;
}
#attention .linetitle {
  margin-bottom: 0.5em;
  position: relative;
  line-height: 1;
  text-align: left;
}
#attention .linetitle::before {
  content: "";
  width: 100%;
  height: 0;
  border-bottom: 1px solid black;
  position: absolute;
  top: 50%;
  left: 0;
  z-index: -1;
}
#attention .linetitle span {
  display: inline-block;
  padding-right: 1.5em;
  background: white;
}

#toppage .kerning {
  letter-spacing: -0.5em;
}
#toppage h3 {
  letter-spacing: 0.1em;
}
#toppage h3 .smaller {
  font-size: 86%;
}
@media screen and (max-width: 960px) {
  #toppage h3 {
    font-size: 3rem;
  }
}
#toppage #mainContentsBox #mainimage {
  position: relative;
  z-index: 1;
  box-shadow: 0 0.5rem 0.5rem rgba(0, 0, 0, 0.1);
  aspect-ratio: 1920/1110;
  position: relative;
  overflow: hidden;
  background: url(../img/home/mainimage01.jpg) no-repeat 50% 50%;
  background-size: cover;
}
#toppage #mainContentsBox #mainimage .initBox {
  max-width: 1920px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
#toppage #mainContentsBox #mainimage .initBox .copy {
  text-align: center;
  color: white;
}
#toppage #mainContentsBox #mainimage .initBox .copy h2 {
  margin-bottom: min(2.6041666667vw, 5rem);
}
#toppage #mainContentsBox #mainimage .initBox .copy h2.isactive {
  animation: fadeUtoD 1s ease 0s 1 normal forwards;
}
#toppage #mainContentsBox #mainimage .initBox .copy h2 img {
  width: 32.1875vw;
  max-width: 618px;
}
#toppage #mainContentsBox #mainimage .initBox .copy h3 {
  font-size: 1rem;
  margin-bottom: min(2.6041666667vw, 3rem);
}
#toppage #mainContentsBox #mainimage .initBox .copy h3 img {
  width: 51.3541666667vw;
  max-width: 986px;
}
#toppage #mainContentsBox #mainimage .initBox .copy p {
  font-size: min(1.3541666667vw, 1.5rem);
  letter-spacing: 0.1em;
}
#toppage #mainContentsBox #mainimage .initBox .copy p span {
  letter-spacing: 0.2em;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimage .initBox .copy h2,
  #toppage #mainContentsBox #mainimage .initBox .copy h3 {
    margin-bottom: 1em;
  }
  #toppage #mainContentsBox #mainimage .initBox .copy h2 img,
  #toppage #mainContentsBox #mainimage .initBox .copy h3 img {
    width: 75%;
  }
  #toppage #mainContentsBox #mainimage .initBox .copy h3 {
    margin-bottom: 2em;
  }
  #toppage #mainContentsBox #mainimage .initBox .copy p {
    font-size: 1.4rem;
    text-align: left;
    padding: 0 2em;
    letter-spacing: 0;
  }
  #toppage #mainContentsBox #mainimage .initBox .copy p span {
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 960px) and (max-width: 374px) {
  #toppage #mainContentsBox #mainimage .initBox .copy p {
    padding: 0;
  }
}
#toppage #mainContentsBox #mainimage .initBox #slickimage {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimage {
    background-image: url(../img/home/mainimage01a_sp.jpg);
    aspect-ratio: auto;
    padding: 5rem 0;
  }
  #toppage #mainContentsBox #mainimage::before, #toppage #mainContentsBox #mainimage::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
    animation: bgAnime 10s infinite;
  }
  #toppage #mainContentsBox #mainimage::before {
    background-image: url(../img/home/mainimage01a_sp.jpg);
  }
  #toppage #mainContentsBox #mainimage::after {
    background-image: url(../img/home/mainimage01b_sp.jpg);
    animation-delay: 5s;
  }
}
#toppage #mainContentsBox #mainimage02 {
  overflow: hidden;
  aspect-ratio: 1920/1111;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimage02 {
    aspect-ratio: 1370/1276;
  }
}
#toppage #mainContentsBox #mainimage02 .init {
  position: relative;
  z-index: 1;
  box-shadow: 0 0.5rem 0.5rem rgba(0, 0, 0, 0.1);
  overflow: hidden;
  background: url(../img/home/mv02/mainimage.jpg) no-repeat 50% 100%;
  background-size: cover;
  aspect-ratio: 1920/1111;
  opacity: 0;
  animation: mainimage02 3s ease 0s 1 normal forwards;
  /*
  &::before, 
  &::after {
  	content: '';
  	width: 100%;
  	aspect-ratio: 1920 / 612;
  	background-position: 50% 50%;
  	background-repeat: no-repeat;
  	background-size: contain;
  	position: absolute;
  	bottom: 0;
  	left: 0;
  	opacity: 0;
  	mix-blend-mode: multiply;
  	@include resp(sp){
  		aspect-ratio: 1370 / 612;
  	}
  }
  &::before {
  	background-image: url(../img/home/mv02/plot01.png);
  	animation: blur 1s ease 3s 1 normal forwards;
  	@include resp(sp){
  		background-image: url(../img/home/mv02/plot01_sp.png);
  	}
  }
  &::after {
  	background-image: url(../img/home/mv02/plot02.png);
  	animation: mainimage02 1s ease 4s 1 normal forwards;
  	@include resp(sp){
  		background-image: url(../img/home/mv02/plot02_sp.png);
  	}
  }
  */
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimage02 .init {
    aspect-ratio: 1370/1276;
    background-image: url(../img/home/mv02/mainimage_sp.jpg);
  }
}
#toppage #mainContentsBox #mainimage02 .init span.ploat {
  position: relative;
  z-index: 3;
}
#toppage #mainContentsBox #mainimage02 .init span.plot::before,
#toppage #mainContentsBox #mainimage02 .init span.plot::after, #toppage #mainContentsBox #mainimage02 .init::before, #toppage #mainContentsBox #mainimage02 .init::after {
  content: "";
  width: 100%;
  aspect-ratio: 1920/614;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimage02 .init span.plot::before,
  #toppage #mainContentsBox #mainimage02 .init span.plot::after, #toppage #mainContentsBox #mainimage02 .init::before, #toppage #mainContentsBox #mainimage02 .init::after {
    aspect-ratio: 1370/614;
  }
}
#toppage #mainContentsBox #mainimage02 .init::before, #toppage #mainContentsBox #mainimage02 .init::after {
  mix-blend-mode: multiply;
  z-index: -1;
}
#toppage #mainContentsBox #mainimage02 .init span.plot::before, #toppage #mainContentsBox #mainimage02 .init::before {
  background-image: url(../img/home/mv02/plot01b.png);
  animation: blur 1s ease 3s 1 normal forwards;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimage02 .init span.plot::before, #toppage #mainContentsBox #mainimage02 .init::before {
    background-image: url(../img/home/mv02/plot01b_sp.png);
  }
}
#toppage #mainContentsBox #mainimage02 .init span.plot::before {
  background-image: url(../img/home/mv02/plot01t.png);
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimage02 .init span.plot::before {
    background-image: url(../img/home/mv02/plot01t_sp.png);
  }
}
#toppage #mainContentsBox #mainimage02 .init span.plot::after, #toppage #mainContentsBox #mainimage02 .init::after {
  background-image: url(../img/home/mv02/plot02b.png);
  animation: mainimage02 1s ease 4s 1 normal forwards;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimage02 .init span.plot::after, #toppage #mainContentsBox #mainimage02 .init::after {
    background-image: url(../img/home/mv02/plot02b_sp.png);
  }
}
#toppage #mainContentsBox #mainimage02 .init span.plot::after {
  background-image: url(../img/home/mv02/plot02t.png);
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimage02 .init span.plot::after {
    background-image: url(../img/home/mv02/plot02t_sp.png);
  }
}
#toppage #mainContentsBox #mainimage02 .init #mainimagecopy h2 {
  margin-top: 5.2083333333vw;
  margin-bottom: min(2.6041666667vw, 5rem);
}
#toppage #mainContentsBox #mainimage02 .init #mainimagecopy h2.isactive {
  animation: fadeUtoD 1s ease 0s 1 normal forwards;
}
#toppage #mainContentsBox #mainimage02 .init #mainimagecopy h2 img {
  width: min(48.28125%, 927px);
}
#toppage #mainContentsBox #mainimage02 .init #mainimagecopy h3 {
  font-size: 1rem;
}
#toppage #mainContentsBox #mainimage02 .init #mainimagecopy h3 img {
  width: min(42.7083333333%, 820px);
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimage02 .init #mainimagecopy h2 {
    margin-top: 13.0208333333vw;
    margin-bottom: 2rem;
  }
  #toppage #mainContentsBox #mainimage02 .init #mainimagecopy h2 img {
    width: 65%;
  }
  #toppage #mainContentsBox #mainimage02 .init #mainimagecopy h3 img {
    width: 45%;
  }
}
@keyframes mainimage02 {
  0% {
    opacity: 0;
    transform: scale(1.2);
  }
  30% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes blur {
  0% {
    opacity: 0;
    filter: blur(50px);
  }
  100% {
    opacity: 1;
    filter: blur(0);
  }
}
#toppage #mainContentsBox #mainimageV3 {
  position: relative;
  aspect-ratio: 1920/1111;
  /*
  aspect-ratio: 1920 / 1264;
  @include resp(sp){
  	aspect-ratio: 1420 / 1090;
  }
  */
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimageV3 {
    aspect-ratio: 1370/1276;
  }
}
#toppage #mainContentsBox #mainimageV3 .slick-dots {
  bottom: 2.5rem;
}
#toppage #mainContentsBox #mainimageV3 .slick-dots li {
  width: 5rem;
  height: 0.7rem;
  margin: 0 0.7rem;
}
#toppage #mainContentsBox #mainimageV3 .slick-dots li button {
  width: 5rem;
  height: 0.7rem;
  font-size: 0;
  line-height: 0;
  padding: 0;
  background: white;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
}
#toppage #mainContentsBox #mainimageV3 .slick-dots li button::before {
  content: none;
}
#toppage #mainContentsBox #mainimageV3 .slick-dots li.slick-active button {
  background: #8d7642;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimageV3 .slick-dots {
    bottom: 0;
  }
}
#toppage #mainContentsBox #mainimageV3 .slick-list img {
  width: 100%;
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 {
  /*
  position: relative;
  #mainimagecopy {
  	position: absolute;
  	width: 100%;
  	height: 100%;
  	top: 0;
  	left: 50%;
  	transform: translateX(-50%);
  	h2, 
  	h3 {
  		text-align: center;
  		img {
  			margin: 0 auto;
  		}
  	}
  	h2 {
  		margin-top: calc((100 / 1920) * 100vw);
  		margin-bottom: min(calc((50 / 1920) * 100vw), 5rem);
  		&.isactive {
  			animation: fadeUtoD 1s ease 0s 1 normal forwards;
  		}
  		img {
  			width: min(calc((927 / 1920) * 100%), 927px);
  		}
  	}
  	h3 {
  		font-size: 1rem;
  		img {
  			width: min(calc((820 / 1920) * 100%), 820px);
  		}
  	}
  	@include resp(sp){
  		h2 {
  			margin-top: calc((250 / 1920) * 100vw);
  			margin-bottom: 2rem;
  			img {
  				width: 65%;
  			}
  		}
  		h3 {
  			img {
  				width: 45%;
  			}
  		}
  	}
  }
  */
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init {
  position: relative;
  z-index: 1;
  box-shadow: 0 0.5rem 0.5rem rgba(0, 0, 0, 0.1);
  overflow: hidden;
  background: url(../img/home/mv02/mainimage.jpg) no-repeat 50% 100%;
  background-size: cover;
  aspect-ratio: 1920/1111;
  opacity: 0;
  animation: mainimage02 3s ease 0s 1 normal forwards;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init {
    aspect-ratio: 1370/1276;
    background-image: url(../img/home/mv02/mainimage_sp.jpg);
  }
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.ploat {
  position: relative;
  z-index: 3;
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::before,
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::after, #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init::before, #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init::after {
  content: "";
  width: 100%;
  aspect-ratio: 1920/614;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::before,
  #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::after, #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init::before, #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init::after {
    aspect-ratio: 1370/614;
  }
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init::before, #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init::after {
  mix-blend-mode: multiply;
  z-index: -1;
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::before, #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init::before {
  background-image: url(../img/home/mv02/plot01b.png);
  animation: blur 1s ease 3s 1 normal forwards;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::before, #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init::before {
    background-image: url(../img/home/mv02/plot01b_sp.png);
  }
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::before {
  background-image: url(../img/home/mv02/plot01t.png);
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::before {
    background-image: url(../img/home/mv02/plot01t_sp.png);
  }
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::after, #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init::after {
  background-image: url(../img/home/mv02/plot02b.png);
  animation: mainimage02 1s ease 4s 1 normal forwards;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::after, #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init::after {
    background-image: url(../img/home/mv02/plot02b_sp.png);
  }
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::after {
  background-image: url(../img/home/mv02/plot02t.png);
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init span.plot::after {
    background-image: url(../img/home/mv02/plot02t_sp.png);
  }
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init #mainimagecopy h2 {
  margin-top: 5.2083333333vw;
  margin-bottom: min(2.6041666667vw, 5rem);
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init #mainimagecopy h2.isactive {
  animation: fadeUtoD 1s ease 0s 1 normal forwards;
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init #mainimagecopy h2 img {
  width: min(48.28125%, 927px);
  margin: 0 auto;
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init #mainimagecopy h3 {
  font-size: 1rem;
}
#toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init #mainimagecopy h3 img {
  width: min(42.7083333333%, 820px);
  margin: 0 auto;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init #mainimagecopy h2 {
    margin-top: 13.0208333333vw;
    margin-bottom: 2rem;
  }
  #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init #mainimagecopy h2 img {
    width: 65%;
  }
  #toppage #mainContentsBox #mainimageV3 #toppageslide .toppageslide01 .init #mainimagecopy h3 img {
    width: 45%;
  }
}
@keyframes mainimage02 {
  0% {
    opacity: 0;
    transform: scale(1.2);
  }
  30% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes blur {
  0% {
    opacity: 0;
    filter: blur(50px);
  }
  100% {
    opacity: 1;
    filter: blur(0);
  }
}
@keyframes mainimage02 {
  0% {
    opacity: 0;
    transform: scale(1.2);
  }
  30% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes blur {
  0% {
    opacity: 0;
    filter: blur(50px);
  }
  100% {
    opacity: 1;
    filter: blur(0);
  }
}
#toppage #mainContentsBox #point {
  background: url(../img/home/bg.jpg) no-repeat 50% 50%;
  background-size: cover;
}
#toppage #mainContentsBox #point .pointbox {
  background: #391b09;
  padding: min(2.4057738573%, 3rem) 0 min(1.2028869286%, 1.5rem);
}
#toppage #mainContentsBox #point .pointbox .initBox {
  width: auto;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #point .pointbox {
    padding: 2.5rem 0;
  }
}
#toppage #mainContentsBox #point .pointbox ol {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
#toppage #mainContentsBox #point .pointbox ol li {
  list-style: none;
  margin-bottom: 1.5rem;
}
#toppage #mainContentsBox #point .pointbox ol li.school img {
  width: 43.1435445068vw;
  max-width: 538px;
}
#toppage #mainContentsBox #point .pointbox ol li.zehm img {
  width: 28.2277465918vw;
  max-width: 352px;
}
#toppage #mainContentsBox #point .pointbox ol li.cosupa img {
  width: 19.2461908581vw;
  max-width: 240px;
}
#toppage #mainContentsBox #point .pointbox ol li.jr img {
  width: 22.774659182vw;
  max-width: 284px;
}
#toppage #mainContentsBox #point .pointbox ol li.parking img {
  width: 22.6142742582vw;
  max-width: 282px;
}
#toppage #mainContentsBox #point .pointbox ol li.zehm, #toppage #mainContentsBox #point .pointbox ol li.cosupa, #toppage #mainContentsBox #point .pointbox ol li.jr {
  position: relative;
  padding-right: 3.2076984763vw;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #point .pointbox ol li.zehm, #toppage #mainContentsBox #point .pointbox ol li.cosupa, #toppage #mainContentsBox #point .pointbox ol li.jr {
    padding-right: 0;
  }
}
#toppage #mainContentsBox #point .pointbox ol li.zehm:after, #toppage #mainContentsBox #point .pointbox ol li.cosupa:after, #toppage #mainContentsBox #point .pointbox ol li.jr:after {
  content: "";
  position: absolute;
  width: 0;
  height: 100%;
  border-right: 1px solid white;
  top: 0;
  right: 1.6038492382vw;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #point .pointbox ol li.school, #toppage #mainContentsBox #point .pointbox ol li.zehm, #toppage #mainContentsBox #point .pointbox ol li.cosupa, #toppage #mainContentsBox #point .pointbox ol li.jr, #toppage #mainContentsBox #point .pointbox ol li.parking {
    width: 100%;
    text-align: center;
    padding-bottom: 1.5rem;
    border-bottom: 1px dotted white;
    margin-bottom: 1.5rem;
  }
  #toppage #mainContentsBox #point .pointbox ol li.school:after, #toppage #mainContentsBox #point .pointbox ol li.zehm:after, #toppage #mainContentsBox #point .pointbox ol li.cosupa:after, #toppage #mainContentsBox #point .pointbox ol li.jr:after, #toppage #mainContentsBox #point .pointbox ol li.parking:after {
    content: none;
  }
  #toppage #mainContentsBox #point .pointbox ol li.school img {
    width: 100%;
    margin-bottom: 0;
  }
  #toppage #mainContentsBox #point .pointbox ol li.zehm img {
    width: 65.4275092937%;
    margin-top: 0;
  }
  #toppage #mainContentsBox #point .pointbox ol li.cosupa img {
    width: 54.2750929368%;
  }
  #toppage #mainContentsBox #point .pointbox ol li.jr img {
    width: 64.126394052%;
  }
  #toppage #mainContentsBox #point .pointbox ol li.parking img {
    width: 52.4163568773%;
  }
  #toppage #mainContentsBox #point .pointbox ol li.parking {
    margin-bottom: 0;
    border-bottom: none;
  }
}
#toppage #mainContentsBox #point .pointbox02 {
  background: #391b09;
  padding: min(2.4057738573%, 3rem) 0 min(1.2028869286%, 1.5rem);
  /*
  div.pc.tb {
  	img {
  		width: min(calc((1368 / 1920) * 100vw), 1368px);
  	}
  }
  ol.sp {
  	display: none;
  }
  @include resp(sp){
  	padding: 2.5rem 0;
  	div.pc.tb {
  		display: none;
  	}
  	ol.sp {
  		display: block;
  		li {
  			list-style: none;
  			text-align: center;
  			padding-bottom: 1.5rem;
  			border-bottom: 1px dotted white(1);
  			margin-bottom: 1.5rem;
  			&.cosupa img { width: min(((240 / 358) * 85%), 240px); }
  			&.school img { width: min(((317 / 358) * 85%), 317px); }
  			&.school02 img { width: min(((255 / 358) * 85%), 255px); }
  			&.zehm img { width: min(((358 / 358) * 85%), 358px); }
  			&.parking img { width: min(((281 / 358) * 85%), 281px); }
  		}
  	}
  }
  */
}
#toppage #mainContentsBox #point .pointbox02 .initBox {
  width: auto;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #point .pointbox02 {
    padding: 5vw 0;
  }
}
#toppage #mainContentsBox #point .pointbox02 ol {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
#toppage #mainContentsBox #point .pointbox02 ol li {
  list-style: none;
  margin-bottom: 1.5rem;
}
#toppage #mainContentsBox #point .pointbox02 ol li.school img {
  width: 42.983159583vw;
  max-width: 536px;
  margin-bottom: min(1.0425020048vw, 13px);
}
#toppage #mainContentsBox #point .pointbox02 ol li.school02 img {
  width: 20.4490777867vw;
  max-width: 255px;
}
#toppage #mainContentsBox #point .pointbox02 ol li.ldk3 img {
  width: 19.8075380914vw;
  max-width: 247px;
  margin-bottom: min(1.0425020048vw, 13px);
}
#toppage #mainContentsBox #point .pointbox02 ol li.zehm img {
  width: 57.4979951885vw;
  max-width: 717px;
  margin-top: min(0.6415396953vw, 8px);
}
#toppage #mainContentsBox #point .pointbox02 ol li.parking img {
  width: 22.5340817963vw;
  max-width: 281px;
}
#toppage #mainContentsBox #point .pointbox02 ol li.cosupa, #toppage #mainContentsBox #point .pointbox02 ol li.shop {
  display: none;
}
#toppage #mainContentsBox #point .pointbox02 ol li.ldk3, #toppage #mainContentsBox #point .pointbox02 ol li.school, #toppage #mainContentsBox #point .pointbox02 ol li.zehm {
  position: relative;
  padding-right: 3.2076984763vw;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #point .pointbox02 ol li.ldk3, #toppage #mainContentsBox #point .pointbox02 ol li.school, #toppage #mainContentsBox #point .pointbox02 ol li.zehm {
    padding-right: 0;
  }
}
#toppage #mainContentsBox #point .pointbox02 ol li.ldk3:after, #toppage #mainContentsBox #point .pointbox02 ol li.school:after, #toppage #mainContentsBox #point .pointbox02 ol li.zehm:after {
  content: "";
  position: absolute;
  width: 0;
  height: 100%;
  border-right: 1px solid white;
  top: 0;
  right: 1.6038492382vw;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #point .pointbox02 ol li {
    width: 100%;
    text-align: center;
    padding-bottom: 1.5rem;
    border-bottom: 1px dotted white;
    margin-bottom: 1.5rem;
  }
  #toppage #mainContentsBox #point .pointbox02 ol li:after {
    content: none !important;
  }
  #toppage #mainContentsBox #point .pointbox02 ol li.cosupa, #toppage #mainContentsBox #point .pointbox02 ol li.shop {
    display: inline-block;
  }
  #toppage #mainContentsBox #point .pointbox02 ol li.school img {
    width: 70.8379888268%;
    max-width: 317px;
    margin-bottom: 0;
  }
  #toppage #mainContentsBox #point .pointbox02 ol li.school02 img {
    width: 56.9832402235%;
    max-width: 255px;
  }
  #toppage #mainContentsBox #point .pointbox02 ol li.ldk3 img {
    width: 59.6648044693%;
  }
  #toppage #mainContentsBox #point .pointbox02 ol li.zehm img {
    width: 80%;
    max-width: 358px;
    margin-top: 0;
  }
  #toppage #mainContentsBox #point .pointbox02 ol li.parking img {
    width: 62.7932960894%;
    max-width: 281px;
  }
  #toppage #mainContentsBox #point .pointbox02 ol li.cosupa img {
    width: 53.6312849162%;
    max-width: 240px;
  }
  #toppage #mainContentsBox #point .pointbox02 ol li.shop img {
    width: 47.8212290503%;
    max-width: 214px;
  }
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #point .pointbox02 ol {
    display: none;
  }
}
#toppage #mainContentsBox #point .pointbox02 div.sp {
  display: none;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #point .pointbox02 div.sp {
    display: block;
  }
}
#toppage #mainContentsBox #point .pointbox02 div.sp img {
  width: 95%;
}
#toppage #mainContentsBox #point .requestbox {
  background: url(../img/home/bg.jpg) no-repeat 50% 50%;
  background-size: cover;
  padding: 9rem 0;
}
#toppage #mainContentsBox #point .requestbox h3 {
  font-size: 5rem;
}
#toppage #mainContentsBox #point .requestbox h3.isactive {
  animation: fadeUtoD 1s ease 0s 1 normal forwards;
}
#toppage #mainContentsBox #point .requestbox .maincolor {
  font-size: 125%;
  letter-spacing: 0.25em;
  font-weight: 500;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #point .requestbox {
    padding: 4.5rem 0;
  }
  #toppage #mainContentsBox #point .requestbox h3 {
    font-size: 3rem;
    line-height: 1.25;
  }
  #toppage #mainContentsBox #point .requestbox h3 .subcolor1 {
    margin: 0.5em 0;
    display: inline-block;
  }
  #toppage #mainContentsBox #point .requestbox .maincolor {
    letter-spacing: 0;
  }
}
#toppage #mainContentsBox #information {
  padding: 9rem 0 4rem 0;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #information {
    padding: 4.5rem 0 2rem 0;
  }
}
#toppage #mainContentsBox #information h4 {
  margin-bottom: 9rem;
}
#toppage #mainContentsBox #information h4::before {
  content: "[";
  margin-right: 0.5em;
}
#toppage #mainContentsBox #information h4::after {
  content: "]";
  margin-left: 0.5em;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #information h4 {
    margin-bottom: 4.5rem;
  }
}
#toppage #mainContentsBox #information .init {
  margin: 1em 0 3em;
  max-height: 12em;
  overflow-y: auto;
}
#toppage #mainContentsBox #information .init::-webkit-scrollbar {
  width: 2px;
}
#toppage #mainContentsBox #information .init::-webkit-scrollbar-track {
  background: #c1c1c1;
}
#toppage #mainContentsBox #information .init::-webkit-scrollbar-thumb {
  background: #391b09;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #information .init {
    max-height: 14em;
  }
}
#toppage #mainContentsBox #information .init ul {
  width: 100%;
}
#toppage #mainContentsBox #information .init ul li {
  display: flex;
  flex-wrap: nowrap;
  justify-content: left;
  padding-bottom: 1em;
  border-bottom: 1px solid rgba(0, 0, 0, 0.3);
  text-align: left;
}
#toppage #mainContentsBox #information .init ul li:not(:last-child) {
  margin-bottom: 1em;
}
#toppage #mainContentsBox #information .init ul li .date {
  width: 7em;
  white-space: nowrap;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #information .init ul li {
    flex-wrap: wrap;
  }
  #toppage #mainContentsBox #information .init ul li .date {
    width: 100%;
    font-size: 1.4rem;
  }
}
#toppage #mainContentsBox #information .init.brown ul li {
  border-bottom-color: rgba(255, 255, 255, 0.5);
}
#toppage #mainContentsBox #information .init.brown ul li a {
  color: white;
}
#toppage #mainContentsBox #information .init.brown ul li a:hover {
  color: yellow;
}
#toppage #mainContentsBox #result {
  background: rgba(173, 153, 108, 0.1);
  margin: 4.5rem 0 7rem;
  padding: 4.5rem 0 2rem;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #result {
    padding: 4.5rem 0;
  }
}
#toppage #mainContentsBox #result h5 {
  font-weight: normal;
  font-size: 1.8rem;
}
#toppage #mainContentsBox #result h3 {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}
#toppage #mainContentsBox #result h3 span {
  display: inline-block;
  margin: 0 0.5em;
}
#toppage #mainContentsBox #result h3 span.isactive {
  animation: fadeUtoD 1s ease 0s 1 normal forwards;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #result h3 {
    flex-wrap: wrap;
  }
  #toppage #mainContentsBox #result h3 span {
    width: 100%;
  }
  #toppage #mainContentsBox #result h3 span:first-child {
    margin-bottom: 1em;
  }
}
#toppage #mainContentsBox #result .flex {
  margin: 4rem;
  flex-wrap: nowrap;
}
#toppage #mainContentsBox #result .flex > * {
  width: calc((100% - 5rem) / 6);
  text-align: center;
  font-size: 1.2rem;
  line-height: 1.25;
}
#toppage #mainContentsBox #result .flex > * picture {
  display: inline-block;
  margin-bottom: 1em;
}
@media screen and (max-width: 960px) {
  #toppage #mainContentsBox #result .flex {
    margin: 2rem;
    flex-wrap: wrap;
  }
  #toppage #mainContentsBox #result .flex > * {
    width: calc((100% - 1rem) / 2);
  }
  #toppage #mainContentsBox #result .flex > *:not(:last-child) {
    margin-bottom: 10px;
  }
}

#concept #mainContentsBox #mainimage {
  position: relative;
  z-index: 1;
  /*box-shadow: 0 0.5rem 0.5rem black(.1);*/
  aspect-ratio: 1920/1110;
  position: relative;
  overflow: hidden;
  background: url(../img/concept/mainimage01.jpg) no-repeat 50% 50%;
  background-size: cover;
  position: relative;
}
#concept #mainContentsBox #mainimage .initBox {
  max-width: 1920px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
#concept #mainContentsBox #mainimage .initBox .copy {
  text-align: center;
  color: white;
}
#concept #mainContentsBox #mainimage .initBox .copy h2 {
  margin-bottom: min(2.6041666667vw, 5rem);
}
#concept #mainContentsBox #mainimage .initBox .copy h2.isactive {
  animation: fadeUtoD 1s ease 0s 1 normal forwards;
}
#concept #mainContentsBox #mainimage .initBox .copy h2 img {
  width: 32.1875vw;
  max-width: 618px;
}
#concept #mainContentsBox #mainimage .initBox .copy h3 {
  font-size: 1rem;
  margin-bottom: min(2.6041666667vw, 3rem);
}
#concept #mainContentsBox #mainimage .initBox .copy h3 img {
  width: 51.3541666667vw;
  max-width: 986px;
}
#concept #mainContentsBox #mainimage .initBox .copy p {
  font-size: min(1.3541666667vw, 1.5rem);
  letter-spacing: 0.1em;
}
#concept #mainContentsBox #mainimage .initBox .copy p span {
  letter-spacing: 0.2em;
}
@media screen and (max-width: 960px) {
  #concept #mainContentsBox #mainimage .initBox .copy h2,
  #concept #mainContentsBox #mainimage .initBox .copy h3 {
    margin-bottom: 1em;
  }
  #concept #mainContentsBox #mainimage .initBox .copy h2 img,
  #concept #mainContentsBox #mainimage .initBox .copy h3 img {
    width: 75%;
  }
  #concept #mainContentsBox #mainimage .initBox .copy h3 {
    margin-bottom: 2em;
  }
  #concept #mainContentsBox #mainimage .initBox .copy p {
    font-size: 1.4rem;
    text-align: left;
    padding: 0 2em;
    letter-spacing: 0;
  }
  #concept #mainContentsBox #mainimage .initBox .copy p span {
    letter-spacing: 0.05em;
  }
}
@media screen and (max-width: 960px) and (max-width: 374px) {
  #concept #mainContentsBox #mainimage .initBox .copy p {
    padding: 0;
  }
}
#concept #mainContentsBox #mainimage .initBox #slickimage {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
@media screen and (max-width: 960px) {
  #concept #mainContentsBox #mainimage {
    background-image: url(../img/concept/mainimage01a_sp.jpg);
    aspect-ratio: auto;
    padding: 5rem 0;
  }
  #concept #mainContentsBox #mainimage::before, #concept #mainContentsBox #mainimage::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
    animation: bgAnime 10s infinite;
  }
  #concept #mainContentsBox #mainimage::before {
    background-image: url(../img/concept/mainimage01a_sp.jpg);
  }
  #concept #mainContentsBox #mainimage::after {
    background-image: url(../img/concept/mainimage01b_sp.jpg);
    animation-delay: 5s;
  }
}
#concept #mainContentsBox #appearance {
  margin-top: 5rem;
  text-align: center;
  position: relative;
}
#concept #mainContentsBox #appearance::before {
  content: "";
  width: 100%;
  height: 20rem;
  display: block;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgb(255, 255, 255) 90%);
  position: absolute;
  top: -24rem;
  left: 0;
  z-index: 1;
}
@media screen and (max-width: 960px) {
  #concept #mainContentsBox #appearance::before {
    height: 10rem;
    top: -14rem;
  }
}
#concept #mainContentsBox #appearance picture {
  margin: 0 auto;
  width: 80%;
  position: relative;
}
#concept #mainContentsBox #appearance picture::before, #concept #mainContentsBox #appearance picture::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  width: 10vw;
  height: 100%;
}
#concept #mainContentsBox #appearance picture::before {
  left: 0;
  background: linear-gradient(to left, rgba(255, 255, 255, 0), rgb(255, 255, 255));
}
#concept #mainContentsBox #appearance picture::after {
  right: 0;
  background: linear-gradient(to right, rgba(255, 255, 255, 0), rgb(255, 255, 255));
}
@media screen and (max-width: 960px) {
  #concept #mainContentsBox #appearance picture {
    width: 100%;
  }
  #concept #mainContentsBox #appearance picture::before, #concept #mainContentsBox #appearance picture::after {
    content: none;
  }
}

#location #pagetitle {
  aspect-ratio: 1920/630;
}
@media screen and (max-width: 960px) {
  #location #access .spscroll img {
    max-width: none;
    height: 200px;
  }
}
#location #access h3,
#location #access .accesslists h4 {
  font-size: 3rem;
  margin-bottom: 1rem;
  position: relative;
  text-align: center;
}
#location #access h3::after,
#location #access .accesslists h4::after {
  content: "";
  width: 100%;
  height: 1px;
  background: #391b09;
  position: absolute;
  top: 50%;
  left: 0;
}
#location #access h3 span,
#location #access .accesslists h4 span {
  color: #391b09;
  background: white;
  padding: 0 1em;
  display: inline-block;
  position: relative;
  z-index: 1;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 960px) {
  #location #access h3,
  #location #access .accesslists h4 {
    font-size: 2.4rem;
  }
}
#location #access h3 {
  margin-bottom: 1rem;
}
#location #access .accesslists ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  -moz-column-gap: 3rem;
       column-gap: 3rem;
  row-gap: 2rem;
}
#location #access .accesslists ul li {
  text-align: left;
  font-size: 1.5rem;
  line-height: 1.5;
}
#location #access .accesslists ul li picture {
  margin-bottom: 0.5rem;
}
@media screen and (max-width: 960px) {
  #location #access .accesslists ul {
    grid-template-columns: repeat(1, 1fr);
  }
}
#location #access .lifeinformationlists {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#location #access .lifeinformationlists .locationitems {
  width: calc((100% - 3rem) / 2);
}
#location #access .lifeinformationlists .locationitems h4 {
  background: #391b09;
  /*	color: #d2bd7b; */
  color: white;
  text-align: center;
  padding: 0.5em;
  line-height: 1;
  letter-spacing: 0.05em;
  margin-bottom: 0.5rem;
}
#location #access .lifeinformationlists .locationitems h4 span::after {
  content: "";
  font-size: 70%;
  margin-left: 1em;
  letter-spacing: 0;
}
@media screen and (max-width: 960px) {
  #location #access .lifeinformationlists .locationitems h4 {
    font-size: 1.8rem;
  }
}
#location #access .lifeinformationlists .locationitems ul li {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #391b09;
  padding: 1.4rem 0;
  font-size: 1.4rem;
  line-height: 1;
}
#location #access .lifeinformationlists .locationitems ul li .title {
  text-align: left;
}
@media screen and (max-width: 960px) {
  #location #access .lifeinformationlists .locationitems ul li .title {
    font-size: 1.3rem;
  }
}
#location #access .lifeinformationlists .locationitems ul li .detail {
  text-align: right;
}
@media screen and (max-width: 960px) {
  #location #access .lifeinformationlists .locationitems ul li .detail {
    font-size: 1.2rem;
  }
}
#location #access .lifeinformationlists .locationitems.shopping h4 span::after {
  content: "ショッピング";
}
#location #access .lifeinformationlists .locationitems.education {
  order: 4;
  margin-top: calc((4.2rem + 1px) * -1);
}
#location #access .lifeinformationlists .locationitems.education h4 span::after {
  content: "教育施設";
}
#location #access .lifeinformationlists .locationitems.hospital {
  order: 2;
}
#location #access .lifeinformationlists .locationitems.hospital h4 span::after {
  content: "医療施設";
}
#location #access .lifeinformationlists .locationitems.financial {
  order: 5;
  margin-top: calc((4.2rem + 1px) * -7);
  transform: translateX(calc(100% + 3rem));
}
#location #access .lifeinformationlists .locationitems.financial h4 span::after {
  content: "金融機関等";
}
#location #access .lifeinformationlists .locationitems.public {
  order: 3;
}
#location #access .lifeinformationlists .locationitems.public h4 span::after {
  content: "公共・その他";
}
@media screen and (max-width: 960px) {
  #location #access .lifeinformationlists .locationitems {
    width: 100%;
  }
  #location #access .lifeinformationlists .locationitems.shopping {
    order: 1;
    margin-top: 0;
    transform: none;
  }
  #location #access .lifeinformationlists .locationitems.education {
    order: 2;
    margin-top: 0;
    transform: none;
  }
  #location #access .lifeinformationlists .locationitems.hospital {
    order: 3;
    margin-top: 0;
    transform: none;
  }
  #location #access .lifeinformationlists .locationitems.financial {
    order: 4;
    margin-top: 0;
    transform: none;
  }
  #location #access .lifeinformationlists .locationitems.public {
    order: 5;
    margin-top: 0;
    transform: none;
  }
}
#location #ver2 {
  text-align: left;
}
#location #ver2 .mbM {
  margin-bottom: 4rem !important;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  #location #ver2 .mbM {
    margin-bottom: 2rem !important;
  }
}
@media screen and (max-width: 960px) {
  #location #ver2 .mbM {
    margin-bottom: 2rem !important;
  }
}
#location #ver2 .large {
  letter-spacing: 0;
}
#location #ver2 .fs14 {
  font-size: 1.4rem;
}
#location #ver2 #lifestyle h3 img {
  width: min(18.4895833333vw, 355px);
  margin-bottom: 0.5em;
}
@media screen and (max-width: 960px) {
  #location #ver2 #lifestyle h3 img {
    width: min(46.7105263158vw, 355px);
  }
}
#location #ver2 #lifestyle .flex.c2 .textbox {
  width: 50%;
}
#location #ver2 #lifestyle .flex.c2 .imagebox {
  width: 43%;
}
@media screen and (max-width: 960px) {
  #location #ver2 #lifestyle .flex.c2 .textbox,
  #location #ver2 #lifestyle .flex.c2 .imagebox {
    width: 100%;
  }
  #location #ver2 #lifestyle .flex.c2 .textbox {
    margin-bottom: 1em;
  }
}
#location #ver2 #lifestyle .lifestyleimage {
  background: url(../img/location/v2/lifestyle02_bg.jpg) no-repeat 80% 50%;
  background-size: contain;
  padding: 8rem 0;
}
@media screen and (max-width: 960px) {
  #location #ver2 #lifestyle .lifestyleimage {
    padding: 4rem 0;
  }
}
#location #ver2 #lifestyle .lifestyleimage .flex {
  flex-wrap: nowrap;
}
#location #ver2 #lifestyle .lifestyleimage .flex > picture {
  width: 25%;
}
@media screen and (max-width: 960px) {
  #location #ver2 #lifestyle .lifestyleimage {
    background: none;
  }
  #location #ver2 #lifestyle .lifestyleimage .flex {
    flex-wrap: wrap;
  }
  #location #ver2 #lifestyle .lifestyleimage .flex > picture {
    width: 50%;
  }
}
#location #ver2 #lifestyle .shoppingbox {
  align-items: flex-end;
}
#location #ver2 #lifestyle .shoppingbox .imagebox {
  width: 70%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}
#location #ver2 #lifestyle .shoppingbox .imagebox > * {
  aspect-ratio: 800/588;
}
#location #ver2 #lifestyle .shoppingbox .imagebox > * picture {
  position: relative;
}
#location #ver2 #lifestyle .shoppingbox .imagebox > * picture::before {
  content: attr(data-num);
  display: flex;
  width: 1em;
  height: 1em;
  background: black;
  color: white;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
#location #ver2 #lifestyle .shoppingbox .imagebox .big {
  grid-column: span 2;
  grid-row: span 2;
}
#location #ver2 #lifestyle .shoppingbox .imagebox .big picture {
  height: calc(100% - 4em);
  overflow: hidden;
}
#location #ver2 #lifestyle .shoppingbox .imagebox .big picture img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
#location #ver2 #lifestyle .shoppingbox .textbox {
  width: calc(30% - 3rem);
}
#location #ver2 #lifestyle .shoppingbox .textbox ol {
  list-style: none;
  counter-reset: shoppingnumber 0;
}
#location #ver2 #lifestyle .shoppingbox .textbox ol li {
  font-size: 1.4rem;
  padding-left: 1.5em;
  position: relative;
  line-height: 1.25;
  margin-bottom: 0.5em;
}
#location #ver2 #lifestyle .shoppingbox .textbox ol li::before {
  counter-increment: shoppingnumber 1;
  content: counter(shoppingnumber) "";
  display: flex;
  width: 1.25em;
  height: 1.25em;
  background: black;
  color: white;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (max-width: 960px) {
  #location #ver2 #lifestyle .shoppingbox.spone > .imagebox,
  #location #ver2 #lifestyle .shoppingbox.spone > .textbox {
    width: 100%;
  }
  #location #ver2 #lifestyle .shoppingbox.spone > .imagebox {
    grid-template-columns: repeat(2, 1fr);
    margin-bottom: 1em;
  }
}
#location #ver2 #access2 h3 img {
  width: min(13.1770833333vw, 253px);
  margin-bottom: 0.5em;
}
@media screen and (max-width: 960px) {
  #location #ver2 #access2 h3 img {
    width: min(33.2894736842vw, 253px);
  }
}
#location #ver2 #access2 .flex.c3 .wide2 .large {
  line-height: 1;
  text-indent: -0.5em;
  margin-bottom: 0.5em;
}
#location #ver2 #access2 + .flex.c5 {
  display: flex;
  flex-wrap: nowrap;
}
#location #ver2 #access2 + .flex.c5 > * {
  width: 20%;
}
@media screen and (max-width: 960px) {
  #location #ver2 #access2 .spscroll img {
    max-width: none;
    height: 250px;
  }
}
#location #ver2 #location h3 img {
  width: min(17.7604166667vw, 341px);
  margin-bottom: 0.5em;
}
@media screen and (max-width: 960px) {
  #location #ver2 #location h3 img {
    width: min(44.8684210526vw, 341px);
  }
}
#location #ver2 #location .locations h4 {
  display: flex;
  justify-content: left;
  flex-wrap: nowrap;
  line-height: 1;
  margin-bottom: 1em;
}
#location #ver2 #location .locations h4 .en {
  border-right: 1px solid black;
  width: 8em;
  letter-spacing: 0.1em;
  font-weight: 600;
}
#location #ver2 #location .locations h4 .copy {
  flex: 1;
  padding-left: 1em;
}
@media screen and (max-width: 960px) {
  #location #ver2 #location .locations h4 {
    flex-wrap: wrap;
    line-height: 1.5;
  }
  #location #ver2 #location .locations h4 .en {
    width: 100%;
    display: block;
    border-right: none;
    margin-bottom: 0.5em;
  }
  #location #ver2 #location .locations h4 .copy {
    width: 100%;
    display: block;
    padding-left: 0;
    letter-spacing: 0;
  }
}
#location #ver2 #location .locations .locationlists {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
  margin-bottom: 4rem;
  font-size: 1.4rem;
}
@media screen and (max-width: 960px) {
  #location #ver2 #location .locations .locationlists {
    grid-template-columns: repeat(2, 1fr);
  }
}
#location #ver2 #location .locations .locationlists picture {
  margin-bottom: 0.5rem;
}
#location #ver2 #location .lifeinformationlists {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#location #ver2 #location .lifeinformationlists .locationitems {
  width: calc((100% - 3rem) / 2);
}
#location #ver2 #location .lifeinformationlists .locationitems h4 {
  color: #8d7642;
  padding-bottom: 0.5em;
  line-height: 1;
  letter-spacing: 0.05em;
  border-bottom: 1px solid #391b09;
  margin-bottom: 0.5rem;
  font-size: 2.4rem;
}
#location #ver2 #location .lifeinformationlists .locationitems h4 span::after {
  content: "";
  font-size: 70%;
  margin-left: 1em;
  letter-spacing: 0;
}
@media screen and (max-width: 960px) {
  #location #ver2 #location .lifeinformationlists .locationitems h4 {
    font-size: 1.8rem;
  }
}
#location #ver2 #location .lifeinformationlists .locationitems ul li {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  padding: 1.4rem 0;
  font-size: 1.4rem;
  line-height: 1;
  position: relative;
}
#location #ver2 #location .lifeinformationlists .locationitems ul li::after {
  content: "";
  width: 100%;
  height: 0;
  border-bottom: 1px dotted black;
  position: absolute;
  top: 50%;
  left: 0;
  z-index: -1;
}
#location #ver2 #location .lifeinformationlists .locationitems ul li .title {
  text-align: left;
  padding-right: 0.5em;
  background: white;
}
@media screen and (max-width: 960px) {
  #location #ver2 #location .lifeinformationlists .locationitems ul li .title {
    font-size: 1.3rem;
  }
}
#location #ver2 #location .lifeinformationlists .locationitems ul li .detail {
  text-align: right;
  padding-left: 0.5em;
  background: white;
}
@media screen and (max-width: 960px) {
  #location #ver2 #location .lifeinformationlists .locationitems ul li .detail {
    font-size: 1.2rem;
  }
}
#location #ver2 #location .lifeinformationlists .locationitems.shopping h4 span::after {
  content: "ショッピング";
}
#location #ver2 #location .lifeinformationlists .locationitems.education {
  order: 4;
  margin-top: calc((4.2rem + 1px) * -1);
}
#location #ver2 #location .lifeinformationlists .locationitems.education h4 span::after {
  content: "教育施設";
}
#location #ver2 #location .lifeinformationlists .locationitems.hospital {
  order: 2;
}
#location #ver2 #location .lifeinformationlists .locationitems.hospital h4 span::after {
  content: "医療施設";
}
#location #ver2 #location .lifeinformationlists .locationitems.financial {
  order: 5;
  margin-top: calc((4.2rem + 1px) * -7);
  transform: translateX(calc(100% + 3rem));
}
#location #ver2 #location .lifeinformationlists .locationitems.financial h4 span::after {
  content: "金融機関等";
}
#location #ver2 #location .lifeinformationlists .locationitems.public {
  order: 3;
}
#location #ver2 #location .lifeinformationlists .locationitems.public h4 span::after {
  content: "公共・その他";
}
@media screen and (max-width: 960px) {
  #location #ver2 #location .lifeinformationlists .locationitems {
    width: 100%;
  }
  #location #ver2 #location .lifeinformationlists .locationitems.shopping {
    order: 1;
    margin-top: 0;
    transform: none;
  }
  #location #ver2 #location .lifeinformationlists .locationitems.education {
    order: 2;
    margin-top: 0;
    transform: none;
  }
  #location #ver2 #location .lifeinformationlists .locationitems.hospital {
    order: 3;
    margin-top: 0;
    transform: none;
  }
  #location #ver2 #location .lifeinformationlists .locationitems.financial {
    order: 4;
    margin-top: 0;
    transform: none;
  }
  #location #ver2 #location .lifeinformationlists .locationitems.public {
    order: 5;
    margin-top: 0;
    transform: none;
  }
}

#share #sharedetail h3 {
  font-size: 3rem;
}
@media screen and (max-width: 960px) {
  #share #sharedetail h3 {
    font-size: 2.4rem;
  }
}
#share #sharedetail .commonspace {
  text-align: center;
}
@media screen and (max-width: 960px) {
  #share #sharedetail .commonspace {
    margin-top: 4rem;
  }
}
#share #sharedetail .commonspace img {
  width: 100%;
  /*
  width: min(calc((930 / 1920) * 100%), 930px);
  margin: 0 auto;
  @include resp(sp){
  }
  */
}
#share #sharedetail .point {
  margin: 6rem 0;
  padding: 6rem 0;
  background: #cdcece;
}
#share #sharedetail .point .pointlists {
  grid-template-columns: repeat(2, 1fr);
}
#share #sharegallery picture.caption::before {
  font-size: 1.8rem;
  left: 1.5em;
  bottom: 1em;
}
@media screen and (max-width: 960px) {
  #share #sharegallery picture.caption::before {
    font-size: 1.5rem;
    left: 1rem;
    bottom: 1rem;
    font-weight: normal;
    letter-spacing: 0.2em;
    /*
    left: auto;
    right: 1rem;
    text-align: right;
    */
  }
}
@media screen and (max-width: 960px) {
  #share #sharedetail .large {
    font-size: 2.2rem;
    margin-bottom: 1em;
    line-height: 1.5;
    letter-spacing: -0.1em;
  }
  #share #sharedetail .point {
    margin: 3rem 0;
    padding: 3rem 0;
  }
}

#design .modal-overlay .modal-content picture img {
  max-width: 100%;
  max-height: 90vh;
}
@media screen and (max-width: 960px) {
  #design #designcopy .large {
    font-size: 2.4rem;
    margin-bottom: 1em;
    line-height: 1.5;
  }
}

#plan {
  /*
  #pagetitle {
  	aspect-ratio: 1920 / 470;
  }
  */
}
#plan .birdcage {
  display: inline-block;
  position: relative;
  max-width: 400px;
}
#plan .birdcage ul li {
  position: absolute;
  top: 0;
  z-index: 1;
  width: 15.0943396226%;
}
#plan .birdcage ul li a {
  display: block;
  width: 100%;
  height: 100%;
}
#plan .birdcage ul li.typea {
  left: 9.4339622642%;
}
#plan .birdcage ul li.typeb {
  left: 24.5283018868%;
}
#plan .birdcage ul li.typec {
  left: 39.6226415094%;
}
#plan .birdcage ul li.typed {
  left: 54.7169811321%;
}
#plan .birdcage ul li.typee {
  left: 69.8113207547%;
}
#plan .birdcage ul li.typef {
  left: 84.9056603774%;
}
#plan .birdcage + .flex li {
  width: calc((100% - 3rem) / 2);
  margin-bottom: 3rem;
}
#plan .birdcage + .flex li a {
  display: block;
  text-align: center;
  width: 100%;
  padding: 0.75em 2em;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
}
#plan .birdcage + .flex li a.active, #plan .birdcage + .flex li a:hover {
  background: #829cbc;
}
@media screen and (max-width: 960px) {
  #plan .birdcage + .flex li {
    width: 100%;
    margin-bottom: 1rem;
  }
  #plan .birdcage + .flex li a {
    padding: 1em 2.5em;
  }
}
#plan #planselect .birdcage {
  margin-right: auto;
  margin-left: auto;
}
@media screen and (max-width: 960px) {
  #plan #planselect .birdcage {
    margin-right: 15%;
    margin-left: 15%;
  }
  #plan #planselect .birdcage + .flex {
    margin-right: 10%;
    margin-left: 10%;
  }
}
#plan #plandetail .tabset .tabnav ul li a {
  display: block;
  border: 1px solid #003476;
  color: #003476;
  text-decoration: none;
  padding: 0.5em 0;
  letter-spacing: 0.1em;
}
#plan #plandetail .tabset .tabnav ul li a:hover {
  background: rgba(0, 52, 118, 0.5);
  color: white;
}
#plan #plandetail .tabset .tabnav ul li a.active {
  pointer-events: none;
  background: #003476;
  color: white;
  position: relative;
}
#plan #plandetail .tabset .tabnav ul li a.active::after {
  content: "";
  position: absolute;
  bottom: -1.5em;
  left: 50%;
  border: 0.75em solid transparent;
  border-top-color: #003476;
  transform: translateX(-50%);
}
@media screen and (max-width: 960px) {
  #plan #plandetail .tabset + p .normal {
    font-size: 1.2rem;
  }
}
#plan #plandetail .tabdetail > * .flex .spec {
  max-width: 440px;
  width: 47.311827957%;
}
@media screen and (max-width: 960px) {
  #plan #plandetail .tabdetail > * .flex .spec {
    width: 53.7634408602%;
  }
}
#plan #plandetail .tabdetail > * .flex .birdcage {
  max-width: 400px;
  width: 43.0107526882%;
  text-align: right;
}
#plan #plandetail .tabdetail > * picture {
  max-width: 700px;
  margin: 0 auto;
}
#plan #plandetail .tabdetail > * #basicplan,
#plan #plandetail .tabdetail > * #menuplan {
  display: none;
}
#plan #plandetail .tabdetail > * #basicplan.active,
#plan #plandetail .tabdetail > * #menuplan.active {
  display: block;
}
#plan #plandetail .normalbtnP a {
  padding: 0.75em 5em;
}
@media screen and (max-width: 960px) {
  #plan #plandetail .normalbtnP a {
    padding: 0.75em 8em;
  }
}

#modelroom #modelroomgallery .modelroomgalleryitem {
  aspect-ratio: 2000/1140;
  overflow: hidden;
  position: relative;
}
#modelroom #modelroomgallery .modelroomgalleryitem picture {
  width: 100%;
  height: 100%;
}
#modelroom #modelroomgallery .modelroomgalleryitem picture.caption::before, #modelroom #modelroomgallery .modelroomgalleryitem picture.caption::after {
  font-size: 2.4rem;
  letter-spacing: 0.2em;
  bottom: 0.5em;
  font-weight: 400;
}
@media screen and (max-width: 960px) {
  #modelroom #modelroomgallery .modelroomgalleryitem picture.caption::before, #modelroom #modelroomgallery .modelroomgalleryitem picture.caption::after {
    font-size: 1.6rem;
    letter-spacing: 0;
  }
}
#modelroom #modelroomgallery .modelroomgalleryitem picture.caption::before {
  left: 0.75em;
}
#modelroom #modelroomgallery .modelroomgalleryitem picture.caption::after {
  right: 0.75em;
}
#modelroom #modelroomgallery .modelroomgalleryitem picture.caption.blackshadow::before, #modelroom #modelroomgallery .modelroomgalleryitem picture.caption.blackshadow::after {
  color: #FFF;
  text-shadow: -1px 0 5px rgba(0, 0, 0, 0.3), 1px 0 5px rgba(0, 0, 0, 0.3), 0 -1px 5px rgba(0, 0, 0, 0.3), 0 1px 5px rgba(0, 0, 0, 0.3);
}
#modelroom #modelroomgallery .modelroomgalleryitem picture.caption img {
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: 50% 50%;
     object-position: 50% 50%;
  width: 100%;
  height: 100%;
}
#modelroom #modelroomgallery .modelroomgalleryitem picture.bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
#modelroom #modelroomgallery .modelroomgalleryitem picture.bg img {
  max-width: none;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 50%;
     object-position: 50% 50%;
  width: 100%;
  height: 100%;
  filter: blur(0.5rem);
}
#modelroom #modelroomgallery .slick-track {
  transform: unset !important;
}
#modelroom #modelroomgallerynav .modelroomgallerynavitem {
  aspect-ratio: 119/108;
  overflow: hidden;
  position: relative;
}
@media screen and (max-width: 960px) {
  #modelroom #modelroomgallerynav .modelroomgallerynavitem {
    width: 20% !important;
  }
}
#modelroom #modelroomgallerynav .modelroomgallerynavitem:not(:first-child)::before {
  content: "";
  border-left: 1px solid rgba(0, 0, 0, 0.3);
  width: 0;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}
#modelroom #modelroomgallerynav .modelroomgallerynavitem picture {
  width: 100%;
  height: 100%;
}
#modelroom #modelroomgallerynav .modelroomgallerynavitem picture img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 50%;
     object-position: 50% 50%;
  max-width: none;
  width: 100%;
  height: 100%;
}
#modelroom #modelroomgallerynav .modelroomgallerynavitem p {
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  z-index: 1;
  line-height: 1.25;
  background: rgba(255, 255, 255, 0.7);
  transition: 0.5s;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 960px) {
  #modelroom #modelroomgallerynav .modelroomgallerynavitem p {
    font-size: 1rem;
  }
}
#modelroom #modelroomgallerynav .modelroomgallerynavitem.slick-current p {
  color: white;
  background: rgba(0, 0, 0, 0.7);
}

#zeh #mainContentsBox {
  position: relative;
}
#zeh #breadcrumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
}
#zeh h4 {
  font-size: 2.4rem;
  margin: 5rem 0 3rem;
  letter-spacing: 0;
}
@media screen and (max-width: 960px) {
  #zeh h4 {
    font-size: 1.8rem;
    margin: 3rem 0 1.5rem;
  }
}
#zeh h5.pointtitle {
  margin: 3rem 0;
  font-size: 1.6rem;
  text-align: center;
}
#zeh h5.pointtitle span {
  color: white;
}
#zeh h5.pointtitle span:first-child::after {
  content: "";
  width: 0;
  height: 0;
  border: 0.4em solid transparent;
  border-left-color: white;
  display: inline-block;
  margin-left: 0.5em;
}
#zeh h5.pointtitle.cat_a {
  background: #cc8944;
}
#zeh h5.pointtitle.cat_b {
  background: #5882a7;
}
@media screen and (max-width: 960px) {
  #zeh h5.pointtitle {
    flex-wrap: wrap;
    padding: 0.5em 0;
  }
  #zeh h5.pointtitle span {
    width: 100% !important;
    display: block;
  }
  #zeh h5.pointtitle span:first-child {
    padding-bottom: 1em;
    position: relative;
  }
  #zeh h5.pointtitle span:first-child::after {
    position: absolute;
    left: calc(50% - 0.5em);
    margin-left: 0;
    bottom: 0;
    border-top-color: white;
    border-left-color: transparent;
  }
  #zeh h5.pointtitle span:last-child {
    line-height: 1.25;
    font-weight: normal;
  }
}
#zeh .flex.wide {
  width: 100%;
}
#zeh .flex.wide .shortbox {
  width: 40%;
}
#zeh .flex.wide .longbox {
  width: 56%;
}
@media screen and (max-width: 960px) {
  #zeh .flex.wide {
    flex-wrap: wrap;
  }
  #zeh .flex.wide .shortbox,
  #zeh .flex.wide .longbox {
    width: 100%;
  }
  #zeh .flex.wide > *:not(:last-child) {
    margin-bottom: 1em;
  }
}
#zeh #concept {
  background: url(../img/zeh/concept_bg.webp) no-repeat 50% 0;
  background-size: 100%;
  padding-top: 8rem;
}
@media screen and (max-width: 960px) {
  #zeh #concept {
    background-image: url(../img/zeh/concept_bg_sp.webp);
    padding-top: 5rem;
    background-position: 100% 0;
    background-size: cover;
  }
}
#zeh #concept #conceptcopy h2 img {
  width: min(50.3875968992%, 740px);
}
@media screen and (max-width: 960px) {
  #zeh #concept #conceptcopy h2 img {
    width: 80%;
  }
}
#zeh #concept #conceptcopy h3 {
  color: #5882a7;
  font-size: 2.4rem;
  font-weight: bold;
  margin: 0.75em 0;
}
@media screen and (max-width: 960px) {
  #zeh #concept #conceptcopy h3 {
    font-size: 1.8rem;
    margin: 0.5em 0;
    letter-spacing: 0;
  }
}
#zeh #concept #conceptcopy .aboutzehm {
  display: flex;
  flex-wrap: nowrap;
  background: rgba(255, 255, 255, 0.5);
  border-top: 1px solid rgba(0, 0, 0, 0.5);
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
  padding: 1rem 0;
}
#zeh #concept #conceptcopy .aboutzehm dt {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 2rem;
  width: 25.1798561151%;
  border-right: 1px solid rgba(0, 0, 0, 0.5);
}
#zeh #concept #conceptcopy .aboutzehm dd {
  width: 71.9424460432%;
  text-align: left;
  font-size: 1.4rem;
  padding: 0 1rem;
}
@media screen and (max-width: 960px) {
  #zeh #concept #conceptcopy .aboutzehm {
    flex-wrap: wrap;
  }
  #zeh #concept #conceptcopy .aboutzehm dt {
    width: 100%;
    border-right: none;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
  }
  #zeh #concept #conceptcopy .aboutzehm dt img {
    max-width: 200px;
  }
  #zeh #concept #conceptcopy .aboutzehm dd {
    padding-top: 1rem;
    width: 100%;
  }
}
@media screen and (max-width: 960px) {
  #zeh #concept #conceptcopy p {
    padding: 0 1em;
    text-align: left;
    font-size: 1.4rem;
  }
}
#zeh #concept #conceptpoint {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8) 20%, rgba(255, 255, 255, 0.8));
}
#zeh #concept #conceptpoint h4 {
  color: #5882a7;
  font-weight: bold;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.5);
}
#zeh #concept #conceptpoint h4::before {
  content: "<";
}
#zeh #concept #conceptpoint h4::after {
  content: ">";
}
@media screen and (max-width: 960px) {
  #zeh #concept #conceptpoint h4::before, #zeh #concept #conceptpoint h4::after {
    content: none;
  }
}
#zeh #concept #conceptpoint .initBox2 {
  padding: 8rem 0;
}
@media screen and (max-width: 960px) {
  #zeh #concept #conceptpoint .initBox2 {
    padding: 4rem 0;
  }
}
#zeh #concept #conceptpoint .initBox2 picture + picture {
  margin-top: 3rem;
}
#zeh #equipment1 h4 .color_a {
  color: #cc8944;
}
#zeh #equipment1 h4 .color_b {
  color: #5882a7;
}
#zeh #equipment1 .equipmentlists {
  text-align: left;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#zeh #equipment1 .equipmentlists > li {
  width: calc((100% - 3rem) / 2);
}
#zeh #equipment1 .equipmentlists > li .textbox {
  width: 53%;
  font-size: 1.4rem;
  text-align: justify;
}
#zeh #equipment1 .equipmentlists > li .imagebox {
  width: 45%;
  display: flex;
  align-items: center;
}
#zeh #equipment1 .equipmentlists > li h6 {
  font-size: 1.8rem;
  margin-bottom: 0.5rem;
  counter-increment: listnum;
}
#zeh #equipment1 .equipmentlists > li h6::before {
  content: counter(listnum);
  width: 1.75em;
  display: inline-block;
  margin-right: 0.25em;
  border-radius: 3px;
  text-align: center;
  color: white;
}
#zeh #equipment1 .equipmentlists > li.flex.wide {
  width: 100%;
}
#zeh #equipment1 .equipmentlists > li.flex.wide .textbox {
  display: flex;
  flex-direction: column;
  width: 30%;
}
#zeh #equipment1 .equipmentlists > li.flex.wide .textbox picture {
  margin-top: auto;
}
#zeh #equipment1 .equipmentlists > li.flex.wide .imagebox {
  width: 66%;
}
@media screen and (max-width: 960px) {
  #zeh #equipment1 .equipmentlists > li.flex.wide .textbox {
    width: 100%;
    margin-bottom: 1em;
  }
  #zeh #equipment1 .equipmentlists > li.flex.wide .imagebox {
    width: 100%;
  }
  #zeh #equipment1 .equipmentlists > li.flex.wide .imagebox img {
    max-width: none;
    width: 100%;
  }
}
#zeh #equipment1 .equipmentlists.cat_a {
  counter-reset: listnum;
}
#zeh #equipment1 .equipmentlists.cat_a h6 {
  color: #cc8944;
}
#zeh #equipment1 .equipmentlists.cat_a h6::before {
  background-color: #cc8944;
}
#zeh #equipment1 .equipmentlists.cat_b {
  counter-reset: listnum 2;
}
#zeh #equipment1 .equipmentlists.cat_b li:not(:last-child) {
  padding-bottom: 2.5em;
  border-bottom: 1px solid #9fa0a0;
}
#zeh #equipment1 .equipmentlists.cat_b li h6 {
  color: #5882a7;
}
#zeh #equipment1 .equipmentlists.cat_b li h6::before {
  background-color: #5882a7;
}
@media screen and (max-width: 960px) {
  #zeh #equipment1 .equipmentlists li {
    width: 100%;
  }
  #zeh #equipment1 .equipmentlists li.flex {
    flex-wrap: wrap;
  }
  #zeh #equipment1 .equipmentlists li.flex .textbox {
    width: 100%;
    margin-bottom: 1em;
  }
  #zeh #equipment1 .equipmentlists li.flex .imagebox {
    width: 100%;
    text-align: center;
  }
  #zeh #equipment1 .equipmentlists li.flex .imagebox img {
    max-width: 270px;
  }
  #zeh #equipment1 .equipmentlists li + li {
    margin-top: 1em;
  }
}
#zeh #equipment2 .unit {
  font-size: 1.4rem;
  text-align: left;
}
#zeh #equipment2 .unit:not(:last-child) {
  padding-bottom: 5rem;
  border-bottom: 1px solid rgba(79, 143, 189, 0.5);
  margin-bottom: 5rem;
}
#zeh #equipment2 .unit dl {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
}
#zeh #equipment2 .unit dl dt {
  display: flex;
  justify-content: center;
  align-items: center;
  /*
  background: linear-gradient(to bottom, #7aa4cb, #4f8fbd);
  */
  background: #5882a7;
  border-radius: 50%;
  color: white;
  width: 15rem;
  aspect-ratio: 1/1;
  font-size: 2rem;
  letter-spacing: 0.25em;
  position: relative;
  padding-bottom: 1em;
}
#zeh #equipment2 .unit dl dt::after {
  content: attr(data-subtitle) "";
  display: block;
  text-align: center;
  position: absolute;
  top: calc(50% + 1em);
  left: 0;
  font-size: 1rem;
  width: 100%;
  letter-spacing: 0.1em;
}
#zeh #equipment2 .unit dl dt[data-subtitle=ecology] span {
  letter-spacing: 0;
}
@media screen and (max-width: 960px) {
  #zeh #equipment2 .unit dl dt {
    display: none;
  }
}
#zeh #equipment2 .unit dl dd {
  width: calc(100% - 18rem);
}
#zeh #equipment2 .unit dl dd h5 {
  font-size: 2.4rem;
  color: #5882a7;
  margin-bottom: 0.5em;
}
@media screen and (max-width: 960px) {
  #zeh #equipment2 .unit dl dd h5 {
    font-size: 1.8rem;
  }
}
#zeh #equipment2 .unit dl dd h5::before {
  content: none;
}
@media screen and (max-width: 960px) {
  #zeh #equipment2 .unit dl dd {
    width: 100%;
  }
  #zeh #equipment2 .unit dl dd h5.bluetitle {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
  }
  #zeh #equipment2 .unit dl dd h5.bluetitle span {
    width: calc(100% - 9rem);
    line-height: 1.5;
  }
  #zeh #equipment2 .unit dl dd h5.bluetitle::before {
    content: attr(data-title) "";
    width: 8rem;
    height: 8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(to bottom, #7aa4cb, #4f8fbd);
    color: white;
    font-size: 1.6rem;
  }
}
#zeh #equipment2 .unit h5 {
  font-size: 1.6rem;
}
#zeh #equipment2 .unit h5.disc {
  font-size: 1.6rem;
  color: black;
  position: relative;
  padding-left: 2rem;
}
#zeh #equipment2 .unit h5.disc::before {
  position: absolute;
  top: 0;
  left: 0;
  content: "■";
  margin-right: 0.25em;
  color: #5882a7;
}
#zeh #equipment2 .unit h5.big {
  font-size: 2.4rem;
  color: #5882a7;
  margin-bottom: 0.5em;
}
@media screen and (max-width: 960px) {
  #zeh #equipment2 .unit h5.big {
    font-size: 1.8rem;
  }
}
#zeh #equipment2 .unit h6 {
  font-size: 1.8rem;
  background: rgba(88, 130, 167, 0.2);
  color: #5882a7;
  text-align: center;
}
@media screen and (max-width: 960px) {
  #zeh #equipment2 .unit h6 {
    font-size: 1.5rem;
  }
}
#zeh #equipment2 .unit sub {
  font-size: 0.5em;
  vertical-align: text-bottom;
  margin-right: 0.25em;
}
#zeh #equipment2 .unit.health .flex.c2 > div:first-child {
  display: flex;
  flex-direction: column;
}
#zeh #equipment2 .unit.health .flex.c2 > div:first-child picture {
  margin-top: auto;
}
#zeh #equipment2 .unit.health .flex.c2 > div:last-child {
  position: relative;
}
#zeh #equipment2 .unit.health .flex.c2 > div:last-child h5 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
@media screen and (max-width: 960px) {
  #zeh #equipment2 .unit.health .flex.c2 > div {
    width: 100%;
  }
  #zeh #equipment2 .unit.health .flex.c2 > div:first-child {
    margin-bottom: 1em;
  }
  #zeh #equipment2 .unit.health .flex.c2 > div:first-child picture {
    margin-top: 0.5em;
  }
  #zeh #equipment2 .unit.health .flex.c2 > div:last-child h5 {
    position: relative;
  }
}
#zeh #equipment2 .unit .flex.loadmap .textbox {
  width: 25%;
}
#zeh #equipment2 .unit .flex.loadmap .imagebox1 {
  width: 38.273657289%;
}
#zeh #equipment2 .unit .flex.loadmap .imagebox2 {
  width: 34.726342711%;
}
@media screen and (max-width: 960px) {
  #zeh #equipment2 .unit .flex.loadmap .textbox,
  #zeh #equipment2 .unit .flex.loadmap .imagebox1,
  #zeh #equipment2 .unit .flex.loadmap .imagebox2 {
    width: 100%;
    margin-bottom: 1em;
  }
}
#zeh #equipment2 .unit .shortbox {
  position: relative;
  display: flex;
  align-items: flex-end;
}
#zeh #equipment2 .unit .shortbox h5.disc {
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (max-width: 960px) {
  #zeh #equipment2 .unit picture.spscroll img {
    max-width: none;
    height: 15rem;
  }
}

#equipment p,
#struct p {
  text-align: justify;
}
#equipment h3.linetitle,
#struct h3.linetitle {
  color: #5882a7;
  border-bottom: none;
}
#equipment h3.linetitle::after,
#struct h3.linetitle::after {
  width: 100%;
  height: 5px;
  background: linear-gradient(to right, #5882a7, rgba(88, 130, 167, 0.6));
  left: 0;
  bottom: 0;
  transform: translateX(0);
}
#equipment h3.bluetitle,
#struct h3.bluetitle {
  color: #5882a7;
}
#equipment h3.bluetitle + p.large,
#struct h3.bluetitle + p.large {
  text-align: center;
}
#equipment .equipmentnav ul,
#struct .equipmentnav ul {
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
}
#equipment .equipmentnav ul li a,
#struct .equipmentnav ul li a {
  display: block;
  text-align: center;
  padding: 0.5em 0;
  text-decoration: none;
}
#equipment .equipmentnav ul.pagenav li,
#struct .equipmentnav ul.pagenav li {
  width: calc((100% - 5rem) / 2);
}
@media screen and (max-width: 960px) {
  #equipment .equipmentnav ul.pagenav li,
  #struct .equipmentnav ul.pagenav li {
    width: calc((100% - 1rem) / 2);
  }
}
#equipment .equipmentnav ul.pagenav li a,
#struct .equipmentnav ul.pagenav li a {
  border: 1px solid #b09b6d;
}
#equipment .equipmentnav ul.pagenav li a:hover,
#struct .equipmentnav ul.pagenav li a:hover {
  background: rgba(176, 155, 109, 0.75);
  color: white;
}
#equipment .equipmentnav ul.pagenav li.nowpage a,
#struct .equipmentnav ul.pagenav li.nowpage a {
  background: #b09b6d;
  color: white;
}
#equipment .equipmentnav ul.catnav,
#struct .equipmentnav ul.catnav {
  margin-bottom: 5rem;
}
#equipment .equipmentnav ul.catnav li,
#struct .equipmentnav ul.catnav li {
  width: calc((100% - 5.4rem) / 4);
}
#equipment .equipmentnav ul.catnav li a,
#struct .equipmentnav ul.catnav li a {
  border-top: 1px solid #b09b6d;
  border-bottom: 1px solid #b09b6d;
  position: relative;
}
#equipment .equipmentnav ul.catnav li a::after,
#struct .equipmentnav ul.catnav li a::after {
  content: "";
  width: 0;
  height: 0;
  border: 1em solid transparent;
  position: absolute;
  bottom: -2em;
  left: 50%;
  transform: translateX(-50%);
  transition: 0.5s;
}
#equipment .equipmentnav ul.catnav li a:hover::after,
#struct .equipmentnav ul.catnav li a:hover::after {
  border-top-color: rgba(176, 155, 109, 0.75);
}
@media screen and (max-width: 960px) {
  #equipment .equipmentnav ul.catnav,
  #struct .equipmentnav ul.catnav {
    flex-wrap: wrap;
  }
  #equipment .equipmentnav ul.catnav li,
  #struct .equipmentnav ul.catnav li {
    width: calc((100% - 1rem) / 2);
    margin-bottom: 3rem;
  }
}

#equipment h4.blueline {
  background: linear-gradient(to right, #d3e2ef, #edf4f9);
  color: #5882a7;
  text-align: center;
  letter-spacing: 0;
  font-weight: bold;
  margin-bottom: 0.75em;
}
#equipment h4.blueline.kerning {
  letter-spacing: -0.1em;
}
#equipment h4.grayline {
  background: #e9e6e3;
  margin-bottom: 0.75em;
  letter-spacing: 0;
  line-height: 1;
  padding: 0.5rem 0;
}
#equipment h4.small {
  font-size: 1.8rem;
  padding: 0.18rem 0;
}
#equipment h4.tiny {
  font-size: 1.6rem;
  padding: 0.36rem 0;
}
#equipment h5 {
  font-size: 1.8rem;
  color: #5882a7;
}
#equipment h5.wide {
  width: calc(200% + 2rem);
}
@media screen and (max-width: 960px) {
  #equipment h5.wide {
    width: 100%;
  }
}
#equipment h6 {
  font-size: 1.6rem;
}
#equipment h6.bluetitle {
  color: #5882a7;
  font-size: 1.6rem;
}
#equipment .defaulttext {
  font-size: 1.4rem;
  text-align: left;
}
#equipment .equipmentnav.cat_kitchen ul li:nth-child(1) a::after {
  border-top-color: #b09b6d;
}
#equipment .equipmentnav.cat_bathroom ul li:nth-child(2) a::after {
  border-top-color: #b09b6d;
}
#equipment .equipmentnav.cat_dressingroom ul li:nth-child(3) a::after {
  border-top-color: #b09b6d;
}
#equipment .equipmentnav.cat_restroom ul li:nth-child(4) a::after {
  border-top-color: #b09b6d;
}
#equipment .detail.wide {
  width: calc(200% + 2rem);
}
@media screen and (max-width: 960px) {
  #equipment .detail.wide {
    width: 100%;
  }
}
#equipment .kerning {
  letter-spacing: -0.1em;
}
#equipment .equipmentlists li h5,
#equipment .equipmentlists2 li h5,
#equipment .equipmentlists4 li h5 {
  text-align: center;
  margin-top: 0.5rem;
}
#equipment .equipmentlists li h5.longtitle,
#equipment .equipmentlists2 li h5.longtitle,
#equipment .equipmentlists4 li h5.longtitle {
  font-size: 1.5rem;
  letter-spacing: -0.1em;
}
@media screen and (max-width: 960px) {
  #equipment .equipmentlists li h5.longtitle,
  #equipment .equipmentlists2 li h5.longtitle,
  #equipment .equipmentlists4 li h5.longtitle {
    font-size: 1.6rem;
    letter-spacing: 0;
  }
}
#equipment .equipmentlists li picture,
#equipment .equipmentlists2 li picture,
#equipment .equipmentlists4 li picture {
  margin-bottom: 0.5rem;
}
#equipment .equipmentlists li p,
#equipment .equipmentlists2 li p,
#equipment .equipmentlists4 li p {
  font-size: 1.4rem;
  text-align: left;
}
#equipment .equipmentlists + .equipmentlists4,
#equipment .equipmentlists2 + .equipmentlists4,
#equipment .equipmentlists4 + .equipmentlists4 {
  margin-top: 4rem;
}
@media only screen and (min-width: 961px) and (max-width: 1000px) {
  #equipment .equipmentlists + .equipmentlists4,
  #equipment .equipmentlists2 + .equipmentlists4,
  #equipment .equipmentlists4 + .equipmentlists4 {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 960px) {
  #equipment .equipmentlists + .equipmentlists4,
  #equipment .equipmentlists2 + .equipmentlists4,
  #equipment .equipmentlists4 + .equipmentlists4 {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 960px) {
  #equipment .equipmentlists,
  #equipment .equipmentlists2,
  #equipment .equipmentlists4 {
    grid-template-columns: repeat(1, 1fr);
    gap: 3rem;
  }
  #equipment .equipmentlists h5.title,
  #equipment .equipmentlists2 h5.title,
  #equipment .equipmentlists4 h5.title {
    padding: 1rem 0;
  }
}
@media screen and (max-width: 960px) {
  #equipment .equipmentlists {
    grid-template-columns: repeat(1, 1fr);
    gap: 3rem;
  }
  #equipment .equipmentlists h5.title {
    padding: 1rem 0;
  }
}
#equipment #kitchen > .initBox2,
#equipment #bathroom > .initBox2,
#equipment #dressingroom > .initBox2 {
  padding-bottom: 8rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
  margin-bottom: 8rem;
}
@media screen and (max-width: 960px) {
  #equipment #kitchen > .initBox2,
  #equipment #bathroom > .initBox2,
  #equipment #dressingroom > .initBox2 {
    padding-bottom: 4rem;
    margin-bottom: 4rem;
  }
}
#equipment #kitchen .flex.left {
  flex-wrap: nowrap;
}
#equipment #kitchen .flex.left h5 {
  font-size: 1.6rem;
  color: #5882a7;
  font-weight: normal;
  white-space: nowrap;
}
#equipment #kitchen .flex.left .detail {
  font-size: 1.4rem;
}
@media screen and (max-width: 960px) {
  #equipment #kitchen .flex.left {
    flex-wrap: wrap;
  }
  #equipment #kitchen .flex.left h5 {
    background: #8d7642;
    color: white;
    width: 100%;
    padding: 0.5rem 0;
    margin: 0 0 0.5rem;
    text-align: center;
  }
  #equipment #kitchen .flex.left .detail {
    width: 100%;
    margin-bottom: 1rem;
  }
}
#equipment #kitchen .featuresbox div:first-child {
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(88, 130, 167, 0.3);
}
#equipment #kitchen .featuresbox div:last-child {
  text-align: left;
  font-size: 1.4rem;
}
@media screen and (max-width: 960px) {
  #equipment #kitchen .featuresbox {
    margin-bottom: 3rem;
  }
}
#equipment #kitchen .builtinglasstopstove,
#equipment #kitchen .slidestocker {
  position: relative;
}
#equipment #kitchen .builtinglasstopstove::before,
#equipment #kitchen .slidestocker::before {
  content: "";
  width: 0;
  height: 0;
  border: 1em solid transparent;
  border-left-color: rgba(88, 130, 167, 0.5);
  position: absolute;
  top: 50%;
  left: calc(-3.25% - 0.5em);
}
@media screen and (max-width: 960px) {
  #equipment #kitchen .builtinglasstopstove::before,
  #equipment #kitchen .slidestocker::before {
    top: -1em;
    left: 50%;
    transform: translateX(-50%);
    border-top-color: rgba(88, 130, 167, 0.5);
    border-left-color: transparent;
  }
}
#equipment #kitchen .builtinglasstopstove h5 {
  font-family: "Noto Sans JP", sans-serif;
  text-align: center;
}
#equipment #kitchen .slidestocker .equipmentlists li {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}
#equipment #kitchen .slidestocker .equipmentlists li > * {
  width: 100%;
  display: block;
}
#equipment #kitchen .slidestocker .equipmentlists li h4 {
  font-family: "Noto Sans JP", sans-serif;
  letter-spacing: 0;
  font-size: 1.6rem;
  background: rgba(88, 130, 167, 0.2);
  color: #5882a7;
}
#equipment #kitchen .slidestocker .equipmentlists li picture {
  order: 4;
  margin-top: auto;
}
#equipment #kitchen .slidestocker .equipmentlists li h5 {
  text-align: center;
  order: 2;
  font-size: 1.6rem;
  font-family: "Noto Sans JP", sans-serif;
}
#equipment #kitchen .slidestocker .equipmentlists li .detail {
  order: 3;
  margin-bottom: 1rem;
}
#equipment #kitchen .equipmentlists2 .flex.c2 .detail {
  line-height: 1.5;
}
@media screen and (max-width: 960px) {
  #equipment #kitchen h6 + p {
    text-align: left;
  }
  #equipment #kitchen .flex.c1-2 > div {
    width: 100%;
  }
  #equipment #kitchen .slidestocker {
    margin-top: 1em;
  }
}
#equipment #bathroom .equipmentlists4 li:has(h5.wide) picture {
  position: relative;
}
#equipment #bathroom .equipmentlists4 li:has(h5.wide) picture::after {
  content: "";
  width: 2.8rem;
  aspect-ratio: 54/57;
  display: block;
  background: url(../img/equipment/bathroom/bathroom07_arrow.png) no-repeat 50% 50%;
  background-size: contain;
  position: absolute;
  top: 50%;
  right: -2.9rem;
  transform: translateY(-50%);
}
#equipment #bathroom .rinnaibox {
  padding: 2em 0;
  text-align: left;
  position: relative;
}
#equipment #bathroom .rinnaibox::before {
  content: "";
  width: 200vw;
  height: 100%;
  background: rgba(88, 130, 167, 0.1);
  position: absolute;
  top: 0;
  left: -100vw;
}
@media screen and (max-width: 960px) {
  #equipment #bathroom .rinnaibox::before {
    width: 110%;
    left: -5%;
  }
}
#equipment #bathroom .rinnaibox p.large {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  line-height: 1.25;
}
#equipment #bathroom .rinnaibox p.large span {
  width: calc(100% - (55px + 1em));
}
#equipment #bathroom .rinnaibox p.large small {
  text-indent: -0.5em;
  font-size: 1.6rem;
  display: inline-block;
}
#equipment #bathroom .rinnaibox p.large::before {
  content: "";
  width: 55px;
  aspect-ratio: 1/1;
  background: url(../img/equipment/bathroom/logo_rinnai.png) no-repeat 50% 50%;
  background-size: contain;
  position: relative;
  z-index: 1;
}
#equipment #bathroom .rinnaibox .special {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
}
#equipment #bathroom .rinnaibox .special li {
  display: inline-block;
  margin-right: 1em;
}
#equipment #bathroom .rinnaibox .special li.title {
  border: 1px solid rgba(0, 0, 0, 0.5);
  padding: 0.25em 0.5em;
}
@media screen and (max-width: 960px) {
  #equipment #bathroom .rinnaibox .special {
    flex-wrap: wrap;
  }
  #equipment #bathroom .rinnaibox .special li {
    width: 48%;
    margin-right: 0;
  }
  #equipment #bathroom .rinnaibox .special li.title {
    width: 100%;
    margin-bottom: 0.5rem;
  }
}
@media screen and (max-width: 960px) {
  #equipment #bathroom .rinnaibox .flex.c2-1 > * {
    width: 100%;
  }
}
#equipment #equipment03 .flooring {
  align-items: flex-start;
}
#equipment #equipment03 .flooring picture {
  width: 36%;
}
#equipment #equipment03 .flooring picture.caption {
  margin-top: 0;
}
#equipment #equipment03 .flooring ul {
  width: 60%;
}
#equipment #equipment03 .flooring ul li h5 {
  font-weight: normal;
  color: #5882a7;
}
#equipment #equipment03 .flooring ul li h5 + p {
  font-size: 1.4rem;
}
@media screen and (max-width: 960px) {
  #equipment #equipment03 .flooring picture {
    width: 100%;
    margin-bottom: 1rem;
  }
  #equipment #equipment03 .flooring ul {
    width: 100%;
  }
  #equipment #equipment03 .flooring ul li {
    width: 100%;
    margin-bottom: 1rem;
  }
}
#equipment #equipment06 .equipmentlists4 li.wide2 h4,
#equipment #equipment06 .equipmentlists4 li.wide2 .detail,
#equipment #equipment07 .equipmentlists4 li.wide2 h4,
#equipment #equipment07 .equipmentlists4 li.wide2 .detail {
  width: calc(200% + 3rem);
}
@media screen and (max-width: 960px) {
  #equipment #equipment06 .equipmentlists4 li.wide2 h4,
  #equipment #equipment06 .equipmentlists4 li.wide2 .detail,
  #equipment #equipment07 .equipmentlists4 li.wide2 h4,
  #equipment #equipment07 .equipmentlists4 li.wide2 .detail {
    width: 100%;
  }
}
#equipment #equipment06 .equipmentlists4 li.wide2 picture::before,
#equipment #equipment06 .equipmentlists4 li.wide2 + li picture::before {
  font-size: 1.4rem;
  top: 0.2rem;
  bottom: auto;
  text-align: center;
  width: 100%;
}
#equipment #equipment08 h5.title {
  margin-top: 1rem;
  padding-bottom: 0.5rem;
  color: #5882a7;
  border-bottom: 1px solid rgba(88, 130, 167, 0.5);
  line-height: 1.25;
}
#equipment #equipment11 p {
  font-size: 1.4rem;
}
#equipment #equipment11 .flex.c2-1 .eneshareplan picture {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #5882a7;
  padding: 1em 2em;
}
@media screen and (max-width: 960px) {
  #equipment #equipment11 .flex.c2-1 > * {
    width: 100%;
    margin-bottom: 1rem;
  }
  #equipment #equipment11 .flex.c2-1 > *:last-child {
    margin-top: 4rem;
  }
  #equipment #equipment11 .flex.c2-1 > * .eneshareplan picture {
    padding: 1em 3em;
  }
}
@media screen and (max-width: 960px) {
  #equipment #equipment11 .flex.c2 > * {
    width: 100%;
    margin-bottom: 1rem;
  }
}

#struct h4.goldetitle {
  color: #5882a7;
  margin-bottom: 1em;
  text-align: left;
}
#struct h4.goldetitle::before {
  content: "■";
  margin-right: 0.25em;
}
@media screen and (max-width: 960px) {
  #struct h4.goldetitle {
    letter-spacing: 0;
  }
}
#struct h4.blueline, #struct h4.greenline, #struct h4.redline, #struct h4.yellowline {
  color: white;
  text-align: center;
  letter-spacing: 0;
  font-weight: bold;
}
@media screen and (max-width: 960px) {
  #struct h4.blueline, #struct h4.greenline, #struct h4.redline, #struct h4.yellowline {
    font-size: 1.6rem;
  }
}
#struct h4.blueline {
  background: #7c92b6;
}
#struct h4.greenline {
  background: #7faa6c;
}
#struct h4.redline {
  background: #c88177;
}
#struct h4.yellowline {
  background: #af9a58;
}
#struct h5 {
  font-size: 1.6rem;
  text-align: left;
}
#struct h5.goldelead {
  color: #5882a7;
}
#struct h5.line {
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.3);
  margin-bottom: 0.5em;
}
#struct h5.purpletitle, #struct h5.greentitle, #struct h5.redtitle, #struct h5.yellowtitle {
  margin-left: -0.5em;
}
#struct h5.purpletitle::before, #struct h5.greentitle::before, #struct h5.redtitle::before, #struct h5.yellowtitle::before {
  content: "【";
}
#struct h5.purpletitle::after, #struct h5.greentitle::after, #struct h5.redtitle::after, #struct h5.yellowtitle::after {
  content: "】";
}
@media screen and (max-width: 960px) {
  #struct h5.purpletitle, #struct h5.greentitle, #struct h5.redtitle, #struct h5.yellowtitle {
    margin-left: 0;
  }
  #struct h5.purpletitle::before, #struct h5.purpletitle::after, #struct h5.greentitle::before, #struct h5.greentitle::after, #struct h5.redtitle::before, #struct h5.redtitle::after, #struct h5.yellowtitle::before, #struct h5.yellowtitle::after {
    content: none;
  }
}
#struct h5.disc {
  margin-left: 1.25em;
  position: relative;
}
#struct h5.disc::before {
  content: "●";
  position: absolute;
  top: 0;
  left: -1.25em;
}
#struct h5.disc::after {
  content: none;
}
#struct h5.purpletitle {
  color: #5882a7;
  font-size: 1.5rem;
}
#struct h5.greentitle {
  color: #4f8e42;
}
#struct h5.redtitle {
  color: #954041;
}
#struct h5.yellowtitle {
  color: #9b7833;
}
#struct p:not(.large) {
  text-align: justify;
  font-size: 1.4rem;
}
#struct .equipmentnav ul {
  justify-content: center;
}
#struct .equipmentnav ul li:nth-child(2) {
  margin: 0 2em;
}
@media screen and (max-width: 960px) {
  #struct .equipmentnav ul {
    justify-content: space-between;
  }
  #struct .equipmentnav ul li:nth-child(2) {
    margin: 0;
  }
}
#struct .equipmentnav.cat_structure ul li:nth-child(1) a::after {
  border-top-color: #b09b6d;
}
#struct .equipmentnav.cat_quality ul li:nth-child(2) a::after {
  border-top-color: #b09b6d;
}
#struct .equipmentnav.cat_security ul li:nth-child(3) a::after {
  border-top-color: #b09b6d;
}
#struct #structure .basicstructurebox {
  background: #fbfaf7;
  padding: 2em;
}
@media screen and (max-width: 960px) {
  #struct #structure .basicstructurebox {
    padding: 1em;
  }
}
#struct #structure .basicstructurebox .flex .no01,
#struct #structure .basicstructurebox .flex .no02,
#struct #structure .basicstructurebox .flex .no03 {
  position: relative;
}
#struct #structure .basicstructurebox .flex .no01::before,
#struct #structure .basicstructurebox .flex .no02::before,
#struct #structure .basicstructurebox .flex .no03::before {
  content: "";
  display: block;
  position: absolute;
  border: 2px dotted #5882a7;
}
@media screen and (max-width: 960px) {
  #struct #structure .basicstructurebox .flex .no01::before,
  #struct #structure .basicstructurebox .flex .no02::before,
  #struct #structure .basicstructurebox .flex .no03::before {
    content: none;
  }
}
#struct #structure .basicstructurebox .flex .no01 h5,
#struct #structure .basicstructurebox .flex .no02 h5,
#struct #structure .basicstructurebox .flex .no03 h5 {
  border: 1px solid #5882a7;
  display: flex;
  align-items: center;
  font-size: 1.6rem;
  font-weight: normal;
  color: #5882a7;
  background: white;
  margin-bottom: 0.5em;
  position: relative;
  z-index: 1;
}
#struct #structure .basicstructurebox .flex .no01 h5::before,
#struct #structure .basicstructurebox .flex .no02 h5::before,
#struct #structure .basicstructurebox .flex .no03 h5::before {
  content: "1";
  width: 2em;
  aspect-ratio: 1/1;
  background: #5882a7;
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 0.5em;
}
#struct #structure .basicstructurebox .flex .no01 {
  width: 30%;
}
#struct #structure .basicstructurebox .flex .no01::before {
  width: 9%;
  height: calc(200% + 5rem);
  border-bottom: none;
  border-left: none;
  top: 1em;
  right: -9%;
}
@media screen and (max-width: 960px) {
  #struct #structure .basicstructurebox .flex .no01 {
    width: 100%;
    margin-bottom: 1em;
  }
}
#struct #structure .basicstructurebox .flex .no02 {
  width: 30%;
}
#struct #structure .basicstructurebox .flex .no02::before {
  width: 12%;
  height: calc(200% + 5rem);
  border-right: none;
  border-bottom: none;
  top: 1em;
  left: -12%;
}
#struct #structure .basicstructurebox .flex .no02 h5::before {
  content: "2";
}
@media screen and (max-width: 960px) {
  #struct #structure .basicstructurebox .flex .no02 {
    width: 100%;
  }
}
#struct #structure .basicstructurebox .flex .no03 {
  width: 68%;
}
#struct #structure .basicstructurebox .flex .no03::before {
  width: 0;
  height: calc(15% + 5rem);
  border-right: none;
  border-bottom: none;
  top: calc((15% + 5rem) * -1);
  right: 33%;
}
#struct #structure .basicstructurebox .flex .no03 h5::before {
  content: "3";
}
@media screen and (max-width: 960px) {
  #struct #structure .basicstructurebox .flex .no03 {
    width: 100%;
    margin-bottom: 1em;
  }
}
#struct #structure .basicstructurebox .flex .sub {
  width: 28%;
  border: 1px solid #5882a7;
  padding: 1em;
  background: white;
}
#struct #structure .basicstructurebox .flex .sub h5 {
  color: #5882a7;
  text-align: center;
}
#struct #structure .basicstructurebox .flex .sub p {
  text-align: left;
  font-size: 1.4rem;
}
@media screen and (max-width: 960px) {
  #struct #structure .basicstructurebox .flex .sub {
    width: 100%;
  }
}
#struct #structure .basicstructurebox .basepicture {
  margin: 5rem 0;
}
#struct #quality .flex.c2 > *.leftbox, #struct #quality .flex.c2 > *.rightbox {
  width: calc((100% - 5rem) / 2);
}
#struct #quality .flex.c2 > *.leftbox {
  position: relative;
}
#struct #quality .flex.c2 > *.leftbox::before {
  content: "";
  display: block;
  width: 0;
  height: 100%;
  border-right: 1px dotted #5882a7;
  position: absolute;
  top: 0;
  right: -2.5rem;
}
@media screen and (max-width: 960px) {
  #struct #quality .flex.c2 > *.leftbox::before {
    content: none;
  }
}
#struct #quality .flex.c2 > *.wide {
  margin-top: 2rem;
  border-top: 1px solid #5882a7;
  padding-top: 2rem;
}
#struct #quality .flex.c2 > *.wide .hpevaluationbox .textbox {
  width: 26%;
}
@media screen and (max-width: 960px) {
  #struct #quality .flex.c2 > *.wide .hpevaluationbox .textbox {
    width: 100%;
    margin-bottom: 1em;
  }
}
#struct #quality .flex.c2 > *.wide .hpevaluationbox .listsbox {
  width: 70%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
#struct #quality .flex.c2 > *.wide .hpevaluationbox .listsbox li {
  text-align: left;
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
}
#struct #quality .flex.c2 > *.wide .hpevaluationbox .listsbox li .iconbox {
  background: #595757;
  aspect-ratio: 1/1;
  width: 20%;
  max-width: 54px;
}
#struct #quality .flex.c2 > *.wide .hpevaluationbox .listsbox li .textbox {
  margin-left: 1rem;
  flex: 1;
}
#struct #quality .flex.c2 > *.wide .hpevaluationbox .listsbox li .textbox .title {
  color: #5882a7;
  font-size: 1.4rem;
}
@media screen and (max-width: 960px) {
  #struct #quality .flex.c2 > *.wide .hpevaluationbox .listsbox {
    width: 100%;
    grid-template-columns: repeat(1, 1fr);
  }
}
#struct #quality .flex.c2 > *.wide .insurance .imagebox {
  width: 38%;
}
@media screen and (max-width: 960px) {
  #struct #quality .flex.c2 > *.wide .insurance .imagebox {
    width: 100%;
    margin-bottom: 1em;
  }
}
#struct #quality .flex.c2 > *.wide .insurance .textbox {
  width: 58%;
}
@media screen and (max-width: 960px) {
  #struct #quality .flex.c2 > *.wide .insurance .textbox {
    width: 100%;
  }
}
@media screen and (max-width: 960px) {
  #struct #quality .flex.c2 > *.leftbox, #struct #quality .flex.c2 > *.rightbox {
    width: 100%;
  }
  #struct #quality .flex.c2 > * .spscroll img {
    max-width: none;
    width: 800px;
  }
}
#struct #security .flex.smallimage .textbox {
  width: 78%;
}
@media screen and (max-width: 960px) {
  #struct #security .flex.smallimage .textbox {
    width: 68%;
  }
}
#struct #security .flex.smallimage .imagebox {
  width: 18%;
}
@media screen and (max-width: 960px) {
  #struct #security .flex.smallimage .imagebox {
    width: 28%;
  }
}
#struct #security .flex.smallimage .imagebox .nm2 {
  margin-top: -2.5em;
}
@media screen and (max-width: 960px) {
  #struct #security .flex.smallimage .imagebox .nm2 {
    margin-top: 0;
  }
}
#struct #security .flex.colormonitor {
  width: calc((100% - 8rem) / 2);
  align-items: flex-start;
}
#struct #security .flex.colormonitor .textbox {
  width: 48%;
}
#struct #security .flex.colormonitor picture {
  width: 48%;
  display: inline-block;
  margin-top: 0;
}
@media screen and (max-width: 960px) {
  #struct #security .flex.colormonitor {
    width: 100%;
    margin-bottom: 2em;
  }
}
#struct #security .flex.firedetectors {
  width: calc((100% - 8rem) / 2);
  position: relative;
}
#struct #security .flex.firedetectors::before {
  content: "";
  width: 0;
  height: 100%;
  display: block;
  border-left: 1px dotted #8d7642;
  position: absolute;
  top: 0;
  left: -4rem;
}
#struct #security .flex.firedetectors .textbox {
  width: 57%;
  display: flex;
  flex-direction: column;
}
#struct #security .flex.firedetectors .textbox picture {
  margin-top: auto;
}
#struct #security .flex.firedetectors .imagebox {
  width: 35%;
}
@media screen and (max-width: 960px) {
  #struct #security .flex.firedetectors {
    width: 100%;
  }
}
@media screen and (max-width: 960px) {
  #struct #security .spscroll img {
    max-width: none;
    width: 800px;
  }
}
@media screen and (max-width: 960px) {
  #struct .flex.c3 > *,
  #struct .flex.c2 > *,
  #struct .flex.c1-2 > * {
    width: 100%;
  }
  #struct .flex.c3 > *:not(:last-child),
  #struct .flex.c2 > *:not(:last-child),
  #struct .flex.c1-2 > *:not(:last-child) {
    margin-bottom: 1em;
  }
  #struct .flex.c4 > * {
    width: 48%;
  }
  #struct .flex.c4 > *:not(:last-child):not(:nth-last-child(2)) {
    margin-bottom: 1em;
  }
}

#brand #about h3 img {
  width: min(50%, 150px);
}
#brand #about p {
  line-height: 2.2;
  font-weight: bold;
}
@media screen and (max-width: 960px) {
  #brand #about p {
    font-size: 1.5rem;
  }
}
#brand #zerovision {
  background: url(../img/brand/bg_zerovision.jpg) no-repeat 100% 100%;
  background-size: cover;
  aspect-ratio: 1920/960;
  display: flex;
  justify-content: center;
  align-items: center;
}
#brand #zerovision .init {
  color: white;
  line-height: 2.2;
  padding: 2em 0;
}
@media screen and (max-width: 960px) {
  #brand #zerovision {
    font-size: 1.5rem;
    display: block;
    padding: 4rem 1.5rem;
  }
  #brand #zerovision .init {
    text-align: left;
    line-height: 1.8;
    text-shadow: 0 0 3px rgba(0, 0, 0, 0.3), 0 0 3px rgba(0, 0, 0, 0.3), 0 0 3px rgba(0, 0, 0, 0.3);
  }
}
#brand #results {
  padding-top: 7rem;
}
@media screen and (max-width: 960px) {
  #brand #results {
    padding-top: 4rem;
  }
}
#brand #results .initBox2 {
  max-width: calc(840px + 1rem);
}
@media screen and (max-width: 932px) {
  #brand #results .initBox2 h3 img {
    width: 20.6247019552%;
  }
}
#brand #results .initBox2 h4 {
  font-size: 2.2rem;
  letter-spacing: 0;
}
@media screen and (max-width: 960px) {
  #brand #results .initBox2 h4 {
    font-size: 1.8rem;
  }
}
#brand #results .initBox2 h5.flex {
  flex-wrap: nowrap;
}
#brand #results .initBox2 h5.flex span {
  display: inline-block;
}
#brand #results .initBox2 h5.flex span:first-child {
  margin-right: 3rem;
}
@media screen and (max-width: 960px) {
  #brand #results .initBox2 h5.flex {
    display: block;
  }
  #brand #results .initBox2 h5.flex span {
    width: 100%;
    display: block;
    text-align: center;
    margin-bottom: 1rem;
    /*
    &:first-child img {
    	width: 100%;
    }
    &:last-child img {
    	width: calc((517 / 588) * 100%);
    }
    */
  }
  #brand #results .initBox2 h5.flex span img {
    width: 100%;
  }
}
#brand #results .initBox2 .resultsUl {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
}
#brand #results .initBox2 .resultsUl li {
  position: relative;
}
#brand #results .initBox2 .resultsUl li p {
  background: rgba(0, 0, 0, 0.75);
  color: white;
  font-size: 1.2rem;
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  display: inline-block;
  line-height: 1.5;
  padding: 0.5em 0;
}
@media screen and (max-width: 960px) {
  #brand #results .initBox2 .resultsUl {
    grid-template-columns: repeat(2, 1fr);
  }
}

#modelroommap .flex picture {
  width: 35%;
  border: 1px solid black;
}
#modelroommap .flex .textbox {
  flex: 1;
  display: flex;
  align-items: flex-end;
  background: #f5f2e9;
  padding: 2em 4em;
}
#modelroommap .flex .textbox h3 {
  background: #8d7642;
  color: white;
  font-size: 2.6rem;
  line-height: 1;
  padding: 0.5em 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
#modelroommap .flex .textbox h3 img {
  height: 1em;
  margin-right: 0.25em;
}
#modelroommap .flex .textbox .carnav {
  font-size: clamp(2.4rem, 3vw, 3.4rem);
  background: white;
  padding: 0.5em 0;
  line-height: 1;
  text-align: center;
}
#modelroommap .flex .textbox .carnav + p {
  margin-top: 1em;
}
#modelroommap .flex .textbox p.point {
  margin: 1em 0 0.5em;
  background: white;
  text-align: center;
  padding: 0.25em 0;
}
#modelroommap .flex .textbox ul li {
  text-align: left;
}
@media screen and (max-width: 960px) {
  #modelroommap .flex {
    flex-wrap: wrap;
  }
  #modelroommap .flex picture {
    width: 100%;
  }
  #modelroommap .flex picture img {
    width: 100%;
  }
  #modelroommap .flex .textbox {
    width: 100%;
    padding: 1em;
  }
  #modelroommap .flex .textbox div {
    margin: 0 auto;
  }
  #modelroommap .flex .textbox h3 {
    font-size: 2rem;
  }
  #modelroommap .flex .textbox .carnav {
    flex-grow: auto;
    padding: 2rem 0;
  }
  #modelroommap .flex .textbox .carnav + p {
    text-align: center;
  }
  #modelroommap .flex .textbox .carnav + p img {
    width: 100%;
    max-width: 400px;
  }
}

#outline table {
  width: 100%;
  text-align: left;
}
#outline table tbody th {
  white-space: nowrap;
  width: 30%;
  border-bottom: 2px solid #8d7642;
  padding: 0.5em 1em;
  font-weight: 400;
  vertical-align: top;
  font-size: 1.4rem;
}
#outline table tbody td {
  border-bottom: 1px dotted #8d7642;
  padding: 0.5em 1em;
  font-size: 1.4rem;
}
@media screen and (max-width: 960px) {
  #outline table {
    display: block;
  }
  #outline table tbody,
  #outline table tr,
  #outline table th,
  #outline table td {
    display: block;
  }
  #outline table tbody th {
    width: auto;
    text-align: left;
    background: rgba(141, 118, 66, 0.1);
    font-size: 1.3rem;
    border-bottom: none;
  }
  #outline table tbody td {
    padding-left: 1.5em;
    font-size: 1.3rem;
    border-bottom: none;
  }
}

#mappage2 #headerBox .submenu .map_mr a,
#mappage #headerBox .submenu .map a,
#outline #headerBox .submenu .outline a {
  pointer-events: none;
  background: #c60f28;
}

@keyframes bgAnime {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  40% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}/*# sourceMappingURL=common.css.map */

.new-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 6px;
  font-size: 10px;
  color: #fff;
  background: #e60023;
  border-radius: 3px;
  font-weight: bold;
  line-height: 1;
    animation: blink 5s infinite;
}

@keyframes blink {
  0%, 100% {opacity: 1;}
  50% {opacity: 0.4;}
}