.g-main {
  padding: 0;
}

/** Keyvisual **/
.keyvisual-slider {
  margin: 0 !important;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-transition: opacity .4s;
  transition: opacity .4s;
}

.keyvisual-slider.-js-show {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.keyvisual-slider .slick-slide .slide-box img {
  filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feGaussianBlur stdDeviation="0" /></filter></svg>#filter');
  filter: blur(0);
  -webkit-transform: scale(1);
          transform: scale(1);
  -webkit-transition: -webkit-transform 0.8s ease;
  transition: -webkit-transform 0.8s ease;
  transition: transform 0.8s ease;
  transition: transform 0.8s ease, -webkit-transform 0.8s ease;
}

_:-ms-lang(x)::backdrop, .keyvisual-slider .slick-slide .slide-box img {
  -webkit-transition: none;
  transition: none;
  transform: none;
  filter: none;
}

.keyvisual-slider .slick-slide:not(.slick-active):not(.slick-clone-active) .slide-box img {
  -webkit-transform: scale(1.025);
          transform: scale(1.025);
  filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feGaussianBlur stdDeviation="5" /></filter></svg>#filter');
  filter: blur(5px);
}

_:-ms-lang(x)::backdrop, .keyvisual-slider .slick-slide:not(.slick-active):not(.slick-clone-active) .slide-box img {
  -webkit-transition: none;
  transition: none;
  transform: none;
  filter: none;
}

.keyvisual-slider .slide-content {
  position: relative;
  overflow: hidden;
}

.keyvisual-slider .slick-arrow {
  width: 50px;
  height: 100%;
  -webkit-transition: opacity .3s;
  transition: opacity .3s;
}

.keyvisual-slider .slick-arrow:before {
  content: none;
}

.keyvisual-slider .slick-arrow:hover {
  opacity: 0.6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
}

.keyvisual-slider .slick-prev {
  background: url(../images/top/slide-arrow-left-green.png) no-repeat center center;
  left: 50%;
  margin-left: -640px;
}

.keyvisual-slider .slick-next {
  background: url(../images/top/slide-arrow-right-green.png) no-repeat center center;
  right: 50%;
  margin-right: -640px;
}

.keyvisual-slider .slick-dots {
  bottom: 15px;
}

.keyvisual-slider .slick-dots li button:before {
  font-size: 14px;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  color: #999;
}

.keyvisual-slider .slick-dots li.slick-active button:before {
  color: #024a60;
}

/** navigation **/
.nav-bar {
  background: -webkit-gradient(linear, left top, right top, from(#2a7f94), to(#00495b));
  background: linear-gradient(to right, #2a7f94 0%, #00495b 100%);
  padding: 35px 0;
}

.nav-bar ul {
  padding: 0;
  list-style: none;
  font-size: 0;
  text-align: center;
}

.nav-bar ul:after {
  content: " ";
  display: table;
  clear: both;
}

.nav-bar ul li {
  display: inline-block;
  margin-right: 42px;
}

.nav-bar ul li:last-child {
  margin-right: 0;
}

.nav-bar ul li a {
  display: block;
  padding: 12px 0;
  text-decoration: none;
  color: #d8eefb;
  font-size: 10px;
  font-weight: bold;
  line-height: 1.3;
}

.nav-bar ul li p {
  margin: 0;
}

.nav-bar ul li .icon {
  margin: 0 auto 10px;
  font-size: 50px;
  color: #fff;
  line-height: 1;
}

/** event & topics **/
.event-container {
  margin-top: 50px;
}

/** infomation **/
.info-container {
  background: url(../images/top/infomation-bg.jpg) no-repeat center top;
  -webkit-background-size: cover;
          background-size: cover;
}

.news-list {
  padding: 0;
  list-style: none;
  margin: 10px 0 40px;
}

.news-list li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-bottom: 1px solid #a3a3a3;
  padding: 15px 0;
}

.news-list li p {
  margin: 0;
}

.news-list li .cate {
  -webkit-box-flex: 0;
      -ms-flex: 0 1 auto;
          flex: 0 1 auto;
  width: 122px;
  text-align: center;
  background: #00495b;
  color: #fff;
  padding: 4px;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: bold;
  line-height: 1;
}

.news-list li .date {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: 165px;
  text-align: center;
}

.news-list li .title {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  width: calc(100% - 287px);
  font-size: 14px;
  font-size: 0.875rem;
}

.news-list li .title a {
  color: inherit;
  text-decoration: none;
  -webkit-transition: all .2s ease-out;
  transition: all .2s ease-out;
}

.news-list li .title a:hover {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  color: #942529;
}

/** web mystory **/
.mystory-conteiner .lead {
  margin: 10px 0 45px;
  text-align: center;
  font-size: 14px;
  font-size: 0.875rem;
}

.mystory-slider {
  margin: 0 0 50px;
}

.mystory-conteiner .rogo img {
width:30%;
margin:0 35%;
}

/** feature **/
.feature-container {
  background: url(../images/top/feature-bg.jpg) no-repeat center top;
  -webkit-background-size: cover;
          background-size: cover;
}

.band-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-top: 45px;
}

.band-unit {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  width: calc(100% / 3 - 0.7px);
  margin: 0 1px 1px 0;
}

.band-unit:nth-child(3n) {
  margin-right: 0;
}

.band-unit .band-box {
  display: block;
  position: relative;
  padding-top: 41.24%;
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  background: #000;
}

.band-unit .band-box.-promenade {
  background: #00495b;
}

.band-unit .band-box > img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.band-unit .band-box:hover {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.band-unit .band-box:hover > img {
  -webkit-transform: scale(1.04);
          transform: scale(1.04);
  opacity: 0.5;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}

.band-unit .band-box:hover .band {
  background: rgba(0, 73, 91, 0.75);
}

.band-unit .band-box:hover .band > p {
  color: #fff;
}

.band-unit .band {
  position: absolute;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  z-index: 2;
  width: 100%;
  background: rgba(255, 255, 255, 0.75);
  padding: 10px;
  text-align: center;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.band-unit .band .title {
  margin: 0 0 0.1em;
  font-size: 16px;
  font-size: 1rem;
  font-weight: bold;
  color: #00495b;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.band-unit .band .en {
  margin: 0;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1;
  color: #333;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.band-unit .promenade-info {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  margin: auto;
  width: 100%;
  max-width: 330px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.band-unit .promenade-info .link {
  float: left;
  width: 60%;
  margin: 0;
}

.band-unit .promenade-info .date {
  float: right;
  width: 40%;
  max-width: 100px;
  font-size: 12px;
  text-align: right;
  font-weight: 600;
  line-height: 1.2;
  margin: 0;
}

.band-unit .promenade-info .date span {
  display: inline-block;
}

.band-unit .promenade-info .comment {
  clear: both;
  padding-top: 20px;
  text-align: center;
  font-weight: bold;
  font-size: 14px;
  line-height: 2;
}

/** SHOP & RESTAURANT **/
.shop-container .media-container {
  margin: 45px 0 20px;
}

/** main facilities **/
.facilities-container {
  background: url(../images/top/facilities-bg.jpg) no-repeat center top;
  -webkit-background-size: cover;
          background-size: cover;
}

/* -----
 * responsive
----------------------------------------------------------------------------- */
@media screen and (min-width: 944px) {
  /* PC */
}

@media screen and (min-width: 768px) and (max-width: 943px) {
  /* tablet */
  /** Keyvisual **/
  .keyvisual-slider .slick-slide .slide-box img {
    filter: none;
    -webkit-transform: none;
            transform: none;
    -webkit-transition: none;
    transition: none;
  }
  .keyvisual-slider .slick-slide:not(.slick-active):not(.slick-clone-active) .slide-box img {
    filter: none;
    -webkit-transform: none;
            transform: none;
    -webkit-transition: none;
    transition: none;
  }
}

@media screen and (max-width: 767px) {
  /* smart phone */
  /** Keyvisual **/
  .keyvisual-slider .slick-slide .slide-box {
    filter: none;
    -webkit-transform: none;
            transform: none;
    -webkit-transition: none;
    transition: none;
  }
  .keyvisual-slider .slick-slide:not(.slick-active):not(.slick-clone-active) .slide-box img {
    -webkit-transform: none;
            transform: none;
    filter: none;
  }
  .keyvisual-slider .slick-arrow {
    display: none !important;
  }
  .keyvisual-slider .slick-dots {
    bottom: 10px;
  }
  .keyvisual-slider .slick-dots li {
    margin: 0 1px;
  }
  .keyvisual-slider .slick-dots li button:before {
    font-size: 12px;
  }
  /** navigation **/
  .nav-bar {
    padding: 0;
  }
  .nav-bar ul li {
    float: left;
    margin-right: 0;
    width: calc(100% / 3);
  }
  .nav-bar ul li:nth-child(3n -1) {
    border-left: 1px solid #d8eefb;
    border-right: 1px solid #d8eefb;
  }
  .nav-bar ul li:nth-child(n + 4) {
    border-top: 1px solid #d8eefb;
  }
  .nav-bar ul li a {
    padding: 15px 0;
  }
  .nav-bar ul li .icon {
    font-size: 30px;
    margin-bottom: 6px;
  }
  .nav-bar ul li:last-child {
    width: 100%;
    border-top: solid 1px #d8eefd;
  }
  .nav-bar ul li:last-child a {
    padding: 12px 0;
  }
  /** event & topics **/
  .event-container {
    margin: 20px 0;
  }
  .event-container .card {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 15px;
  }
  .event-container .card .thumb {
    -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
    width: calc(50% - 17px);
    padding: 0;
  }
  .event-container .card .thumb a {
    display: block;
    padding-top: 50%;
  }
  .event-container .card .contents {
    -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
            flex: 1 1 auto;
    width: calc(50% + 17px);
    padding: 0 0 0 12px;
  }
  /** infomation **/
  .info-container {
    background-image: url(../images/top/infomation-bg-sp.jpg);
  }
  .news-list {
    margin: 6px 0 30px;
  }
  .news-list li {
    padding: 10px 0;
  }
  .news-list li .cate {
    width: 10em;
    font-size: 0.45rem;
  }
  .news-list li .date {
    width: 9em;
    margin-left: 0.4em;
    font-size: 0.625rem;
  }
  .news-list li .title {
    width: 100%;
    font-size: 0.75rem;
    padding-top: 5px;
  }
  /** web mystory **/
  .mystory-conteiner .lead {
    margin: 6px 0 15px;
    font-size: 0.75rem;
  }
  .mystory-conteiner .card-container.-column2 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
  .mystory-slider {
    margin: 0 -10px 10px;
  }
  .band-container {
    margin-top: 20px;
  }
  .band-unit {
    width: 100%;
  }
  .band-unit .band .title {
    font-size: 0.81rem;
  }
  .band-unit .band .en {
    font-size: 0.7rem;
  }
  .band-container.res-bottom .band-unit .band {
    top: auto;
    bottom: 0;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }

.mystory-conteiner .rogo img {
width:60%;
margin:0 20%;
}
  /** feature **/
  .feature-container {
    background-image: url(../images/top/feature-bg-sp.jpg);
  }
  .feature-container .band-container {
    display: block;
  }
  .feature-container .band-container .band-unit {
    vertical-align: bottom;
  }
  /** SHOP & RESTAURANT **/
  .shop-container .media-container {
    margin: 15px 0;
  }
  /** main facilities **/
  .facilities-container {
    padding-left: 10px;
    padding-right: 10px;
    background-image: url(../images/top/facilities-bg-sp.jpg);
  }
}