@charset "utf-8";

/* body.fixed {
  position: fixed;
  left: 0;
  overflow-y: scroll;
} */

.event .head .head__main .sp_only {
  display: none;
}

@media only screen and (max-width: 599px) {
  .event .head .head__main .sp_only {
    display: block;
  }
}

form#searchform {
  background-color: #fff;
  padding: 3rem 0 0;
  font-family: 'Noto Sans JP', YuGothic,"Yu Gothic","Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
}

form#searchform li {
  cursor: pointer;
  color: #484848;
}

.labelWrap {
  margin: 5rem auto;width: 90%;
  max-width: 1370px;
  margin: 0 auto;
  padding: 0 40px;
}

.labelWrap .add__labelWrap {
  background-color: #efefef;
  padding-bottom: calc(20px + 1.5rem);
}

.labelWrap .listPageBtn {
  text-align: center;
  display: block;
  width: 30%;
  padding: 1rem 0;
  margin: 0 auto;
  background-color: #fff;
  border: solid 1px #ca0000;
  color: #ca0000;
  border-radius: 2rem;
  cursor: pointer;
  transition: .5s;
}

.labelWrap .listPageBtn:hover {
  background-color: #ca0000;
  border: solid 1px #ca0000;
  color: #fff;
}

/* top */
.labelWrap__contents.top {
  padding: 20px 40px 0 40px;
  margin: 0 auto;
}

.labelWrap__contents__container__btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.btnTitle {
  width: calc(100%/2.02);
  text-align: center;
  padding: 1.5rem;
  background-color: #fff;
  border: solid 1px #9e9e9e;
  color: #484848;
  cursor: pointer;
  transition: .5s;
}

.btnTitle:hover {
  opacity: .6;
}

.btnTitle.on {
  background-color: #fff !important;
}

.labelWrap__contents__container {
  padding: 1.5rem;
}

.labelWrap__contents__container__inner {
  background-color: #fff;
  padding: 2rem;
  border: solid 1px #fff;
}

.labelWrap__contents__container__inner:first-of-type .area:last-of-type {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: solid 1px #c4c4c4;
}

.labelWrap__contents__container__inner .area {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

.labelWrap__contents__container__inner .area > p {
  width: 100%;
  padding: 1rem;
  text-align: center;
  font-weight: bold;
  color: #909090;
}

.labelWrap__contents__container__inner .area > p .multi {
  font-size: .8rem;
  font-weight: normal;
  display: block;
  margin-top: 5px;
}

.labelWrap__contents__container__inner .area li {
  width: calc(100%/4.124);
  text-align: center;
  border-radius: 5px;
  background-color: #fff;
  font-size: .9rem;
}

.labelWrap__contents__container__inner .area li label {
  padding: .5rem;
  display: block;
  cursor: pointer;
  min-height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #909090;
  line-height: 1.4;
}

.labelWrap__contents__container__inner .area li.check {
  background-color: #ca0000;
}

.labelWrap__contents__container__inner .area li.check label {
  color: #fff;
}

.labelWrap__contents__container__inner .area:first-of-type li {
  border: solid 1px #efefef;
  margin-bottom: 1%;
}

.labelWrap__contents__container__inner .area:last-of-type li {
  border: solid 1px #efefef;
  margin-bottom: 1%;
}

@media only screen and (min-width:1000px) {
  .labelWrap__contents__container__inner .area:first-of-type li:not(:nth-of-type(4n+1)) {
    margin-left: 1%;
  }
  .labelWrap__contents__container__inner .area:last-of-type li:not(:nth-of-type(4n+1)) {
    margin-left: 1%;
  }
}

input[type='submit'] {
  text-align: center;
  display: block;
  width: 40%;
  padding: 1.5rem 0;
  margin: 0 auto;
  background-color: #fff;
  border: solid 1px #ca0000;
  color: #ca0000;
  border-radius: 2rem;
  cursor: pointer;
  transition: .5s;
  font-family: 'Noto Sans JP', YuGothic,"Yu Gothic","Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;;
}

input[type='submit']:hover {
  background-color: #ca0000;
  border: solid 1px #ca0000;
  color: #fff;
}

/* bottom */
.labelWrap__contents.bottom {
  padding: 0 40px 20px 40px;
  margin: 0 auto;
}

.labelWrap__contents.bottom .labelWrap__contents__container {
  display: flex;
  justify-content: space-between;
  padding: 0 1.5rem;
}

.labelWrap__contents.bottom .labelWrap__contents__container li {
  width: calc(100%/4.12);
  text-align: center;
  background-color: #fff;
  border: solid 1px #9e9e9e;
  transition: .5s;
}

.labelWrap__contents.bottom .labelWrap__contents__container li:hover {
  opacity: .6;
}

.labelWrap__contents.bottom .labelWrap__contents__container li#js__calendarBtn {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: .5s;
}

