.wwrep {
  color: darkblue;
}

.wwh2 {
  line-height: 1.2;
  color: midnightblue;
  border-top: none;
  border-right: none;
  border-bottom: solid 2px deeppink;
  border-left: solid 8px deeppink;
  padding: 8px 5px 5px 8px;
}
.wwt {
  margin-bottom: 1.6rem;
}
.wwspace {
  margin-right: 1.0rem;
}
.wwcmt {
  font-size: 90%;
  color: navy;
  text-indent: -1rem;
  margin: 0.4rem 0 1.6rem 2rem;
}
.wwind {
  margin-left : 1rem;
  margin-bottom : 1.6rem;
}
/*無色テーブル。*/
.wwtable {
  margin-left: 0.5rem;
  margin-bottom: 1.6rem;
}
.wwtablecell1 {
  width: 5.5rem;
  vertical-align: top;
}
.wwtablecell2 {
  vertical-align: top;
}
/*有色テーブル。*/
.wwtableborder {
  border: 3px deepskyblue solid;
  border-collapse: collapse;
  margin-left: 0.5rem;
  margin-bottom: 1.6rem;
}
.wwtableborder th,
.wwtableborder td {
  border: 2px deepskyblue solid;
  padding: 0.5rem;
}
/*以下は各セルの設定だが、上のth・td設定の詳細度が「011」で、ここでクラスだけ指定すると「010」となり負けてしまうため、ダミーidをくっつけて優先順位を「110」に上げた。*/
:not(#dummy) .wwtablecellthborder1 {
  border-bottom-width: 3px;
  border-right-width: 3px;
}
:not(#dummy) .wwtablecellthborder2 {
  border-bottom-width: 3px;
}
:not(#dummy) .wwtablecellborder1 {
  font-weight: bold;
  border-right-width: 3px;
}
/*この下は有色の大きい方のテーブル用追加。小さな画面では表示しない。*/
:not(#dummy) .wwtablecellborder2 {
  text-align : center;
  border-right-width: 3px;
}
/*この下は有色の中くらいのテーブル用追加。小さな画面では表示しない。*/
:not(#dummy) .wwtablecellborder3 {
  border-right-width: 3px;
}

/*大テーブル用レスポンシブ設定。複雑なので注意。*/
.wwcontainer {
  display: flex;
  flex-wrap: wrap;
  width: fit-content;
  margin: 0 1rem 0.6rem 0;
}
.wwcontainer div {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  margin: 0 0 0.2rem 0.4rem;
  line-height: 1;
}
.wwcontainer .item1 {
  /*指揮者*/
  width: 10rem;
  justify-content: start;
  flex-grow: 1;
  padding-left: 1rem;
  padding-right: 1rem;
  background-color: paleturquoise;
  font-weight: bold;
}
.wwcontainer .item2 {
  /*年*/
  width: 4rem;
  flex-grow: 1;
  background-color: blanchedalmond;
}
.wwcontainer .item3 {
  /*チター*/
  width: 4.5rem;
  flex-grow: 1;
  background-color: whitesmoke;
}
.wwcontainer .item4 {
  /*第1ワルツ*/
  width: 2rem;
  flex-grow: 1;
  background-color: pink;
}
.wwcontainer .item5-8 {
  /*第2-5ワルツの大枠。縦方向に整列。*/
  display: flex;
  flex-direction: column;
  margin-left: 0;
  margin-bottom: 0;
  padding: 0;
}
.wwcontainer .item5-8 .item5-8c0 {
  /*第2-5ワルツ上段。*/
  width: 4.9rem;
  margin-bottom: 0.2rem;
}
.wwcontainer .item5-8 .item5-8c {
  /*第2-5ワルツ下段の枠。横方向に整列。*/
  display: flex;
  padding: 0;
}
.wwcontainer .item5-8 .item5-8c div {
  /*第2-5ワルツ下段の各セル。*/
  margin-left: 0.2rem;
  margin-bottom: 0;
  width: 1.5rem;
}
.wwcontainer .item5-8 .item5-8c div:first-child {
  /*第2-5ワルツ（下段）の最初のセル。*/
  margin-left: 0;
}
.item5-8.item5 .item5-8c0,
.item5-8.item5 .item5-8c div {
  /*第2ワルツの色*/
  background-color: chartreuse;
}
.item5-8.item6 .item5-8c0,
.item5-8.item6 .item5-8c div {
  /*第3ワルツの色*/
  background-color: gold;
}
.item5-8.item7 .item5-8c0 {
  /*第4ワルツの幅*/
  width: 3.2rem;
}
.item5-8.item7 .item5-8c0,
.item5-8.item7 .item5-8c div {
  /*第4ワルツの色*/
  background-color: lavender;
}
.item5-8.item8 .item5-8c0,
.item5-8.item8 .item5-8c div {
  /*第5ワルツの色*/
  background-color: thistle;
}
.wwcontainer .item9 {
  /*時間*/
  min-width: 4rem;
  background-color: lemonchiffon;
}
:not(#dummy) .itemtxtcenter {
  justify-content: center;
}
/*大テーブル用レスポンシブ設定ここまで。*/

