@charset "UTF-8";
@media screen and (min-width: 1080px) {
  #bottomLink ul li.spOnly {
    display: none;
  }

  main .tabContent.active {
    padding: 5.73vw 0 0;
  }

  /* popup */
  .popup {
    top: 0;
    bottom: 0;
    right: 0;
    bottom: 0;

    margin: auto;
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.1);
  }

  .popup.active {
    justify-content: center;
  }

  .popupInnner {
    position: relative;
    /* height: 71.79vw; */
    height: auto;
    width: 26.51vw;
  }

  .popup div {
    padding: 0;
    display: flex;
    flex-flow: column;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0 auto;
  }

  .popup>div.popupInnnerWrap {
    padding: 0;
    margin: 0;
  }

  .popupInnner>div {
    padding: 1.61vw 2.6vw;
    position: relative;
  }


  .popup img {
    width: 100%;
  }

  #mapWrap .popup img {
    margin-bottom: 10vw;
  }

  .popup .popupTtl {
    padding: 0 0 1.93vw;
    font-size: 1.41vw;
    line-height: 1.82vw;
  }

  .popup .popupTtl.new {
    background-size: 2.92vw 3.23vw;
    background-position-x: 0;
    padding-left: 4vw;
    line-height: 3vw;
  }

  .popup p {
    font-size: 0.89vw;
    line-height: 1.3vw;
  }

  .popupCuption span {
    font-size: 0.73vw;
    line-height: 1.3vw;
    padding-top: 1vw;
    padding-left: 1vw;
    text-indent: -1vw;
  }

  .popupCuption span:not(:first-child) {
    padding-top: 0;
    padding-left: 2vw;
  }

  .popup div.popupBtn {
    margin-top: 5vw;
    margin: 0;
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
    height: 3.73vw;
  }

  .popup div.popupBtn a {
    padding: 0;
    width: 50%;
    height: auto;
    font-size: 1.04vw;
  }

  .popup i.closeTabId {
    top: -13.15vw;
    background-color: transparent;
    right: 1vw;
    left: auto;
    width: 1.2vw;
    height: 1.2vw;
  }

  .close {
    width: 1.2vw;
    height: 1.2vw;
    right: 2vw;
    top: 0vw;
  }

  .close i,
  .close b {
    width: 100%;
    height: 2px;
  }

  .close i {
    right: auto;
    top: calc(50% - 1px);
    left: 0;
    bottom: auto;
  }

  .close b {
    top: calc(50% - 1px);
    left: 0;
    right: auto;
    bottom: auto;
  }

  #popupWrap>div.popup.active {
    flex-flow: row;
    justify-content: center;
  }

  /* 個人種目レベル別 */
  /* #individualEventsByLevel {
    display: grid;
    grid-template-columns: 36.72vw 1fr;
    align-items: start;
  }

  #individualEventsByLevel > h3,
  #individualEventsByLevel > p.dot {
    grid-column: 2;
  } */

  #sideMenu {
    position: sticky;
    top: 10vw;
    left: 21.35vw;
    /* grid-column: 1;
    grid-row: 1 / span 100;
    align-self: start; */
    height: 23.65vw;
    padding-left: 0;
    box-sizing: border-box;
  }

  #sideMenu li {
    height: 7.86vw;
    width: 5.42vw;
    left: 0;
  }

  #sideMenu li a {
    height: 7.86vw;
    width: 5.42vw;
    padding: 2vw 0;
  }

  #sideMenu li:nth-of-type(1) {
    border-top-left-radius: 9999px;
    border-top-right-radius: 9999px;
  }

  #sideMenu li:nth-of-type(3) {
    border-bottom-left-radius: 9999px;
    border-bottom-right-radius: 9999px;
  }


  #sideMenu li img {
    width: 0.96vw;
    height: 0.96vw;
  }

  #sideMenu li a span {
    writing-mode: initial;
    font-size: 1.25vw;
  }

  main {
    background-image: url(/2026/top/assets/img/raceIntroduction/mainBg.webp);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
  }

  main h2 {
    font-size: 2.6vw;
    padding: 4.95vw 0 0;
    color: #fff;
  }

  main .tab {
    padding: 0;
    margin: auto;
    margin-top: 4.05vw;
    width: 57.29vw;
    justify-content: space-between;
    background-color: transparent;
  }

  main .tab li {
    height: 6.25vw;
    width: 13.54vw;
    font-size: 1.56vw;
    line-height: 1.98vw;
    padding: 0;
    border-left: none;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    flex: initial;
    background-color: #9D9D9D;
  }
  main .tab li + li::before {
    display: none;
  }

  main .tab li:first-of-type,
  main .tab li:nth-of-type(2),
  main .tab li:nth-of-type(3),
  main .tab li:last-of-type {
    padding: 0;
  }

  .subttl {
    padding: 0 0;
    font-size: 1.56vw;
    width: 26.22vw;
    height: 4.76vw;
    margin: 0 auto 2.56vw;
  }

  .ttl {
    font-size: 1.67vw;
    line-height: 2.14vw;
    padding: 0 0 0.92vw;
  }

  .ttl span {
    font-size: 1.04vw;
    padding: 0vw 0 0 2.2vw;
  }

  .ttl::before {
    font-size: 1.69vw;
    padding-right: .2vw;
  }

  .ttl.ttlindent {
    text-indent: -2vw;
    padding-left: 2vw;
  }

  #individualEventsByLevel>div {
    margin-left: 36.82vw;
    margin-bottom: 5.99vw;
    width: 26.33vw;
    grid-column: 2;
  }

  #individualEventsByLevel>div#advanced .left {
    width: auto;
  }

  #individualEventsByLevel>div .left {
    width: 14.41vw;
  }

  #individualEventsByLevel>div .right {
    width: 9.83vw;
  }

  #individualEventsByLevel>div:first-of-type .left {
    width: 10.09vw;
    margin-left: 0;
  }

  #individualEventsByLevel>div:first-of-type .right {
    width: 13.75vw;
  }

  #individualEventsByLevel>div:first-of-type .dataTop .big {
    font-size: 5.2vw;
  }

  #individualEventsByLevel>div:first-of-type .dataTop {
    margin: 0 0 .8vw;
  }

  #popupWrap>div.popup {
    width: 100vw;
    height: 100%;
  }

  .popup div.balloon {
    width: auto;
    padding: 0;
    top: 0vw;
    left: 0;
  }

  .popup div.balloonInnner {
    height: 16.42vw;
    width: 21.31vw;
    margin: auto;
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35);
    padding: 0 2.08vw;
    margin: 0 0 3vw;
    background-image: url(/2026/top/assets/img/raceIntroduction/balloonBg.webp);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 2.14vw 1.09vw;
  }

  .popup div.balloonInnner::before {
    bottom: 0;
    left: 50%;
    border-width: 1px 10px 0 10px;
    translate: -50% 100%;
  }

  .popup div.balloonInnner::after {
    left: 50%;
    border-width: 1.25vw 1vw 0 1vw;
    translate: -50% 100%;
    bottom: 3vw;

  }

  .popup div.balloon i.closeTabId {
    top: 20.85vw;
    left: 21vw;
    right: auto;
  }

  .popup div.balloon i.closeTabId i {
    left: 0;
    top: calc(50% - 1px);
    right: auto;
    bottom: auto;
    transform: rotate(45deg);
  }

  .popup div.balloon i.closeTabId b {
    left: 0;
    top: calc(50% - 1px);
    right: auto;
    bottom: auto;
    transform: rotate(-45deg);
  }

  .balloon p:first-of-type {
    font-size: 1.41vw;
    line-height: 1.82vw;
    padding: 0.55vw 0 0.72vw;
  }

  #individualEventsByLevel h3,
  #teamsEventsByLevel h3,
  #byAge h3,
  #SportsWithAwideRangeOfCompetitiveLevels h3 {
    font-size: 2.6vw;
  }

  #individualEventsByLevel h3 {
    margin-top: -23vw;
  }

  #individualEventsByLevel p.dot,
  #teamsEventsByLevel p.dot,
  #byAge p.dot,
  #SportsWithAwideRangeOfCompetitiveLevels p.dot {
    padding: 4.26vw 0 4.26vw;
    font-size: 3vw;
  }

  .tabContent a.detailBtn {
    width: 26.22vw;
    height: 4.76vw;
    margin: 1.56vw 0 0;
    font-size: 1.41vw;
  }

  .tabContent a.detailBtn img {
    width: 0.39vw;
    margin-right: .5vw;
  }

  .dataTop {
            text-align-last: justify;
    border-bottom: 1px solid #000;
    padding-bottom: 1.25vw;
    margin-bottom: .5vw;
  }

  .dataTop .big {
    font-size: 6.2vw;
  }
  .dataTop .big.fullWide {
    letter-spacing: 0;
  }
  .dataTop .big.halfWide {
    letter-spacing: .2vw;
    padding-left: .5vw;
  }

  .dataTop .unit {
    font-size: 3.4vw;
  }

  .dataTop .sub {
    right: 0;
    top: 1vw;
    font-size: 2.14vw;

  }

  #individualEventsByLevel .dataTop .sub {
    top: 0;
  }
  #individualEventsByLevel .dataTop .sub.digits {
    padding-right: 1vw;;
  }

  .dataTop .sub span {
    font-size: 1.09vw;
  }

  .AverageTime:first-child {
    text-align: left;
  }

  .AverageTime p {
    font-size: 1.04vw;
    line-height: 1.2vw;
    padding-bottom: 0
  }

  .AverageTime .big {
    font-size: 3.2vw;
    margin-left: .5vw;
  }

  .AverageTime .unit {
    font-size: 1.41vw;
  }

  .AverageTime.left .big {
    padding-left: 1vw;
  }

  #individualEventsByLevel>div.colorBar {
    right: 21.35vw;
    top: 17.92vw;
    width: 0.78vw;
    height: 170.4vw;
    margin: 0;
  }

  .colorBar .yellow {
    height: 57.18vw;
    border-top-left-radius: 9999px;
    border-top-right-radius: 9999px;
  }

  .colorBar .brown {
    height: 229.74vw;
  }

  .colorBar .blue {
    height: 119.16vw;
    border-bottom-left-radius: 9999px;
    border-bottom-right-radius: 9999px;
  }

  /* チーム種目レベル別 */
  #teamsEventsByLevel {
    width: 57.29vw;
    margin: 0 auto;
  }

  #teamsEventsByLevel .detailBtn {
    margin: 2.08vw auto 5.98vw;
  }

  #teamsEventsByLevel .detail {
    padding: 1.56vw 0 0;
    font-size: 1.25vw;
    line-height: 1.82vw;
  }

  #teamsEventsByLevel .detail:not(:first-of-type) {
    font-size: 1.04vw;
    line-height: 1.56vw;
  }

  #teamsEventsByLevel .detail:first-of-type {
    padding: 1.72vw 0 0;
    font-size: 1.25vw;
    line-height: 1.82vw;
  }

  #teamsEventsByLevel .aqua .data>div:last-of-type {
    margin-top: 0;
  }

  .note {
    font-size: 1.04vw;
    line-height: 1.56vw;
  }

  #teamsMenu {
    margin-bottom: 3.4vw;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #teamsEventsByLevel .aqua .data {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 2.34vw;
  }

  #teamsMenu li {
    width: 18.44vw;
    height: 5.42vw;
    margin: 0 0 3.85vw;
    border-radius: 10px;
  }

  #teamsMenu li a {
    width: 18.44vw;
    padding: 0 1.09vw;
    font-size: 1.19vw;
    line-height: 1.67vw;
    border-radius: 10px;
  }

  #timeTrialBox {
    margin: 1vw 0;
    width: 100%;
    justify-content: center;
  }

  #timeTrialBox div {
    width: 25%;
  }

  #timeTrialBox .sub {
    right: .5vw;
  }

  #timeTrialBox div p {
    font-size: 1.3vw;
    line-height: 1.46vw;
  }

  #timeTrialBox .sub {
    right: 1vw;
    top: 2vw;
    font-size: 1.88vw;
  }

  #timeTrialBox .sub span {
    font-size: 1.09vw;
  }

  #stageSuzukaData {
    margin: 0 0 2.3vw;
    padding: 0 11.73vw;

  }

  #stage3 {
    width: 26.78vw;
    margin: auto;
  }

  #stageSuzukaData .left {
    font-size: 1.15vw;
    width: 32.74vw;
  }

  #stageSuzukaData .left .big {
    font-size: 2.37vw;
    line-height: 3vw;

  }


  #stageSuzukaData .right .big {
    font-size: 7.35vw;

  }

  #stageSuzukaData .right .sub {
    right: 0;
    top: 2vw;
    font-size: 1.46vw;
  }

  #stageSuzukaData .right .unit {
    font-size: 3.44vw;
  }


  #stage3 div {
    padding: 0 1.3vw;
    font-size: 1.15vw;
    line-height: 1.82vw;
  }


  #stage3 .big {
    font-size: 3.14vw;

  }

  #stage3 .unit {
    font-size: 1.72vw;

  }

  #stage3 div span:first-child {
    padding-bottom: 1vw;
  }

  .colorBar div:first-of-type {
    border-top-left-radius: 9999px;
    border-top-right-radius: 9999px;
  }

  .colorBar div:last-of-type {
    border-bottom-left-radius: 9999px;
    border-bottom-right-radius: 9999px;
  }

  #teamsEventsByLevel>div.colorBar {
    top: 29.58vw;
    height: 125.1vw;
    width: 0.78vw;

  }

  #teamsEventsByLevel .colorBar .aqua {
    height: 41.46vw;
  }

  #teamsEventsByLevel .colorBar .yellow {
    height: 41.82vw;
  }

  #teamsEventsByLevel .colorBar .blue {
    height: 41.88vw;
  }

  /* 年齢別 */
  #byAge {
    padding: 0;
    width: 57.29vw;
    margin: 0 auto;
  }

  #buAgeinner {
    padding: 5.73vw 0 0;
    border-radius: 10px;
  }

  #buAgeinner>div {
    width: 52.08vw;
  }

  #byAgemenu,
  #SportsWithAwideRangeOfCompetitiveLevelsMenu {
    justify-content: start;
    gap: 0 0.68vw;
  }

  #byAgemenu {
    margin: 0 0 8.19vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevelsMenu {
    margin: 0 0 4.19vw;

  }

  #byAgemenu li a,
  #SportsWithAwideRangeOfCompetitiveLevelsMenu li a {
    height: 5.42vw;
    margin: 0 0 3.85vw;
    border-radius: 10px;
    font-size: 1.18vw;
    line-height: 1.67vw;
    padding: 0 1.2vw;

  }

  #byAgemenu li a {
    width: 13.8vw;
    margin-bottom: 0;
  }

  #SportsWithAwideRangeOfCompetitiveLevelsMenu li a {
    width: 10.89vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevelsMenu li:last-child,
  #SportsWithAwideRangeOfCompetitiveLevelsMenu li:last-child a {
    width: 10.89vw;
  }

  #byAgemenu li a span,
  #SportsWithAwideRangeOfCompetitiveLevelsMenu li a span {
    font-size: 1.04vw;
  }

  #byAgemenu li a img,
  #SportsWithAwideRangeOfCompetitiveLevelsMenu li a img,
  #teamsMenu li a img {
    width: 0.56vw;
    margin-left: 2vw;
  }

  #teamsMenu li a img {
    width: 1vw;
  }

  .age {
    font-size: 2.55vw;
    line-height: 3.2vw;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
  }

  .age span {
    display: block;
    font-size: 1.8vw;
    line-height: 2.2vw;
    width: 100%;
    text-align: center;
  }

  .age.new {
    background-size: 5.63vw 6.3vw;
    background-position-x: 1.8vw;
    padding-left: 6.6vw;
  }

  .attention {
    font-size: 1.04vw;
    padding: 0 0 2.13vw;
  }

  #byAge .details {
    font-size: 1.25vw;
    line-height: 1.82vw;
    padding: 1.1vw 0;
  }

  #byAge .detailBtn {
    width: 15.63vw;
    margin: 0 auto 6.38vw;
  }

  #elementary,
  #under19 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #under19 {
    justify-content: center;
    gap: 0 5.21vw;
    padding-right: 2vw;
  }

  #elementary>div,
  #seniorHight div,
  #under19>div,
  #over30>div {
    width: 15.63vw;
    margin: auto;
    justify-content: center;
  }

  #under19>div {
    width: 15.63vw;
    margin: 0;
  }

  #byAge>div.colorBar {
    top: 29.58vw;
    height: 108.23vw;
    width: 0.78vw;
  }

  #byAge .colorBar .aqua {
    height: 22.92vw;
  }

  #byAge .colorBar .green {
    height: 24.53vw;
  }

  #byAge .colorBar .yellow {
    height: 27.97vw;
  }

  #byAge .colorBar .blue {
    height: 32.76vw;
  }

  /* 競技レベルが幅広い種目 */
  #SportsWithAwideRangeOfCompetitiveLevels {
    padding: 5.73vw 0 0;
    width: 57.29vw;
    margin: 0 auto;
  }

  .data .big {
    font-size: 5.71vw;
    padding-right: .75vw;
  }

  .data .unit {
    font-size: 2.45vw;
  }
  .data .unit.wide {
    margin-left: -.75vw;
  }

  .data .middle {
    font-size: 3.95vw;
    padding-left: 1.2vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevels .detailBtn {
    width: 15.63vw;
    margin: 1.67vw 0 0;
    margin-bottom: 6.09vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevels .detail {
    font-size: 1.25vw;
    line-height: 1.82vw;
    width: auto;
  }

  #ninetyMinutes {
    background-image: url(/2026/top/assets/img/raceIntroduction/newBubble.webp);
    background-repeat: no-repeat;
    background-size: 4.9vw auto;
    background-position: left top;
  }

  #ninetyMinutes .ttl {
    font-size: 1.6vw;
    line-height: 3.14vw;
    padding: 1vw 0 0 6vw;
    margin-bottom: 1vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevelsInner {
    width: 25.16vw;
    margin: 0 0 0 15.3vw;
    padding: 0 0 0 3.2vw;
    border-left: .3vw solid;
    border-image: linear-gradient(to bottom, transparent 0%, #a8a8a1 0% 86%, transparent 86%);
    border-image-slice: 2;
  }
  #SportsWithAwideRangeOfCompetitiveLevelsInner .ttl {
    font-size: 1.5vw;
  }
  #halfAnHour{
    padding-top: 0;
  }
  #halfAnHour .detailBtn{
    margin-bottom: 7.25vw;
  }
  #oneHour{
    padding-top: 0;
  }
  #oneHour .detailBtn{
    margin-bottom: 8.5vw;
  }
  #ninetyMinutes{
    padding-top: 0;
  }
  #ninetyMinutes .detailBtn{
    margin-bottom: 12vw;
  }
  #twoHours{
    padding-top: 0;
  }
  #twoHours .detailBtn{
    margin-bottom: 8.75vw;
  }
  #timeTrial{
    padding-top: 0;
    width: 24vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevels .note {
    font-size: 1.04vw;
    line-height: 1.56vw;
    padding: 1.7vw 0;
  }


  #SportsWithAwideRangeOfCompetitiveLevelsInner::before {

    background-position: left 0vw top, left top 20.01%, left top 41.75%, left top 65.3%, left top 86.3%;
    background-size: 2.55vw auto;
    margin-left: -4.6vw;
    pointer-events: none;
  }

  #SportsWithAwideRangeOfCompetitiveLevels>div.colorBar {
    top: 29.48vw;
    height: 151.88vw;
    width: 0.78vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevels .colorBar .aqua {
    height: 30vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevels .colorBar .green {
    height: 30.31vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevels .colorBar .yellow {
    height: 31.46vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevels .colorBar .brown {
    height: 29.95vw;
  }

  #SportsWithAwideRangeOfCompetitiveLevels .colorBar .blue {
    height: 30.16vw;
  }
  
  #SportsWithAwideRangeOfCompetitiveLevelsInner .detailBtn img{
    width: .55vw;
  }
}