.labelWrap__contents.bottom .labelWrap__contents__container li label {
  padding: 1rem 0;
  display: block;
  cursor: pointer;
}

.labelWrap__contents.bottom .labelWrap__contents__container li label button {
  color: #484848;
  font-family: 'Noto Sans JP', YuGothic,"Yu Gothic","Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
  cursor: pointer;
}

#comment {
  text-align: center;
}

@media only screen and (min-width:600px) and (max-width: 999px) {
  .btnTitle {
    width: calc(100%/2.03);
  }
  .labelWrap {
    width: 100%;
    padding: 0;
  }
  .labelWrap .add__labelWrap {
    padding-bottom: 20px;
  }
  .labelWrap .listPageBtn {
    width: 60%;
  }
  .labelWrap__contents.top {
    padding: 20px 0 0;
  }
  .labelWrap__contents.bottom {
    padding: 25px 0 20px;
  }
  .labelWrap__contents__container {
    padding: 0 10px;
  }
  .labelWrap__contents__container__inner .area li {
    width: calc(100%/3.062);
    margin-bottom: 1%;
  }
  .labelWrap__contents__container__inner .area:first-of-type li:not(:nth-of-type(3n+1)) {
    margin-left: 1%;
  }
  .labelWrap__contents__container__inner .area:last-of-type li:not(:nth-of-type(3n+1)) {
    margin-left: 1%;
  }
  .labelWrap__contents.bottom .labelWrap__contents__container {
    padding: 0 10px;
  }
  .labelWrap__contents.bottom .labelWrap__contents__container li {
    width: calc(100%/4.18);
  }
  input[type='submit'] {
    width: 60%;
  }
}

@media only screen and (max-width: 599px) {
  .btnTitle {
    width: calc(100%/2.06);
  }
  .labelWrap {
    width: 100%;
    padding: 0;
  }
  .labelWrap .add__labelWrap {
    padding-bottom: 20px;
  }
  .labelWrap .listPageBtn {
    width: 60%;
  }
  .labelWrap__contents.top {
    padding: 20px 0 0;
  }
  .labelWrap__contents.bottom {
    padding: 10px 0 15px;
  }
  .labelWrap__contents__container {
    padding: 0 10px;
  }
  .labelWrap__contents__container__inner {
    padding: 2rem 1rem;
  }
  .labelWrap__contents__container__inner .area li {
    width: calc(100%/2.021);
    margin-bottom: 1%;
  }
  .labelWrap__contents__container__inner .area li label {
    padding: .5rem;
    line-height: 1.4;
  }
  .labelWrap__contents__container__inner .area:first-of-type li:not(:nth-of-type(2n+1)) {
    margin-left: 1%;
  }
  .labelWrap__contents__container__inner .area:last-of-type li:not(:nth-of-type(2n+1)) {
    margin-left: 1%;
  }
  .labelWrap__contents.bottom .labelWrap__contents__container {
    flex-wrap: wrap;
    padding: 0 10px;
  }
  .labelWrap__contents.bottom .labelWrap__contents__container li:not(:nth-of-type(1)) {
    width: calc(100%/3.2);
  }
  .labelWrap__contents.bottom .labelWrap__contents__container li#js__calendarBtn {
    width: 100%;
    padding: 1rem 0;
    margin-bottom: 10px;
  }
  input[type='submit'] {
    width: 100%;
  }
}

