* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

html {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

article, aside, footer, header, nav, section, figcaption, figure, main {
  display: block; }

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -.25em; }

sup {
  top: -.5em; }

img {
  border-style: none;
  vertical-align: top; }

table {
  border-collapse: collapse; }

button, input, select, textarea {
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit; }

button, html [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button; }

textarea {
  overflow: auto;
  resize: vertical; }

[type="checkbox"], [type="radio"] {
  box-sizing: border-box;
  padding: 0; }

a, area, button, input, label, select, summary, textarea, [tabindex] {
  touch-action: manipulation; }

@media screen and (max-width: 800px) {
  header .headerInner #headerSiteName {
    overflow: hidden; }
    header .headerInner #headerSiteName a {
      -webkit-transform: translateY(-100%);
              transform: translateY(-100%); }
  #homeTop {
    width: 100%;
    background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_fv_bg_sp.webp);
    background-size: 100% auto;
    background-position: center top;
    background-repeat: no-repeat;
    background-color: #ffdc51;
    overflow: hidden; }
    #homeTop .inner {
      aspect-ratio: 750 / 1340;
      position: relative; }
      #homeTop .inner .siteName {
        position: absolute;
        max-width: 597px;
        width: 79.6%;
        aspect-ratio: 597 / 257;
        top: 22.5%;
        left: 0;
        right: 0;
        margin: 0 auto; }
        #homeTop .inner .siteName img {
          width: 100%;
          height: auto; }
      #homeTop .inner .read {
        font-size: 20px;
        color: #0d2538;
        text-align: center;
        position: absolute;
        top: 47.3%;
        left: 0;
        right: 0;
        margin: 0 auto;
        line-height: 2;
        font-weight: 700; }
      #homeTop .inner .fukidashi {
        position: absolute;
        -webkit-transform: scale(0);
                transform: scale(0);
        -webkit-transform-origin: center bottom;
                transform-origin: center bottom;
        transition: all .4s ease;
        transition-delay: .5s; }
        #homeTop .inner .fukidashi img {
          width: 100%;
          height: auto; }
      #homeTop .inner .fukidashi1 {
        width: 19.7%;
        aspect-ratio: 148 / 105;
        top: 11.5%;
        left: 18%; }
      #homeTop .inner .fukidashi2 {
        width: 19.7%;
        aspect-ratio: 148 / 102;
        top: 13.4%;
        left: 39.9%; }
      #homeTop .inner .fukidashi3 {
        width: 23.5%;
        aspect-ratio: 176 / 106;
        top: 11.5%;
        left: 61.7%; }
      #homeTop .inner .topIcon {
        position: absolute;
        transition: all .2s linear;
        opacity: 0; }
        #homeTop .inner .topIcon img {
          width: 100%;
          height: auto; }
      #homeTop .inner .loupe {
        width: 12.7%;
        aspect-ratio: 111 / 116;
        top: 2.1%;
        left: 46.8%; }
      #homeTop .inner .badge {
        width: 15.5%;
        aspect-ratio: 100 / 99;
        top: 2.7%;
        left: 2.9%; }
      #homeTop .inner .hakari {
        width: 16.7%;
        aspect-ratio: 136 / 134;
        top: 18%;
        right: 5%; }
      #homeTop .inner .book {
        width: 14.2%;
        aspect-ratio: 113 / 93;
        top: 20.4%;
        left: 5%; }
      #homeTop .inner .kids {
        position: absolute;
        opacity: 0;
        transition: all .4s ease; }
        #homeTop .inner .kids img {
          width: 100%;
          height: auto; }
      #homeTop .inner .kids1 {
        width: 22.4%;
        aspect-ratio: 168 / 202;
        top: 76%;
        left: 2.4%; }
      #homeTop .inner .kids2 {
        width: 19.7%;
        aspect-ratio: 148 / 208;
        top: 74.9%;
        left: 22.5%; }
      #homeTop .inner .jfbaName {
        width: 34.7%;
        aspect-ratio: 158 / 79;
        position: absolute;
        top: 90.2%;
        right: 30.1%;
        z-index: 3; }
        #homeTop .inner .jfbaName img {
          width: 100%;
          height: auto; }
      #homeTop .inner .jfba {
        width: 43.7%;
        aspect-ratio: 328 / 358;
        position: absolute;
        top: 72.8%;
        right: 2.9%;
        opacity: 0;
        transition: all .4s ease; }
        #homeTop .inner .jfba img {
          width: 100%;
          height: auto; }
      #homeTop .inner.loaded .siteName {
        -webkit-animation: topLogoAnime .8s forwards ease;
                animation: topLogoAnime .8s forwards ease; }
      #homeTop .inner.loaded .fukidashi {
        -webkit-transform: scale(1);
                transform: scale(1); }
        #homeTop .inner.loaded .fukidashi.fukidashi1 {
          -webkit-animation-delay: .6s;
                  animation-delay: .6s; }
        #homeTop .inner.loaded .fukidashi.fukidashi2 {
          -webkit-animation-delay: .9s;
                  animation-delay: .9s; }
        #homeTop .inner.loaded .fukidashi.fukidashi3 {
          -webkit-animation-delay: 1.2s;
                  animation-delay: 1.2s; }
      #homeTop .inner.loaded .topIcon {
        opacity: 1;
        -webkit-animation: topIconAnime 3s infinite linear;
                animation: topIconAnime 3s infinite linear; }
        #homeTop .inner.loaded .topIcon.loupe {
          transition-delay: .8s;
          -webkit-animation-delay: 2.5s;
                  animation-delay: 2.5s; }
        #homeTop .inner.loaded .topIcon.badge {
          transition-delay: 1s;
          -webkit-animation-delay: 5s;
                  animation-delay: 5s; }
        #homeTop .inner.loaded .topIcon.hakari {
          transition-delay: 1s;
          -webkit-animation-delay: 5s;
                  animation-delay: 5s; }
        #homeTop .inner.loaded .topIcon.book {
          transition-delay: .8s;
          -webkit-animation-delay: 2.5s;
                  animation-delay: 2.5s; }
      #homeTop .inner.loaded .kids {
        opacity: 1;
        transition-delay: 1.2s;
        -webkit-animation: kidsAnime 13s infinite linear;
                animation: kidsAnime 13s infinite linear; }
        #homeTop .inner.loaded .kids.kids1 {
          -webkit-animation-delay: 2.5s;
                  animation-delay: 2.5s; }
        #homeTop .inner.loaded .kids.kids2 {
          -webkit-animation-delay: 3s;
                  animation-delay: 3s; }
      #homeTop .inner.loaded .jfbaName {
        opacity: 1;
        transition-delay: 1.4s; }
      #homeTop .inner.loaded .jfba {
        opacity: 1;
        transition-delay: 1.4s;
        -webkit-animation: jfbaAnime 10s infinite linear;
                animation: jfbaAnime 10s infinite linear;
        -webkit-animation-delay: 2s;
                animation-delay: 2s; }
      #homeTop .inner.loaded .read {
        opacity: 1;
        transition-delay: 1.6s; }
  @-webkit-keyframes topLogoAnime {
    0% {
      opacity: 0;
      -webkit-transform: scale(0);
              transform: scale(0); }
    50% {
      opacity: 1;
      -webkit-transform: scale(1.1);
              transform: scale(1.1); }
    85% {
      opacity: 1;
      -webkit-transform: scale(0.85);
              transform: scale(0.85); }
    100% {
      opacity: 1;
      -webkit-transform: scale(1);
              transform: scale(1); } }
  @keyframes topLogoAnime {
    0% {
      opacity: 0;
      -webkit-transform: scale(0);
              transform: scale(0); }
    50% {
      opacity: 1;
      -webkit-transform: scale(1.1);
              transform: scale(1.1); }
    85% {
      opacity: 1;
      -webkit-transform: scale(0.85);
              transform: scale(0.85); }
    100% {
      opacity: 1;
      -webkit-transform: scale(1);
              transform: scale(1); } }
  @-webkit-keyframes topIconAnime {
    0% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    5% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    10% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    15% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    20% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    25% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    30% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    35% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    40%, 100% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); } }
  @keyframes topIconAnime {
    0% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    5% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    10% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    15% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    20% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    25% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    30% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    35% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    40%, 100% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); } }
  @-webkit-keyframes jfbaAnime {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    3% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    6% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    9% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    12%, 100% {
      -webkit-transform: translateY(0);
              transform: translateY(0); } }
  @keyframes jfbaAnime {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    3% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    6% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    9% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    12%, 100% {
      -webkit-transform: translateY(0);
              transform: translateY(0); } }
  @-webkit-keyframes kidsAnime {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    2% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    4% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    6% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    8%, 100% {
      -webkit-transform: translateY(0);
              transform: translateY(0); } }
  @keyframes kidsAnime {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    2% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    4% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    6% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    8%, 100% {
      -webkit-transform: translateY(0);
              transform: translateY(0); } }
  #HomeMenu {
    position: relative;
    background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_sect2_bg2.webp);
    background-size: 16px 16px;
    padding: 80px 0 40px; }
    #HomeMenu:before {
      content: "";
      display: block;
      background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_sect2_bg1_sp.webp);
      background-size: 100% 36px;
      width: 90%;
      height: 36px;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 0; }
    #HomeMenu .inner {
      position: relative;
      z-index: 1;
      border: 10px solid #ffcc51;
      border-radius: 20px;
      background-color: #fff;
      padding: 8vw 2vw 17vw;
      position: relative; }
      #HomeMenu .inner .dot {
        position: absolute;
        width: 100%;
        height: 6px;
        left: 0;
        z-index: 1; }
        #HomeMenu .inner .dot:before, #HomeMenu .inner .dot:after {
          content: "";
          display: block;
          width: 6px;
          height: 6px;
          border-radius: 50%;
          background-color: #f76e00;
          position: absolute;
          top: 0; }
        #HomeMenu .inner .dot:before {
          left: 12px; }
        #HomeMenu .inner .dot:after {
          right: 12px; }
        #HomeMenu .inner .dot.dot1 {
          top: 12px; }
        #HomeMenu .inner .dot.dot2 {
          bottom: 12px; }
      #HomeMenu .inner:before {
        content: "";
        display: block;
        background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_sect2_jfba.webp);
        background-size: 100% auto;
        aspect-ratio: 186 / 203;
        width: 90px;
        position: absolute;
        bottom: -45px;
        left: -8px;
        z-index: 2; }
      #HomeMenu .inner:after {
        content: "";
        display: block;
        background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_sect2_book.webp);
        background-size: 100% auto;
        aspect-ratio: 125 / 95;
        width: 80px;
        position: absolute;
        top: -40px;
        right: -10px;
        -webkit-transform: rotate(10deg);
                transform: rotate(10deg);
        z-index: 2; }
      #HomeMenu .inner h2 {
        text-align: center;
        border-bottom: 1px solid #d4d4d4;
        font-size: 22px;
        font-weight: 700;
        padding-bottom: 20px;
        line-height: 1.9; }
        #HomeMenu .inner h2 ruby {
          font-size: 28px;
          border-bottom: 4px dotted #000; }
          #HomeMenu .inner h2 ruby:nth-of-type(1) {
            border-color: #f76e00; }
          #HomeMenu .inner h2 ruby:nth-of-type(2) {
            border-color: #0168b7; }
          #HomeMenu .inner h2 ruby:nth-of-type(3) {
            border-color: #ed3d2f; }
          #HomeMenu .inner h2 ruby rt {
            font-size: 12px; }
      #HomeMenu .inner .btns {
        width: 100%;
        margin-top: 35px;
        margin: 35px auto 0; }
        #HomeMenu .inner .btns .cell + .cell {
          margin-top: 5vw; }
        #HomeMenu .inner .btns .cell a {
          display: flex;
          align-items: center;
          border: 4px solid #000;
          border-bottom-width: 9px;
          border-radius: 10px;
          text-decoration: none;
          padding: 5vw 3vw;
          gap: 15px;
          position: relative;
          overflow: hidden;
          transition: all .3s ease; }
          #HomeMenu .inner .btns .cell a .icon {
            width: 60px;
            height: 60px;
            border-radius: 50%;
            background-color: #fff;
            background-position: 50%;
            background-repeat: no-repeat;
            background-size: 60% auto;
            position: relative;
            z-index: 5; }
          #HomeMenu .inner .btns .cell a .txt {
            font-size: 23px;
            font-weight: 700;
            color: #fff;
            text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.3);
            position: relative;
            z-index: 5;
            width: calc(100% - 75px); }
          #HomeMenu .inner .btns .cell a.shigoto {
            background-color: #f76e00;
            border-color: #db5200; }
            #HomeMenu .inner .btns .cell a.shigoto .icon {
              background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_hakari.webp); }
          #HomeMenu .inner .btns .cell a.narikata {
            background-color: #0db49a;
            border-color: #008f78; }
            #HomeMenu .inner .btns .cell a.narikata .icon {
              background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_badge.webp); }
          #HomeMenu .inner .btns .cell a.houritsu {
            background-color: #0168b7;
            border-color: #005393; }
            #HomeMenu .inner .btns .cell a.houritsu .icon {
              background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_book.webp); }
          #HomeMenu .inner .btns .cell a.saiban {
            background-color: #895ec2;
            border-color: #764ab0; }
            #HomeMenu .inner .btns .cell a.saiban .icon {
              background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_loupe.webp); }
  #homeMotto #mottoHead {
    background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_sect2_bg2.webp);
    background-size: 16px 16px;
    position: relative;
    overflow: hidden; }
    #homeMotto #mottoHead:before {
      content: "";
      display: block;
      width: 100%;
      aspect-ratio: 750 / 53;
      background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_motto_head_bg_sp.webp);
      background-size: 100% auto;
      background-repeat: no-repeat; }
    #homeMotto #mottoHead .inner {
      display: flex;
      justify-content: center;
      padding: 40px 5vw 30px;
      background-color: #fff;
      width: 100vw; }
      #homeMotto #mottoHead .inner h2 {
        position: relative;
        font-weight: 700;
        font-size: 22px;
        text-align: center; }
        #homeMotto #mottoHead .inner h2:before {
          content: "";
          display: block;
          background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/fukidashi_motto.webp);
          background-size: 100% auto;
          aspect-ratio: 112 / 78;
          width: 80px;
          position: absolute;
          top: -60px;
          left: -5vw; }
        #homeMotto #mottoHead .inner h2 span {
          font-size: 28px;
          display: block; }
  #homeMotto .bnr {
    background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_bnr_bg_sp.webp);
    background-size: 100% 280px;
    background-position: 50% bottom;
    background-repeat: no-repeat; }
    #homeMotto .bnr .inner a.oshiete, #homeMotto .bnr .inner a.bnrLink {
      width: 100%;
      display: block; }
      #homeMotto .bnr .inner a.oshiete + a, #homeMotto .bnr .inner a.bnrLink + a {
        margin-top: 30px; }
      #homeMotto .bnr .inner a.oshiete img, #homeMotto .bnr .inner a.bnrLink img {
        width: 100%;
        height: auto; }
  #homeMotto #movies {
    background-color: #0168b7;
    padding-top: 75px;
    padding-bottom: 80px; }
    #homeMotto #movies .inner h3 {
      font-size: 26px;
      font-weight: 700;
      color: #fff;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 15px; }
      #homeMotto #movies .inner h3 .icon {
        width: 50px;
        height: 50px;
        background-color: #fff;
        border-radius: 50%;
        background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_film.webp);
        background-size: 50% auto;
        background-position: 50%;
        background-repeat: no-repeat; }
    #homeMotto #movies .inner .items {
      display: flex;
      flex-direction: column;
      gap: 50px;
      margin-top: 50px; }
      #homeMotto #movies .inner .items .movie a {
        display: block;
        text-decoration: none;
        color: #fff; }
        #homeMotto #movies .inner .items .movie a .img {
          position: relative;
          display: block;
          transition: all .4s ease; }
          #homeMotto #movies .inner .items .movie a .img:after {
            content: "";
            display: block;
            background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_play.webp);
            width: 76px;
            height: 58px;
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translateX(-50%) translateY(-50%);
                    transform: translateX(-50%) translateY(-50%); }
          #homeMotto #movies .inner .items .movie a .img img {
            width: 100%; }
        #homeMotto #movies .inner .items .movie a .title {
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin-top: 13px;
          font-size: 18px; }
          #homeMotto #movies .inner .items .movie a .title:after {
            content: "";
            display: block;
            background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/arrow.webp);
            width: 23px;
            height: 23px; } }

