body {
  background: #ffffff;
  border: unset;
  -webkit-text-size-adjust: 100%;
}


p,
a {
  font-size: 15px;
  /* font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; */
	font-family: "Noto Sans TC", sans-serif;
  font-weight: 400;
}

.load_wrap {
  position: fixed;
  height: 100vh;
  width: 100vw;
  background-color: #fff;
  left: 0px;
  top: 0px;
  z-index: 9999;
  width: 100%;
  height: 100%;
}

.load_anime {
  animation-name: load_anm;
  animation-timing-function: ease;
  animation-duration: 2.5s;
  animation-fill-mode: forwards;
}

@keyframes load_anm {
  from {
    transform: translateX(0);
  }

  30%,
  70% {
    transform: translateX(0);
  }

  to {
    transform: translateX(100%);
  }
}


#tabiiro_link a {
  text-decoration: none;
  color: #687a5c;
  font-size: 12px;
}

#tabiiro_link {
  position: fixed;
  top: 2px;
  right: 80px;
  z-index: 12000
}

#header {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10000;
  width: 100%;
  background: #fff;
  height: 100%;
  width: 44px;
  left: unset;
  box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.1) inset;
}

.page_bottom {
  position: absolute;
  font-size: 15px;
  bottom: -30px;
  right: calc(-6% - 18.4px);
}

#menu_btn {


  background: unset;
  bottom: unset;
  left: unset;
  border: unset;
  z-index: unset;
  width: unset;
  height: unset;
  background: unset;
  border-radius: unset;
  font-family: unset;
  font-size: unset;
  line-height: unset;
  text-align: unset;
  color: unset;
  cursor: unset;
  padding: unset;

  position: absolute;
  height: 20px;
  display: inline-block;
  box-sizing: border-box;
  margin-top: 0px;
  width: 45px;
  right: 5px;
  top: 5px;
  z-index: 1300;
}

#sns_area {
  top: 3px;
  right: 220px;
  bottom: unset;
  left: unset;
  z-index: 12000;
}

.section.roll {
  width: 100%;
  margin: 0;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
  height: 100vh;
  /*  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  overflow:hidden;*/
}

#footer .pagenation>ul {
  max-width: 870px;
  margin: 0 auto;
}

#footer .pagenation>ul>li {
  width: 49%;
  margin: 0;
  margin-right: 2%;
}

#footer .pagenation>ul>li:last-child {
  margin-right: 0;
}

.waku_area2>img {
  position: absolute;
  width: 18px;
  top: -9px;
  left: -9px;
  z-index: 100;
}

.waku_area2 p {
  font-size: 11.5px;
  line-height: 1.8;
}

.waku_area2 {
  position: absolute;
  bottom: auto;
  left: 0;
  border: 1px solid #000;
  padding: 15px;
  border-radius: 8px;
  width: 88%;
}

.waku_area2>div {
  position: relative;
}

.waku_area2>div>img {
  position: absolute;
  width: 56px;
  top: -26px;
  left: 2px;
  z-index: 100;
}

.pt12 {
  padding-top: 12px;
}


.bottom_contents {
  background: #fff;
  margin-bottom: 120px;
}

.bottom_contents>div>ul {
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
}

.bottom_contents>div>ul>li:last-child,
.bottom_contents>div>ul>li ul li:last-child {
  margin-right: 0;
}

.bottom_contents>div>ul>li>div img {
  max-height: 43px;
}

.bottom_contents>div>ul>li:first-child {
  width: 22%;
}

.bottom_contents>div>ul>li {
  width: 36%;
  margin-right: 3.5%;
}

.bottom_contents>div>ul>li ul li {
  width: 26%;
  margin-right: 11%;
}

.bottom_contents>div>ul>li:first-child ul li {
  width: 42.55%;
}

.bottom_contents>div>ul>li ul {
  display: flex;
  justify-content: center;
  width: 96%;
  margin: 0 auto;
}

.bottom_contents>div {
  position: relative;
  display: block;
  width: 96%;
  height: 100%;
  padding: 32px 0 0;
  max-width: 870px;
  margin: 0 auto;
}

.bottom_contents>div>ul>li ul li a:hover span span {
  text-decoration: underline;
}

.bottom_contents>div>ul>li ul li a:hover span span span {
  text-decoration: none;
}

.text_tate span span {
  background: #010101;
  color: #fff;
  border-radius: 10px;
  padding: 9px 1px;
  font-size: 10px;
}

.bottom_contents>div>ul>li ul li a {
  display: block;
  max-height: 20em;
}

.text_tate {
  /*-webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;*/
  position: relative;
  display: block;
  min-height: 188px;
  width: 100%;
  max-height: 16em;
}

.copyrights_bottom {
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  margin-top: 0;
  font-size: 14px;
  text-align: center;
  padding: 5px 0;
  background: #000;
  color: #fff;
}



/*------------------------------------------------------------*/

.close_btn:hover {
  cursor: pointer;
  opacity: 0.8;
  -moz-transition: ease-in-out, .3s;
  -o-transition: ease-in-out, .3s;
  -webkit-transition: ease-in-out, .3s;
  transition: ease-in-out, .3s;
}

.close_btn {
  position: absolute;
  top: 0;
  right: 0;
  border: 1px solid #fff;
  padding: 0px 8px 5px;
  font-size: 25px;
  color: #fff;
  line-height: 1;
}

