@charset "UTF-8";
/*reset
========*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

body {
  line-height: 1; }

article, aside, dialog, figure, footer, header, hgroup, nav, section {
  display: block; }

nav ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none; }

a {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none; }

mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

.clearfix:before, .clearfix:after {
  content: "";
  display: table; }

.clearfix:after {
  clear: both; }

.clearfix {
  zoom: 1; }

h1, h2, h3, h4, h5, h6 {
  font-weight: 500; }

li {
  list-style: none; }

*, *:before, *:after {
  box-sizing: border-box; }

a.imganime img {
  -moz-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s; }

a.imganime:hover img {
  opacity: .8;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; }

.alignleft {
  text-align: left; }

.alignright {
  text-align: right; }

.aligncenter {
  text-align: center; }

.floatLeft {
  float: left; }

.floatRight {
  float: right; }

.clear {
  clear: both; }

.centerBlock {
  display: block;
  margin-left: auto;
  margin-right: auto; }

.flex-parent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.table-parent {
  display: table; }

.table-parent .table-child {
  display: table-cell; }

.clearfix {
  zoom: 1; }

.clearfix:before, .clearfix:after {
  content: "";
  display: table; }

.clearfix:after {
  clear: both; }

.mTop0 {
  margin-top: 0 !important; }

.mTop10 {
  margin-top: 10px !important; }

.mTop20 {
  margin-top: 20px !important; }

.mTop30 {
  margin-top: 30px !important; }

.mTop40 {
  margin-top: 40px !important; }

.mTop50 {
  margin-top: 50px !important; }

.mBtm0 {
  margin-bottom: 0 !important; }

.mBtm10 {
  margin-bottom: 10px !important; }

.mBtm15 {
  margin-bottom: 15px !important; }

.mBtm20 {
  margin-bottom: 20px !important; }

.mBtm30 {
  margin-bottom: 30px !important; }

.mBtm40 {
  margin-bottom: 40px !important; }

.mBtm50 {
  margin-bottom: 50px !important; }

.mBtm05em {
  margin-bottom: 0.5em !important; }

.mBtm1em {
  margin-bottom: 1em !important; }

.mBtm15em {
  margin-bottom: 1.5em !important; }

.mBtm2em {
  margin-bottom: 2em !important; }

.mBtm3em {
  margin-bottom: 3em !important; }

.pad10 {
  padding: 10px !important; }

.pad15 {
  padding: 15px !important; }

.pad20 {
  padding: 20px !important; }

.pad25 {
  padding: 25px !important; }

.pad30 {
  padding: 30px !important; }

.pad40 {
  padding: 40px !important; }

.pad70 {
  padding: 70px !important; }

.displayTable {
  display: table;
  width: 100%;
  table-layout: fixed; }

.tableCell {
  display: table-cell;
  vertical-align: middle; }

.hide {
  display: none; }

.show {
  display: block; }

.noWrap {
  white-space: nowrap; }

.bold {
  font-weight: bold; }

.normal {
  font-weight: 500; }

small {
  font-size: 11px;
  font-size: 11px;
  font-size: 1.1rem; }

strong {
  font-weight: bold; }

.color-black {
  color: #000000; }

.color-white {
  color: #fff; }

.font10 {
  font-size: 10px;
  font-size: 10px;
  font-size: 1.0rem; }

.font12 {
  font-size: 12px;
  font-size: 12px;
  font-size: 1.2rem; }

.font14 {
  font-size: 14px;
  font-size: 14px;
  font-size: 1.4rem; }

.font16 {
  font-size: 16px;
  font-size: 16px;
  font-size: 1.6rem; }

.font18 {
  font-size: 18px;
  font-size: 18px;
  font-size: 1.8rem; }

.font20 {
  font-size: 20px;
  font-size: 20px;
  font-size: 2.0rem; }

.font22 {
  font-size: 22px;
  font-size: 22px;
  font-size: 2.2rem; }

.font24 {
  font-size: 24px;
  font-size: 24px;
  font-size: 2.4rem; }

.font26 {
  font-size: 26px;
  font-size: 26px;
  font-size: 2.6rem; }

.font28 {
  font-size: 28px;
  font-size: 28px;
  font-size: 2.8rem; }

.font30 {
  font-size: 30px;
  font-size: 30px;
  font-size: 3.0rem; }

.font32 {
  font-size: 32px;
  font-size: 32px;
  font-size: 3.2rem; }

.gothic {
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック","MS PGothic", sans-serif; }

.mincho {
  font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","游明朝", YuMincho, "ＭＳ Ｐ明朝","MS PMincho", serif;
  text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.1);
  -webkit-text-stroke-width: 0.1px; }

.serif {
  font-family: "Times New Roman", Garamond, Century, serif; }

.sans {
  font-family: Arial, Helvetica, Tahoma, sans-serif; }

.bgWhite {
  background: #fff; }

.bgBlack {
  background: #000; }

.bgGray01 {
  background: #e0e0e0; }

.bgGray02 {
  background: #ccc; }

.showMark {
  padding-left: 1em;
  margin-left: .5em; }

.showMark li {
  list-style: decimal; }

.hideMark {
  padding-left: 0; }

.hideMark li {
  list-style: none; }

.headCaution {
  padding: 10px 0;
  background: #ffcc66;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100; }

.headCaution p {
  width: 960px;
  display: block;
  margin: 0 auto;
  font-size: 14px;
  font-size: 14px;
  font-size: 1.4rem;
  background: url("../images/caution.png") 0 50% no-repeat;
  padding: 5px 25px; }

table {
  border-collapse: collapse; }

th, td {
  border: none; }

table .odd {
  background: #eee; }

.clickBox {
  cursor: pointer;
  -moz-transition-duration: 0.2s;
  -webkit-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  -ms-transition-duration: 0.2s; }

blockquote {
  background: #fff;
  padding: 40px 20px;
  position: relative;
  border-radius: 10px;
  border: 1px solid #ddd;
  margin-bottom: 2em; }

blockquote:before,
blockquote:after {
  content: "”";
  font-family: Georgia, "Times New Roman", Times, serif;
  color: #bbb;
  font-size: 40px;
  font-weight: bold;
  line-height: 60px;
  width: 40px;
  height: 40px;
  position: absolute; }

blockquote:before {
  text-align: left;
  top: 0px;
  left: 10px; }

blockquote:after {
  text-align: right;
  bottom: 0px;
  right: 20px; }

.flexImg {
  max-width: 100%;
  height: auto; }

.show-sm-block {
  display: none; }

.show-md-block {
  display: none; }

.show-pc-block {
  display: block; }

.show-sp-block {
  display: none; }

html {
  font-size: 62.5%; }

body {
  height: 100%;
  min-height: 100%;
  font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN","メイリオ", Meiryo, "ＭＳ Ｐゴシック","MS PGothic", Helvetica,Arial,Verdana,sans-serif;
  font-weight: 400;
  color: #666666;
  position: relative;
  background: #ffffff;
  -webkit-text-size-adjust: 100%;
  font-size: 16px;
  font-size: 16px;
  font-size: 1.6rem; }

/*
* ================
* common
* ================
*/
a {
  color: #4197a7;
  text-decoration: none; }

