
/* title
----------------------------------- */

.mod-media-horizontal>.content>.hdg,
.mod-media-horizontal>.content>p.top,
.mod-media-horizontal>.content>p.bottom{
  margin-bottom: 0;
  color: black;
}

.mod-media-horizontal>.content>.hdg{
  font-size: 4rem;
}

.mod-media-horizontal>.content>p.bottom{
  font-weight: bold;
}

.mod-media-horizontal>.content .logo{
  display: block;
}

.mod-media-horizontal>.content .logo img{
  max-width: 100%;
}

.mod-media-horizontal>.content .top .logo{
  max-width: clamp(15em, 16vw, 325px);
  padding-top: 20px;
  padding-bottom: 1vw;
}

.mod-media-horizontal>.content .bottom .logo{
  max-width: clamp(17em, 20vw, 420px);
  padding-top: 2vw;
}

@media screen and (min-width: 1024px), print{
  .mod-media-horizontal>.content{
    width: auto;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1280px),
screen and (max-width: 667px), print{
  .mod-media-horizontal>.content>.hdg{
    font-size: 3rem;
  }
}

/* -------------------------------- */


/* local nav
----------------------------------- */

.mod-link-03.of-reverse-color>.inner>.list>li>.link{
  color: black;
}

.mod-link-03.of-reverse-color>.inner>.list>li>.link .img{
  position: relative;
}

.mod-link-03.of-reverse-color>.inner>.list>li>.link .txt{
  margin: 0;
  padding: 0;
  font-size: inherit;
}

.mod-link-03.of-reverse-color>.inner>.list>li>.link .txt::before{
  display: block;
  text-align: center;
  color: var(--strong);
}

.mod-link-03.of-reverse-color>.inner>.list>li>.link .txt::after{
  position: relative;
  margin: .4em auto 0;
  border-color: black;
}

.mod-link-03.of-reverse-color>.inner>.list>li>.link[href="#anc-present"] .txt::before{content: "\2500\a0\73FE\5728\a0\2500";}
.mod-link-03.of-reverse-color>.inner>.list>li>.link[href="#anc-past"] .txt::before{content: "\2500\a0\904E\53BB\a0\2500";}
.mod-link-03.of-reverse-color>.inner>.list>li>.link[href="#anc-future"] .txt::before{content: "\2500\a0\6700\65B0\60C5\5831\a0\2500";}

.mod-link-03.of-reverse-color>.inner>.list>li>.link>.img.of-separate{
  padding-bottom: 0;
  border: none;
}

/* -------------------------------- */


/* huge heading
----------------------------------- */

.mod-hdg-l2#anc-present,
.mod-hdg-l2#anc-past,
.mod-hdg-l2#anc-future{
  position: relative;
  display: flex;
  margin: 400px 0 200px;
  font-size: 8rem;
  align-items: center;
  gap: 10px;
}

.mod-hdg-l2#anc-present::before,
.mod-hdg-l2#anc-past::before,
.mod-hdg-l2#anc-future::before,
.mod-hdg-l2#anc-present::after,
.mod-hdg-l2#anc-past::after,
.mod-hdg-l2#anc-future::after{
  content: "";
  background-color: var(--gray);
  height: 1px;
  flex-basis: 100%;
}

.mod-hdg-l2#anc-present> span,
.mod-hdg-l2#anc-past> span,
.mod-hdg-l2#anc-future> span{
  display: block;
  width: 100%;
  text-align: center;
  word-break: keep-all;
  flex-basis: 100%;
}

.mod-hdg-l2#anc-present> span::before,
.mod-hdg-l2#anc-past> span::before,
.mod-hdg-l2#anc-future> span::before{
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  height: min(580px, 80vw);
  width: 100%;
  transform: translateY(-67%);
  z-index: -1;
}

.mod-hdg-l2#anc-present> span::before{background-image: url("../images/bg-present.jpg");}
.mod-hdg-l2#anc-past> span::before{background-image: url("../images/bg-past.jpg");}
.mod-hdg-l2#anc-future> span::before{background-image: url("../images/bg-future.jpg");}

@media screen and (max-width: 1024px), print{
  .mod-hdg-l2#anc-present,
  .mod-hdg-l2#anc-past,
  .mod-hdg-l2#anc-future{
    font-size: 7rem;
  }
}