.section_area.place_area_pop .inner {
  margin-top: 55px !important;
}

.section_area.place_area_pop .inner ul {
  margin-top: 15px;
}

.place_area_pop {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  width: 100%;
  height: 100%;
  z-index: 1000;
}

.place_area_pop .pop_bg {
  background: #fff;
  margin-top: 15px;
  padding: 8% 8%;
}

.place_area_pop .img00 {
  width: 38%;
}

.place_area_pop .img01 {
  width: 65%;
}

.place_area_pop .main_text {
  font-size: 14px;
  margin-top: 10px;
  width: 100%;
  line-height: 1.8;
}

.place_area_pop .read_text {
  font-size: 17px;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  margin-top: 5px;
}

.place_area_pop .img02 {
  width: 64vh;
  margin-top: 20px;
  line-height: 0;
  margin-left: auto;
  max-width: 400px;
}


.place_area {
  background: #f2f2f2;
  margin-top: 100px;
  padding-bottom: 50px;
}

.place_area .section_area .inner ul {
  margin-top: 0;
}

.place_area .img01 {
  width: 65%;
}

.place_area .main_text {
  font-size: 14px;
  margin-top: 10px;
  width: 98%;
  line-height: 1.8;
}

.place_area .img02 {
  width: 94%;
  margin-top: 0;
  line-height: 0;
  margin-left: auto;
}

.place_area .img03 {
  width: 46%;
  margin-top: 20px;
  line-height: 0;
  margin-left: auto;
}

.place_area .what_text:hover {
  opacity: 0.8;
  cursor: pointer;
  -moz-transition: ease-in-out, .3s;
  -o-transition: ease-in-out, .3s;
  -webkit-transition: ease-in-out, .3s;
  transition: ease-in-out, .3s;
}

.place_area .what_text {
  font-weight: bold;
  text-decoration: underline;
  color: #000;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-size: 23px;
  text-align: right;
  margin-top: 10px;
}


.section_area.profile_area .inner ul {
  margin-top: 0;
  margin-bottom: 80px;
}

.section_area.profile_area .inner {
  max-width: 640px !important;
}

.section_area.profile_area .inner ul li {
  width: 30%;
  margin-right: 10%;
}

.section_area.profile_area .inner ul li:last-child {
  width: 60%;
}

.profile_area .img01 {
  width: 100%;
  margin-top: 0;
  line-height: 0;
}

.profile_area .main_text {
  font-size: 12px;
  margin-top: 10px;
  margin-left: 4px;
}

.profile_area .img02 {
  width: 50%;
  margin-top: 25px;
}

.profile_area .img03 {
  width: 65%;
}

.profile_area .profile_btn {
  margin-top: 55px;
  text-align: center;
}

.profile_area .profile_btn a {
  position: relative;
  background: #3d7f1d;
  padding: 8px 0px 8px 20px;
  border-radius: 20px;
  color: #fff;
  width: 80%;
  display: block;
  margin: 0 auto;
  text-align: left;
  font-size: 15px;
}

.profile_title {
  text-align: right;
  border-bottom: 1px solid #000;
  font-size: 15px;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}

.mini_pop2 {
  font-size: 14px;
  text-decoration: underline;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  text-align: right;
  margin-top: 15px;
}

.mini_pop2:hover {
  cursor: pointer;
}



.waku_area>img {
  position: absolute;
  width: 18px;
  top: -9px;
  left: -9px;
  z-index: 100;
}

.waku_area p {
  font-size: 11px;
}

.waku_area {
  border: 1px solid #000;
  position: relative;
  padding: 10px 10px;
  margin-top: 35px;
}

.waku_area:before {
  height: 0;
  display: block;
  position: absolute;
  left: -1px;
  content: "";
  border-top: solid 7px #fff;
  border-right: solid 7px transparent;
  top: -2px;
  z-index: 2;
}

.waku_area:after {
  height: 0;
  display: block;
  position: absolute;
  left: -1px;
  content: "";
  border-top: solid 7px rgb(0, 0, 0);
  border-right: solid 7px transparent;
  top: -1px;
}



.section_area .inner ul li:last-child {
  margin-right: 0;
}

.section_area .inner ul li {
  width: 50%;
}

.section_area .inner ul {
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
}

.section_area .inner {
  position: relative;
  display: block;
  width: 96%;
  height: 100%;
  padding: 32px 0 0;
  max-width: 870px;
  margin: 0 auto;
}

.main {
  margin-top: 0;
}

a:hover {
  opacity: 0.8;
  -moz-transition: ease-in-out, .3s;
  -o-transition: ease-in-out, .3s;
  -webkit-transition: ease-in-out, .3s;
  transition: ease-in-out, .3s;
}

.first_text {
  margin-bottom: 5px;
}

.first_text span {
  display: block;
  margin-top: 20px;
}

.text_img01 .prev {
  visibility: hidden;
}

.text_img02,
.text_img03 {
  display: none;
}

.img_title {
  position: absolute;
  top: 22%;
  left: 0;
  width: 48%;
}

.text_area {
  height: 100%;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
}

.text_img .img01 {
  line-height: 0;
}

