@charset "UTF-8";


:root {
    /* グローバルのCSS Variablesを上書きする場合にはここに記述 */
    /* --font-family-headline:  "Shippori Mincho",serif;
    --font-family-main:  "Shippori Mincho",serif; */
    --font-family-headline:  "Noto Sans JP", sans-serif;
    --font-family-main:  "Noto Sans JP", sans-serif;
    --tyt-red: #e60000;
}

body {
  animation-name:loading;
  animation-duration:1s;
  animation-fill-mode:forwards;
  animation-delay:0.4s;
  opacity:0;
}

@keyframes loading {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

header{
    margin-bottom:0 !important;
}


.mainmenu, .mainmenu li {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    outline: none;
    border: 0;
    list-style: none;
    vertical-align: baseline;
    text-decoration: none;
    font: inherit;
    -webkit-tap-highlight-color: transparent;
}

.mainmenu{
    background-color: var(--tyt-red);
    color: #fff;
    display: flex;
    justify-content: center;
    height:38px;
    padding-top:5px;
    position: sticky;
    top:0;
    left:0;
    z-index: 100;
}

.mainmenu li{
    display: block;
    font-size:17px;
    padding-top: 5px;
    padding-left:30px;
    padding-right:30px;
    height:28px;
    border-right:solid 1px #fff;
    line-height: 1em;
    text-align: center;
}

.mainmenu li:hover{
    color:rgba(255,255,255,0.8);
}

/*
.mainmenu li:nth-of-type(2){
    letter-spacing: -0.1em;
}

.mainmenu li:nth-of-type(3){
    letter-spacing: -0.1em;
}

.mainmenu li:nth-of-type(5){
    letter-spacing: -0.04em;
}
*/

.hero{
    position: relative;
}

.hero  .swiper-slide img{
    aspect-ratio: 2 / 1;
    object-fit: cover;
}

.catchcopy{
    width:780px;
    position: absolute;
    left:50%;
    top:60%;
    transform: translate(-50%,-50%);
}

.catchcopy img{
    max-width: 100%;
    height:auto;
}

.lead{
    margin-top:5rem !important;
}

h2{
    position: relative;
}

h2::before,h2::after{
    content:"";
    width:100%;
    height:4px;
    position:absolute;
    left:0;
    background: linear-gradient(
        to right, 
    #da3b36 25%,
    #48a364 25%,
    #48a364 50%,
    #f8e246 50%,
    #f8e246 75%,
    #3369b2 75%
    );
}

h2::before{
    top:0;
}

h2::after{
    bottom:0;
}

.h2.h2--m{
    font-weight: 700;
    color: var(--tyt-red);
    padding:21px 0 25px 0;
}

.h2_main{
    letter-spacing: 0.05em;
}

.h2_sub{
    /*font-size:26px !important;*/
    font-size:1.625rem !important;
    line-height: 1em;
    display: block;
    margin-bottom:10px;
}

.h3{
    font-weight: 700;
    color: var(--tyt-red);
    text-decoration-color: var(--tyt-red);
    text-decoration-line: underline;
    /*text-decoration-thickness:2px;
    text-underline-offset: 10px;*/
    text-decoration-thickness: 0.125rem;
    text-underline-offset: 0.625rem;    
}

p{
    line-height: 1.875em;
}


.player_photo_block{
    /*margin-top:8px;*/
    margin-top:0.5rem;
}

.player_heading{
    text-align: center;
    margin-top:100px;
    margin-bottom:40px;
}

.player_heading .player_name{
    font-size:32px;
    font-weight:700;
    position:relative;
}

.player_heading .player_name_kana{
    font-size:16px;
    margin-left:0.2em;
    font-weight:400;
}

.player_heading_sheading{
    font-size:24px;
    font-weight:700;
}

/*
.player_name{
    font-size:24px;
    padding-left:11px;
    font-weight:700;
    position:relative;
    line-height: 1.5em;
    border-left:solid 5px var(--tyt-red);
}

.player_name_kana{
    font-size:15px;
    margin-left:-0.2em;
    font-weight:400;
}
*/

.competition{
    font-size:24px;
}

.player_profile{
    font-size:14px;
    line-height: 1.75em;
}

.continued_text{
    margin-top:1em !important;
}

.other_schedule{
    margin-top:1em;
    text-align: right;
    font-size:80%;
}

.other_schedule a:link{
    text-decoration: underline;

}

.btn_style{
    background-color: var(--tyt-red) !important;
    line-height:1.5em !important;
    font-weight: 500;
    letter-spacing: -0.04em;
}

.banner_style{
    background-color: var(--tyt-red) !important;
    font-weight: 500;
}

.logo_bottom{
    /*width:260px;*/
    width:16.25rem;
    text-align: center;
    line-height:0;
    margin-left:auto;
    margin-right:auto;
    /*margin-top:200px;
    margin-bottom:60px;*/
    margin-top:12.5rem;
    margin-bottom:3.75rem;
}

.logo_bottom img{
    max-width: 100%;
    height: auto;
}

@media only screen and (min-device-width: 320px) and (max-width: 767px) {

    .mainmenu{
        flex-wrap: wrap;
        height:auto;
        /*
        row-gap: 13px;
        padding-top:9px;
        padding-bottom:9px;
        */
        row-gap: 3.46666667vw;
        padding-top:2.4vw;
        padding-bottom:2.4vw;
    }

    .mainmenu li{
        width:33%;
        /*font-size:14px;*/
        font-size:3.73333333vw;
        padding-top: 0;
        /*padding-left:5px;
        padding-right:5px;
        height:16px;*/
        padding-left:1.33333333vw;
        padding-right:1.33333333vw;
        height:4.26666667vw;
    }

    .mainmenu li:nth-of-type(1), .mainmenu li:nth-of-type(3){
        width: 25%;
    }

    .mainmenu li:nth-of-type(2){
        width: 50%;
        letter-spacing: -0.01em;
    }

    .mainmenu li:nth-of-type(3), .mainmenu li:nth-of-type(5){
        border:none;
    }

    .hero  .swiper-slide img{
            aspect-ratio: 3 / 4;
            object-fit: cover;
    }

    .catchcopy{
        width:94vw;
        position: absolute;
        left:50%;
        top:60%;
        transform: translate(-50%,-50%);
    }
    
    .lead{
     /*   margin-top:60px !important;*/
        margin-top:16vw !important;
    }

    h2::before,h2::after{
        /*height:4px;*/
        height:1.06666667vw;
    }

    .h2.h2--m{
        /*padding:20px 0 21px 0;*/
        padding:5.33333333vw 0 5.6vw 0;

    }

    .h2_sub{
        /*font-size:20px !important;
        margin-bottom:6px;*/
        font-size:5.33333333vw !important;
        margin-bottom:1.6vw;
    }

    .h3{
        /*text-decoration-thickness:2px;
        text-underline-offset: 4px;    */
        text-decoration-thickness:0.53333333vw;
        text-underline-offset: 1.06666667vw;    
    }

    .player_photo_block{
        margin-top:0;
    }

    .player_heading{
        /*margin-top:60px;
        margin-bottom:30px;*/
        margin-top:16vw;
        margin-bottom:8vw;
    }

    .player_heading .player_name{
        /*font-size:20px;*/
        font-size:5.33333333vw;
    }

    .player_heading .player_name_kana{
        /*font-size:12px;*/
        font-size:3.2vw;
    }

    .player_heading_sheading{
        /*font-size:18px;*/
        font-size:4.8vw;
        line-height: 1.5em;
    }

    .competition{
     /*   font-size:20px;*/
        font-size:5.33333333;
    }

    .player_profile{
        /*font-size:14px;*/
        font-size:3.73333333vw;
    }

    .logo_bottom{
        /*margin-top:155px;
        margin-bottom:60px;*/
        margin-top:41.33333333vw;
        margin-bottom:16vw;
    }
}


.c-vl {
        height: calc(95px * var(--vl-ratio));
}

.table-set1 {
    width: 100%;
    height: 15.2rem;
    overflow-x: scroll;
    border: solid 1px #bbb;
    margin-bottom: 2rem;
}
.table-set2 {
    width: 100%;
    height: 18rem;
    overflow: hidden;
    border: solid 1px #bbb;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}
.table-set2.active {
    height: 100%;
}
table {
    width: 100%;
    border-bottom: solid 1px #333;
    border-right: solid 1px #333;
    font-size: 0.8rem;
}
table th, table td {
    border-top: solid 1px #333;
    border-left: solid 1px #333;
}
table th {
    text-align: left;
    padding: 0.5rem 0.3rem;
    background-color: #f6cacb;
    line-height: 1.2;
}
table td {
    text-align: center;
    padding: 0 0.3rem;
    font-size: 1.1rem;
    color: #e97a80;
    background-color: #fcf0ef;
}
table th span.gray {
    color: #e97a80;
}
table th.blue {
    background-color: #0084ff;
    color: #fff;
}
table th.red {
    background-color: #ff4768;
    color: #fff;
}
table th span.medal {
    display: inline-block;
    width: 0.8rem;
    height: 0.8rem;
    margin: 0 auto;
    background: url(../images/icon_medal.png) no-repeat center center;
    background-size: 100%;
}
table td span {
    display: block;
    width: 1.1rem;
    height: 1.1rem;
    margin: 0 auto;
    line-height: 1;
}
.fixed01, .fixed02, .fixed03  {
    position: sticky;
    top: 0;
    left: 0;
    border-left: solid 1px #333;
    border-right: solid 1px #333;
}
.fixed01 {
    z-index: 2;
}
.fixed02 {
    z-index: 1;
}
.fixed03 {
    z-index: 3;
}
@media only screen and (min-device-width: 320px) and (max-width: 767px) {
    .table-set1 {
        height: 14.2rem;
    }
    .table-set1 table, .table-set2 table {
        width: 200vw;
    }
    .table-set2 {
        height: 18rem;
        overflow-x: scroll;
    }
    
}


@media screen and (min-width: 750px) {
  .sp {
    display: none !important;
  }
}

@media screen and (max-width: 749px) {
  .pc {
    display: none !important;
  }
}