@media print, screen and (min-width: 801px) {
  header .headerInner #headerSiteName {
    overflow: hidden; }
    header .headerInner #headerSiteName a {
      -webkit-transform: translateY(-100%);
              transform: translateY(-100%); }
  #homeTop {
    width: 100%;
    background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_fv_bg.webp);
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
    overflow: hidden; }
    #homeTop .inner {
      aspect-ratio: 1080 / 517;
      position: relative; }
      #homeTop .inner .siteName {
        position: absolute;
        width: 66.7%;
        aspect-ratio: 720 / 91;
        top: 36%;
        left: 0;
        right: 0;
        margin: 0 auto;
        opacity: 0;
        -webkit-transform: scale(0);
                transform: scale(0); }
        #homeTop .inner .siteName img {
          width: 100%;
          height: auto; }
      #homeTop .inner .read {
        font-size: 20px;
        font-weight: 700;
        color: #0d2538;
        text-align: center;
        position: absolute;
        top: 60%;
        left: 0;
        right: 0;
        margin: 0 auto;
        line-height: 2;
        opacity: 0;
        transition: all .4s ease; }
      #homeTop .inner .fukidashi {
        position: absolute;
        -webkit-transform: scale(0);
                transform: scale(0);
        -webkit-transform-origin: center bottom;
                transform-origin: center bottom;
        transition: all .4s ease;
        transition-delay: .5s; }
        #homeTop .inner .fukidashi img {
          width: 100%;
          height: auto; }
      #homeTop .inner .fukidashi1 {
        width: 10%;
        aspect-ratio: 148 / 105;
        top: 12.6%;
        left: 33%; }
      #homeTop .inner .fukidashi2 {
        width: 10%;
        aspect-ratio: 148 / 102;
        top: 16.2%;
        left: 44%; }
      #homeTop .inner .fukidashi3 {
        width: 11.8%;
        aspect-ratio: 176 / 106;
        top: 12.4%;
        left: 55.1%; }
      #homeTop .inner .topIcon {
        position: absolute;
        transition: all .2s linear;
        opacity: 0; }
        #homeTop .inner .topIcon img {
          width: 100%;
          height: auto; }
      #homeTop .inner .loupe {
        width: 8.9%;
        aspect-ratio: 111 / 116;
        top: 40%;
        left: -3.3%; }
      #homeTop .inner .badge {
        width: 9%;
        aspect-ratio: 100 / 99;
        top: 10.3%;
        left: 10.6%; }
      #homeTop .inner .hakari {
        width: 11.2%;
        aspect-ratio: 136 / 134;
        top: 5.4%;
        right: 11%; }
      #homeTop .inner .book {
        width: 10.4%;
        aspect-ratio: 113 / 93;
        top: 25.5%;
        right: -3%; }
      #homeTop .inner .kids {
        position: absolute;
        opacity: 0;
        transition: all .4s ease; }
        #homeTop .inner .kids img {
          width: 100%;
          height: auto; }
      #homeTop .inner .kids1 {
        width: 11.2%;
        aspect-ratio: 168 / 202;
        top: 71.6%;
        left: 7.4%; }
      #homeTop .inner .kids2 {
        width: 9.9%;
        aspect-ratio: 148 / 208;
        top: 69.6%;
        left: 17.2%; }
      #homeTop .inner .jfbaName {
        width: 15.2%;
        aspect-ratio: 158 / 79;
        position: absolute;
        top: 85.3%;
        right: 16.9%;
        opacity: 0;
        transition: all .4s ease; }
        #homeTop .inner .jfbaName img {
          width: 100%;
          height: auto; }
      #homeTop .inner .jfba {
        width: 17.7%;
        aspect-ratio: 328 / 358;
        position: absolute;
        top: 58%;
        right: 3.8%;
        opacity: 0;
        transition: all .4s ease; }
        #homeTop .inner .jfba img {
          width: 100%;
          height: auto; }
      #homeTop .inner.loaded .siteName {
        -webkit-animation: topLogoAnime .8s forwards ease;
                animation: topLogoAnime .8s forwards ease; }
      #homeTop .inner.loaded .fukidashi {
        -webkit-transform: scale(1);
                transform: scale(1); }
        #homeTop .inner.loaded .fukidashi.fukidashi1 {
          -webkit-animation-delay: .6s;
                  animation-delay: .6s; }
        #homeTop .inner.loaded .fukidashi.fukidashi2 {
          -webkit-animation-delay: .9s;
                  animation-delay: .9s; }
        #homeTop .inner.loaded .fukidashi.fukidashi3 {
          -webkit-animation-delay: 1.2s;
                  animation-delay: 1.2s; }
      #homeTop .inner.loaded .topIcon {
        opacity: 1;
        -webkit-animation: topIconAnime 3s infinite linear;
                animation: topIconAnime 3s infinite linear; }
        #homeTop .inner.loaded .topIcon.loupe {
          transition-delay: .8s;
          -webkit-animation-delay: 2.5s;
                  animation-delay: 2.5s; }
        #homeTop .inner.loaded .topIcon.badge {
          transition-delay: 1s;
          -webkit-animation-delay: 5s;
                  animation-delay: 5s; }
        #homeTop .inner.loaded .topIcon.hakari {
          transition-delay: 1s;
          -webkit-animation-delay: 5s;
                  animation-delay: 5s; }
        #homeTop .inner.loaded .topIcon.book {
          transition-delay: .8s;
          -webkit-animation-delay: 2.5s;
                  animation-delay: 2.5s; }
      #homeTop .inner.loaded .kids {
        opacity: 1;
        transition-delay: 1.2s;
        -webkit-animation: kidsAnime 13s infinite linear;
                animation: kidsAnime 13s infinite linear; }
        #homeTop .inner.loaded .kids.kids1 {
          -webkit-animation-delay: 2.5s;
                  animation-delay: 2.5s; }
        #homeTop .inner.loaded .kids.kids2 {
          -webkit-animation-delay: 3s;
                  animation-delay: 3s; }
      #homeTop .inner.loaded .jfbaName {
        opacity: 1;
        transition-delay: 1.4s; }
      #homeTop .inner.loaded .jfba {
        opacity: 1;
        transition-delay: 1.4s;
        -webkit-animation: jfbaAnime 10s infinite linear;
                animation: jfbaAnime 10s infinite linear;
        -webkit-animation-delay: 2s;
                animation-delay: 2s; }
      #homeTop .inner.loaded .read {
        opacity: 1;
        transition-delay: 1.6s; }
  @-webkit-keyframes topLogoAnime {
    0% {
      opacity: 0;
      -webkit-transform: scale(0);
              transform: scale(0); }
    50% {
      opacity: 1;
      -webkit-transform: scale(1.1);
              transform: scale(1.1); }
    85% {
      opacity: 1;
      -webkit-transform: scale(0.85);
              transform: scale(0.85); }
    100% {
      opacity: 1;
      -webkit-transform: scale(1);
              transform: scale(1); } }
  @keyframes topLogoAnime {
    0% {
      opacity: 0;
      -webkit-transform: scale(0);
              transform: scale(0); }
    50% {
      opacity: 1;
      -webkit-transform: scale(1.1);
              transform: scale(1.1); }
    85% {
      opacity: 1;
      -webkit-transform: scale(0.85);
              transform: scale(0.85); }
    100% {
      opacity: 1;
      -webkit-transform: scale(1);
              transform: scale(1); } }
  @-webkit-keyframes topIconAnime {
    0% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    5% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    10% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    15% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    20% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    25% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    30% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    35% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    40%, 100% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); } }
  @keyframes topIconAnime {
    0% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    5% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    10% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    15% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    20% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    25% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    30% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); }
    35% {
      -webkit-transform: rotate(-5deg);
              transform: rotate(-5deg); }
    40%, 100% {
      -webkit-transform: rotate(5deg);
              transform: rotate(5deg); } }
  @-webkit-keyframes jfbaAnime {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    3% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    6% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    9% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    12%, 100% {
      -webkit-transform: translateY(0);
              transform: translateY(0); } }
  @keyframes jfbaAnime {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    3% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    6% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    9% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    12%, 100% {
      -webkit-transform: translateY(0);
              transform: translateY(0); } }
  @-webkit-keyframes kidsAnime {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    2% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    4% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    6% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    8%, 100% {
      -webkit-transform: translateY(0);
              transform: translateY(0); } }
  @keyframes kidsAnime {
    0% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    2% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    4% {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
    6% {
      -webkit-transform: translateY(-20px);
              transform: translateY(-20px); }
    8%, 100% {
      -webkit-transform: translateY(0);
              transform: translateY(0); } }
  #HomeMenu {
    position: relative;
    background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_sect2_bg2.webp);
    padding-bottom: 65px;
    padding-top: 50px; }
    #HomeMenu:before {
      content: "";
      display: block;
      background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_sect2_bg1.webp);
      background-size: 100% 137px;
      width: 100%;
      height: 137px;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 0; }
    #HomeMenu .inner {
      position: relative;
      z-index: 1;
      border: 16px solid #ffcc51;
      border-radius: 25px;
      background-color: #fff;
      padding: 25px 40px;
      position: relative; }
      #HomeMenu .inner .dot {
        position: absolute;
        width: 100%;
        height: 6px;
        left: 0;
        z-index: 1; }
        #HomeMenu .inner .dot:before, #HomeMenu .inner .dot:after {
          content: "";
          display: block;
          width: 6px;
          height: 6px;
          border-radius: 50%;
          background-color: #f76e00;
          position: absolute;
          top: 0; }
        #HomeMenu .inner .dot:before {
          left: 12px; }
        #HomeMenu .inner .dot:after {
          right: 12px; }
        #HomeMenu .inner .dot.dot1 {
          top: 12px; }
        #HomeMenu .inner .dot.dot2 {
          bottom: 12px; }
      #HomeMenu .inner:before {
        content: "";
        display: block;
        background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_sect2_jfba.webp);
        width: 186px;
        height: 203px;
        position: absolute;
        bottom: -35px;
        left: -77px;
        z-index: 2; }
      #HomeMenu .inner:after {
        content: "";
        display: block;
        background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_sect2_book.webp);
        width: 125px;
        height: 95px;
        position: absolute;
        top: 70px;
        right: -20px;
        -webkit-transform: rotate(10deg);
                transform: rotate(10deg);
        z-index: 2; }
      #HomeMenu .inner h2 {
        text-align: center;
        border-bottom: 1px solid #d4d4d4;
        font-size: 36px;
        font-weight: 700;
        padding-bottom: 20px; }
        #HomeMenu .inner h2 ruby {
          font-size: 46px;
          border-bottom: 4px dotted #000; }
          #HomeMenu .inner h2 ruby:nth-of-type(1) {
            border-color: #f76e00; }
          #HomeMenu .inner h2 ruby:nth-of-type(2) {
            border-color: #0168b7; }
          #HomeMenu .inner h2 ruby:nth-of-type(3) {
            border-color: #ed3d2f; }
          #HomeMenu .inner h2 ruby rt {
            font-size: 14px; }
      #HomeMenu .inner .btns {
        position: relative;
        z-index: 5;
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 1fr 1fr;
            grid-template-columns: 1fr 1fr;
        -ms-grid-rows: 1fr 1fr;
            grid-template-rows: 1fr 1fr;
        gap: 20px;
        margin-top: 35px;
        max-width: 824px;
        margin: 35px auto 0; }
        #HomeMenu .inner .btns .cell a {
          display: flex;
          align-items: center;
          border: 4px solid #000;
          border-bottom-width: 9px;
          border-radius: 10px;
          text-decoration: none;
          padding: 22px;
          gap: 22px;
          position: relative;
          overflow: hidden;
          transition: all .5s ease; }
          #HomeMenu .inner .btns .cell a:after {
            content: "";
            display: block;
            background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/menu_jfba.webp);
            width: 85px;
            height: 85px;
            position: absolute;
            bottom: -85px;
            right: -85px;
            transition: all .5s ease; }
          #HomeMenu .inner .btns .cell a:hover {
            -webkit-transform: scale(1.03);
                    transform: scale(1.03); }
            #HomeMenu .inner .btns .cell a:hover:after {
              bottom: -27px;
              right: -13px; }
          #HomeMenu .inner .btns .cell a .icon {
            width: 80px;
            height: 80px;
            border-radius: 50%;
            background-color: #fff;
            background-position: 50%;
            background-repeat: no-repeat;
            background-size: 60% auto;
            position: relative;
            z-index: 5; }
          #HomeMenu .inner .btns .cell a .txt {
            font-size: 30px;
            font-weight: 700;
            color: #fff;
            text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.3);
            position: relative;
            z-index: 5; }
          #HomeMenu .inner .btns .cell a.shigoto {
            background-color: #f76e00;
            border-color: #db5200; }
            #HomeMenu .inner .btns .cell a.shigoto .icon {
              background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_hakari.webp); }
          #HomeMenu .inner .btns .cell a.narikata {
            background-color: #0db49a;
            border-color: #008f78; }
            #HomeMenu .inner .btns .cell a.narikata .icon {
              background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_badge.webp); }
          #HomeMenu .inner .btns .cell a.houritsu {
            background-color: #0168b7;
            border-color: #005393; }
            #HomeMenu .inner .btns .cell a.houritsu .icon {
              background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_book.webp); }
          #HomeMenu .inner .btns .cell a.saiban {
            background-color: #895ec2;
            border-color: #764ab0; }
            #HomeMenu .inner .btns .cell a.saiban .icon {
              background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_loupe.webp); }
  #homeMotto #mottoHead {
    background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_sect2_bg2.webp);
    position: relative;
    overflow: hidden; }
    #homeMotto #mottoHead:before {
      content: "";
      display: block;
      width: 100%;
      height: 300px;
      background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_motto_head_bg.webp);
      background-size: 100% 300px;
      position: absolute;
      top: 15px;
      left: 0; }
    #homeMotto #mottoHead .inner {
      display: flex;
      justify-content: center;
      padding: 100px 0 50px; }
      #homeMotto #mottoHead .inner h2 {
        position: relative;
        font-weight: 700;
        font-size: 36px; }
        #homeMotto #mottoHead .inner h2:before {
          content: "";
          display: block;
          background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/fukidashi_motto.webp);
          width: 112px;
          height: 78px;
          position: absolute;
          top: -90px;
          left: -30px; }
        #homeMotto #mottoHead .inner h2 span {
          font-size: 46px; }
  #homeMotto .bnr {
    background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/home_bnr_bg.webp);
    background-size: 100% 300px;
    background-position: 50% bottom;
    background-repeat: no-repeat; }
    #homeMotto .bnr .inner a.oshiete {
      width: 100%;
      transition: all .4s ease;
      display: block; }
      #homeMotto .bnr .inner a.oshiete:hover {
        -webkit-transform: scale(1.05);
                transform: scale(1.05); }
      #homeMotto .bnr .inner a.oshiete img {
        width: 100%;
        height: auto; }
    #homeMotto .bnr .inner a.bnrLink {
      width: 100%;
      margin-top: 30px;
      display: block;
      border-radius: 10px;
      overflow: hidden;
      transition: all .4s ease; }
      #homeMotto .bnr .inner a.bnrLink:hover {
        -webkit-transform: scale(1.05);
                transform: scale(1.05); }
      #homeMotto .bnr .inner a.bnrLink img {
        width: 100%; }
  #homeMotto #movies {
    background-color: #0168b7;
    padding-top: 75px;
    padding-bottom: 50px; }
    #homeMotto #movies .inner h3 {
      font-size: 36px;
      font-weight: 700;
      color: #fff;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 15px; }
      #homeMotto #movies .inner h3 .icon {
        width: 67px;
        height: 67px;
        background-color: #fff;
        border-radius: 50%;
        background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_film.webp);
        background-size: 50% auto;
        background-position: 50%;
        background-repeat: no-repeat; }
    #homeMotto #movies .inner .items {
      display: flex;
      gap: 38px;
      margin-top: 50px; }
      #homeMotto #movies .inner .items .movie a {
        display: block;
        text-decoration: none;
        color: #fff;
        transition: all .4s ease; }
        #homeMotto #movies .inner .items .movie a .img {
          position: relative;
          display: block; }
          #homeMotto #movies .inner .items .movie a .img:after {
            content: "";
            display: block;
            background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/icon_play.webp);
            width: 76px;
            height: 58px;
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translateX(-50%) translateY(-50%);
                    transform: translateX(-50%) translateY(-50%); }
          #homeMotto #movies .inner .items .movie a .img img {
            width: 100%; }
        #homeMotto #movies .inner .items .movie a .title {
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin-top: 13px;
          font-size: 18px; }
          #homeMotto #movies .inner .items .movie a .title:after {
            content: "";
            display: block;
            background-image: url(https://www.nichibenren.or.jp/library/images/kodomo2024/arrow.webp);
            width: 23px;
            height: 23px; }
        #homeMotto #movies .inner .items .movie a:hover {
          -webkit-transform: scale(1.05);
                  transform: scale(1.05); } }

/*# sourceMappingURL=map/kodomo2024home.css.map */