#arrows {
  position: absolute;
  width: 48%;
  display: block;
  top: 284px;
  bottom: 0;
  right: unset;
  left: 0;
  margin-top: 0;
  font-size: 16px;
  z-index: 99;
  margin: auto;
  height: 25px;
  text-align: right;
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -moz-transition: ease-in-out, .3s;
  -o-transition: ease-in-out, .3s;
  -webkit-transition: ease-in-out, .3s;
  transition: ease-in-out, .3s;
}

#arrows span {
  display: inline-block;
  width: unset;
  height: unset;
  background: unset;
  border: unset;
  border-radius: unset;
  position: relative;
  cursor: pointer;
  -moz-transition: ease-in-out, .3s;
  -o-transition: ease-in-out, .3s;
  -webkit-transition: ease-in-out, .3s;
  transition: ease-in-out, .3s;
}

#arrows span.prev {
  top: 0;
  right: 0;
  margin-right: 0;
}

#arrows span.next {
  bottom: 0;
  right: 0;
  margin-left: 8%;
}

#arrows span:hover {
  background: unset;
  border-color: unset;
  opacity: 0.7;
}


p.first_text:first-letter {
  font-size: 32px;
  font-weight: bold;
  padding-left: 5px;
}

.text_img div.inner ul li {
  width: 48.5%;
  margin-right: 3%;
  position: relative;
}

.text_img div.inner ul li:last-child {
  margin-right: 0;
}

.text_img div.inner .text_img01 ul,
.text_img div.inner .text_img02 ul,
.text_img div.inner .text_img03 ul,
.text_img div.inner .text_img04 ul,
.text_img div.inner .text_img05 ul,
.text_img>div.inner>ul {
  display: flex;
  position: absolute;
  top: 46%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  margin: auto;
  width: 100%;
  padding-inline-start: 0;
  margin-block-start: unset;
  margin-block-end: unset;
  list-style-type: unset;
}

.section.roll .inner {
  position: relative;
  display: block;
  width: 96%;
  height: 100%;
  padding-top: 32px;
  max-width: 870px;
  margin: 0 auto;
}


.mt20 {
  margin-top: 20px;
}

#header .h-logo a {
  width: 228px;
}

.credit-box p {
  margin-top: 10px;
}

.credit-box {
  display: none;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 15px 15px 45px;
  box-sizing: border-box;
  background: #ffffff;
  border: 1px solid #808080;
  font-size: 13px;
  line-height: 1.6em;
  position: absolute;
}

.credit-box .credit-close {
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 20px;
  text-align: center;
  cursor: pointer;
  opacity: 1;
  -moz-transition: ease-in-out, .3s;
  -o-transition: ease-in-out, .3s;
  -webkit-transition: ease-in-out, .3s;
  transition: ease-in-out, .3s;
}

.credit-box .credit-close img {
  width: 12px;
  height: 12px;
  margin-right: 6px;
  vertical-align: text-bottom;
}


.fade-up {
  opacity: 1;
  -moz-transition: ease-out 1.0s;
  -o-transition: ease-out 1.0s;
  -webkit-transition: ease-out 1.0s;
  transition: ease-out 1.0s;
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}

.fade-left {
  opacity: 1;
  -moz-transition: ease-out 1.0s;
  -o-transition: ease-out 1.0s;
  -webkit-transition: ease-out 1.0s;
  transition: ease-out 1.0s;
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}

.fade-scale {
  opacity: 1;
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);
  -moz-transition: all 1.0s cubic-bezier(0.65, -0.55, 0.265, 1.55) .3s;
  -o-transition: all 1.0s cubic-bezier(0.65, -0.55, 0.265, 1.55) .3s;
  -webkit-transition: all 1.0s cubic-bezier(0.65, -0.55, 0.265, 1.55);
  -webkit-transition-delay: .3s;
  transition: all 1.0s cubic-bezier(0.65, -0.55, 0.265, 1.55) .3s;
}

.fade-right {
  opacity: 1;
  -moz-transition: ease-out 1.0s;
  -o-transition: ease-out 1.0s;
  -webkit-transition: ease-out 1.0s;
  transition: ease-out 1.0s;
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}

.fade-left.switch {
  opacity: 0;
  -moz-transform: translate(-20px, 0);
  -ms-transform: translate(-20px, 0);
  -webkit-transform: translate(-20px, 0);
  transform: translate(-20px, 0);
}

.fade-right.switch {
  opacity: 0;
  -moz-transform: translate(20px, 0);
  -ms-transform: translate(20px, 0);
  -webkit-transform: translate(20px, 0);
  transform: translate(20px, 0);
}

.fade-scale.switch {
  opacity: 0;
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
}

.fade-up.switch {
  opacity: 0;
  -moz-transform: translate(0, 40px);
  -ms-transform: translate(0, 40px);
  -webkit-transform: translate(0, 40px);
  transform: translate(0, 40px);
}

.block-L .copyrights {
  margin-top: 30px !important;
}

#menu_content .menu-inner>.copyrights {
  width: 67%;
  position: absolute;
  bottom: -2%;
  right: 0;
  text-align: left !important;
}

#menu_content .book_img {
  width: 31%;
  position: absolute;
  bottom: 3.5%;
  right: 7%;
}

#menu_content .bg_img {
  width: 4.5%;
  position: absolute;
  top: 0;
  right: 0;
}