a:hover {
  text-decoration: underline; }

img {
  max-width: 100%;
  height: auto; }

p {
  text-align: justify;
  text-justify: inter-ideograph;
  overflow-wrap: break-word;
  word-wrap: break-word; }

.fade {
  -moz-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s; }

.fade:hover {
  opacity: .7;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; }

.color-brown {
  color: #6d2600; }

.color-dblue {
  color: #005d7a; }

#wrapper {
  min-width: 1180px;
  background: url("../img/common/bg-repeat.jpg") center center repeat; }

/* color setting
=================*/
.font-orange {
  color: #f6921e; }

.font-blue {
  color: #4197a7; }

.font-green {
  color: #539859; }

.font-beige {
  color: #c39e69; }

.font-pink {
  color: #bb484a; }

/* page
===================*/
.container {
  width: 1140px;
  padding-left: 20px;
  padding-right: 20px;
  margin-left: auto;
  margin-right: auto;
  box-sizing: content-box; }

.page-contents {
  background: #FFF;
  padding-bottom: 30px; }

.back-top-top-wrap {
  text-align: right;
  padding-right: 50px;
  clear: both; }

.back-to-top {
  background-image: url(../img/sprite.png);
  background-position: -784px -212px;
  width: 72px;
  height: 88px;
  background-size: 881px 682px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block;
  display: inline-block; }

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite; }

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s; }

/*the animation definition*/
@-webkit-keyframes tada {
  10%,
  20% {
    -webkit-transform: rotate3d(0, 0, 1, -3deg);
    transform: rotate3d(0, 0, 1, -3deg); }
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: rotate3d(0, 0, 1, 3deg);
    transform: rotate3d(0, 0, 1, 3deg); }
  40%,
  60%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -3deg);
    transform: rotate3d(0, 0, 1, -3deg); } }

@keyframes tada {
  10%,
  20% {
    -webkit-transform: rotate3d(0, 0, 1, -3deg);
    transform: rotate3d(0, 0, 1, -3deg); }
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: rotate3d(0, 0, 1, 3deg);
    transform: rotate3d(0, 0, 1, 3deg); }
  40%,
  60%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, -3deg);
    transform: rotate3d(0, 0, 1, -3deg); } }

