.page-title .large { font-size: 200%; padding: 5px; }

.en-title { font-family: "Barlow Condensed", sans-serif; font-optical-sizing: auto; font-style: normal; font-variation-settings: "wdth" 100; font-feature-settings: 'palt'; font-weight: 500; color: #c87f52; font-size: clamp(26px, calc(22.6165px + 0.9023vw), 32px); letter-spacing: 0.15em; margin-top: 5rem; text-align: center; }

.bg-stripe { background: url("../images/share/bg_stripe01.png") center center/26px auto repeat; color: #000; }

.local-nav ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; max-width: 720px; margin: auto; }
.local-nav ul div, .local-nav ul li { min-height: 0%; }
.local-nav ul li { max-width: 400px; }
.local-nav ul li a { display: block; width: 100%; padding: 4px; text-align: center; line-height: 1.2; border: thin solid #000; background-color: #fff; transition: all 0.4s; position: relative; }
.local-nav ul li a::before { content: ""; display: inline-block; width: 8px; height: calc(8px / 2 * tan(60deg)); background-color: #000; clip-path: polygon(0 0, 100% 50%, 0 100%); position: absolute; right: 8px; top: 50%; transform: translateY(-50%); z-index: 2; transition: all 0.4s; }
.local-nav ul li a::after { content: ""; display: block; width: 100%; height: 100%; background-color: #c87f52; position: absolute; left: 0; top: 0; opacity: 0; z-index: 1; transition: all 0.4s; }
.local-nav ul li a .en-b { font-size: clamp(24px, 1.4vw, 1.5rem); color: #000; line-height: 1.2; letter-spacing: 0.05em; text-align: center; position: relative; z-index: 2; transition: all 0.4s; }
.local-nav ul li a:hover, .local-nav ul li a.current { color: #fff; border-color: #c87f52; }
.local-nav ul li a:hover::before, .local-nav ul li a.current::before { background-color: #fff; }
.local-nav ul li a:hover::after, .local-nav ul li a.current::after { opacity: 1; }
.local-nav ul li a:hover .en-b, .local-nav ul li a.current .en-b { color: #fff; }
.local-nav ul.option3 li { width: 32%; }
.local-nav ul.option2 li { width: 48%; }

.intro { position: relative; z-index: 2; }

.item-list { padding-top: 2.5rem; }
.item-list ul { display: grid; grid-template-columns: repeat(12, 1fr); gap: 2.875rem 4.6%; }
.item-list ul > li.item-box { display: grid; grid-template-rows: subgrid; grid-row: span 3; grid-column: span 4; gap: 0; }
.item-list ul > li.item-box.nosubgrid { grid-template-rows: none; }
.item-list ul > li.item-box.w1 { grid-column: span 12; }
.item-list ul > li.item-box.w4-3 { grid-column: span 9; }
.item-list ul > li.item-box.w3-2 { grid-column: span 8; }
.item-list ul > li.item-box.w2 { grid-column: span 6; }
.item-list ul > li.item-box.w4 { grid-column: span 3; }
.item-list ul .image { margin-bottom: 8px; align-self: center; }
.item-list ul .item-name { font-size: clamp(16px, 1.2vw, 1.125rem); text-align: center; line-height: 1.28; color: #c87f52; align-self: center; }
.item-list ul .item-name .note { color: #000; }
.item-list ul .text { padding-top: 4px; }
.item-list ul .text .lead { font-size: clamp(14px, 1.1vw, 0.9375rem); text-align: left; line-height: 1.6; }
.item-list ul .text .note { margin-top: 0.5rem; }
@media screen and (max-width: 560px) { .item-list { padding-top: 2rem; }
  .item-list ul { grid-template-columns: repeat(2, 1fr); gap: 2.5rem 4.8%; }
  .item-list ul > li.item-box { grid-column: span 1; }
  .item-list ul > li.item-box.w1 { grid-column: span 2; }
  .item-list ul > li.item-box.w4-3 { grid-column: span 2; }
  .item-list ul > li.item-box.w3-2 { grid-column: span 2; }
  .item-list ul > li.item-box.w2 { grid-column: span 2; }
  .item-list ul > li.item-box.w4 { grid-column: span 1; } }

.type-column { align-items: flex-start; }
.type-column .bg-stripe { padding: 1rem 4.6%; }

.block-title { text-align: center; font-size: clamp(16px, 1.2vw, 1.125rem); letter-spacing: 0.1em; padding: 6px 0; margin-bottom: 8px; border: 1px solid #c87f52; color: #c87f52; border-width: 1px 0; }

#equipment main { background-color: #47403b; color: #fff; }
#equipment .page-title { color: #fff; }

#Kitchen #gasrange .bg-stripe { padding: 1rem 3.2%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
#Kitchen #gasrange .bg-stripe div, #Kitchen #gasrange .bg-stripe li { min-height: 0%; }
#Kitchen #gasrange .bg-stripe .block { display: grid; grid-template-columns: none; }
#Kitchen #gasrange .bg-stripe .block.block1 { grid-template-columns: 1fr; gap: 0; width: 48%; }
#Kitchen #gasrange .bg-stripe .block.block1 .text { order: 3; }
#Kitchen #gasrange .bg-stripe .block.block2 { align-self: flex-end; grid-template-columns: 56% 40%; gap: 0 4%; width: 48%; }
#Kitchen #gasrange .bg-stripe .block.block2 .image { grid-row: span 2; }
@media screen and (max-width: 834px) { #Kitchen #gasrange .bg-stripe .block.block2 { align-self: center; grid-template-columns: 64% 32%; } }
@media screen and (max-width: 560px) { #Kitchen #gasrange .bg-stripe .block.block1 { width: 100%; }
  #Kitchen #gasrange .bg-stripe .block.block2 { width: 100%; grid-template-columns: 48% 48%; margin-top: 1.5rem; } }

#Others .type-column { grid-row: span 3; }
#Others .type-column .bg-stripe { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 2.4%; grid-row: span 3; align-items: stretch; color: #000; }
#Others .type-column .image .img .cap.in { bottom: 14%; }
#Others .type-column .pic-title { display: block; width: 100%; position: absolute; left: 0; bottom: 0; }
#Others .type-column .pic-title .bg-container { padding: 4px; position: relative; }
#Others .type-column .pic-title .bg-container .bg { content: ""; display: block; width: 100%; height: 100%; background-color: #6e6e6f; mix-blend-mode: multiply; position: absolute; left: 0; top: 0; z-index: 1; }
#Others .type-column .pic-title .txt { font-size: clamp(11px, 1vw, 0.75rem); color: #fff; text-align: center; line-height: 1.2; position: relative; z-index: 2; }
#Others .type-column .item-name { grid-column: span 2; }
#Others .type-column .text { grid-column: span 2; }
#Others #toilet { border: thin solid #c87f52; background-color: #fff; color: #000; padding: 1.25rem 2.4%; }
#Others #toilet .toilet-cont-wrap { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem 2.4%; }
#Others #toilet .toilet-cont-wrap .block { display: grid; grid-template-columns: 48% 48%; grid-template-rows: subgrid; grid-row: span 3; gap: 0 4%; }
#Others #toilet .toilet-cont-wrap .block .image { grid-row: span 3; }
#Others #toilet .toilet-cont-wrap .block.block1 { grid-template-columns: 1fr; }
#Others #toilet .toilet-cont-wrap .block.block2 { order: 4; }
#Others #toilet .toilet-cont-wrap .block.block5 { order: 5; }
#Others #toilet .toilet-cont-wrap .block.block6 { order: 6; }
#Others #toilet .toilet-cont-wrap .washlet-item .text .lead { font-size: clamp(13px, 1.05vw, 0.875rem); }
#Others #toilet .toilet-cont-wrap .washlet-item-name { padding: 4px 6px; font-size: clamp(13px, 1.05vw, 0.875rem); color: #fff; text-align: left; line-height: 1.2; background-image: linear-gradient(to right, #d2936a, rgba(212, 152, 109, 0.56)); margin-bottom: 6px; }
@media screen and (max-width: 834px) { #Others .type-column .image .img .cap.in { bottom: 20%; }
  #Others #toilet .toilet-cont-wrap { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem 2.4%; }
  #Others #toilet .toilet-cont-wrap .block.block2 { order: 2; }
  #Others #toilet .toilet-cont-wrap .block.block3 { order: 3; }
  #Others #toilet .toilet-cont-wrap .block.block4 { order: 4; } }
@media screen and (max-width: 560px) { #Others .type-column .image .img .cap.in { bottom: 22%; }
  #Others #toilet { padding: 1.25rem 4%; }
  #Others #toilet .toilet-cont-wrap { gap: 1.75rem 4.6%; }
  #Others #toilet .toilet-cont-wrap .block { grid-template-columns: 1fr; }
  #Others #toilet .toilet-cont-wrap .block .image { grid-row: span 1; margin-bottom: 0; }
  #Others #toilet .toilet-cont-wrap .block.block1 { grid-column: span 2; }
  #Others #toilet .toilet-cont-wrap .block.block2 { grid-column: span 2; grid-template-columns: repeat(2, 1fr); gap: 1rem 2.4%; }
  #Others #toilet .toilet-cont-wrap .block.block2 .image { grid-row: span 3; }
  #Others #toilet .toilet-cont-wrap .block.block3 { order: 3; }
  #Others #toilet .toilet-cont-wrap .block.block4 { order: 4; }
  #Others #disposal24 { order: 13; } }

#Structure #pile { grid-row: span 6; }
#Structure #pile .image { grid-row: span 4; align-self: flex-end; }
#Structure #pile .image .img { height: 100%; }
#Structure #pile .image .img img { height: 100%; object-fit: cover; }
@media screen and (max-width: 560px) { #Structure #pile { grid-column: span 2; grid-row: span 4; grid-template-columns: repeat(2, 1fr); gap: 0 2.3%; }
  #Structure #pile .image { grid-row: span 4; align-self: center; }
  #Structure #pile .item-name { grid-row-start: 2; grid-row-end: 3; }
  #Structure #pile .text { grid-row-start: 3; grid-row-end: 4; } }

#Security #securitySystem { grid-template-columns: repeat(4, 1fr); gap: 0 2.3%; }
#Security #securitySystem .image { order: 2; grid-column: span 3; grid-row: span 2; }
#Security #securitySystem .text { order: 3; }
@media screen and (max-width: 560px) { #Security #securitySystem { grid-template-columns: 1fr; }
  #Security #securitySystem .image { order: 1; grid-column: span 1; grid-row: span 1; }
  #Security #securitySystem .image .img .cap.in { position: static; text-align: right; width: 100%; }
  #Security #securitySystem .item-name { order: 2; }
  #Security #elevatorSecurity { grid-column: span 2; } }