/*中テーブル用レスポンシブテーブル設定。*/
.wwzitable {
  border: 3px deepskyblue solid;
  border-collapse: collapse;
  margin-bottom: 0.4rem;
}
.wwzitable tr td {
  border: 2px deepskyblue solid;
  padding: 0 0.4rem;
}
.wwzitable tr td:first-child {
  width: 4rem;
  font-weight: bold;
  vertical-align: center;
  background-color: lightcyan;
}
.wwzitable tr td:last-child {
  width: calc(100vw - 4rem);
  vertical-align: top;
}
.wwzitable tr:first-child td:last-child {
  padding-left: 1.5rem;
  font-weight: bold;
}
.wwzitable tr:last-child td:last-child {
  padding-left: 2.5rem;
  font-weight: bold;
}
/*中テーブル用レスポンシブテーブル設定ここまで。*/

.wwcenterbottom{
  text-align: center;
  margin-bottom: 1.6rem;
}

/*CD曲目用テーブル。*/
.wwcdtable {
  margin: 0 auto 1.6rem;
}
.wwcdtable td {
  vertical-align: top;
}
.wwcdtablecell1 {
  width: 1rem;
  text-align: right;
  padding-right: 1rem;
}
.wwcdtablecell2 {
  padding-right: 1rem;
}
.wwcdtablecell3 {
  text-align : right;
  padding-right : 1rem;
}
/*いちばん下のレコ芸データ欄用。flex版。*/
.wwrecogeicontainer1 {
  display: flex;
  align-items:flex-end;
}
.wwrecogeicontainer1 > div:first-child {
  width: 60%;
  padding-right: 1rem;
}
.wwrecogeicontainer1 > div:nth-child(2) {
  width: 40%;
  word-break: break-all;
}
.wwrecogeicontainer1 .wwrecogeileftrem {
  padding-left: 5rem;
}

.wwrecogeicontainer2 {
  display: flex;
}
.wwrecogeicontainer2 > div:first-child {
  width: 60%;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-left: 1px solid;
  margin: 0.2rem 0;
  padding: 0.1rem 0 0.1rem 0.6rem;
}
.wwrecogeicontainer2 > div:nth-child(2) {
  width: 40%;
  text-align: right;
  border-top: 1px solid;
  border-right: 1px solid;
  border-bottom: 1px solid;
  margin: 0.2rem 0;
  padding: 0.1rem 1rem 0.1rem 0;
}

/*****************************************************************************/

/*採点表（grade slip）の設定。*/
@media (min-width: 960px) {
  #gradesliplarge {
    display: block;
  }
  #gradeslipsmall {
    display: none;
  }
}
@media (max-width: 959px) {
  #gradesliplarge {
    display: none;
  }
  #gradeslipsmall {
    display: block;
  }
}
@media (min-width: 768px) {
  #zithergradeslipsmall {
    display: none;
  }
}
@media (max-width: 767px) {
  .wwcmt {
    margin-left: 1em;
  }
  .wwtable {
    margin-left: 0;
  }
  #gradesliplarge {
    display: none;
  }
  #zithergradesliplarge {
    display: none;
  }
  .wwrecogeicontainer1 {
    flex-wrap: wrap;
  }
  .wwrecogeicontainer1 > div:first-child {
    width: 100%;
    margin-bottom: 0.6rem;
  }
  .wwrecogeicontainer1 > div:nth-child(2) {
    width: 100%;
  }
  .wwrecogeicontainer1 .wwrecogeileftrem {
    padding-left: 1rem;
  }
  .wwrecogeicontainer2 {
    flex-wrap: wrap;
  }
  .wwrecogeicontainer2 > div:first-child {
    width: 100%;
    border-bottom: none;
    border-right: 1px solid;
    margin-bottom: 0;
  }
  .wwrecogeicontainer2 > div:nth-child(2) {
    width: 100%;
    border-top: none;
    border-left: 1px solid;
    margin-top: 0;
  }
}