.gnavi_top div:first-child {
  width: 9%;
  margin-right: 2.5%;
}

.gnavi_top div:last-child {
  width: 84%;
}

.gnavi_top div p {
  font-size: 12px;
}

.gnavi_top {
  display: flex;
}

#menu_content {
  z-index: -1;
  background: #467613;
  border: unset;
  border-top: unset;
  background: #fff;
  moz-transform: translate(100%, 0);
  -ms-transform: translate(100%, 0);
  -webkit-transform: translate(100%, 0);
  transform: translate(100%, 0);
  width: 85%;
  margin-left: 15%;

  position: fixed;
  height: 100vh;
  box-sizing: border-box;
  box-shadow: 0 0 6px 3px rgba(0, 0, 0, 0.1) inset;
  left: 0;
  top: 0;
  opacity: 0;
  -moz-transition: cubic-bezier(0.075, 0.82, 0.165, 1), .3s;
  -o-transition: cubic-bezier(0.075, 0.82, 0.165, 1), .3s;
  -webkit-transition: cubic-bezier(0.075, 0.82, 0.165, 1), .3s;
  transition: cubic-bezier(0.075, 0.82, 0.165, 1), .3s;
}





#menu_content .block-L,
#menu_content .block-R {
  /*margin-top: 50px;*/
}

#menu_content .block-L {}

#menu_content .block-L .cover {
  max-width: 100%;
  margin: 0 auto;
}

#menu_content .block-R {
  width: 56%;
  margin-right: 10%;
}

#menu_content #gnavi li a {
  position: relative;
  margin-bottom: 25px
}

#menu_content #gnavi ul {
  margin-top: 10px;
  margin-left: 0;
  list-style-type: unset;
  margin-block-start: unset;
  margin-block-end: unset;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: unset;
}

#menu_content #gnavi li .img {
  width: 26%;
}


#menu_content .copyrights {
  background: unset !important;
  color: #fff !important;
}

#menu_content .staff-credit,
#menu_content .copyrights {
  color: #fff;
  margin-top: 5px;
  text-align: left;
  font-size: 11px;
}

#menu_content.open {
  opacity: 1;
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  z-index: 10;
}

#head_area {
  position: fixed;
  z-index: 20000;
  top: 0;
  right: 0;
}

#scn03 p.staff_credit {
  font-size: 12px;
  padding-top: 15px;
}

#scn05 .img_title,
#scn06 .img_title,
#scn07 .img_title,
#scn08 .img_title,
#scn09 .img_title {
  top: -490px;
  bottom: 0;
  margin: auto;
  height: max-content;
}

.img_title {
  left: calc(50% - 435px);
  width: calc(416px);
}

.text_bold {
  text-decoration: underline;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}


.text_img {
  max-width: 870px;
}

.text_img div ul {
  max-width: 870px;
}

.img_sub {
  width: 50%;
}

.text_img .img01 {
  margin-top: 13%;
  line-height: 0;
}

.text_title {
  font-size: 22px;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}

.text_area p span {
  display: block;
  margin-top: 20px;
}

#scn14 .waku_area2 {
  top: 310px;
  margin: auto;
  bottom: 0;
  height: max-content;
}

#scn16 .waku_area2 {
  top: 400px;
  margin: auto;
  bottom: 0;
  height: max-content;
}

.waku_area2 {
  bottom: unset;
  left: calc(50% - 435px);
  width: calc(386px);
}

#scn06 .img_title {}

#scn11 .img_title,
#scn12 .img_title,
#scn13 .img_title,
#scn14 .img_title,
#scn16 .img_title,
#scn17 .img_title,
#scn18 .img_title {
  top: -380px;
  bottom: 0;
  margin: auto;
  height: max-content;
}

#scn14 .page_bottom {
  bottom: -116px;
}

.pagenation {
  margin-top: 140px;
}

.cmn_img4 {
  position: absolute;
  top: 21%;
  right: 0;
  margin: auto;
  width: 50%;
  z-index: 10;
  text-align: center;
  height: max-content;
  max-width: 1180px;
}

.cmn_img4_01 {
  width: 18%;
  margin: 0 auto;
}

.cmn_img2 {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 50%;
  z-index: 10;
  text-align: center;
  height: max-content;
  max-width: 870px;
}

.cmn_img2_01 {
  width: 80%;
  margin: 0 auto;
}

.cmn_img2_02 {
  width: 18vh;
  margin: 0 auto;
  max-width: 140px;
}

.cmn_img2_03 {
  width: 40%;
  margin: 0 auto;
}

body {
  position: unset;
}

article {
  position: absolute;
  z-index: 500;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ffffff;
  overflow: hidden;
  opacity: 0;
}

article a {
  color: #000000;
}

article a:hover {
  color: #888888;
}

.txt_box p {
  font-size: 15px;
  line-height: 1.8;
}

.ttl_box,
.txt_box {
  position: absolute;
  top: 0;
  left: 0;
  padding: 0;
  overflow: hidden;
  bottom: 0;
  right: 0;
  margin: auto;
  height: max-content;
  max-width: 870px;
}

.tal {
  text-align: left;
}

.tac {
  text-align: center;
}

.tar {
  text-align: right;
}

