@charset "UTF-8";
.touchSwUtil {
  display: block;
  position: fixed;
  top: 10px;
  right: 10px;
  width: 35px;
  height: 35px;
  text-decoration: none !important;
  z-index: 200;
}
.touchSwUtil span {
  display: block;
  position: relative;
  top: 0px;
}
.touchSwUtil span:before {
  color: #e6e6e6;
  font-size: 8px;
  content: "MENU";
}
.touchSwUtil i {
  position: relative;
  display: -moz-inline-stack;
  display: inline-block;
  zoom: 1;
  width: 30px;
  height: 3px;
  color: #e6e6e6;
  font: bold 14px/.4 Helvetica;
  text-transform: uppercase;
  text-indent: -55px;
  background: #e6e6e6;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
.touchSwUtil i:before, .touchSwUtil i:after {
  content: '';
  width: 30px;
  height: 3px;
  background: #e6e6e6;
  position: absolute;
  left: 0;
  -moz-transition: 0.2s;
  -o-transition: 0.2s;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.touchSwUtil i:before {
  top: -9px;
}
.touchSwUtil i:after {
  bottom: -9px;
}
.touchSwUtil.active {
  color: #fff;
}
.touchSwUtil.active i {
  width: 0;
}
.touchSwUtil.active i:before, .touchSwUtil.active i:after {
  background: #fff;
}
.touchSwUtil.active i:before {
  top: 0px;
  width: 30px;
  -moz-transform: rotateZ(45deg);
  -ms-transform: rotateZ(45deg);
  -webkit-transform: rotateZ(45deg);
  transform: rotateZ(45deg);
}
.touchSwUtil.active i:after {
  top: 0px;
  width: 30px;
  -moz-transform: rotateZ(-45deg);
  -ms-transform: rotateZ(-45deg);
  -webkit-transform: rotateZ(-45deg);
  transform: rotateZ(-45deg);
}
.touchSwUtil.active span:before {
  content: "CLOSE";
}
.touchSwUtil:hover i {
  background-color: #fff;
}
.touchSwUtil:hover i:before, .touchSwUtil:hover i:after {
  background-color: #fff;
}

.touchMenuUtil {
  background-color: transparent;
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 60px 0 0;
  width: 100%;
  overflow-y: auto;
  z-index: 150;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}
.touchMenuUtil.active {
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -webkit-transform: translateX(0);
  transform: translateX(0);
}
.touchMenuUtil .inner {
  padding: 10px;
  background-color: #e6e6e6;
}

.translate3d-on {
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.list-half > li {
  float: left;
  width: 50%;
}

.list-quarter > li {
  float: left;
  width: 25%;
}
@media screen and (max-width: 1023px) {
  .list-quarter > li {
    width: 50%;
  }
}

.bg-none, .dot-none {
  background-image: none;
}

.bg-trans, .dot-trans {
  background: transparent;
}

.bg-white, .dot-white {
  background: url(/images/common/dot-white.svg);
}

.bg-blue, .dot-blue {
  background: url(/images/common/dot-blue.svg);
}

.bg-black, .dot-black {
  background: url(/images/common/dot-black.svg);
}

.bg-red, .dot-red, .bg-pink, .dot-pink {
  background: url(/images/common/dot-red.svg);
}

.bg-gold, .dot-gold {
  background: url(/images/common/dot-gold.jpg);
}

.bg-beige, .dot-beige {
  background: url(/images/common/dot-beige.png);
}

.bg-green, .dot-green {
  background: url(/images/common/dot-green.jpg);
}

.common-logo {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
  width: 180px;
  height: 60px;
}
.common-logo a, .common-logo figure {
  display: block;
  width: 100%;
  height: 100%;
  background: url(/images/common/logo.svg) no-repeat center center;
}

.label-white {
  display: inline-block;
  padding: 0 10px;
  color: #888;
  font-size: 13px;
  border: 1px solid #888;
  -moz-border-radius: 12px;
  -webkit-border-radius: 12px;
  border-radius: 12px;
  background-color: #fff;
  text-decoration: none;
  line-height: 1.8;
}
.label-white:hover, .label-white.active {
  color: #fff;
  border-color: #ff7676;
  background-color: #ff7676;
}

.inline-block {
  display: inline-block;
}

.block {
  display: block;
}

.mainHeader .upper {
  position: relative;
  height: 60px;
  background-color: #fff;
}
.mainHeader .upper .logoL {
  position: absolute;
  left: 80px;
  width: 220px;
  height: 200px;
  z-index: 10;
}
.mainHeader .upper .logoL figure {
  background-image: url(/images/common/logoL.svg);
}
.mainHeader .mainVisual .inner {
  padding: 0 60px;
}
.mainHeader .mainVisual .inner .flexslider {
  margin: 0;
}

body:not(.fixed) header.siteHeader .logo {
  display: none;
}
body:not(.fixed) header.siteHeader .glovalNavi .inner, body:not(.fixed) header.siteHeader .subsiteNav .inner {
  padding-left: 10px;
  text-align: center;
}
body:not(.fixed) header.siteHeader .glovalNavi .inner nav, body:not(.fixed) header.siteHeader .subsiteNav .inner nav {
  display: inline-block;
}

@media (min-width: 1171px) {
  .mainVisual.mainVisual-touch {
    display: none;
  }
}
.mainVisual .inner .bannerContent:before, .mainVisual .inner .bannerContent:after {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 90%;
  width: 900px;
  height: 100%;
  content: " ";
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-size: contain;
  pointer-events: none;
  background: url("/images/subsite/mice/mv_mice.svg") no-repeat center center;
  z-index: 10;
}
.mainVisual .inner .bannerContent:before {
  background-image: url("/images/subsite/mice/mv_mice_bg.png");
  z-index: 10;
}
.mainVisual .inner .bannerContent:after {
  background-image: url("/images/subsite/mice/mv_mice.svg");
  z-index: 20;
  max-width: 60%;
}

@media (max-width: 768px) {
  .mainVisual.mainVisual-touch {
    display: block;
    padding: 0;
  }
  .mainVisual.mainVisual-touch .inner {
    padding: 0;
  }
  .mainVisual.mainVisual-touch .inner .bannerContent:before, .mainVisual.mainVisual-touch .inner .bannerContent:after {
    background-size: contain;
  }
  .mainVisual.mainVisual-touch .flexslider {
    margin: 0;
  }
}
/* font-icon */
@font-face {
  font-family: 'tz-okayama';
  src: url("./fonts/tz-okayama.ttf?8gkr3g") format("truetype"), url("./fonts/tz-okayama.woff?8gkr3g") format("woff"), url("./fonts/tz-okayama.svg?8gkr3g#tz-okayama") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'tz-okayama' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-allow:before {
  content: "\e900";
}

/* -- common -- */
h1, h2, h3, h4, p {
  margin: 0;
}

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

a {
  transition: all 300ms ease-out;
}

a:hover {
  opacity: 0.8;
}

section {
  width: 100%;
  padding: 40px 0 0 0;
}

.bg-image--beige {
  padding-bottom: 60px;
  background: url(/images/common/dot-beige.png) repeat left top;
}

.bg-image--blue {
  background: url(/images/common/dot-mice.svg) repeat left top;
}

.mice-page__title {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  max-width: 1200px;
  margin: 0 auto 40px auto;
  padding: 0 20px;
  font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "Hiragino Mincho ProN", "游明朝", YuMincho, 'Yu Mincho', "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "ＭＳ 明朝", serif;
  font-weight: 600;
  font-size: 3rem;
  color: #344482;
}
.mice-page__title::before {
  content: '';
  display: block;
  width: 6px;
  height: 50px;
  margin-right: 20px;
  background-color: #344482;
}

/* -- btn -- */
.detail__btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 270px;
  height: 50px;
  padding: 0 15px;
  color: #fff;
  font-size: 1.6rem;
}
.detail__btn span {
  position: absolute;
  right: 15px;
  color: #fff;
}
.detail__btn:hover {
  color: #fff;
}

.mice-image__box {
  position: relative;
  z-index: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto 55px auto;
}
.mice-image__box:nth-of-type(2) {
  flex-direction: row-reverse;
  margin-bottom: 80px;
}
.mice-image__box:nth-of-type(2) .mice-information__box {
  margin: 0 -80px 0 0;
}
.mice-image__box .image-photo__box {
  position: relative;
  z-index: 10;
  max-width: 780px;
  max-height: 410px;
}
.mice-image__box .image-photo__box img {
  width: 100%;
  height: 100%;
}
.mice-image__box .mice-information__box {
  position: relative;
  z-index: 20;
  width: 530px;
  height: 310px;
  margin-left: -80px;
  background-color: #fff;
}
.mice-image__box .mice-information__box h3 {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 80px;
  padding-left: 40px;
  font-size: 2rem;
  font-weight: 600;
  color: #fff;
  background: url(/images/common/dot-mice.svg) repeat left top;
}
.mice-image__box .mice-information__box p {
  padding: 25px 40px;
  font-size: 1.6rem;
  color: #666;
  line-height: 1.8;
  text-align: left;
}

.mice-movie__box {
  max-width: 820px;
  margin: 0 auto 110px auto;
  text-align: center;
}
.mice-movie__box iframe {
  width: 100%;
  height: 460px;
}

.subsidy-system__box {
  position: relative;
  max-width: 1200px;
  height: 165px;
  margin: 0 auto 20px auto;
  padding: 0 80px 0 40px;
  background-color: #fff;
  border: 2px solid #344482;
}
.subsidy-system__box h3 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 400px;
  height: 60px;
  margin-top: -30px;
  background-color: #fff;
  border: 2px solid #344482;
  font-size: 2rem;
  font-weight: 600;
  color: #344482;
}
.subsidy-system__box div {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 35px;
}
.subsidy-system__box div p {
  width: 57%;
  font-size: 1.8re;
  line-height: 1.8;
  color: #181818;
}

/* -- PR -- */
.pr__title-header {
  max-width: 1200px;
  margin: 0 auto 30px auto;
  font-size: 2.5rem;
  font-weight: 600;
  letter-spacing: 0.5rem;
  text-align: center;
}

.pr-banner__box {
  max-width: 1080px;
  margin: 0 auto;
  padding-bottom: 10px;
}
.pr-banner__box .pr-banner__list {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}
.pr-banner__box .pr-banner__list .pr-banner__item {
  width: calc(20% - 8px);
  margin: 0 10px 30px 0;
}
.pr-banner__box .pr-banner__list .pr-banner__item:nth-of-type(5n) {
  margin-right: 0;
}
.pr-banner__box .pr-banner__list .pr-banner__item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  font-family: 'object-fit: contain;';
}
.pr-banner__box .pr-banner__list.banner--large .pr-banner__item {
  width: calc(33.333% - 30.7px);
  margin: 0 46px 30px 0;
}
.pr-banner__box .pr-banner__list.banner--large .pr-banner__item:nth-of-type(3n) {
  margin-right: 0;
}

@media (max-width: 768px) {
  section {
    padding: 20px 0 0 0;
  }

  .bg-image--beige {
    padding-bottom: 40px;
  }

  .business-page__title {
    margin-bottom: 20px;
    padding: 0 15px;
    font-size: 2.4rem;
  }

  .detail__btn {
    width: 100%;
  }

  .mice-image__box {
    flex-direction: column;
    margin-bottom: 0;
    padding: 0 15px;
  }
  .mice-image__box:nth-of-type(2) {
    flex-direction: column;
    margin-bottom: 0;
  }
  .mice-image__box:nth-of-type(2) .mice-information__box {
    margin: 0 0 30px 0;
  }
  .mice-image__box .mice-information__box {
    width: 100%;
    height: auto;
    margin: 0 0 30px 0;
  }
  .mice-image__box .mice-information__box h3 {
    padding: 0 15px;
    font-size: 1.8rem;
  }

  .mice-movie__box {
    margin-bottom: 60px;
    padding: 0 15px;
  }
  .mice-movie__box iframe {
    height: 260px;
  }

  .subsidy-system__box {
    height: auto;
    margin: 0 15px;
    padding: 0 15px 15px 15px;
  }
  .subsidy-system__box h3 {
    width: 100%;
  }
  .subsidy-system__box div {
    flex-direction: column;
  }
  .subsidy-system__box div p {
    width: 100%;
    margin-bottom: 15px;
  }

  /* -- PR -- */
  .pr__title-header {
    border-top-width: 5px;
  }

  .pr-banner__box .pr-banner__list {
    flex-wrap: wrap;
    max-width: 345px;
    margin: 0 auto;
    justify-content: center;
  }
  .pr-banner__box .pr-banner__list .pr-banner__item {
    width: calc(50% - 15px);
    margin-right: 15px;
  }
  .pr-banner__box .pr-banner__list .pr-banner__item:nth-of-type(2n) {
    margin-right: 0;
  }
  .pr-banner__box .pr-banner__list .pr-banner__item:nth-of-type(5n) {
    margin-right: 15px;
  }
  .pr-banner__box .pr-banner__list.banner--large {
    max-width: 240px;
    margin: 0 auto;
  }
  .pr-banner__box .pr-banner__list.banner--large .pr-banner__item {
    width: 100%;
    margin: 0 0 20px 0;
  }
}

/*# sourceMappingURL=layout.css.map */