.gold { color: #c9bc9c; }

.note.tar { text-align: right; }

.lnav { width: 90%; max-width: 1100px; margin-left: auto; margin-right: auto; padding: 5rem 0; }
.lnav ul { max-width: 800px; margin: 0 auto; display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
.lnav ul li a { display: grid; place-content: center; place-items: center; padding: 1.5rem; text-align: center; border: solid 1px #9e7c1d; background: #251A16; transition: .4s; }
.lnav ul li a .en { font-size: 10px; letter-spacing: 0; line-height: 1; color: #fff; }
.lnav ul li a .ja { text-align: center; font-size: .875rem; line-height: 1; color: #fff; margin-top: .5rem; }
.lnav ul li.current a { background: #856814; background: -webkit-linear-gradient(110deg, #856814 3%, #4a3600 90%); background: -moz-linear-gradient(110deg, #856814 3%, #4a3600 90%); background: linear-gradient(110deg, #856814 3%, #4a3600 90%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#856814", endColorstr="#4A3600", GradientType=0); }
.lnav ul li:hover a { filter: brightness(120%); }
@media screen and (max-width: 768px) { .lnav ul { max-width: 400px; grid-template-columns: 1fr; }
  .lnav ul li a { padding: 1.2rem; }
  .lnav ul li a .en img { height: .85rem; } }

section .w-box { background: #fff; color: #222; padding: 5rme 0; }
section .w-box h3 { color: #9e7c1d; }

.img .pic_txt { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; text-align: center; padding: 12px 0; color: #fff; background: linear-gradient(90deg, rgba(0, 0, 0, 0.1), black, rgba(0, 0, 0, 0.1)); font-size: 2rem; line-height: 1; }
.img .pic_txt span { font-size: 1em; text-align: right; display: inline-block; line-height: 0.8; }
.img .pic_txt span b { font-size: 2em; font-weight: normal; }
.img .pic_txt span small { font-size: 0.6em; }

.photoArea .img .pic_txt { font-size: 1rem; }

@media screen and (max-width: 500px) { h3.lmidashi { font-size: 1.2rem; letter-spacing: 0; } }

h4.komidashi { text-align: center; margin-bottom: 2rem; font-size: 1.4rem; }
h4.komidashi.en { color: #c9bc9c; }
@media screen and (max-width: 500px) { h4.komidashi { font-size: 1rem; } }

h6 { font-size: 1rem; margin-bottom: 1rem; }
h6 b { font-size: 1.5em; font-weight: normal; }

.sub_ttl { text-align: center; width: 100%; background: #5D5D5D; color: #fff; padding: 12px 0; font-size: 1.4rem; line-height: 1.4; margin-bottom: 1rem; }
.sub_ttl b { font-size: 1.5em; font-weight: normal; }
@media screen and (max-width: 768px) { .sub_ttl { font-size: 3.4vw; }
  .sub_ttl b { font-size: 1.3em; } }

.flexBox { display: -webkit-box; display: flex; flex-wrap: wrap; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: start; align-items: flex-start; }
.flexBox * { min-height: 0%; }
.flexBox.box2 > li, .flexBox.box2 > div, .flexBox.box2 > p, .flexBox.box2 > span { width: 48%; }
.flexBox.box3 > li, .flexBox.box3 > div, .flexBox.box3 > p, .flexBox.box3 > span { width: 31%; }
.flexBox.box4 > li, .flexBox.box4 > div, .flexBox.box4 > p, .flexBox.box4 > span { width: 23%; }

.img_category_main { /*@include inner;*/ width: 100%; }
.img_category_main .img { overflow: hidden; }
.img_category_main .img::before { content: ""; display: block; width: 100%; height: 300px; }
.img_category_main .img img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
@media screen and (max-width: 768px) { .img_category_main .img::before { height: auto; padding-bottom: 56%; } }

@media screen and (max-width: 1024px) { .category-box.move-line + .lmidashi { margin-top: 0; } }
#p00 { padding-bottom: 5rem; }
#p00 .lmidashi .note { margin-top: .5rem; text-align: center; }
#p00 h3 { color: #c9bc9c; }

#p01 { padding: 0 0 5rem; background: #5D6164; background: -webkit-linear-gradient(110deg, #5d6164 1%, #292526 100%); background: -moz-linear-gradient(110deg, #5d6164 1%, #292526 100%); background: linear-gradient(110deg, #5d6164 1%, #292526 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5D6164", endColorstr="#292526", GradientType=0); }
#p01 h3 { color: #c9bc9c; }
#p01 .accessmap1 { max-width: 900px; margin: 3rem auto 0; }
#p01 .accessmap1 .img .cap { background: none; }
#p01 .umejimaSta { margin: 8rem auto; }
#p01 .umejimaSta .sub_ttl { background: #7d7d7d; }
#p01 .umejimaSta li:nth-of-type(1) { width: 52.7%; }
#p01 .umejimaSta li:nth-of-type(2) { width: 46.4%; }
#p01 .umejimaSta li:nth-of-type(2) .img { width: 49%; }
#p01 .hibiyasen { max-width: 600px; margin: 3rem auto; }
#p01 .hibiyasen .komidashi { font-size: 1.6rem; border: solid 1px #fff; padding: 5px 10px; }
#p01 .hibiyasen .note { margin-top: 1rem; }
@media screen and (max-width: 1024px) { #p01 { padding-top: 0; } }
@media screen and (max-width: 768px) { #p01 .accessmap1 .img { padding-bottom: 2rem; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
  #p01 .accessmap1 img { height: 300px; width: auto; max-width: none; }
  #p01 .umejimaSta { margin-bottom: 0; }
  #p01 .umejimaSta li:nth-of-type(1) { width: 100%; margin-bottom: 1rem; }
  #p01 .umejimaSta li:nth-of-type(2) { width: 100%; } }

#p02 { padding: 5rem 0; /*background: #5D6164;
background: -webkit-linear-gradient(110deg, rgba(93, 97, 100, 1) 1%, rgba(41, 37, 38, 1) 100%);
background: -moz-linear-gradient(110deg, rgba(93, 97, 100, 1) 1%, rgba(41, 37, 38, 1) 100%);
background: linear-gradient(110deg, rgba(93, 97, 100, 1) 1%, rgba(41, 37, 38, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5D6164", endColorstr="#292526", GradientType=0);*/ }
#p02 h3 { color: #c9bc9c; }
#p02 .nishiaraiSta { margin: 0 auto; }
#p02 .nishiaraiSta .sub_ttl { background: #483d8f; }
#p02 .nishiaraiSta li:nth-of-type(1) { width: 52.7%; }
#p02 .nishiaraiSta li:nth-of-type(2) { width: 46.4%; }
#p02 .nishiaraiSta li:nth-of-type(2) .img { width: 49%; }
#p02 .hibiyasen { max-width: 600px; margin: 3rem auto; }
@media screen and (max-width: 768px) { #p02 .nishiaraiSta { margin-bottom: 0; }
  #p02 .nishiaraiSta li:nth-of-type(1) { width: 100%; margin-bottom: 1rem; }
  #p02 .nishiaraiSta li:nth-of-type(2) { width: 100%; } }

#p03 { background: #38383a; padding: 5rem 0; }
#p03 .kitasenju .accessmap { max-width: 900px; margin: 0 auto 4rem; }
#p03 .kitasenju .photoArea { margin-bottom: 5rem; }
#p03 .kitasenju .photoArea.mb2 { margin-bottom: 2rem; }
#p03 .kitasenju .photoArea li { width: 24%; }
#p03 .kitasenju .sub_ttl.ttl1 { background: #009393; }
#p03 .kitasenju .sub_ttl.ttl2 { background: #009dcf; }
@media screen and (max-width: 768px) { #p03 .kitasenju .accessmap .img { padding-bottom: 2rem; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
  #p03 .kitasenju .accessmap img { height: 300px; width: auto; max-width: none; }
  #p03 .kitasenju .photoArea { margin-bottom: 2rem; }
  #p03 .kitasenju .photoArea li { width: 49%; margin-bottom: 0.5rem; } }

#p04 { padding: 5rem 0; }
#p04 .accessmap { max-width: 900px; margin: 0 auto 4rem; }
#p04 .list { /*max-width: 540px;*/ max-width: 900px; margin: 0 auto 4rem; }
#p04 .note { margin-top: 1rem; }

#p05 { background: #38383a; padding: 5rem 0; }
#p05 .inner { background: #dfd4bd; padding: 3rem 550px 3rem 3rem; position: relative; }
#p05 .inner::after { content: ""; display: block; width: 20%; height: 100%; position: absolute; top: 0; right: 0; z-index: 1; background: #b9a783; }
#p05 .txtArea { text-align: left; color: #000; position: relative; z-index: 2; }
#p05 .txtArea .en { font-size: 2rem; color: rgba(0, 0, 0, 0.3); margin-bottom: 1rem; }
#p05 .txtArea h4.komidashi { text-align: left; }
#p05 .pic { position: absolute; top: -20px; right: -20px; width: 40%; z-index: 2; }
@media screen and (max-width: 1200px) { #p05 .inner { padding: 3rem 35% 3rem 3rem; } }
@media screen and (max-width: 768px) { #p05 .inner { padding: 2rem; }
  #p05 .txtArea .en { font-size: 1.8rem; margin-bottom: 0.7rem; padding-top: 25%; }
  #p05 .pic { width: 60%; } }

#p06 { background: #515457; padding: 0 0 5rem; }
#p06 .lmidashi { margin-bottom: 5rem; }
#p06 .list .note { margin-top: 1rem; }
@media screen and (max-width: 1024px) { #p06 { padding-top: 0; } }

#p07 { padding: 0 0 5rem; }
#p07 .lmidashi { margin-bottom: 5rem; }
#p07 .photoArea { margin-bottom: 3rem; }
#p07 .photoArea li { width: 24%; }
#p07 .photoArea li .txt { margin-top: 1rem; }
#p07 .photoArea li .txt img { height: 6rem; width: auto; }
#p07 .list { margin-top: 1rem; background: #515457; }
#p07 .list .bus_map { width: 52%; }
#p07 .list .bus_list { width: 48%; padding: 2% 5%; }
@media screen and (max-width: 1024px) { #p07 { padding-top: 0; } }
@media screen and (max-width: 768px) { #p07 .photoArea { margin-bottom: 2rem; }
  #p07 .photoArea li { width: 49%; margin-bottom: 2rem; }
  #p07 .photoArea li .txt img { height: 17vw; }
  #p07 .list .bus_map { width: 100%; }
  #p07 .list .bus_list { width: 100%; padding: 2rem 5%; } }

#p08 { background: #515457; padding: 0 0 5rem; }
#p08 .img_category_main .img img { top: auto; bottom: 0; left: 50%; -webkit-transform: translate(-50%, 5%); transform: translate(-50%, 5%); }
#p08 .lmidashi { margin-bottom: 5rem; }
#p08 .list .note { margin-top: 1rem; }
@media screen and (max-width: 1024px) { #p08 { padding-top: 0; } }
@media screen and (max-width: 768px) { #p08 .img_category_main .img::before { padding-bottom: 53%; } }

#p09 { padding: 0 0 5rem; }
#p09 .lmidashi { margin-bottom: 5rem; }
#p09 .list { max-width: 600px; margin: auto; }
#p09 .list .note { margin-top: 1rem; }
@media screen and (max-width: 1024px) { #p09 { padding-top: 0; } }

#p10 { background: #515457; padding: 0 0 5rem; }
#p10 .lmidashi { margin-bottom: 5rem; }
#p10 .list { max-width: 580px; margin: 0 auto 5rem; }
#p10 .list .note { margin-top: 1rem; }
#p10 .photoArea li { width: 24%; }
#p10 .photoArea li .img { margin-bottom: 0.5rem; }
#p10 .photoArea li .txt { font-size: 1rem; line-height: 1.1; }
#p10 .photoArea li .txt b { font-size: 2.5em; font-weight: normal; }
#p10 .photoArea li .txt small { display: block; margin-top: 0.5rem; }
#p10 .photoArea > .note { margin-top: 2rem; }
@media screen and (max-width: 1024px) { #p10 { padding-top: 0; } }
@media screen and (max-width: 768px) { #p10 .photoArea li { width: 48%; margin-bottom: 2rem; }
  #p10 .photoArea > .note { margin-top: 2rem; } }

.js-scrollable { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.js-scrollable img { max-width: none; }

.caution { padding-bottom: 1rem; text-align: center; color: #fff; font-size: .875rem; line-height: 1.2; border: solid 1px #fff; padding: 5px; }
.caution + .img { margin-top: 1rem; }