#headline {
  position: absolute;
  z-index: 600;
  top: 23%;
  left: 55%;
  width: 27%;
  height: 23vw;
  min-width: 250px;
  min-height: 222px;
  max-width: 346px;
  max-height: 288px;
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: cover;
  overflow: hidden;
  opacity: 1;
  filter: drop-shadow(0 0 4px rgba(255, 255, 255, 0.8));
}

/*#text01{
    position: absolute;
    z-index: 600;
  top: 66%;
    left: 57%;
    width: 26%;
    height: 3.5%;
    background-image: url(./images/interview/tabiiro_copy.svg);
    background-repeat: no-repeat;
    background-position: 50% 0;
    background-size: cover;
    overflow: hidden;
    opacity: 1;
    filter: drop-shadow(0 0 3px rgba(0,0,0,0.8));
}*/


#scn10 {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  background-image: url("/book/focal/kushirotown/images/img02.jpg");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  opacity: 0;
}

#scn15 {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  background-image: url("/book/focal/kushirotown/images/img03.jpg");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  opacity: 0;
}

#cmn_contents nav h1 {
  padding: 26px 0px;
  border-top: 1px solid #000000;
}

#cmn_contents nav h1 img {
  width: 400px;
  height: 36px;
}

#cmn_contents nav li {
  /*float: left;*/
  /*padding: 0px 20px 0px 0px;*/
}

#cmn_contents nav li img {
  width: 80%;
}

#cmn_contents nav li a {
  display: block;
  color: #000000;
  font-size: 10px;
  line-height: 1.3;
  text-decoration: none;
  display: flex;
}

#cmn_contents nav li a:hover {
  color: #888888;
}

li {
  list-style-type: none;
}

#cmn_contents {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}


.scrollMove {
  padding-top: 85px;
  position: absolute;
  bottom: 2%;
  right: 4%;
  font-size: 24px;
  color: #9fd06b;
}

.scrollMove span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 50px;
  height: 50px;
  margin-left: -25px;
  border-left: 8px solid #9fd06b;
  border-bottom: 8px solid #9fd06b;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: sdb 2s infinite;
  animation: sdb 2s infinite;
  box-sizing: border-box;
}

@-webkit-keyframes sdb {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    -webkit-transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}