.tada {
  -webkit-animation-name: tada;
  animation-name: tada; }

/*
* header
=====================================*/
#header {
  height: 256px;
  position: relative; }

#header h1 {
  text-align: center;
  position: absolute;
  left: 0;
  top: 56px;
  width: 100%; }

#header h1 a {
  display: inline-block; }

#header h1 a:hover {
  -webkit-animation-name: tada;
  animation-name: tada; }

#header h1 span {
  background-image: url(../img/sprite.png);
  background-position: 0px 0px;
  width: 291px;
  height: 168px;
  background-size: 881px 682px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

/* global navigation
======================= */
#gnav {
  position: relative;
  width: 100%; }

#gnav:before {
  content: "";
  background-image: url(../img/sprite.png);
  background-position: -561px -387px;
  width: 137px;
  height: 123px;
  background-size: 881px 682px;
  position: absolute;
  left: 360px;
  top: 15px;
  display: block; }

#gnav:after {
  content: "";
  background-image: url(../img/sprite.png);
  background-position: -308px -178px;
  width: 230px;
  height: 111px;
  background-size: 881px 682px;
  position: absolute;
  left: 610px;
  top: 8px;
  display: block; }

#gnav li {
  position: absolute;
  left: 0;
  top: 0; }

#gnav li:hover {
  -webkit-animation-name: tada;
  animation-name: tada; }

#gnav .gnav-home {
  left: 0;
  top: 20px;
  -webkit-clip-path: url(#gnav-home-mask);
          clip-path: url(#gnav-home-mask); }

#gnav .gnav-home span {
  background-image: url(../img/sprite.png);
  background-position: -301px 0px;
  width: 250px;
  height: 126px;
  background-size: 881px 682px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

#gnav .gnav-about {
  left: 7px;
  top: 127px;
  -webkit-clip-path: url(#gnav-about-mask);
          clip-path: url(#gnav-about-mask); }

#gnav .gnav-about span {
  background-image: url(../img/sprite.png);
  background-position: -561px 0px;
  width: 213px;
  height: 101px;
  background-size: 881px 682px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

#gnav .gnav-about span.active {
  background-image: url(../img/sprite.png);
  background-position: -561px -111px;
  width: 213px;
  height: 101px;
  background-size: 881px 682px; }

#gnav .gnav-minakami {
  left: 231px;
  top: 28px;
  -webkit-clip-path: url(#gnav-minakami-mask);
          clip-path: url(#gnav-minakami-mask); }

#gnav .gnav-minakami span {
  background-image: url(../img/sprite.png);
  background-position: -154px -178px;
  width: 144px;
  height: 199px;
  background-size: 881px 682px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

#gnav .gnav-minakami span.active {
  background-image: url(../img/sprite.png);
  background-position: 0px -178px;
  width: 144px;
  height: 199px;
  background-size: 881px 682px; }

#gnav .gnav-nature {
  left: 725px;
  top: 105px;
  -webkit-clip-path: url(#gnav-nature-mask);
          clip-path: url(#gnav-nature-mask); }

#gnav .gnav-nature span {
  background-image: url(../img/sprite.png);
  background-position: 0px -387px;
  width: 171px;
  height: 130px;
  background-size: 881px 682px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

#gnav .gnav-nature span.active {
  background-image: url(../img/sprite.png);
  background-position: -181px -387px;
  width: 171px;
  height: 130px;
  background-size: 881px 682px; }

#gnav .gnav-data {
  left: 902px;
  top: 56px;
  -webkit-clip-path: url(#gnav-data-mask);
          clip-path: url(#gnav-data-mask); }

#gnav .gnav-data span {
  background-image: url(../img/sprite.png);
  background-position: -305px -527px;
  width: 145px;
  height: 134px;
  background-size: 881px 682px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

#gnav .gnav-data span.active {
  background-image: url(../img/sprite.png);
  background-position: -150px -527px;
  width: 145px;
  height: 134px;
  background-size: 881px 682px; }

#gnav .gnav-contact {
  left: 1001px;
  top: 78px;
  -webkit-clip-path: url(#gnav-contact-mask);
          clip-path: url(#gnav-contact-mask); }

#gnav .gnav-contact span {
  background-image: url(../img/sprite.png);
  background-position: -561px -222px;
  width: 140px;
  height: 155px;
  background-size: 881px 682px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

#gnav .gnav-contact span.active {
  background-image: url(../img/sprite.png);
  background-position: 0px -527px;
  width: 140px;
  height: 155px;
  background-size: 881px 682px; }

#gnav .header-utility {
  position: absolute;
  right: 0;
  top: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }

#gnav .header-search {
  position: relative;
  margin-right: 8px; }

#gnav .header-search .search-text {
  width: 208px;
  height: 43px;
  padding: 16px 30px 16px 15px;
  border: none;
  background: url("../img/common/search-bg.png");
  background-size: 100% auto; }

#gnav .header-search .search-btn {
  width: 30px;
  height: 30px;
  white-space: nowrap;
  overflow: hidden;
  text-indent: 100px;
  display: block;
  position: absolute;
  top: 50%;
  margin-top: -15px;
  right: 5px;
  border: none;
  background: url("../img/common/icon-search.png") center center/15px auto no-repeat; }

#gnav .header-fb-btn span {
  background-image: url(../img/sprite.png);
  background-position: -846px -310px;
  width: 33px;
  height: 29px;
  background-size: 881px 682px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

#gnav-btn {
  position: absolute;
  top: 18px;
  right: 14px;
  z-index: 100;
  text-align: center;
  display: none;
  font-size: 0;
  border-radius: 4px; }

#gnav-btn span {
  background-image: url(../img/sprite-sp.png);
  background-position: -282px -157.5px;
  width: 56px;
  height: 90.5px;
  background-size: 508.5px 447.5px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

#gnav-btn.open {
  left: 50%;
  margin-left: -25px; }

#gnav-btn.open span {
  background-image: url(../img/sprite-sp.png);
  background-position: -141px -277.5px;
  width: 51px;
  height: 82px;
  background-size: 508.5px 447.5px; }

