@charset "UTF-8";
/* Scss Document */
/*共通設定-------------------------------------------------------------------------------------------------------------------------------------*/
/*基本設定*/
/*メイン*/
.students {
    margin: 0 auto 0; }

    .students table {
      width: 100%;
      margin: 2em 0 0; }
      .students table th {
        padding: 0.5em 2%;
        width: 16%;
        font-weight: normal; }
      .students table td {
        padding: 0.5em 2%;
        width: 76%; }
        .students table td i {
          font-style: normal;
          font-size: 80%; }
      .students table tr:nth-child(odd) {
        background-color: #ddd; }
      .students table tr:nth-child(1) {
        background-color: #ccc; }
    .students .attention {
      margin: 1em 0 0;
      font-size: 80%; }
      .students .attention span {
        background-color: #5bb3e3;
        padding: 0.2em 5px;
        margin: 0 5px 0 0;
        color: #fff; }
    .students .attention2 {
      background-color: #5bb3e3;
      padding: 0.2em 5px;
      margin: 0 5px 0 0;
      color: #fff; }

.w_back {
  width: 100%;
  padding: 2em 0;
  margin: 4em 0 0;
  background-color: #fff; }

.g_back2 {
  width: 100%;
  margin: 2em 0 0; }

.desktop-hidden {
    display: none;
  }



/*共通設定ここまで-------------------------------------------------------------------------------------------------------------------------------------*/
/* pc */
@media screen and (min-width: 1300px) {
  /*ヘッダー*/
  /*メイン*/
  .students {
    }

  /*フッター*/ }
/* tablet以下共通 ------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 1299px) {
  /*ヘッダー*/
  /*メイン*/
  .students {
    width: 96%; }

  /*フッター*/ }
/* tablet以下共通ここまで ------------------------------------------------------------------------------------------*/
/* tablet1 */
@media only screen and (min-width: 1024px) and (max-width: 1299px) {
  /*基本設定*/
  /*ヘッダー*/
  /*メイン*/
  /*フッター*/ }
/* tablet2  */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  /*基本設定*/
  /*メイン*/
  /*フッター*/ }
/* tablet3  */
@media only screen and (max-width: 767px) {
  /*メイン*/

  .students {
    margin: 0 auto 0; }
    .students h3 {
      font-size: 120%; }
      .students h3 span {
        font-size: 70%; }
    .students dl {
      flex-direction: column; }
      .students dl dt {
        width: 80%;
        margin: 0 auto 1em; }
      .students dl dd {
        width: 100%; }
    .students table {
      width: 100%;
      margin: 2em 0 0; }
      .students table th {
        display: block;
        width: 100%;
        background-color: #ddd; }
      .students table td {
        display: block;
        width: 100%;
        background-color: #fff;
        margin: 0 0 1em; }
      .students table tr:nth-child(odd) {
        background-color: rgba(255, 255, 255, 0); }
      .students table tr:nth-child(1) {
        display: none;
        background-color: none; } }

/* smartPhone1 */
@media only screen and (max-width: 499px) {
  /*基本設定*/
  html {
    font-size: 80%; }
    .desktop-hidden {
      display: inline;
    }

    .students,
    .students td,
    .students th {
      /*border: 1px solid #cbced2;*/
      border-collapse: collapse;
      text-align: left;
      line-height: 1.5;
    }
    
    .students th {
      /*background: #01214d;*/
      color: #01214d;
      padding: 4px 12px;
      display: block;
      width: 100%
    }
    
    .students td {
      background: #f5f6f8;
      padding: 4px 12px;
      display: block;
      width: 100%;
    }


  /*メイン*/ }
