@charset "utf-8";
/* トップページ向けCSS */
/* VISUAL
=========================================== */

#page-visual {
  position: relative;
}

#page-visual .for-pc img {
  display: none;
}

#page-visual::after {
  content: "";
  height: 631px;
  position: absolute;
  z-index: -1;
  top: 0;
  width: 100%;
}

@media (min-width: 768px) {
  #page-visual .for-pc img {
    display: block;
    position: absolute;
  }
  #page-visual {
    text-align: left;
  }
}

@media (min-width: 1000px) and (max-width: 1200px) {
  #page-visual {
    max-height: 580px;
  }
}

@media (min-width: 768px) and (max-width: 999px) {
}

@media (max-width: 767px) {
  .houou_sp {
    position: absolute;
  }
  .sp_visual .zoomin img {
    position: absolute;
  }
  #page-visual .sp_visual {
    margin: 0;
  }
  .opningtime {
    position: absolute;
    width: 100%;
    top: 96%;
    text-align: center;
    padding: 0 15%;
  }
  #page-visual .date,
  #page-visual .slogan1,
  #page-visual .headrightbottom {
    display: none;
  }
  #page-visual .headrightbottom img {
    width: 45px;
    height: auto;
  }
  #page-visual .main_title {
    display: none;
  }
  #page-visual .main_title2 {
    position: relative;
    position: absolute;
    right: -116px;
    bottom: 60px;
  }
  #page-visual .main_title2 img {
    width: 50%;
    height: auto;
  }
}

/*
COUNTDOWN
*/
/**/

#timer {
  width: 30%;
  height: 10.7%;
  text-align: center;
  color: #ffffff;
  /*border-bottom: 5px solid #ca321c;*/
  /*text-shadow: 2px 2px 0 #787878;*/
  position: absolute;
  top: 95%;
  display: inline-block;
  font-size: 2.6vw;
  font-weight: bold;
  float: left;
  margin-left: 19.5%;
  z-index: 10;
  /*background-color:#192159a3;*/
}

#kaimon {
  width: 31%;
  height: 10.7%;
  text-align: center;
  color: #ffffff;
  /*text-shadow: 2px 2px 0 #cacaca;*/
  position: absolute;
  top: 95%;
  display: inline-block;
  font-size: 2.6vw;
  font-weight: bold;
  float: left;
  margin-left: 46.5%;
  z-index: 10;
  /*background: url("../img/bg_gold.png");*/
  /*background: linear-gradient(to right bottom,#dda643 0% 10%,#eee0b9 20%,#fff,#eee0b9 80%,#dda643 90% 100%)*/
}


#timer span {
    color: #e72410;
    font-size: 3.2vw;
    text-shadow: -2px -2px 0 #ffffff, 2px -2px 0 #ffffff, -2px 2px 0 #ffffff, 2px 2px 0 #ffffff;
}

#kaimon span {
    color: #e72410;
    font-size: 3.2vw;
    text-shadow: -2px -2px 0 #ffffff, 2px -2px 0 #ffffff, -2px 2px 0 #ffffff, 2px 2px 0 #ffffff;
}

.timeover {
  font-size: 2vw;
  color: #ffffff!important;
  text-shadow: 2px 2px 0 #787878!important;
}

@media (max-width: 768px) and (min-width: 541px) {
  #timer {
    width: 47%;
    height: 4%;
    font-size: 5vw;
    top: 94.5%;
    margin-left: 27.8%;
    /*border-bottom: 1px solid #192159;*/
  }

  #timer span {
    font-size: 6vw;
  }
  #kaimon {
    width: 65%;
    height: 3%;
    font-size: 5vw;
    top: 99.5%;
    margin-left: 17.8%;
    /*border-bottom: 1px solid #192159;*/
  }

  #kaimon span {
    font-size: 6vw;
  }
  
}

@media (max-width: 768px) and (min-width: 768px) {
  #timer {
    width: 47%;
    height: 12%;
    font-size: 3vw;
    top: 94%;
    margin-left: 26.5%;
    /*border-bottom: 1px solid #192159;*/
  }

  #timer span {
    font-size: 3.5vw;
  }
  #kaimon {
    width: 65%;
    height: 12%;
    font-size: 3vw;
    top: 105%;
    margin-left: 17%;
    /*border-bottom: 1px solid #192159;*/
  }

  #kaimon span {
    font-size: 3.5vw;
  }
  
}

@media (max-width: 540px) {
  #timer {
    width: 47%;
    height: 7%;
    font-size: 5vw;
    top: 94%;
    margin-left: 27.8%;
    /*border-bottom: 1px solid #192159;*/
  }

  #timer span {
    font-size: 7vw;
  }
  #kaimon {
    width: 65%;
    height: 7%;
    font-size: 5vw;
    top: 100%;
    margin-left: 17.8%;
    /*border-bottom: 1px solid #192159;*/
  }

  #kaimon span {
    font-size: 7vw;
  }
  
  .mt-sp-4 {
    margin-top: 1.5rem !important;
  }
}

