/* Scss Document */
/* Scss Document */
.contents {
  width: 1300px;
  margin: 150px auto 0;
  padding: 0; }

@media (max-width: 1400px) {
  .contents {
    width: calc(100% - 80px);
    margin: 100px 40px 0; } }
@media (max-width: 700px) {
  .contents {
    width: calc(100% - 40px);
    margin: 60px 20px 0; } }
.cntsSelect {
  margin: 0;
  padding: 0;
  list-style: none;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center; }
  .cntsSelect__item {
    width: 300px;
    height: 80px;
    margin: 0 20px 0 0;
    color: #AAA;
    font-size: 1.25rem;
    font-family: "Zen Maru Gothic", sans-serif;
    line-height: 1.0;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: #F3F3F3;
    border: 4px solid #DDD;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    transition: 0.1s linear; }
    .cntsSelect__item:hover {
      cursor: pointer;
      border: 4px solid transparent;
      background: linear-gradient(white, white) padding-box, linear-gradient(to right, #f6b3d2, #f6ebba) border-box; }
    .cntsSelect__item:last-of-type {
      margin: 0; }
    .cntsSelect__item span {
      margin: 10px 0 0;
      font-size: 1rem; }
    .cntsSelect__item.active {
      color: #444;
      border: 4px solid transparent;
      background: linear-gradient(white, white) padding-box, linear-gradient(to right, #f6b3d2, #f6ebba) border-box; }

@media (max-width: 600px) {
  .cntsSelect {
    flex-direction: column;
    align-items: center; }
    .cntsSelect__item {
      margin: 0; }
      .cntsSelect__item:not(:first-of-type) {
        margin: 20px 0 0; } }
.cntsWrap {
  width: 600px;
  overflow: hidden;
  margin: 70px auto 0;
  padding: 0 60px;
  position: relative; }
  .cntsWrap__sat {
    margin: 10px 0 0;
    font-size: 1.125rem; }

@media (max-width: 780px) {
  .cntsWrap {
    width: 100%;
    margin: 70px 0 0;
    padding: 0 40px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; } }
.content {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 50px 0;
  background-color: #def3f5;
  position: relative;
  left: 100%;
  display: none;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  border-radius: 40px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
  .content.active {
    left: 0;
    display: block; }
  .content__list {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative; }
    .content__list::after {
      content: '';
      width: 4px;
      height: 100%;
      position: absolute;
      top: 0;
      left: -2px;
      z-index: 1;
      background-color: #75c497; }
  .content__item {
    margin: 0 0 40px;
    padding: 0;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    position: relative;
    z-index: 2; }
    .content__item:last-of-type {
      margin: 0; }
    .content__item.extra {
      padding: 0 0 40px;
      border-bottom: 1px dashed #444; }
    .content__item--time {
      width: 120px;
      height: 40px;
      margin: 0 0 0 -60px;
      color: #FFF;
      font-size: 1.125rem;
      line-height: 1.0;
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: -o-flex;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: #75c497;
      -webkit-border-radius: 20px;
      -moz-border-radius: 20px;
      border-radius: 20px; }

@media (max-width: 780px) {
  .content__item--time {
    width: 80px;
    height: 30px;
    margin: 0 0 0 -40px;
    font-size: 1rem; } }
.schedule {
  width: calc(100% - 120px - 30px);
  margin: 0 0 0 30px;
  padding: 5px 0 0;
  list-style: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
  .schedule__item {
    margin: 0 0 15px;
    padding: 0;
    font-size: 1.125rem;
    line-height: 1.5; }
    .schedule__item:last-of-type {
      margin: 0; }
    .schedule__item--photo {
      margin: 0;
      padding: 0;
      list-style: none;
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: -o-flex;
      display: flex;
      -webkit-flex-wrap: wrap;
      -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
      -o-flex-wrap: wrap;
      flex-wrap: wrap; }
      .schedule__item--photo li {
        width: 200px;
        margin: 20px 20px 0 0;
        position: relative; }
        .schedule__item--photo li::before {
          content: '';
          display: block;
          padding-top: 75%; }
        .schedule__item--photo li span {
          display: block;
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0; }
          .schedule__item--photo li span img {
            width: 100%;
            height: 100%;
            object-fit: cover; }
        .schedule__item--photo li span {
          -webkit-border-radius: 20px;
          -moz-border-radius: 20px;
          border-radius: 20px;
          overflow: hidden; }

@media (max-width: 780px) {
  .schedule {
    width: calc(100% - 80px - 30px); }
    .schedule__item--photo li {
      width: calc((100% - 20px)/2);
      margin: 20px 10px 0 0; } }
@media (max-width: 500px) {
  .schedule__item--photo {
    flex-direction: column; }
    .schedule__item--photo li {
      width: 100%;
      margin: 20px 0 0; } }