/* js__animation style */
.js__panel {
  display: none;
}
.js__panel.show {
  display: block;
  border: solid 1px #9e9e9e;
  margin-top: 1.5rem;
}
@media only screen and (max-width:599px) {
  .js__panel.show {
    margin-top: 15px;
  }
}


/* calendar style */
#calendar_modal {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  background: rgba(0,0,0,.7);
  z-index: 101;
  visibility: hidden;
  opacity: 0;
  transition: .5s ease-in-out;
}

#calendar_modal.show {
  visibility: visible;
  opacity: 1;
}

#calendar_modal #js__bg {
  height: 100vh;
  width: 100%;
}

.closeBtn {
  position: absolute;
  width: 50px;
  height: 50px;
  border: solid 1px #fff;
  border-radius: 50%;
  top: 3%;
  right: 2%;
  transition: .5s;
  cursor: pointer;
}

.closeBtn:hover {
  background-color: #fff;
}

.closeBtn::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 70%;
  height: 5px;
  background-color: #ccc;
  transform-origin: center;
  transform: translate(-50%, -50%) rotate(45deg);
}

.closeBtn:hover::before {
  background-color: #ca0000;
}

.closeBtn::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 70%;
  height: 5px;
  background-color: #ccc;
  transform-origin: center;
  transform: translate(-50%, -50%) rotate(-45deg);
}

.closeBtn:hover::after {
  background-color: #ca0000;
}

.buttonWrap {
  position: absolute;
  left: 50%;
  bottom: 8.5vw;
  transform: translateX(-50%);
}

.buttonWrap #prev {
  margin-right: 2rem;
}

.buttonWrap #prev,
.buttonWrap #next {
  color: #fff;
  font-size: 1.5rem;
  transition: .5s;
  cursor: pointer;
}

.buttonWrap #prev:hover,
.buttonWrap #next:hover {
  opacity: .6;
}

#calendar_modal #calendars {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50%;
}

section .y_m {
  color: #fff;
  font-size: 1.5rem;
}

h1 {
  font-size: 18px;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
  background-color: #fff;
}

tr:first-of-type td {
  border: 1px solid #dfdfdf;
  background: #efefef;
  padding: 20px 10px;
}

tr:first-of-type td:first-of-type {
  color:#ca0000;
}

tr:first-of-type td:last-of-type {
  color: #0025ca;
}

td {
  border: 1px solid #efefef;
  text-align: center;
}

td button[type="submit"] {
  width: 100%;
  padding: 30px 0;
  cursor: pointer;
  transition: .5s;
  color: #000;
}

td button[type="submit"]:hover {
  color: #ca0000;
}

td.is-disabled,
td.old {
  color: #ccc;
  padding: 30px 0;
}

td.today {
  position: relative;
  transition: .5s;
}

td.today button[type="submit"]:hover {
  color: #fff;
}

td.today::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 3vmax;
  height: 3vmax;
  background-color: #ca0000;
  border-radius: 50%;
  transition: .5s;
}

td.today:hover::before {
  transform: translate(-50%, -50%) scale(1.1);
}

td.today button {
  position: relative;
  color: #fff;
}

@media only screen and (min-width:600px) and (max-width: 999px) {
  #calendar_modal #calendars {
    width: 90%;
  }
  .buttonWrap {
    bottom: 12.5vmax;
  }
  td.today::before {
    width: 5vmax;
    height: 5vmax;
  }
}

@media only screen and (max-width: 599px) {
  #calendar_modal #calendars {
    width: 90%;
  }
  .buttonWrap {
    bottom: 10%;
  }
  td.today::before {
    width: 4vmax;
    height: 4vmax;
  }
  .buttonWrap #prev,
  .buttonWrap #next {
    font-size: 1.2rem;
  }
  .closeBtn {
    right: 4%;
  }
}

#selectName {
  display: block;
  width: 90%;
  margin: 0 auto 1.5rem;
  color: #b7b2b2;
  line-height: 1.5;
}

.bg-gray {
  background-color: #fff !important;
}

@media only screen and (min-width: 750px) and (max-width: 999px) {
  .latestevent .article__item:nth-child(n+4) {
    display: block !important;
  }
}