@media screen and (max-width: 667px), print{
  .mod-hdg-l2#anc-present,
  .mod-hdg-l2#anc-past,
  .mod-hdg-l2#anc-future{
    font-size: min(6rem, 10vw);
  }
}

/* -------------------------------- */


/* heading
----------------------------------- */

.of-bgcolor-02 .mod-hdg-l2,
.of-bgcolor-03 .mod-hdg-l2,
.of-bgcolor-04 .mod-hdg-l2,
.of-bgcolor-05 .mod-hdg-l2,
.of-bgcolor-06 .mod-hdg-l2,
.of-bgcolor-07 .mod-hdg-l2{
  position: relative;
  padding-top: 110px;
}

.of-bgcolor-02 .mod-hdg-l2::before,
.of-bgcolor-03 .mod-hdg-l2::before,
.of-bgcolor-04 .mod-hdg-l2::before,
.of-bgcolor-05 .mod-hdg-l2::before,
.of-bgcolor-06 .mod-hdg-l2::before,
.of-bgcolor-07 .mod-hdg-l2::before{
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  height: 110px;
  width: 110px;
  transform: translateX(-50%);
  z-index: -1;
}

.of-bgcolor-02 .mod-hdg-l2::before{background-image: url("../images/icon-present.png");}
.of-bgcolor-03 .mod-hdg-l2::before{background-image: url("../images/icon-present.png");}
.of-bgcolor-04 .mod-hdg-l2::before{background-image: url("../images/icon-past.png");}
.of-bgcolor-05 .mod-hdg-l2::before{background-image: url("../images/icon-past.png");}
/*.of-bgcolor-06 .mod-hdg-l2::before{background-image: url("../images/icon-past.png");}*/
.of-bgcolor-07 .mod-hdg-l2::before{background-image: url("../images/icon-future.png");}


/* -------------------------------- */


/* present feature
----------------------------------- */

.of-bgcolor-02 .mod-media-lyt-lqd>.content{
  padding-right: 0;
}

@media screen and (min-width: 1025px), print{
  .of-bgcolor-02 .mod-media-lyt-lqd>.content{
    padding-right: 50px;
  }
}

.of-bgcolor-02 .mod-media-lyt-lqd>.content img{
  max-width: 100%;
}

.of-bgcolor-02 .mod-media-lyt-lqd>.media{
  margin-top: 16px;
}

.of-bgcolor-02 .mod-media-lyt-lqd>.media .mod-media{
  position: relative;
  height: 30rem;
  width: 30rem;
  justify-content: center;
}

.of-bgcolor-02 .mod-media-lyt-lqd>.media .mod-media figcaption{
  margin-top: 0;
  font-size: 2.6rem;
}

.of-bgcolor-02 .mod-media-lyt-lqd>.media .mod-media figcaption .circle{
  display: block;
}

.of-bgcolor-02 .mod-media-lyt-lqd>.media .mod-media figcaption .circle::before{
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--lightgray);
  border-radius: 100%;
  z-index: -1;
}

.of-bgcolor-02 .mod-media-lyt-lqd>.media .mod-media figcaption .circle.blue{color: white;}
.of-bgcolor-02 .mod-media-lyt-lqd>.media .mod-media figcaption .circle.blue::before{background-color: var(--blue);}
.of-bgcolor-02 .mod-media-lyt-lqd>.media .mod-media figcaption .circle.blue strong{color: white;}

.of-bgcolor-02 .mod-media-lyt-lqd>.media .mod-media figcaption .circle.white::before{
  background-color: white;
  border: 1px solid var(--blue);
}

.of-bgcolor-02 .mod-media-lyt-lqd>.media .mod-media figcaption .circle span{
  display: block;
}

.of-bgcolor-02 .mod-media-lyt-lqd>.media .mod-media figcaption .circle strong{
  color: var(--strong);
}

.of-bgcolor-02 .mod-box{
  box-shadow: 3px 3px 6px 0 rgba(0,0,0,.1);
}

/* -------------------------------- */


/* past history
----------------------------------- */