@keyframes sdb {
  0% {
    transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}

.para_text.is-anm-done span.st0 {
  transition-delay: 0s;
}

.para_text.is-anm-done span.st1 {
  transition-delay: 0.1s;
}

.para_text.is-anm-done span.st2 {
  transition-delay: 0.2s;
}

.para_text.is-anm-done span.st3 {
  transition-delay: 0.3s;
}

.para_text.is-anm-done span.st4 {
  transition-delay: 0.4s;
}

.para_text.is-anm-done span.st5 {
  transition-delay: 0.5s;
}

.para_text.is-anm-done span.st6 {
  transition-delay: 0.6s;
}

.para_text.is-anm-done span.st7 {
  transition-delay: 0.7s;
}

.para_text.is-anm-done span.st8 {
  transition-delay: 0.8s;
}

.para_text.is-anm-done span.st9 {
  transition-delay: 0.9s;
}

.para_text.is-anm-done span.st10 {
  transition-delay: 1.0s;
}

.para_text.is-anm-done span.st11 {
  transition-delay: 1.1s;
}

.para_text.is-anm-done span.st12 {
  transition-delay: 1.2s;
}

.para_text.is-anm-done span.st13 {
  transition-delay: 1.3s;
}

.para_text.is-anm-done span.st14 {
  transition-delay: 1.4s;
}

.para_text.is-anm-done span.st15 {
  transition-delay: 1.5s;
}

.para_text.is-anm-done span.st16 {
  transition-delay: 1.6s;
}

.para_text.is-anm-done span.st17 {
  transition-delay: 1.7s;
}

.para_text.is-anm-done span.st18 {
  transition-delay: 1.8s;
}

.para_text.is-anm-done span.st19 {
  transition-delay: 1.9s;
}

.para_text.is-anm-done span.st20 {
  transition-delay: 2.0s;
}

.para_text.is-anm-done span.st21 {
  transition-delay: 2.1s;
}

.para_text.is-anm-done span.st22 {
  transition-delay: 2.2s;
}

.para_text.is-anm-done span.st23 {
  transition-delay: 2.3s;
}

.para_text.is-anm-done span.st24 {
  transition-delay: 2.4s;
}

.para_text.is-anm-done span.st25 {
  transition-delay: 2.5s;
}

.para_text.is-anm-done span.st26 {
  transition-delay: 2.6s;
}

.para_text.is-anm-done span.st27 {
  transition-delay: 2.7s;
}

.para_text.is-anm-done span.st28 {
  transition-delay: 2.8s;
}

.para_text.is-anm-done span.st29 {
  transition-delay: 2.9s;
}

.para_text.is-anm-done span {
  text-shadow: 2px 2px 10px #000000;
  opacity: 1;
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -moz-transition: all 1.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  -o-transition: all 1.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-transition: all 1.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 1.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.para_text span {
  display: inline-block;
  color: #fff;
  text-shadow: 0 0 30px #000000;
  opacity: 0;
  -moz-transform: translate(-10px, 30px);
  -ms-transform: translate(-10px, 30px);
  -webkit-transform: translate(-10px, 30px);
  transform: translate(-10px, 30px);
  font-family: "Ryumin Regular KL", serif;
}

.text_tate span span {
  background: unset;
  color: #093a56;
  border-radius: unset;
  padding: unset;
  font-size: 14px;
  display: block;
  /*text-align: right;*/
}

.large_title {
  font-size: 20px !important;
  margin-bottom: 10px;
  font-weight: 700 !important;
}




.side_area_number a.nav_right_number_00:hover .side_area_subimg {
  background-image: url(/book/focal/kushirotown/images/common/navi_top_w.svg);
}

.side_area_number .is-active .side_area_subimg {
  background-image: url(/book/focal/kushirotown/images/common/navi_top_w.svg);
}

.side_area_subimg {
  content: ;
  background-image: url(/book/focal/kushirotown/images/common/navi_top_b.svg);
  display: inline-block;
  background-size: contain;
  vertical-align: middle;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
}

.nav_share img:hover {
  opacity: 0.8;
  cursor: pointer;
}

.side_area_number .is-active:hover {
  background: #fff;
}

.side_area_number .is-active {
  background: #093a56;
}

.side_area_number .is-active a {
  color: #fff;
}

.side_area_number {
  padding-top: 10px;
}

.side_area_line {
  border-top: 1px solid #aaa;
  width: 58%;
  margin: 0 auto;
}

.side_area_bottom>div.is-active {
  background-color: #093a56;
}

.side_area_number .side_area_subtext {
  font-family: "Koburina Gothic W6 JIS2004", sans-serif;
  position: absolute;
  width: max-content;
  color: #fff;
  background: #fff;
  font-size: 12px;
  margin-left: 13px;
  padding: 8px 5px;
  top: 0;
  line-height: 1;
}

.side_area_number a {
  font-size: 16px;
  color: #093a56;
  line-height: 1.4;
  font-weight: bold;
  padding-top: 3px;
  position: relative;
  transition: ease-in, 1s;
  display: block;
  min-height: 24px;
}

.side_area_number a:hover {
  opacity: 1;
}

.side_area_number a.nav_right_number_00:hover {
  transform: matrix(1, 0, 0, 1, -150, 0);
}

.side_area_number a.nav_right_number_01:hover {
  transform: matrix(1, 0, 0, 1, -231, 0);
}

.side_area_number a.nav_right_number_02:hover {
  transform: matrix(1, 0, 0, 1, -279, 0);
}

.side_area_number a.nav_right_number_03:hover {
  transform: matrix(1, 0, 0, 1, -267, 0);
}

.side_area_number a.nav_right_number_04:hover {
  transform: matrix(1, 0, 0, 1, -183, 0);
}

.side_area_number a:hover {
  background: #093a56;
  color: #fff;
  opacity: 1;
  cursor: pointer;
  transition: ease-in, 0.8s;
}

.side_area_number a:hover .side_area_subtext {
  background: #fff;
  color: #093a56;
  cursor: pointer;
}

.side_area_bottom .nav_share img {
  width: 100%;
  margin: 30px auto 10px;
}

.side_area_bottom .nav_share a:hover {
  opacity: 0.8;
}

.side_area_bottom .nav_right_tp {
  padding-top: 8px;
}

.side_area_bottom>div {
  width: 100%;
  text-align: center;
  margin: 0 auto;
}

.side_area_bottom>div>div {
  width: 60%;
  text-align: center;
  margin: 0 auto;
}

.side_area_bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  background: #fff;
}

.nav_right_up span,
.nav_right_down span {
  position: absolute;
  width: 100%;
  display: block;
  height: 100%;
  top: 0;
  left: 0;
}

.nav_right_up,
.nav_right_down {
  position: relative;
  cursor: pointer;
}

.nav_right .nav_right_tp p {
  font-size: 16px;
  color: #093a56;
  font-weight: 700;
  /*font-family: "Koburina Gothic W6 JIS2004", sans-serif;*/
}

.nav_right .nav_right_tp {
  width: 58%;
  margin: 0 auto;
  height: 26px;
}

.nav_right ul.side_area_dot li p {
  font-size: 30px;
  line-height: 0.7;
  color: #ddd;
}

.nav_right ul.side_area_dot li p:hover,
.nav_right ul.side_area_dot li.is-active p {
  background: #093a56;
  color: #fff;
  opacity: 1;
  cursor: pointer;
  transition: ease-in, 0.6s;
}

.nav_right {
  text-align: center;
  margin-top: 10px;
}

.nav_right div i {
  font-size: 32px;
  color: #093a56;
}


#menu_line:hover {
  cursor: pointer;
}

#menu_line {
  position: absolute;
  height: 20px;
  display: inline-block;
  box-sizing: border-box;
  margin-top: 0px;
  width: 50px;
  right: 0px;
  top: 2px;
  z-index: 120;
}

#menu_line span {
  position: absolute;
  right: 15%;
  height: 3px;
  width: 70%;
  background-color: #093a56;
  border-radius: 10px;
  display: inline-block;
  box-sizing: border-box;
  transition: all .4s;
}

#menu_line span:nth-child(1) {
  top: 0;
}

#menu_line span:nth-child(2) {
  top: 8px;
  width: 50%;
}

