@charset "utf-8";

/* ------------------------------------------------------------
top page style
------------------------------------------------------------ */
#textWelcome {
  margin: 16px 0;
  font-size: 200%;
}
#slides2 {
  display: none;
}
#contents p {
  width: 100%;
}
#contents img {
  max-width: 100%;
  height: auto;
}
.buttonStyle {
  display: inline-block;
  margin-bottom: 5px;
  padding: 12px 16px;
  background: #DDDDDD;
  text-align: center;
}
.buttonStyle:hover {
  background: #09F;
  color: #FFF;
}
.buttonStyle:visited {
  color: #111114;
}
#rss {
  padding: 0 16px;
  border: 4px solid #eee;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
}
#rss h2 {
  margin: -4px -20px 16px;
  padding: 8px 20px;
  -moz-border-radius: 8px 8px 0 0;
  -webkit-border-radius: 8px 8px 0 0;
  border-radius: 8px 8px 0 0;
  background: #06C;
  color: #FFF;
}
#rss h2 a {
  color: #FFF;
}

#businessDayCalendar {
  overflow: hidden;
}
.calendar {
  border-collapse: collapse;
  border-bottom: black 1px solid;
  border-left: black 1px solid;
}
.calendar:first-of-type {
  float: left;
  margin-right: 1em;
}
.calendar thead th, .calendar tbody td {
  padding: 3px;
  border-top: black 1px solid;
  border-right: black 1px solid;
}
.calendar tbody td {
  text-align: center;
}
.closed {
  border-top: 1px solid red;
  border-bottom: 1px solid red;
  color: red;
}
.afternoonClosed {
  border-bottom: 1px solid red;
  color: red;
}
.amClosed {
  border-top: 1px solid red;
  color: red;
}

.businessHours {
  margin-bottom: 0;
}
.businessHours + p {
  margin-top: 0;
}

#businessDay summary {
  color: #f60;
}
#businessDay summary h2 {
  display: inline-block;
}

.flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.flex-text {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 49%;
  flex: 0 0 49%;
}
.flex-text p:first-child {
  margin-top: 0;
}

.movie-wrap {
  position: relative;
  padding-bottom: 27.55%; /*アスペクト比 16:9の場合の縦幅*/
  height: 0;
  overflow: hidden;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 49%;
  flex: 0 0 49%;
}
.movie-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 412px) {
  #textWelcome {
    font-size: 150%;
  }
}

@media screen and (max-width: 414px) {
  .movie-wrap {
    padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
  }
  .flex-text {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
  }
  .flex-text p:first-child {
    margin-top: 1em;
  }
}

@media screen and (max-width: 459px) {
  .calendar:first-of-type {
    float: none;
    margin-right: 0;
    margin-bottom: 1em;
  }
}

@media screen and (max-width: 568px) {
  #slides {
    display: none;
  }
  #slides2 {
    display: block;
  }
  .slidesjs-navigation {
    margin-top: 7px;
  }
}