/* TOPICS
=========================================== */

#page-topics {
  padding: 50px 0;
}

#page-topics > .container > .title {
  display: none;
}
/* page-topicsbanner
========================================== */

#page-topicsbanner .row > div {
  margin-top: 10px;
}
/* page-panel
========================================== */

#page-panel.content {
  padding-top: 0;
}

.content .list-panel {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-left: -5px;
  margin-right: -5px;
  padding-left: 0;
}

.list-panel li {
  flex: 0 0 50%;
  max-width: 50%;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 10px;
  list-style: none;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

.list-panel a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding: 10px;
  background: rgba(13, 53, 99, 0.3);
  background: -moz-linear-gradient(
    left,
    rgba(13, 53, 99, 0.3) 0%,
    rgba(101, 182, 152, 0.3) 100%
  );
  /* FF3.6-15 */
  background: -webkit-linear-gradient(
    left,
    rgba(13, 53, 99, 0.3) 0%,
    rgba(101, 182, 152, 0.3) 100%
  );
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(
    to right,
    rgba(13, 53, 99, 0.3) 0%,
    rgba(101, 182, 152, 0.3) 100%
  );
  text-align: center;
  box-shadow: 0 3px 5px 2px rgba(0, 0, 0, 0.2);
  border: 1px solid #e8ce37;
  color: #fff;
}

.list-panel a:hover {
  text-decoration: none;
  opacity: 0.75;
  top: 2px;
}

.list-panel a > span {
  display: inline-block;
  height: 2.5em;
}

@media (min-width: 768px) {
  .list-panel li {
    flex: 0 0 33.33333%;
    max-width: 33.33333%;
    padding-left: 0;
    padding-bottom: 10px;
  }
  .list-panel a > span {
    height: auto;
  }
}
/* Social media tag
=========================================== */

.table-fb, .table-tw, .table-ins {
  width: 100%;
  margin-bottom: 10px;
  box-shadow: 0 3px 5px 2px rgba(0, 0, 0, 0.2);
}

.fb-title, .tw-title, .ins-title {
  position: relative;
  height: 64px;
  background-color: #1877f2;
  color: #fff;
}

.fb-title {
    background-color: #1877f2;
}

.tw-title {
    background-color: #000000;
}

.ins-title {
    background: linear-gradient(55.01deg,#ff7a00 12.35%,#ff0169 56.52%,#d300c5);
}

.fb-title img, .tw-title img, ins-title img{
    max-width: 100%;
}

.fb-title-comment,.tw-title-comment, .ins-title-comment {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 100px;
  height: 64px;
  display: block;
  background-color: #1b2959;
}

.fb-title-comment:after, .tw-title-comment:after, .ins-title-comment:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 100px;
  display: block;
  border-bottom: 64px solid #1b2959;
  border-left: 10px solid transparent;
}

@media (max-width: 767px) {
  .fb-title-comment, .tw-title-comment, .ins-title-comment {
    display: none;
  }
}
/* #section-info  新着情報、注目トピックススライダー領域
=========================================== */

#section-info {
  background-image: url(../img/index/bg_info.jpg);
  padding: 56px 0;
}

.panel-info {
    margin: 0;
    padding: 20px;
    height: 480px;
    font-size: 1.2em;
    text-decoration: none;
    border: 8px #5cb531;
    border-style: groove ridge ridge groove;
    /*background-image: url(../img/index/bg_paper.png);*/
    background-color: #ffffff;
    border-radius: 8px;
    position: relative;
    overflow: hidden;
    /*box-shadow: 4px 4px #ffeac16c;*/
}

    .panel-info h3 {
        margin-top: 0;
        color: #1b330e;
    }

/*
    
    .panel-info::before,
    .panel-info::after {
        content: "";
        position: absolute;
        display: block;
        width: 100%;
        height: 2px;
        background-color: #d3be92;
        border-radius: 8px;
        left: 0;
    }
*/

.panel-info::before {
  top: 0;
}

.panel-info::after {
  bottom: 0;
}

@media (max-width: 992px) {
  .panel-info {
    height: auto;
  }
}

/* 新着情報 リスト */

.updates {
  padding: 0;
  list-style: none;
}

    .updates li {
        margin: 0;
        padding: 8px 0;
        border-bottom: 1px solid #1b330e;
        color: #1b330e;
    }

.updates li:last-child {
  border-bottom: 0 none;
}

    .updates li .date {
        vertical-align: middle;
        color: #1b330e;
    }

    .updates a {
        font-weight: bold;
        font-size: 1.1em;
        color: #1b330e;
        text-decoration: underline;
    }