.closearea {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 30;
  background: rgba(0, 0, 0, 0.5);
  display: none; }

#footer {
  font-size: 13px;
  font-size: 1.3rem;
  text-align: center; }

.foot-nav {
  font-weight: bold; }

.foot-nav ul {
  padding: 28px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }

.foot-nav li {
  border-left: 1px solid #b4b3b1;
  text-align: center;
  padding: 0 1em; }

.foot-nav li:first-child {
  border: none; }

.foot-spec {
  color: #FFF;
  padding: 13px 0;
  background: #4197a7 url("../img/common/bg-repeat.jpg");
  background-blend-mode: multiply;
  line-height: 181.81818%; }

.foot-spec span {
  white-space: nowrap;
  margin-right: 1em;
  display: inline-block; }

.foot-copy {
  color: #FFF;
  padding: 13px 0;
  background: #2C313B url("../img/common/bg-repeat.jpg");
  background-blend-mode: multiply;
  text-align: center; }

/*
* =========================================
*             トップページ
* =========================================
*/

/* メインビジュアル
===================*/
.top-visual-wrap {
  margin-bottom: 55px;
  overflow: hidden;
  position: relative; }

.top-visual-wrap:before {
  content: "";
  background: url("../img/top/ie-mask.png") center top no-repeat;
  width: 1180px;
  height: 626px;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 20; }

#top-visual {
  position: relative; }

#top-visual:before {
  content: "";
  background-image: url(../img/sprite.png);
  background-position: -784px 0px;
  width: 97px;
  height: 202px;
  background-size: 881px 682px;
  position: absolute;
  left: 20px;
  bottom: 0;
  z-index: 10; }

#top-visual:after {
  content: "";
  background-image: url(../img/sprite.png);
  background-position: -308px -299px;
  width: 236px;
  height: 56px;
  background-size: 881px 682px;
  position: absolute;
  right: 50px;
  bottom: -10px;
  z-index: 10; }

