@@charset "UTF-8";

/* DISCOGRAPHY */
.discography {margin: 30px 0}

.disc {margin: 0 10px;
      padding-top: 20px}

.disc a {display: block;
        color: #778899;
        text-align: center;
        text-decoration: none}

.disc span {display: block;
           padding: 10px 0;
           font-size: 38px}

.disc h2 {margin: 0;
         padding: 0;
         font-size: 14px}

.disc p {margin: 0;
        padding: 15px 0;
        font-size: 12px}

/* DISCOGRAPHY YEAR */
.year ul {display: flex;
         margin: 0;
         padding: 0;
         list-style: none}

.year li a {display: block;
          padding: 10px;
          font-size: 14px}

.year a {color:#000000;text-decoration:none;}
.year a:link {color:#000000;text-decoration:none;}
.year a:visited {color:#000000;text-decoration:none;}
.year a:hover {color:#000000;text-decoration:underline;}
.year a:active {color:#000000;text-decoration:underline;}

/* 西暦 */
.yyyy {padding: 5px 0;
     font-size: 20px}

/* コピーライト */
.copyright p {margin: 10px 0;
             color: #000000;
             font-size: 14px;
             text-align: center}

/* グリッド */
body {display: grid;
     grid-template-columns: [left] minmax(20px, 1fr)[main-start] auto [menu] minmax(auto, 700px)  [sns] auto  [main-end] minmax(20px, 1fr) [right];
     grid-template-rows: [head] auto [head] auto [img] auto [year] auto [y6] auto [d64] auto [d63] auto [d62] auto [d61]  auto [y5] auto [d54] auto [d53] auto [d52] auto [d51] auto [y4] auto [d44] auto [d43] auto [d42] auto [d41] auto [y3] auto [d34] auto [d33] auto [d32] auto [d31] auto [y2] auto [d24] auto [d23] auto [d22] auto [d21] auto [y1] auto [d14] auto [d13] auto [d12] auto [d11] auto [main] auto [foot] auto [bottom]}

.year {grid-column-start: main-start;
      grid-column-end: main-end;
      grid-row-start: year;
      justify-self: center}

.discography11 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d11;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography12 {grid-column-start: main-start;
             grid-column-end: main-end;
             grid-row-start: d12;
             display: grid;
             grid-template-columns: 1fr 1fr 1fr;
             grid-template-rows: auto;
             max-width: 1040px;
             border-top: dotted 2px #dddddd}

.discography13 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d13;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography14 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d14;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography21 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d21;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography22 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d22;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography23 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d23;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography24 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d24;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography31 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d31;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography32 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d32;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography33 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d33;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography34 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d34;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography41 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d41;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography42 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d42;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography43 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d43;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography44 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d44;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography51 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d51;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography52 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d52;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography53 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d53;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography54 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d54;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography61 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d61;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography62 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d62;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography63 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d63;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.discography64 {grid-column-start: main-start;
              grid-column-end: main-end;
              grid-row-start: d64;
              display: grid;
              grid-template-columns: 1fr 1fr 1fr;
              grid-template-rows: auto;
              max-width: 1040px;
              border-top: dotted 2px #dddddd}

.y1 {grid-column-start: main-start;
     grid-column-end: main-end;
     grid-row-start: y1;
     max-width: 1040px;
     border-top: dotted 2px #dddddd}

.y2 {grid-column-start: main-start;
     grid-column-end: main-end;
     grid-row-start: y2;
     max-width: 1040px;
     border-top: dotted 2px #dddddd}

.y3 {grid-column-start: main-start;
     grid-column-end: main-end;
     grid-row-start: y3;
     max-width: 1040px;
     border-top: dotted 2px #dddddd}

.y4 {grid-column-start: main-start;
     grid-column-end: main-end;
     grid-row-start: y4;
     max-width: 1040px;
     border-top: dotted 2px #dddddd}

.y5 {grid-column-start: main-start;
     grid-column-end: main-end;
     grid-row-start: y5;
     max-width: 1040px;
     border-top: dotted 2px #dddddd}

.y6 {grid-column-start: main-start;
     grid-column-end: main-end;
     grid-row-start: y6;
     max-width: 1040px;
     border-top: dotted 2px #dddddd}