.updates a:focus,
.updates a:hover {
  text-decoration: none;
}

.panel-info .scroll-y {
  overflow-y: auto;
  height: 400px;
}
/* 注目トピックススライダー */

.topics {
  padding-bottom: 20px;
}

.topics .slick-arrow {
  background: transparent none no-repeat scroll center center;
  border: 0 none;
  display: block;
  height: 100%;
  position: absolute;
  top: 0;
  width: 40px;
  z-index: 100;
  text-indent: -9999px;
  overflow: hidden;
}

.topics .slick-prev {
  background-image: url(../img/btn_prev1.png);
  left: -20px;
}

.topics .slick-next {
  background-image: url(../img/btn_next1.png);
  right: -20px;
}

.slick-dots {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  display: block;
  text-align: center;
  height: 0;
}

.slick-dots li {
  display: inline-block;
  list-style: outside none;
  padding: 0 4px;
}

.slick-dots li button {
  display: block;
  background: #ccc;
  border: 0 none;
  overflow: hidden;
  width: 32px;
  height: 0;
  padding-top: 8px;
}

    .slick-dots li.slick-active button {
        background: linear-gradient(to right, #1b330e 0%, #5cb531 70%);
    }

@media (max-width: 767px) {
  .topics .slick-arrow {
    -webkit-background-size: 20px 20px;
    background-size: 20px 20px;
    width: 20px;
  }
  .slick-dots {
    display: none !important;
  }
}
/*
section
===========================================
*/

#section-menu {
  padding: 56px 0 0 0;
}

#section-slider {
  padding: 56px 0;
}

#section-slider .flags {
  background: linear-gradient(
    135deg,
    rgba(92, 96, 100, 1) 0%,
    rgba(31, 34, 37, 1) 45%,
    rgba(38, 42, 46, 1) 55%,
    rgba(38, 42, 46, 1) 100%
  );
  padding: 20px 105px;
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}

/*
    #section-slider .flags::before,
    #section-slider .flags::after {
        content: "";
        display: block;
        height: 1px;
        background: linear-gradient(to right, #f2e1c2, #b28c47);
        position: absolute;
        left: 0;
        width: 100%;
    }
*/

#section-slider .flags::before {
  top: 0;
}

#section-slider .flags::after {
  bottom: 0;
}

#section-slider .flags .slick-slide {
  margin: 8px;
}

#section-slider .flags .slick-slide > a {
  display: block;
}

#section-links {
  background-image: url(../img/index/bg_links.jpg);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  padding: 56px 0;
}
/* slick */

.slick-slider {
  display: none;
}

.slick-slider.slick-initialized {
  display: block;
}

.flags .slick-arrow {
  background: transparent none no-repeat scroll center center;
  border: 0 none;
  display: block;
  height: 100%;
  position: absolute;
  top: 0;
  width: 48px;
  z-index: 100;
  text-indent: -9999px;
  overflow: hidden;
}

.flags .slick-prev {
  background-image: url(../img/btn_prev2.png);
  left: 45px;
}

.flags .slick-next {
  background-image: url(../img/btn_next2.png);
  right: 45px;
}

@media (max-width: 767px) {
  #section-slider .flags {
    margin: 0 auto;
    padding: 10px 20px;
    border-radius: 10px;
  }
  #section-slider .flags .slick-slide {
    margin: 3px;
  }
  .flags .slick-arrow {
    -webkit-background-size: 20px 20px;
    background-size: 20px 20px;
    width: 20px;
  }
  .flags .slick-prev {
    left: 5px;
  }
  .flags .slick-next {
    right: 5px;
  }
}
/*
movie
===========================================
*/

#section-movie {
  position: relative;
  background-color: rgba(255, 255, 255, 0.0);
  padding: 56px 0;
}

    #section-movie::before {
        content: "";
        position: absolute;
        bottom: 0;
        display: block;
        border-left: 100vw solid transparent;
        border-bottom: 248px solid #f39800;
    }

.panel-movie {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    font-weight: 700;
    text-align: center;
    line-height: 1.2;
    background-color: rgba(255, 255, 255, 0.8);
    border: 6px solid #f39800;
    /*border-style: groove ridge ridge groove;*/
    border-radius: 4px;
    letter-spacing: 0;
    overflow: hidden;
    padding: 20px;
    margin-bottom: 7px;
    box-shadow: 6px 6px #192159;
}

/*
    .panel-movie::before,
    .panel-movie::after {
        content: "";
        position: absolute;
        display: block;
        width: 100%;
        height: 2px;
        background-color: #e3542b;
        border-radius: 8px;
        left: 0;
    }
*/

.panel-movie::before {
  top: 0;
}

.panel-movie::after {
  bottom: 0;
}

.panel-movie-text {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 3em;
  padding: 5px;
}