@charset "UTF-8";
/*!  変数・関数
================================================ */
/*-----------------------------------------------
 main
-----------------------------------------------*/
h2 {
  margin-bottom: 35px; }

/*-----------------------------------------------
 .anniversary
-----------------------------------------------*/
.anniversary {
  width: 1000px;
  margin: 0 auto;
  padding-bottom: 50px; }

ul.list-chronology li {
  display: flex;
  position: relative;
  box-sizing: content-box; }
  ul.list-chronology li .day {
    position: absolute;
    left: 0;
    width: 95px;
    font-size: 3.4rem;
    font-family: "Hiragino Mincho ProN W7", "ヒラギノ明朝 ProN W7", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    color: #030303;
    margin-top: -10px;
    margin-right: 4px; }
    ul.list-chronology li .day .year {
      font-size: 2.0rem; }
      ul.list-chronology li .day .year::after {
        display: inline-block;
        content: "年";
        font-size: 1.4rem; }
  ul.list-chronology li .day-none {
    position: absolute;
    left: 0;
    width: 95px; }
  ul.list-chronology li .day-point {
    position: absolute;
    left: 92px;
    width: 39px;
    height: 100%;
    margin-right: 30px;
    padding-top: 30px;
    border-right: 3px solid #000;
    box-sizing: border-box; }
  ul.list-chronology li:first-child .day-point {
    margin-top: 28px;
    padding-top: 0; }
  ul.list-chronology li:last-child .day-point {
    margin-bottom: 110px; }
  ul.list-chronology li .note {
    position: relative;
    left: 160px;
    display: flex;
    justify-content: space-between;
    width: 841px;
    font-size: 2.1rem;
    line-height: 1.6;
    margin-top: 65px;
    padding: 0 24px 20px 33px;
    box-sizing: border-box; }
    ul.list-chronology li .note .note-icon {
      display: inline-block;
      margin: 0 0 12px; }
    ul.list-chronology li .note::before {
      display: block;
      position: absolute;
      width: calc(100% - 40px);
      height: 0;
      left: 0;
      content: "";
      border-left: solid 40px transparent;
      bottom: 100%;
      z-index: 1; }
    ul.list-chronology li .note a {
      color: #2e64d8;
      text-decoration: none; }
    ul.list-chronology li .note span {
      color: #2e64d8; }
    ul.list-chronology li .note .note-img {
      position: relative;
      margin-top: -19px;
      margin-left: 20px;
      z-index: 5; }
  ul.list-chronology li .novels {
    background: rgba(113, 161, 252, 0.3); }
    ul.list-chronology li .novels::before {
      border-bottom: solid 40px rgba(113, 161, 252, 0.3); }
    ul.list-chronology li .novels .note-img img {
      border: 1px solid #3f77fd; }
  ul.list-chronology li .comics {
    background: rgba(254, 234, 190, 0.3); }
    ul.list-chronology li .comics::before {
      border-bottom: solid 40px rgba(254, 234, 190, 0.3); }
    ul.list-chronology li .comics .note-img img {
      border: 1px solid #fcb419; }
  ul.list-chronology li .animation {
    background: rgba(134, 252, 237, 0.3); }
    ul.list-chronology li .animation::before {
      border-bottom: solid 40px rgba(134, 252, 237, 0.3); }
    ul.list-chronology li .animation .note-img img {
      border: 1px solid #16cbb4; }
  ul.list-chronology li .game {
    background: rgba(234, 187, 251, 0.3); }
    ul.list-chronology li .game::before {
      border-bottom: solid 40px rgba(234, 187, 251, 0.3); }
    ul.list-chronology li .game .note-img img {
      border: 1px solid #d269f9; }
  ul.list-chronology li .other {
    background: rgba(252, 179, 192, 0.3); }
    ul.list-chronology li .other::before {
      border-bottom: solid 40px rgba(252, 179, 192, 0.3); }
    ul.list-chronology li .other .note-img img {
      border: 1px solid #fc4675; }

@media screen and (max-width: 640px) {
  /*-----------------------------------------------
   main
  -----------------------------------------------*/
  h2 {
    margin-bottom: 8.59375vw; }

  /*-----------------------------------------------
   .anniversary
  -----------------------------------------------*/
  .anniversary {
    width: 92.1875vw;
    padding-bottom: 7.8125vw; }

  ul.list-chronology li .day {
    width: 10.46875vw;
    font-size: 3.75vw;
    margin-top: -1.5625vw;
    margin-right: 0.46875vw; }
    ul.list-chronology li .day .year {
      font-size: 2.1875vw; }
      ul.list-chronology li .day .year::after {
        font-size: 1.53125vw; }
  ul.list-chronology li .day-none {
    width: 9.84375vw; }
  ul.list-chronology li .day-point {
    left: 10.78125vw;
    width: 4.375vw;
    margin-right: 2.1875vw;
    padding-top: 2.96875vw; }
    ul.list-chronology li .day-point img {
      width: 5.3125vw; }
  ul.list-chronology li:first-child .day-point {
    margin-top: 2.8125vw; }
  ul.list-chronology li:last-child .day-point {
    margin-bottom: 50vw; }
  ul.list-chronology li .note {
    left: 17.96875vw;
    width: 73.90625vw;
    font-size: 3.4375vw;
    margin-top: 6.25vw;
    margin-bottom: 6.25vw;
    padding: 0 3.75vw 5.3125vw 3.75vw; }
    ul.list-chronology li .note .note-icon {
      width: 13.125vw;
      margin: 0 0 1.09375vw; }
    ul.list-chronology li .note::before {
      width: calc(100% - 4.38vw);
      border-left: solid 4.375vw transparent; }
    ul.list-chronology li .note .note-img {
      margin-top: 0;
      margin-left: 3.125vw; }
      ul.list-chronology li .note .note-img img {
        width: 19.6875vw; }
    ul.list-chronology li .note .note-img2 {
      margin-left: 3.125vw;
      padding-top: 6.25vw; }
  ul.list-chronology li .novels::before {
    border-bottom: solid 4.375vw rgba(113, 161, 252, 0.3); }
  ul.list-chronology li .comics::before {
    border-bottom: solid 4.375vw rgba(254, 234, 190, 0.3); }
  ul.list-chronology li .animation::before {
    border-bottom: solid 4.375vw rgba(134, 252, 237, 0.3); }
  ul.list-chronology li .animation .note-icon {
    width: 18.75vw; }
  ul.list-chronology li .game::before {
    border-bottom: solid 4.375vw rgba(234, 187, 251, 0.3); }
  ul.list-chronology li .other::before {
    border-bottom: solid 4.375vw rgba(252, 179, 192, 0.3); } }