@charset "utf-8";

/* css Document
*****************************************************************/
@import "../../n_common/css/_variable.css";

.photo {
  padding-block-end: 6vw;
  font-feature-settings: "halt";
  @media (width < 480px) {
    padding-block-end: 40px;
  }
}

.txt_space {
  font-size: clamp(18px, 1.04cqw + 14.1px, 27px);
  text-align: center;
  word-break: keep-all;
  overflow-wrap: anywhere;
  line-height: 1.5em;
}


.pt60px {
  padding-top: 4.83cqw;/*60px相当*/
  @media (width < 480px) {
    padding-top: 30px;
  }
}

.mt60px {
  margin-top: 4.83cqw;/*60px相当*/
  @media (width < 480px) {
    margin-top: 30px;
  }
}

.slide {
  position: relative;
}

.thumbnail {
  position: relative;
  margin-top: 16px;
  @media (width < 480px) {
    margin-top: 8px;
  }
  .item {
    opacity: 0.4;
    transition: opacity .3s linear;
    margin-inline: 8px;
    cursor: pointer;
    @media (width < 480px) {
      margin-inline: 4px;
    }
    &:hover {
      opacity: 1;
    }
    &.slick-current {
      opacity: 1;
    }
  }
} 
.slick-dots{ 
  position: absolute;
  width: 100%;
  bottom: 0px;
  li {
    button:before { 
      font-size: 16px;
      color: #CCC;
      opacity: 1;
    }
    &.slick-active {
      button:before { 
        color: var(--main_c);
      }
    }
  }
}
.slick-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  z-index: 8000;
}

.slick-next,.slick-prev {
  &::before {
    font-size: 30px;
    color: #000;
  }
  &.slick-disabled {
    cursor: default;
    &::before {
      opacity: 1;
      color: #ededed;
    }
  }
}

.slick-next {

}

.slick-next {

}


.kome {
  text-indent: -1em;
  padding-left: 1em;
  text-align: left;
}