.swiper-container {
  height: 626px;
  width: 100%;
  -webkit-clip-path: url(#top-visual-mask-pc);
          clip-path: url(#top-visual-mask-pc); }

.top-visual-svg {
  position: absolute;
  z-index: -10; }

.swiper-slide {
  color: #000;
  font-weight: bold;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: cover; }

.slide-text {
  width: 500px;
  height: 300px;
  padding: 40px;
  margin: auto;
  position: relative;
  margin-top: 170px;
  left: 33px; }

.slide-text p {
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 192.30769%;
  font-weight: bold; }

.slide-text-contents {
  position: relative;
  z-index: 20;
  line-height: 187.5%; }

.slide-heading {
  font-size: 22px;
  font-size: 2.2rem;
  font-weight: bold;
  margin-bottom: 20px;
  line-height: 136.36364%; }

.slide-text-bg {
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(255, 255, 255, 0.75);
  width: 500px;
  height: 300px;
  z-index: 10; }

.slide-imge {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 626px;
  z-index: 0;
  background-position: center center;
  background-size: cover; }

.slide-imge img {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover; }

#top-visual-mask-sp {
  width: 100%;
  margin: auto;
  background: #000; }

/* お知らせ等
==============*/
.top-infomations {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: 30px; }

.top-info-box {
  width: 370px;
  height: 360px;
  background: #FFF; }

.top-info-box h2 {
  position: relative; }

.top-info h2 {
  background-image: url(../img/top-sprite.png);
  background-position: 0px -159px;
  width: 315px;
  height: 119px;
  background-size: 636px 386px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block;
  top: -37px;
  left: 14px;
  margin-bottom: -37px; }

.top-info ul {
  padding: 15px 30px 0; }

.top-info ul li {
  border-bottom: 1px solid #f1ede8;
  position: relative; }

.top-info ul li:last-child {
  border: none; }

.top-info ul li:after {
  content: "";
  position: absolute;
  right: 3px;
  top: 50%;
  margin-top: -5px;
  display: block; }

.top-info ul li:nth-child(3n+1):after {
  background-image: url(../img/sprite.png);
  background-position: -866px -233px;
  width: 7px;
  height: 13px;
  background-size: 881px 682px; }

.top-info ul li:nth-child(3n+2):after {
  background-image: url(../img/sprite.png);
  background-position: -866px -212px;
  width: 9px;
  height: 11px;
  background-size: 881px 682px; }

.top-info ul li:nth-child(3n+3):after {
  background-image: url(../img/sprite.png);
  background-position: -866px -256px;
  width: 6px;
  height: 13px;
  background-size: 881px 682px; }

.top-info ul a {
  height: 38px;
  line-height: 38px;
  display: block;
  padding-right: 30px;
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: bold;
  -moz-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -ms-transition-duration: 0.3s;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis; }

.top-info ul a:hover {
  background: #eef7f9;
  text-decoration: none; }

.top-ecopark h2 {
  background-image: url(../img/top-sprite.png);
  background-position: 0px 0px;
  width: 316px;
  height: 149px;
  background-size: 636px 386px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block;
  top: -54px;
  left: 4px;
  margin-bottom: -54px; }

.top-ecopark ul {
  padding: 15px 30px 0; }

.top-ecopark li {
  margin-bottom: 6px; }

.top-ecopark span {
  display: block;
  margin: auto; }

.top-ecopark .top-eco-regi {
  background-image: url(../img/top-sprite.png);
  background-position: -326px -160px;
  width: 310px;
  height: 70px;
  background-size: 636px 386px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

.top-ecopark .top-eco-overview {
  background-image: url(../img/top-sprite.png);
  background-position: -326px -80px;
  width: 310px;
  height: 70px;
  background-size: 636px 386px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

.top-ecopark .top-eco-land {
  background-image: url(../img/top-sprite.png);
  background-position: -326px 0px;
  width: 310px;
  height: 70px;
  background-size: 636px 386px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block; }

.top-fb h2 {
  background-image: url(../img/top-sprite.png);
  background-position: -326px -240px;
  width: 193px;
  height: 37px;
  background-size: 636px 386px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block;
  margin: 45px auto 15px; }

.top-fb .fb-wrap {
  padding: 0 28px;
  margin-bottom: 7px; }

.top-fb .top-fb-btn {
  background-image: url(../img/top-sprite.png);
  background-position: 0px -342px;
  width: 310px;
  height: 44px;
  background-size: 636px 386px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block;
  margin: auto; }

/* みなかみ町の自然とくらし
==================*/
.top-life-btns {
  background: url("../img/top/scene_pc.jpg") center center/cover no-repeat;
  padding: 56px 0; }

.top-life-btns h2 {
  background-image: url(../img/top-sprite.png);
  background-position: 0px -288px;
  width: 325px;
  height: 44px;
  background-size: 636px 386px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block;
  margin: auto auto 73px; }

.top-life-btn-square {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  margin-bottom: 30px; }

.top-life-btn-square .square-btn {
  width: 207px; }

.top-life-btn-square .square-btn:hover {
  -webkit-animation-name: tada;
  animation-name: tada; }

.top-life-btn-rectangle {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row; }

.top-life-btn-rectangle .btn-rectangle {
  width: 370px;
  display: block; }

.top-life-btn-rectangle .btn-rectangle:hover {
  -webkit-animation-name: tada;
  animation-name: tada; }

/*
* ================
* browser hacks
* ================
*/
/* for iOS hacks */
@supports (-webkit-text-size-adjust: none) and (not (-ms-accelerator: true)) and (not (-moz-appearance: none)) {
  #gnav li svg {
    display: none; } }

@supports (-webkit-text-size-adjust: none) and (not (-ms-accelerator: true)) and (not (-moz-appearance: none)) {
  .swiper-container {
    -webkit-clip-path: none;
            clip-path: none; } }

@supports (-webkit-text-size-adjust: none) and (not (-ms-accelerator: true)) and (not (-moz-appearance: none)) {
  .foot-spec {
    background-image: none; } }

@supports (-webkit-text-size-adjust: none) and (not (-ms-accelerator: true)) and (not (-moz-appearance: none)) {
  .foot-copy {
    background-image: none; } }

/* for IE hacks */
_:-ms-fullscreen, :root .foot-spec {
  background-image: none; }

_:-ms-fullscreen, :root .foot-copy {
  background-image: none; }

_:-ms-fullscreen, :root .data-section a:before {
  margin-top: 0; }

_:-ms-fullscreen, :root .info-list .info-title {
  padding-top: 10px; }

/* for edge hacks */
@supports (-ms-accelerator: true) {
  .foot-spec {
    background-image: none; } }

@supports (-ms-accelerator: true) {
  .foot-copy {
    background-image: none; } }

@media only screen and (max-width: 767px){
  .hidden-sm{
    display: none; }
  .hidden-sm-md{
    display: none; }
  .show-sm-block{
    display: block; }
  body{
    font-size: 1.2rem; }
  #wrapper{
    min-width: auto;
    background-size: 350px auto; }
  .container{
    max-width: 100%;
    width: auto; }
  .page-contents{
    padding-bottom: 0; }
  .back-top-top-wrap{
    text-align: center;
    position: relative;
    padding: 0; }
  .back-top-top-wrap:after{
    content: "";
    background-image: url(../img/sprite.png);
    background-position: -154px -149.5px;
    width: 118px;
    height: 28px;
    background-size: 440.5px 341px;
    display: block;
    margin: 20px auto auto; }
  .back-to-top{
    background-image: url(../img/sprite-sp.png);
    background-position: -202px -277.5px;
    width: 57px;
    height: 70px;
    background-size: 508.5px 447.5px;
    margin-top: -40px; }
  #header{
    height: 210px; }
  #header h1{
    padding-top: 22px;
    position: static; }
  #header h1 a:hover{
    -webkit-animation-name: none;
            animation-name: none; }
  #header h1 span{
    background-image: url(../img/sprite-sp.png);
    background-position: 0px 0px;
    width: 226.5px;
    height: 147.5px;
    background-size: 508.5px 447.5px; }
  #gnav{
    padding: 10px;
    width: auto;
    z-index: 40;
    position: absolute;
    left: 0;
    top: 10px;
    display: none; }
  #gnav:before{
    display: none; }
  #gnav:after{
    display: none; }
  #gnav .gnav-inner{
    padding-top: 90px;
    padding-bottom: 15px;
    background: url("../img/common/bg-repeat.jpg") center center/350px repeat; }
  #gnav ul{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: 10px; }
  #gnav li{
    position: static;
    display: inline-block;
    -webkit-clip-path: none !important;
            clip-path: none !important;
    padding: 4px; }
  #gnav li svg{
    display: none; }
  #gnav .gnav-home span{
    background-image: url(../img/sprite-sp.png);
    background-position: -141px -157.5px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .gnav-about span{
    background-image: url(../img/sprite-sp.png);
    background-position: 0px -277.5px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .gnav-about span.active{
    background-image: url(../img/sprite-sp.png);
    background-position: 0px -277.5px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .gnav-minakami span{
    background-image: url(../img/sprite-sp.png);
    background-position: 0px -157.5px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .gnav-minakami span.active{
    background-image: url(../img/sprite-sp.png);
    background-position: 0px -157.5px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .gnav-nature span{
    background-image: url(../img/sprite-sp.png);
    background-position: -236.5px 0px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .gnav-nature span.active{
    background-image: url(../img/sprite-sp.png);
    background-position: -236.5px 0px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .gnav-data span{
    background-image: url(../img/sprite-sp.png);
    background-position: -377.5px 0px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .gnav-data span.active{
    background-image: url(../img/sprite-sp.png);
    background-position: -377.5px 0px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .gnav-contact span{
    background-image: url(../img/sprite-sp.png);
    background-position: -377.5px -120px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .gnav-contact span.active{
    background-image: url(../img/sprite-sp.png);
    background-position: -377.5px -120px;
    width: 131px;
    height: 110px;
    background-size: 508.5px 447.5px; }
  #gnav .header-utility{
    position: static;
    width: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
  #gnav-btn{
    display: block; }
  #footer{
    font-size: 1.2rem; }
  .foot-nav{
    padding: 0; }
  .foot-nav ul{
    display: block;
    padding: 15px 0 10px; }
  .foot-nav li{
    text-align: left;
    display: block;
    border: none;
    border-top: 1px solid #fff;
    padding: 0;
    position: relative; }
  .foot-nav li:after{
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -5px;
    display: block;
    right: 20px; }
  .foot-nav li:nth-child(3n+1):after{
    background-image: url(../img/sprite.png);
    background-position: -866px -233px;
    width: 7px;
    height: 13px;
    background-size: 881px 682px; }
  .foot-nav li:nth-child(3n+2):after{
    background-image: url(../img/sprite.png);
    background-position: -866px -212px;
    width: 9px;
    height: 11px;
    background-size: 881px 682px; }
  .foot-nav li:nth-child(3n+3):after{
    background-image: url(../img/sprite.png);
    background-position: -866px -256px;
    width: 6px;
    height: 13px;
    background-size: 881px 682px; }
  .foot-nav li a{
    padding: 10px 25px;
    display: block; }
  .foot-spec span{
    display: block; }
  .home #header{
    padding: 0;
    height: 300px; }
  .home h1{
    margin-bottom: 18px; }
  .home #gnav{
    position: static;
    padding: 0;
    display: block; }
  .home #gnav .gnav-inner{
    padding: 0; }
  .home #gnav ul{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 320px;
    margin: auto; }
  .home #gnav li{
    position: static !important;
    margin-bottom: 10px;
    padding: 0 5px; }
  .home #gnav .gnav-home{
    padding-top: 5px; }
  .home #gnav .gnav-about{
    padding-top: 2px; }
  .home #gnav .gnav-nature{
    padding-top: 3px;
    padding-left: 12px; }
  .home #gnav .gnav-contact{
    padding-top: 3px;
    padding-right: 12px; }
  .home #gnav .header-utility{
    display: none; }
  .home #gnav-btn{
    display: none; }
  .top-visual-wrap:before{
    background-image: url("../img/top/mask-bg_sp.png");
    background-size: 100% auto;
    width: 320px;
    height: 226px;
    display: block;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    left: 50%;
    margin-left: -160px; }
  .top-visual-wrap{
    margin-bottom: 60px;
    overflow: hidden;
    width: 320px;
    padding: 0; }
  #top-visual:before{
    display: none; }
  #top-visual:after{
    display: none; }
  .swiper-container{
    height: auto;
    -webkit-clip-path: none;
            clip-path: none;
    margin: auto; }
  .top-visual-svg{
    display: none; }
  .swiper-slide{
    font-weight: normal; }
  .slide-text{
    width: 100%;
    height: auto;
    padding: 0 25px;
    margin-top: 245px;
    font-size: 1.1rem;
    left: 0; }
  .slide-text p{
    color: #666666;
    font-size: 1.2rem;
    font-weight: normal; }
  .slide-heading{
    font-size: 1.4rem;
    margin-bottom: 5px; }
  .slide-text-bg{
    display: none; }
  .slide-imge{
    width: 320px;
    height: 226px;
    left: 50%;
    margin-left: -160px; }
  .slide-imge img{
    max-width: auto;
    width: auto;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover; }
  .top-infomations{
    display: block;
    margin-left: -20px;
    margin-right: -20px;
    margin-bottom: 70px; }
  .top-info-box{
    width: 100%;
    height: auto; }
  .top-info{
    margin-bottom: 70px;
    padding-bottom: 10px; }
  .top-info h2{
    background-image: url(../img/top-sprite-sp.png);
    background-position: 0px -124px;
    width: 258.5px;
    height: 97.5px;
    background-size: 538.5px 392px;
    top: -25px;
    left: -30px;
    margin: auto;
    margin-bottom: -25px; }
  .top-info ul{
    padding: 25px 0 0; }
  .top-info ul li:after{
    right: 15px; }
  .top-info ul a{
    padding: 0 35px 0 25px;
    font-size: 1.1rem; }
  .top-ecopark{
    margin-bottom: 70px; }
  .top-ecopark h2{
    background-image: url(../img/top-sprite-sp.png);
    background-position: 0px 0px;
    width: 265.5px;
    height: 119px;
    background-size: 538.5px 392px;
    top: -25px;
    left: -20px;
    margin: auto;
    margin-bottom: -25px; }
  .top-ecopark ul{
    padding: 20px 25px 28px;
    text-align: center; }
  .top-ecopark .top-eco-regi{
    background-image: url(../img/top-sprite-sp.png);
    background-position: -270.5px -65.5px;
    width: 268px;
    height: 60.5px;
    background-size: 538.5px 392px; }
  .top-ecopark .top-eco-overview{
    background-image: url(../img/top-sprite-sp.png);
    background-position: -270.5px -131px;
    width: 268px;
    height: 60.5px;
    background-size: 538.5px 392px; }
  .top-ecopark .top-eco-land{
    background-image: url(../img/top-sprite-sp.png);
    background-position: -270.5px 0px;
    width: 268px;
    height: 60.5px;
    background-size: 538.5px 392px; }
  .top-fb{
    padding-top: 37px;
    padding-bottom: 25px;
    position: relative; }
  .top-fb:after{
    content: "";
    background-image: url(../img/sprite.png);
    background-position: -154px -149.5px;
    width: 118px;
    height: 28px;
    background-size: 440.5px 341px;
    display: block;
    margin: auto;
    position: absolute;
    left: 50%;
    bottom: -60px;
    margin-left: -59px; }
  .top-fb h2{
    background-image: url(../img/top-sprite-sp.png);
    background-position: -273px -226.5px;
    width: 166px;
    height: 32px;
    background-size: 538.5px 392px;
    margin-top: 0;
    margin-bottom: 10px; }
  .top-fb .fb-wrap{
    margin-bottom: 35px; }
  .top-fb .top-fb-btn{
    background-image: url(../img/top-sprite-sp.png);
    background-position: 0px -226.5px;
    width: 268px;
    height: 38px;
    background-size: 538.5px 392px; }
  .top-life-btns{
    padding-top: 25px;
    padding-bottom: 10px;
    background-image: url("../img/top/scene_sp.jpg"); }
  .top-life-btns h2{
    background-image: url(../img/top-sprite-sp.png);
    background-position: 0px -269.5px;
    width: 194px;
    height: 25.5px;
    background-size: 538.5px 392px;
    margin-bottom: 15px; }
  .top-life-btn-square{
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 0;
    margin-bottom: 0; }
  .top-life-btn-square .square-btn{
    width: 145px;
    margin: 0 5px 10px; }
  .top-life-btn-rectangle{
    display: none; } }