#menu_line span:nth-child(3) {
  bottom: 0;
  width: 30%;
}

#menu_line.is-active span:nth-child(1) {
  -webkit-transform: translateY(5px) rotate(-45deg);
  transform: translateY(5px) rotate(-45deg);
  width: 60%;
}

#menu_line.is-active span:nth-child(2) {
  opacity: 0;
}

#menu_line.is-active span:nth-child(3) {
  -webkit-transform: translateY(-12px) rotate(45deg);
  transform: translateY(-12px) rotate(45deg);
  width: 60%;
}

#menu_line.is-active {
  top: 4px;
}

#top_area #menu_btn {
  top: 10px;
}


.contents_img {
  width: 25%;
  margin: 5% 0 0 6%;
}

.contents_line {
  position: absolute;
  top: 7%;
  left: 17%;
  border-top: 1px solid #093a56;
  width: 80%;
}

#menu_content #gnavi li {
  width: 100%;
  margin: 0%;
  background: unset;
  border-radius: unset;
  position: relative;
}

/*#menu_content #gnavi li:last-child .txt img {
    width: 15%;
    margin-top: 4%;
    margin-bottom: 1%;
}*/
#menu_content #gnavi li .txt img {
  width: 80px;
}

#menu_content #gnavi li .txt {
  width: 66%;
  font-family: "Hiragino Kaku Gothic W6 JIS2004", Sans-Serif;
  font-size: 14px;
  margin: 0;
}

#menu_content .menu-inner {
  width: 100%;
  max-width: unset;
  -webkit-align-items: unset;
  align-items: unset;
  position: relative;
  margin-top: 15px;
  margin-left: 6%;
}

#menu_content .block-L .cover {
  max-width: 100%;
  margin: 0 auto;
  text-align: center;
}

#menu_content .block-L .cover img {
  width: 68%;
  margin: 10% 0 7%;
}

#menu_content .block-L {
  width: 86%;
  margin-right: 0;
  border-top: 1px solid #15435f;
  padding-top: 15px;
}

.title_b {
  width: 77%;
  margin: 0 auto;
  max-width: 300px;
}

#menu_content .block-R {
  width: 59%;
  margin-right: unset;
}


#menu_content p:nth-child(3) {
  /*text-align: right;*/
}

#menu_content p {
  font-family: "Noto Serif TC", serif;
  color: #093a56;
  font-size: 13px;
  font-weight: bold;
  display: table-row;
}

#menu_content #gnavi li::after {
  content: unset;
}


.bottom_nav a:hover {
  opacity: 1;
  text-decoration: underline;
}

.bottom_nav_left {
  position: absolute;
  bottom: 14px;
  left: 15px;
}

.intro_img .intro_on .intro_cover_img {
  width: 67%;
  margin: 0 auto;
}

.intro_img .intro_on {
  position: absolute;
  top: calc(40px + 45%);
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  z-index: 1100;
  width: 96%;
}

.intro_img>img {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  object-fit: cover;
  z-index: 1000;
  height: 100vh;
}

.intro_title_img {
  width: 42%;
  margin: 4% auto 0;
}

.read_btn span {
  font-size: 13px;
  margin-left: 4px;
  line-height: 30px;
  vertical-align: middle;
}

.read_btn a {
  display: inline-block;
  padding: 8px 15px 8px 20px;
  text-decoration: none;
  font-family: "Koburina Gothic W6 JIS2004", sans-serif;
  color: #fff;
  letter-spacing: 1px;
  font-size: 17px;
  line-height: 1;
  border: 2px solid #fff;
  border-radius: 25px;
  background: rgba(0, 0, 0, 0.4);
}

.fda_btn a img {
  display: block;
  width: 100%;
}

.fda_btn {
  position: absolute;
  top: calc(55% + 190px);
  left: 45%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  z-index: 5;
}

.fda_btn a {
  width: 122%;
}

.read_btn {
  width: 100%;
  position: absolute;
  top: 80%;
  left: 0;
  text-align: center;
}

