@charset "utf-8";

.ticketschedule_chart_wrap {
    width:100%;
}

.top_caption {
    margin:10px auto 20px!important;
}

.ticketschedule_chart_wrap table {
    border-collapse: collapse;
    width:100%;
    font-weight: bold;
}

.table_wrap {
}

.table_wrap table th {
    width:100px;
    padding:10px 10px 0px;
    background:#bbb;
    border:3px solid #fff;
    line-height: 130%;
    text-align: center;

}
.table_wrap th img {
  width:50px!important;
  display: block;
  margin:0 auto;
}
.table_wrap table th span {
    font-size: 1.2rem;
    display: block;
    line-height: 130%;
    margin:5px 0;
}

.table_wrap table{
  width: 100%;
}
.table_wrap th,td{
  height:auto;
  vertical-align: middle;
  padding:12px;
  border: 2px solid #fff!important;
  text-align: center;
  font-size: 1.4rem;
  line-height: 140%;
  white-space:nowrap;
  width:20%;
}

.table_wrap td {
    font-size: 1.5rem;
    font-weight: bold;
}

.table_wrap td a {
    font-size:1.5rem;
    line-height: 140%;
    display: inline-block;
    padding:10px 24px;
    text-decoration: none;
    border-radius: 20px;
    background:#fff;
}

.table_wrap th img {
  width:40px!important;
  display: block;
  margin:0 auto;
}
.table_wrap .fix1{
  text-align:center;
  position: sticky;
  top: 0;
  left: 0;
  color: #333;
  &:before{
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    width: 100%;
    height: 100%;
    border: 3px solid #fff;
  }
}
.table_wrap .fix1{
  z-index: 2;
  text-align: center;
  vertical-align: middle;
  padding:8px 5px;
  font-size: 1.2rem;
}

.table_wrap .fix1 .fix1emb {
    width:80px!important;
    margin:auto;
}

.table_wrap .fix1 .fix1emb img {
    width:100%;
}

.table_wrap .fix1 p {
    margin:0!important;
}

.table_wrap .fix1 span {
    display: block;
    font-size: 1.25rem;
    line-height: 140%;
    margin:10px 0 0 0;
}
.table_wrap .fix2{
  z-index: 1;
  text-align: left;
  white-space: nowrap;
  background:#fff;
  font-weight: bold;
  padding:15px 10px;
}


@media screen and (max-width: 640px) {

    .table_wrap {
        width: 100%;
    }

    .table_wrap table th {
        width:60px;
        padding:10px 10px;
        background:#ccc;
        border:3px solid #fff;
        line-height: 130%;
        text-align: center;
    }

    .table_wrap th,
    .table_wrap td{
    width: auto;
    height:auto;
    vertical-align: middle;
    padding:5px 5px 0;
    border: 2px solid #fff!important;
    text-align: center;
    font-size: 1rem;
    line-height: 140%;
    white-space: wrap;
    }
    .table_wrap td{
    font-size: 1.25rem;
    text-align: center;
    }
     .table_wrap td a {
        font-size:1.4rem;
        line-height: 120%;
        padding:7px 14px;
        text-decoration: none;
        border-radius: 10px;
        background:#fff;
        margin:0;
    }
    .table_wrap table th span {
        font-size: 1rem;
        white-space: wrap;
        margin:5px 0 0;
    }
    .table_wrap .fix1{
        text-align:center;
        position: sticky;
        top: 50px;
        left: 0;
        color: #333;
        &:before{
            content: "";
            position: absolute;
            top: -1px;
            left: -1px;
            width: 100%;
            height: 100%;
            border: 3px solid #fff;
        }
    }
    .table_wrap .fix1{
    z-index: 2;
    text-align: center;
    vertical-align: middle;
    padding:7px 5px ;
    font-size: 1rem;
    line-height: 120%;
    }


    .table_wrap .fix1 p {
        margin:0!important;
    }

    .table_wrap .fix1 span {
        display: block;
        font-size: 1rem;
        line-height: 140%;
        margin:10px 0 0 0;
    }
    .table_wrap .fix2 {
    z-index: 1;
    text-align: left;
    white-space:wrap;
    background:#fff;
    font-weight: bold;
    font-size:1rem;
    }
    
}

.table_wrap tr td:nth-child(2),
.table_wrap tr td:nth-child(4),
.table_wrap tr td:nth-child(6) {
    background-color: #caebac;
}
.table_wrap tr td:nth-child(3),
.table_wrap tr td:nth-child(5) {
    background-color: #e1eed6;
}

.table_wrap tr td:nth-child(1) {
    background-color: #bbb;
}
.table_wrap thead tr td:nth-child(3),
.table_wrap thead tr td:nth-child(5) {
    background-color: #e5e5e5;
}

.table_wrap thead tr td:nth-child(2),
.table_wrap thead tr td:nth-child(4),
.table_wrap thead tr td:nth-child(6) {
    background-color: #ccc;
}
.table_wrap tbody tr td:nth-child(2),
.table_wrap tbody tr td:nth-child(4),
.table_wraptbody tr td:nth-child(6) {
    background-color: #caebac;
}
.table_wrap tbody tr .fix1:nth-child(3),
.table_wrap tbody tr .fix1:nth-child(5) {
    background-color: #e1eed6;
}



.ticketschedule_chart_wrap td.chart .inner p,
.ticketschedule_chart_wrap td.matchday .inner p {
    text-align: center;
    margin:0!important;
    display: block;
}

@media screen and (max-width: 640px) {

    .pconly {
        display: none;
    }

    .ticketschedule_chart_wrap {
        width:95vw;
        margin: 0 auto;
    }

    .ticketschedule_chart_wrap table th {
        width:10%;
        padding:5px 2px;
        border:2px solid #fff;
        font-size:1.2rem;
        line-height: 130%;
        text-align: center;
    }


}