.of-bgcolor-05 .mod-media-lyt-lqd{
  padding: .5em 0;
  margin-bottom: 0;
  align-items: flex-start;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.media{
  overflow: hidden;
  display: flex;
  padding-right: 20px;
  justify-content: flex-end;
  gap: 10px;
  flex-basis: calc(100% - 13rem);
}

.of-bgcolor-05 .mod-media-lyt-lqd>.media .mod-media{
  margin: 0;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.media .mod-media img{
  width: 100%;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.media .mod-media> span{
  position: relative;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.media .mod-media> span::before{
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: var(--gray);
  height: 1px;
  width: 100%;
  z-index: -1;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.media .mod-media figcaption{
  max-width: none !important;
  margin-top: .5em;
  font-size: 1.2rem;
  line-height: 1.4;
  word-break: keep-all;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.media .mod-media figcaption> span{
  display: block;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.media .mod-media figcaption strong{
  font-size: 1.6rem;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.content{
  position: relative;
  display: flex;
  margin-top: 1em;
  padding-right: 0;
  flex-basis: calc(100% + 13rem);
}

@media screen and (min-width: 1025px), print{
  .of-bgcolor-05 .mod-media-lyt-lqd>.content{
    padding-right: 60px;
    flex-basis: calc(100% + 13rem - 60px);
  }
}


.of-bgcolor-05 .mod-media-lyt-lqd>.content .mod-list>.list{
  margin-bottom: 0;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.content .mod-list>.list .text{
  padding-left: 25px;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.content .mod-list>.list .text::before{
  display: none;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.content .year{
  display: block;
  background-image: linear-gradient(to bottom, var(--lightblue), var(--blue));
  background-repeat: no-repeat;
  background-size: 100% calc(100% * 22);
  background-position: 0 calc((100% / 22) * 1);
  width: 12rem;
  padding: .5em 0;
  margin-right: 20px;
  color: white;
  font-size: 3rem;
  font-weight: bold;
  line-height: 1;
  text-align: center;
}

.of-bgcolor-05 .mod-media-lyt-lqd>.content .year> span{
  font-size: 2rem;
}

.of-bgcolor-05 [class^=str-outer]:nth-last-child(23) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 1);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(22) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 2);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(21) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 3);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(20) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 4);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(19) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 5);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(18) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 6);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(17) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 7);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(16) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 8);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(15) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 9);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(14) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 10);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(13) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 11);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(12) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 12);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(11) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 13);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(10) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 14);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(9) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 15);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(8) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 16);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(7) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 17);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(6) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 18);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(5) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 19);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(4) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 20);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(3) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 21);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(2) .mod-media-lyt-lqd>.content .year{background-position: 0 calc((100% / 22) * 22);}


.of-bgcolor-05 .mod-media-lyt-lqd::before{
  content: "";
  position: absolute;
  top: 49px;
  left: 50%;
  bottom: -49px;
  background-image: repeating-linear-gradient(to bottom, transparent, transparent 8px, white 8px, white), linear-gradient(to bottom, var(--lightblue), var(--blue));
  background-size: 100% 16px, 100% calc(100% * 22);
  background-position: top center, 0 calc((100% / 22) * 1);
  width: 3px;
}

.of-bgcolor-05 [class^=str-outer]:nth-last-child(23) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 1);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(22) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 2);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(21) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 3);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(20) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 4);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(19) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 5);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(18) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 6);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(17) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 7);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(16) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 8);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(15) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 9);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(14) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 10);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(13) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 11);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(12) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 12);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(11) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 13);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(10) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 14);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(9) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 15);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(8) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 16);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(7) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 17);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(6) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 18);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(5) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 19);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(4) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 20);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(3) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 21);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(2) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 22);}
.of-bgcolor-05 [class^=str-outer]:nth-last-child(1) .mod-media-lyt-lqd::before{background-position: top center, 0 calc((100% / 22) * 23);}

.of-bgcolor-05 [class^=str-outer]{
  z-index: auto;
}