.main_text {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.main_text.fda_text {
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  position: absolute;
  display: block;
  top: 43%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
  height: max-content;
  /*max-height: 390px;*/
}

.main_text>p:nth-child(3) {
  text-align: right;
  font-size: 20px;
}

.main_text>p {
  color: #fff;
  font-size: 27px;
  text-shadow: 1px 3px 13px #000;
}

.tobira-ttl {
  width: 100vw;
}

.tobira-ttl img {
  display: block;
  width: 100%;
  height: auto;
}

.fda-ttl {
  height: 120vw;
}

.name {
  position: absolute;
  bottom: 25px;
  left: 30px;
  font-size: 12px;
  color: #FFFFFF;
  width: 14vh;
}


.para_text span.st0 {
  transition-delay: 0s;
}

.para_text span.st1 {
  transition-delay: 0.1s;
}

.para_text span.st2 {
  transition-delay: 0.2s;
}

.para_text span.st3 {
  transition-delay: 0.3s;
}

.para_text span.st4 {
  transition-delay: 0.4s;
}

.para_text span.st5 {
  transition-delay: 0.5s;
}

.para_text span.st6 {
  transition-delay: 0.6s;
}

.para_text span.st7 {
  transition-delay: 0.7s;
}

.para_text span.st8 {
  transition-delay: 0.8s;
}

.para_text span.st9 {
  transition-delay: 0.9s;
}

.para_text span.st10 {
  transition-delay: 1.0s;
}

.para_text span.st11 {
  transition-delay: 1.1s;
}

.para_text span.st12 {
  transition-delay: 1.2s;
}

.para_text span.st13 {
  transition-delay: 1.3s;
}

.para_text span.st14 {
  transition-delay: 1.4s;
}

.para_text span.st15 {
  transition-delay: 1.5s;
}

.para_text span.st16 {
  transition-delay: 1.6s;
}

.para_text span.st17 {
  transition-delay: 1.7s;
}

.para_text span.st18 {
  transition-delay: 1.8s;
}

.para_text span.st19 {
  transition-delay: 1.9s;
}

.para_text span.st20 {
  transition-delay: 2.0s;
}

.para_text span.st21 {
  transition-delay: 2.1s;
}

.para_text span.st22 {
  transition-delay: 2.2s;
}

.para_text span.st23 {
  transition-delay: 2.3s;
}

.para_text span.st24 {
  transition-delay: 2.4s;
}

.para_text span.st25 {
  transition-delay: 2.5s;
}

.para_text span.st26 {
  transition-delay: 2.6s;
}

.para_text span.st27 {
  transition-delay: 2.7s;
}

.para_text span.st28 {
  transition-delay: 2.8s;
}

.para_text span.st29 {
  transition-delay: 2.9s;
}

.para_text span {
  text-shadow: 2px 2px 5px #000000;
  opacity: 1;
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -moz-transition: all 1.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  -o-transition: all 1.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-transition: all 1.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 1.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}


#menu_content.open {
  z-index: 1250;
}

#menu_line.is-active span {
  background-color: #093a56;
}

#menu_line span {
  background-color: #fff;
}

#menu_line.is-active {}

#menu_line.blue span {
  background-color: #093a56;
}

#menu_line.shadow span{
  filter: drop-shadow(0px 0px 3px rgba(0,0,0,0.75));
}
.logo_img {
  position: fixed;
  width: 35%;
  top: 15px;
  left: 17px;
  max-width: 230px;
  z-index: 1200;
}
.logo_img.shadow img{
  filter: drop-shadow(0px 0px 3px rgba(0,0,0,0.75));
}
.logo_img .white {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.logo_img .blue {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: none;
}

.on_bg {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 61, 90, 0.6);
  z-index: 1;
}

.on_area {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 83%;
  z-index: 5;
}

.city_img {
  width: 70%;
  margin: 5% auto;
}
.nav_white{
  position: absolute;
  top: 0;
  left: 0;
  background-color: #ffffff;
  width: 100%;
  height: 50px;

}
.map_img {
  width: 100%;
  margin: 10% auto;
}

.text_1 {
  font-size: 14px;
  line-height: 1.6;
  color: #fff;
}

.detail_1 {
  font-size: 14px;
  line-height: 1.57;
  color: #fff;
  letter-spacing: 0.02em;
}

.detail_1 .text-indent {
  padding-left: 4em;
  text-indent: -4em;
  display: block;
}

.credit_1 {
  margin-top: 1em;
  font-size: 12px;
  color: #fff;
}

.sp-buttons {
  position: absolute;
  top: calc(50% - 40px);
  right: 5px;
  width: unset;
  width: 11px;
  padding-top: unset;
  line-height: 1;
}

.sp-button {
  width: 6px;
  height: 6px;
  background-color: #fff;
}

.sp-selected-button {
  background-color: unset !important;
  width: 8px;
  height: 8px;
}

.sp-button {
  border: 1px solid #fff;
  margin: unset;
}

.sp-buttons.blue .sp-button {
  border-color: #093a56;
  background-color: #093a56;
}

.selector::-webkit-scrollbar {
  display: none;
  -ms-overflow-style: none;
}

.sp-slides-container {
  position: relative;
}

.sp-slide,
.sp-image-container,
.sp-image {
  object-fit: cover;
}

.fixed {
  position: fixed;
  width: 100%;
  height: 100%;
  margin: 0%;
}

.bg_all.bg_on {
  opacity: 0.01;
  z-index: 100;
}

.bg_all {
  position: fixed;
  opacity: 0;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
}

.change_img {
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  width: 100%;
  opacity: 0;
  transition: 1.5s;
}

.change_img.active {
  opacity: 1;
  transition: 1.5s;
}

.bg_movie_overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  margin: auto;
  top: 0;
  left: 0;
}

.bg_movie_overlay::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 61, 90, 0.6);
}

.bg_movie {
  position: fixed;
  top: 0;
  left: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  background-image: url(/sp/book/focal/kushirotown/images/gaiyo/bg02.jpg);
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: cover;
}

.movie-block {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 10%;
}

.movie-block .balloon {
  display: block;
  width: 45%;
}

.movie-block>a {
  display: block;
  width: 53.3%;
  margin-left: 2%;
}

.c-filter {
  pointer-events: none !important;
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  -moz-touch-callout: none !important;
  -moz-user-select: none !important;
  touch-callout: none !important;
  user-select: none !important;
}



.monument {
  width: 30.8%;
  margin-left: auto;
}

.sp-slide[data-index="3"] #menu_line.blue span {
  background-color: #ffffff !important;
}
