@charset "UTF-8";
@media screen and (min-width: 1080px) {

  /* ページタイトル */
  #theDayTitle {
    text-align: center;
    font-size: 4.17vw;
    color: #02797a;
    font-family: 'Zen Maru Gothic', 'Noto Sans', sans-serif;
    font-weight: 700;
    margin: 0 0 7.17vw;
    padding: 0;
  }

  /* コンテンツ全体 */
  #theDayInfoWrap {
    padding: 6.4vw 5.21vw 7.81vw;
  }

  /* ボタングリッド */
  #btnArea {
    display: flex;
    flex-direction: column;
    gap: 3.1vw;
  }

  /* 各行：PC では横並び */
  .btnRow {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 1.56vw;
    margin-bottom: 0;
  }

  /* ボタン共通 */
  .theDayBtn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 3vw 0 1.3vw;
    height: 4.27vw;
    border-radius: 2.14vw;
    font-size: 1.2vw;
    font-weight: 600;
    text-decoration: none;
    gap: 1.04vw;
    white-space: nowrap;
    min-width: 12vw;
    width: auto;
    box-sizing: border-box;
  }

  /* 塗りつぶしボタン */
  .theDayBtn.filled {
    background: #007c79;
    color: #fff;
  }

  /* 枠線ボタン */
  .theDayBtn.outlined {
    background: #fff;
    border: 3px solid #007c79;
    color: #007c79;
  }

  /* 矢印アイコン（::after で表示） */
  .theDayBtn::after,
  .theDayBtn.outlined:hover:after,
  .theDayBtn.outlined:active:after {
    content: '';
    display: block;
    flex-shrink: 0;
    width: 1.43vw;
    height: 1.26vw;
    margin: 0 -1.7vw 0 .7vw;
  }
  .theDayBtn.filled::after {
    background-image: url('/2026/top/assets/img/theDayInfo/arrowPcWhite.svg');
  }

  .theDayBtn.outlined::after,
  .theDayBtn.filled:hover:after,
  .theDayBtn.filled:active:after {
    background-image: url('/2026/top/assets/img/theDayInfo/arrowPc.svg');
  }

  /* エントリーリスト・リザルト：＋アイコン（矢印なし） */
  .theDayBtn.plus::after {
    display: none;
  }

  .plusIcon {
    width: 1.09vw;
    height: 1.09vw;
    flex-shrink: 0;
    position: relative;
    display: block;
  }

  .plusIcon::before,
  .plusIcon::after {
    content: '';
    position: absolute;
    background: #007c79;
    border-radius: 1px;
  }

  .plusIcon::before {
    width: 100%;
    height: 2px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }

  .plusIcon::after {
    width: 2px;
    height: 100%;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
  }

}