.of-bgcolor-05 [class^=str-outer]:nth-last-child(23)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(20)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(18)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(15)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(12)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(9)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(6)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(3)::after{
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  background-image: url(../images/bg-clock.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  height: 420px;
  width: 25%;
  translate: 0 -50%;
  z-index: -1;
}

.of-bgcolor-05 [class^=str-outer]:nth-last-child(20)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(15)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(9)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(3)::after{
  left: auto;
  right: 0;
  height: 340px;
  scale: -1 1;
}

.of-bgcolor-05 [class^=str-outer]:nth-last-child(23)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(20)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(12)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(9)::after{transform: rotate(30deg);}

.of-bgcolor-05 [class^=str-outer]:nth-last-child(18)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(15)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(6)::after,
.of-bgcolor-05 [class^=str-outer]:nth-last-child(3)::after{transform: rotate(-30deg);}

@media screen and (max-width: 667px), print{
  .of-bgcolor-05 .mod-media-lyt-lqd{
    flex-direction: column;
  }
  .of-bgcolor-05 .mod-media-lyt-lqd::before{
    left: 4em;
  }
  .of-bgcolor-05 .mod-media-lyt-lqd>.media{
    padding: 0 1rem 0 10rem;
    flex-wrap: wrap;
    justify-content: flex-start;
    flex-basis: 100%;
  }
  .of-bgcolor-05 .mod-media-lyt-lqd>.media .mod-media{
  }
  .of-bgcolor-05 .mod-media-lyt-lqd>.media .mod-media> span::before{
    display: none;
  }
  .of-bgcolor-05 .mod-media-lyt-lqd>.content .mod-list{
    margin-bottom: 10px;
  }
  .of-bgcolor-05 .mod-media-lyt-lqd>.content .year{
    margin-right: 10px;
  }
}

/* -------------------------------- */


/* past lineup
----------------------------------- */

.of-bgcolor-06 .mod-box-05>.inner>.col>.box{
  padding: 10px;
  border-radius: 10px;
  text-align: center;
}

.of-bgcolor-06 .mod-box-05 .mod-media{
  margin-bottom: 0;
}

.of-bgcolor-06 .mod-box-05>.inner>.col>.box a{
  display: inline-block;
  font-size: 1.4rem;
  font-weight: bold;
  text-decoration: none;
  transition: opacity .3s ease;
}

.of-bgcolor-06 .mod-box-05>.inner>.col>.box>:last-child{
  margin-bottom: 14px;
}

.of-bgcolor-06 .mod-box-05>.inner>.col>.box a:hover{
  opacity: .4;
}

.of-bgcolor-06 .mod-box-05>.inner>.col>.box a:hover img{
  opacity: 1;
}

/* -------------------------------- */


/* future colorbox
----------------------------------- */

.of-bgcolor-07 .mod-box.of-transparent>.inner{
  margin: 0; 
}

.of-bgcolor-07 .mod-box.of-transparent>.inner .mod-media-lyt-lqd{
  align-items: flex-end;
}

/* -------------------------------- */





/* redifine
----------------------------------- */

.sct-primary> .of-bgcolor-02,
.sct-primary> .of-bgcolor-03,
.sct-primary> .of-bgcolor-04,
.sct-primary> .of-bgcolor-05,
.sct-primary> .of-bgcolor-06,
.sct-primary> .of-bgcolor-07{
  overflow: hidden;
}

.sct-primary> .of-bgcolor-02>[class^=str-outer],
.sct-primary> .of-bgcolor-03>[class^=str-outer],
.sct-primary> .of-bgcolor-04>[class^=str-outer],
.sct-primary> .of-bgcolor-05>[class^=str-outer],
.sct-primary> .of-bgcolor-06>[class^=str-outer],
.sct-primary> .of-bgcolor-07>[class^=str-outer]{
  overflow: visible;
  background: transparent;
}

.content > p:nth-child(1){
  margin: 0;
}

.mod-btn-02.of-has-limit a{
  min-width: 312px;
  max-width: none;
}

/* -------------------------------- */


/* common
----------------------------------- */

:root{
  --strong: #286EBE;
  --lightblue: #DBDFF1;
  --blue: #012C63;
  --gray: #cccccc;
  --lightgray: #ebebeb;
}

.c-blue{
  color: var(--strong) !important;
}

.bg-blue{
  background-color: var(--blue);
  color: white;
}

[class^=bg-]{
  display: block;
  max-width: 630px;
  margin-left: auto;
  margin-right: auto;
  padding: .6em .5em .4em;
}

.fs-18{
  font-size: 1.8rem;
}

.fs-24{
  font-size: 2.4rem;
}

.fs-40{
  font-size: 4rem;
  line-height: 1.4;
}

@media screen and (max-width: 667px), print{
  .fs-40{
    font-size: 2.4rem;
  }
}