@media only screen and (min-width: 768px) and (max-width: 1139px){
  .hidden-md{
    display: none; }
  .hidden-sm-md{
    display: none; }
  .show-md-block{
    display: block; } }

@media only screen and (min-width: 1140px) and (max-width: 1919px){
  .hidden-lg{
    display: none; } }

@media only screen and (max-width: 479px){
  .hidden-sp{
    display: none; }
  .show-pc-block{
    display: none; }
  .show-sp-block{
    display: block; } }

@media only screen and (min-width: 768px){
  .hidden-pc{
    display: none; } }

@media only screen and (max-width: 767px) and (max-width: 767px){
  .home #gnav .gnav-home span{
    background-image: url(../img/top-sprite-sp.png);
    background-position: -314.5px -300px;
    width: 90px;
    height: 39.5px;
    background-size: 538.5px 392px; }
  .home #gnav .gnav-about span{
    background-image: url(../img/top-sprite-sp.png);
    background-position: 0px -300px;
    width: 109px;
    height: 39.5px;
    background-size: 538.5px 392px; }
  .home #gnav .gnav-minakami span{
    background-image: url(../img/top-sprite-sp.png);
    background-position: 0px -344.5px;
    width: 82px;
    height: 47.5px;
    background-size: 538.5px 392px; }
  .home #gnav .gnav-nature span{
    background-image: url(../img/top-sprite-sp.png);
    background-position: -114px -300px;
    width: 97.5px;
    height: 39.5px;
    background-size: 538.5px 392px; }
  .home #gnav .gnav-data span{
    background-image: url(../img/top-sprite-sp.png);
    background-position: -409.5px -300px;
    width: 78px;
    height: 39.5px;
    background-size: 538.5px 392px; }
  .home #gnav .gnav-contact span{
    background-image: url(../img/top-sprite-sp.png);
    background-position: -216.5px -300px;
    width: 93px;
    height: 39.5px;
    background-size: 538.5px 392px; } }