.header { background-color: rgba(0, 0, 0, 0); transition: background 0.3s ease 0s; }
.header.bgActive { background-color: black; }

.bg-white { position: relative; background-color: #fff; }

.contentsArea { padding-bottom: 0; }

.header-space { height: 1px; }

/******************************************************

spfooterinformation

******************************************************/
#spFooterNav { opacity: 0; pointer-events: none; transition: 0.3s linear 0s opacity; }
#spFooterNav ul li a { pointer-events: none; }
#spFooterNav.active { opacity: 1; pointer-events: auto; }
#spFooterNav.active ul li a { pointer-events: auto; }

.page-wrap { padding-bottom: 0rem; }

.main-container { background-color: #397f9f; width: 100%; }
.main-container .scene-cls { position: fixed; top: 70px; left: 0; display: flex; flex-direction: column; justify-content: space-between; width: 100%; }
.main-container .scene-cls .scene-visual { width: 100%; height: calc(100vh - 166px - 70px); background-color: #000; overflow: hidden; position: relative; }
.main-container .scene-cls .scene-visual .note { text-align: right; position: absolute; translate: 0% -100%; bottom: 0; color: #fff; line-height: 1; right: 1rem; text-shadow: 0 0 2px #000, 0 0 5px #000, 0 0 10px #000; }
.main-container .scene-cls .scene-obj { position: absolute; }
.main-container .scene-cls .scene-obj img { width: 100%; height: auto; }
.main-container .scene-cls .scene-copy { height: 166px; background-color: #231404; display: flex; flex-direction: column; justify-content: center; text-align: center; padding: 0 4rem; overflow: hidden; }
.main-container .scene-cls .scene-copy .midashi-L { color: #e6ce82; line-height: 1; font-feature-settings: "palt" 1; letter-spacing: 0.0em; opacity: 0; translate: 0% 100%; transition: 1s ease 0s translate, 1s ease 0s opacity; }
.main-container .scene-cls .scene-copy .copy { color: #e0daca; letter-spacing: 0.1em; opacity: 0; translate: 0% 100%; transition: 1.5s ease 0s translate, 1.5s ease 0s opacity; }
.main-container .scene-cls .scene-copy .copy .en { font-size: 2em; line-height: 1; }
.main-container .scene-cls.active .scene-copy .midashi-L { opacity: 1; translate: 0% 0%; }
.main-container .scene-cls.active .scene-copy .copy { opacity: 1; translate: 0% 0%; }
.main-container .scene-space { width: 100%; height: 100vh; pointer-events: none; }
.main-container .scene-space#scene01-space { height: 150vh; }
@media screen and (max-width: 870px) { .main-container .scene-cls .scene-visual { width: 100%; height: calc(100vh - 166px - 70px - 49px); background-color: #000; overflow: hidden; } }
@media screen and (max-width: 599px) { .main-container .scene-cls .scene-visual { width: 100%; height: calc(100vh - 140px - 70px - 49px); }
  .main-container .scene-cls .scene-copy { height: 140px; } }

#scene .scene-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center center; }
#scene .scene-visual#visual01 img { width: 120%; }
#scene .scene-visual#visual02 { position: absolute; top: 0px; left: 0; opacity: 0; }
#scene .scene-visual#visual02 img { width: 120%; }

.localNav { width: 100%; /*background-color: #231404;*/ background-color: #fff; padding: 10px 0; z-index: 100; /*border-bottom: 1px solid rgba(0, 0, 0, 0.1);*/ }
.localNav ul { width: calc(100% - 4rem); max-width: 900px; margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; }
.localNav ul li { position: relative; width: calc(100 / 2 * 1% - 4px); }
.localNav ul li.current button { background-color: #397f9f !important; }
.localNav ul.btnList button:hover { background: #397f9f; }
.localNav.absorute { position: fixed; left: 0; }
@media screen and (max-width: 599px) { .localNav ul li { width: calc(100 / 2 * 1% - 4px); margin-bottom: 5px; }
  .localNav ul li.current button { color: #fff; }
  .localNav ul.btnList button:hover { color: #fff; } }

.page-container { position: relative; /*background-color: $blue;*/ width: 100%; padding: 4rem 0rem 0; }

@media screen and (max-width: 599px) { .contents-secttl { width: calc(100% - 4rem); margin-left: 2rem; } }

.section-container { margin-top: 4rem; width: 100%; overflow: hidden; position: relative; padding: 3rem 0; /*background-color: $blue;*/ color: #397f9f; text-align: center; }
.section-container .section-inner { max-width: 790px; width: 90%; margin: 0 auto; }
.section-container .section-ttl { width: 100%; margin-bottom: 3rem; }
.section-container .section-ttl .txt1 { background-color: #397f9f; color: #fff; text-align: center; padding: 0.2em 0; }
.section-container .section-ttl .txt2 { background-color: #fff; color: #000; text-align: center; margin-bottom: 2rem; padding: 0.4em 0; }
.section-container .section-ttl .txt3 { color: #000; text-align: center; }
.section-container .section-box { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin: 0 auto 3rem; }
.section-container .num { width: 1.5em; height: 1.5em; display: inline-block; margin-right: 0.5em; }
.section-container .num img { width: 100%; height: auto; }
.section-container .txt-detail { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; text-align: left; margin-bottom: 1rem; }
.section-container .txt-detail .lead { color: #000; }
.section-container .komidashi { position: relative; width: 100%; border-bottom: 1px solid #000; padding-bottom: 0.5em; margin-bottom: 0.5em; }
.section-container .komidashi .num, .section-container .komidashi .txt { vertical-align: middle; line-height: 1; }
.section-container .komidashi .storage-icon { width: 1.4em; height: 1.4em; position: absolute; top: 0.4em; right: 0; background-size: contain; background-repeat: no-repeat; background-position: center center; }
.section-container .komidashi .storage-icon.icon-s { background-image: url("../img/storage/storage-icon01.png"); }
.section-container .komidashi .storage-icon.icon-r { background-image: url("../img/storage/storage-icon02.png"); }
.section-container .komidashi .storage-icon.icon-c { background-image: url("../img/storage/storage-icon03.png"); }
.section-container .lead-s { font-size: 0.7rem; line-height: 1.5; color: #000; }
.section-container .lead { position: relative; }
.section-container .saiyo { position: absolute; right: 3rem; top: 50%; transform: translate(0%, -50%); width: 3.5rem; }
.section-container .saiyo img { width: 100%; height: auto; }
@media screen and (max-width: 599px) { .section-container .section-ttl .txt1 .lead { text-align: center; }
  .section-container .section-ttl .txt2 { padding: 0.4rem 1.6rem; }
  .section-container .section-ttl .txt3.lead { text-align: left; }
  .section-container .lead-s { font-size: 0.9rem; }
  .section-container .saiyo { right: 1rem; top: 0.5rem; } }

#block00 { padding-top: 3rem; }

#sec01 { margin-top: 0; }
#sec01 .box1 { margin: 0 auto 2rem; background-color: #f0ece5; border-radius: 5px; overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 2rem; }
#sec01 .box1 .box-inner1 { width: 100%; }
#sec01 .box1 .box-inner1 .img { width: 38.2481751825%; margin: 0 auto 2rem; }
#sec01 .box1 .box-inner2 { width: 42.3357664234%; }
#sec01 .box1 .box-inner3 { width: 51.3868613139%; text-align: left; color: #000; }
#sec01 .box1 .box-inner3 .txt1 { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #b97137; font-size: 0.92em; }
#sec01 .box2 { margin: 0 auto; background-color: #f0ece5; border-radius: 5px; overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 2rem; }
#sec01 .box2 .box-inner1 { width: 100%; }
#sec01 .box2 .box-inner1 .img { width: 29.4890510949%; margin: 0 auto 2rem; }
#sec01 .box2 .box-inner2 { width: 100%; }
@media screen and (max-width: 599px) { #sec01 .box1 .box-inner1 { width: 100%; }
  #sec01 .box1 .box-inner1 .img { width: 80%; }
  #sec01 .box1 .box-inner3 { width: 100%; }
  #sec01 .box1 .box-inner3 .txt1 { text-align: center; font-size: 1.15rem; margin-bottom: 3rem; }
  #sec01 .box1 .box-inner3 .txt1 br { display: block; }
  #sec01 .box1 .box-inner3 .txt1 .aw { display: inline-block; }
  #sec01 .box1 .box-inner3 .img2 { margin-bottom: 1.5rem; }
  #sec01 .box2 .box-inner1 { width: 100%; }
  #sec01 .box2 .box-inner1 .img { width: 70%; } }

#sec02, #sec03, #sec04, #sec05 { background-color: #f0ece5; color: #000; }
#sec02 .box1, #sec03 .box1, #sec04 .box1, #sec05 .box1 { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#sec02 .box1 .box-inner1, #sec03 .box1 .box-inner1, #sec04 .box1 .box-inner1, #sec05 .box1 .box-inner1 { width: 334px; }
#sec02 .box1 .box-inner2, #sec03 .box1 .box-inner2, #sec04 .box1 .box-inner2, #sec05 .box1 .box-inner2 { width: calc(95% - 334px); margin-bottom: 2rem; }
#sec02 .box1 .box-inner2 ul, #sec03 .box1 .box-inner2 ul, #sec04 .box1 .box-inner2 ul, #sec05 .box1 .box-inner2 ul { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; }
#sec02 .box1 .box-inner2 ul .txt-detail, #sec03 .box1 .box-inner2 ul .txt-detail, #sec04 .box1 .box-inner2 ul .txt-detail, #sec05 .box1 .box-inner2 ul .txt-detail { width: 100%; }
#sec02 .box1 .box-inner2 ul .txt-detail.half, #sec03 .box1 .box-inner2 ul .txt-detail.half, #sec04 .box1 .box-inner2 ul .txt-detail.half, #sec05 .box1 .box-inner2 ul .txt-detail.half { width: 48%; }
@media screen and (max-width: 599px) { #sec02 .box1 .box-inner1, #sec03 .box1 .box-inner1, #sec04 .box1 .box-inner1, #sec05 .box1 .box-inner1 { width: 100%; }
  #sec02 .box1 .box-inner2, #sec03 .box1 .box-inner2, #sec04 .box1 .box-inner2, #sec05 .box1 .box-inner2 { width: 100%; margin-top: 2rem; } }

#sec02 { margin-top: 0; }

#sec03 .box1 .box-inner2 .txt-detail .komidashi { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; }
#sec03 .box1 .box-inner2 .txt-detail .komidashi .txt { line-height: 1.5; }
#sec03 .box1 .box-inner2 .txt-detail .komidashi .note { margin-left: 2rem; }
#sec03 .box1 .box-inner2 .txt-detail.pic { width: 30%; }
#sec03 .box1 .box-inner2 .txt-detail.pic .img .num { position: absolute; top: 0.5rem; left: 0.5rem; }
@media screen and (max-width: 599px) { #sec03 .box1 .box-inner1 { width: 100%; }
  #sec03 .box1 .box-inner2 { width: 100%; margin-top: 2rem; }
  #sec03 .box1 .box-inner2 .komidashi br { display: block; } }

#sec04 { margin-top: 0; text-align: left; }
#sec04 .item_section { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#sec04 .komidashi { margin-bottom: 0.5em; }
#sec04 .lead-s { margin-bottom: 0.5em; }
#sec04 .item .img { margin-bottom: 1rem; }
#sec04 .item:nth-of-type(1), #sec04 .item:nth-of-type(2), #sec04 .item:nth-of-type(3) { width: 31%; margin-bottom: 3rem; position: relative; }
#sec04 .item:nth-of-type(4), #sec04 .item:nth-of-type(5) { width: 48%; margin-bottom: 3rem; position: relative; }
#sec04 .zentei { position: absolute; top: 0; right: 0; width: 40px; translate: 0% -50%; }
#sec04 .zentei img { width: 100%; height: auto; }
@media screen and (max-width: 599px) { #sec04 .item:nth-of-type(1), #sec04 .item:nth-of-type(2), #sec04 .item:nth-of-type(3) { width: 100%; }
  #sec04 .item:nth-of-type(4), #sec04 .item:nth-of-type(5) { width: 100%; } }

#sec05 { margin-top: 0; }
#sec05 .box1 .box-inner2 .txt-detail .komidashi { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; }
#sec05 .box1 .box-inner2 .txt-detail .komidashi .txt { line-height: 1.5; }
#sec05 .box1 .box-inner2 .txt-detail .komidashi .note { margin-left: 2rem; }
#sec05 .box1 .box-inner2 .txt-detail.pic { width: 30%; }
#sec05 .box1 .box-inner2 .txt-detail.pic .img .num { position: absolute; top: 0.5rem; left: 0.5rem; }
@media screen and (max-width: 599px) { #sec05 .box1 .box-inner1 { width: 100%; }
  #sec05 .box1 .box-inner2 { width: 100%; margin-top: 2rem; }
  #sec05 .box1 .box-inner2 .komidashi br { display: block; } }