/* デザイン画面のみの要素 */
.con_season [data-collection-list-content] {
  display: contents;
}

.con_season {
  background-image: url('https://www.la-shoro.jp/files/images/common/bg2.png');
  background-repeat: repeat;
  margin: 8.02083% auto 0;
  padding: 4%;
  width: 90%;
}

.con_season h3 {
  text-align: left;
}

.con_season h3 span {
  writing-mode: horizontal-tb;
}

.up-d-season-list {
  margin: 40px auto 0;
  display: flex;
  gap: 24px;
  justify-content: center;
}

.up-d-item {
  flex: 1;
  max-width: calc(50% - 12px);
}

.up-d-link {
  display: block;
  text-decoration: none;
  color: inherit;
  transition: opacity 0.3s ease;
}

.up-d-link:hover {
  opacity: 0.8;
  color: #313131;
}

.up-d-thumb {
  width: 100%;
  overflow: hidden;
}

.up-d-thumb img {
  width: 100%;
  height: auto;
  object-fit: contain;
  transition: transform 0.4s ease;
}

.up-d-link:hover .up-d-thumb img {
  transform: scale(1.05);
}

.up-d-body {
  position: relative;
  letter-spacing: .05em;
  text-shadow: 0 0 1px rgba(49, 49, 49, 0.5);
  padding: 1.5em 0 0;
  text-align: left;
  font-size: 115%;
}

.up-d-date {
  display: block;
  letter-spacing: 0.08em;
  font-family: 'Crimson Text', serif;
}

.up-d-title {
  margin: 5px 0 0;
  letter-spacing: 0.05em;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "MS Ｐゴシック", "MS PGothic", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, sans-serif;
}

/* 初期状態 */
.up-d-season-list .up-d-item {
  opacity: 0;
  transform: translateY(2em);
}

/* scrActive時 */
.scrItem.scrActive .up-d-season-list .up-d-item:nth-child(1) {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 1200ms ease 250ms, transform 1200ms ease 250ms;
}

.scrItem.scrActive .up-d-season-list .up-d-item:nth-child(2) {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 1200ms ease 500ms, transform 1200ms ease 500ms;
}

/* SP対応 */
@media screen and (max-width: 767px) {
  .con_season {
    width: 100%;
    padding: 15% 8%;
    margin:0;
  }

  .up-d-season-list {
    flex-direction: column;
    width: 100%;
    padding: 0;
    gap: 20px;
  }

  .up-d-item {
    max-width: 100%;
  }
  
  .con_season .up-d-body {
        font-size: 100%;
    }
}