@charset "UTF-8";
/* ボックスレイアウト
=========================================== */
.flex.col_1 > div {
  width: 100%; }
  @media only screen and (max-width: 767px) {
    .flex.col_1 > div {
      width: 100%; } }

.flex.flex-between.col_1 > div {
  width: 98.5%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_1 > div {
      width: 100%; } }

.flex.col_2 > div {
  width: 50%; }
  @media only screen and (max-width: 767px) {
    .flex.col_2 > div {
      width: 100%; } }

.flex.flex-between.col_2 > div {
  width: 48.5%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_2 > div {
      width: 100%; } }

.flex.col_3 > div {
  width: 33.3333333333%; }
  @media only screen and (max-width: 767px) {
    .flex.col_3 > div {
      width: 100%; } }

.flex.flex-between.col_3 > div {
  width: 31.8333333333%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_3 > div {
      width: 100%; } }

.flex.col_4 > div {
  width: 25%; }
  @media only screen and (max-width: 767px) {
    .flex.col_4 > div {
      width: 100%; } }

.flex.flex-between.col_4 > div {
  width: 23.5%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_4 > div {
      width: 100%; } }

.flex.col_5 > div {
  width: 20%; }
  @media only screen and (max-width: 767px) {
    .flex.col_5 > div {
      width: 100%; } }

.flex.flex-between.col_5 > div {
  width: 18.5%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_5 > div {
      width: 100%; } }

.flex.col_6 > div {
  width: 16.6666666667%; }
  @media only screen and (max-width: 767px) {
    .flex.col_6 > div {
      width: 100%; } }

.flex.flex-between.col_6 > div {
  width: 15.1666666667%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_6 > div {
      width: 100%; } }

.flex.col_7 > div {
  width: 14.2857142857%; }
  @media only screen and (max-width: 767px) {
    .flex.col_7 > div {
      width: 100%; } }

.flex.flex-between.col_7 > div {
  width: 12.7857142857%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_7 > div {
      width: 100%; } }

.flex.col_8 > div {
  width: 12.5%; }
  @media only screen and (max-width: 767px) {
    .flex.col_8 > div {
      width: 100%; } }

.flex.flex-between.col_8 > div {
  width: 11%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_8 > div {
      width: 100%; } }

.flex.col_9 > div {
  width: 11.1111111111%; }
  @media only screen and (max-width: 767px) {
    .flex.col_9 > div {
      width: 100%; } }

.flex.flex-between.col_9 > div {
  width: 9.6111111111%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_9 > div {
      width: 100%; } }

.flex.col_10 > div {
  width: 10%; }
  @media only screen and (max-width: 767px) {
    .flex.col_10 > div {
      width: 100%; } }

.flex.flex-between.col_10 > div {
  width: 8.5%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_10 > div {
      width: 100%; } }

.flex.col_11 > div {
  width: 9.0909090909%; }
  @media only screen and (max-width: 767px) {
    .flex.col_11 > div {
      width: 100%; } }

.flex.flex-between.col_11 > div {
  width: 7.5909090909%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_11 > div {
      width: 100%; } }

.flex.col_12 > div {
  width: 8.3333333333%; }
  @media only screen and (max-width: 767px) {
    .flex.col_12 > div {
      width: 100%; } }

.flex.flex-between.col_12 > div {
  width: 6.8333333333%; }
  @media only screen and (max-width: 767px) {
    .flex.flex-between.col_12 > div {
      width: 100%; } }

/* 游ゴシック
=========================================== */
@font-face {
  font-family: "Yu Gothic","Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  src: local("Yu Gothic Medium");
  font-weight: 100; }
@font-face {
  font-family: "Yu Gothic","Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  src: local("Yu Gothic Medium");
  font-weight: 200; }
@font-face {
  font-family: "Yu Gothic","Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  src: local("Yu Gothic Medium");
  font-weight: 300; }
@font-face {
  font-family: "Yu Gothic","Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  src: local("Yu Gothic Medium");
  font-weight: 400; }
@font-face {
  font-family: "Yu Gothic","Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  src: local("Yu Gothic Bold");
  font-weight: bold; }
/* 矢印
=========================================== */
/* 角丸
=========================================== */
@media only screen and (max-width: 960px) {
  #main_visual {
    margin: 0;
  }
}
#main_visual .container {
  max-width: 1880px;
  margin-left: auto;
  margin-right: auto;
  position: relative; }
  #main_visual .container #visual_image {
    height: 550px;
    margin-top: 9px; }
    @media only screen and (max-width: 960px) {
      #main_visual .container #visual_image {
        margin-top: 0; } }
    #main_visual .container #visual_image > div {
      width: 50%;
      background-repeat: no-repeat;
      background-size: cover; }
  #main_visual .container #ab_contents {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 0 0 0 0;
    padding-left: 3%;
    padding-right: 3%; }
    @media only screen and (max-width: 767px) {
      #main_visual .container #ab_contents {
        position: static;
        padding-left: 0;
        padding-right: 0; } }
    #main_visual .container #ab_contents #catch_copy {
      text-align: center;
      padding: 4em 0 4em 0; }
  #main_visual .container #top_news {
    width: 48%;
    margin-left: auto;
    margin-right: 0; }
    @media only screen and (max-width: 767px) {
      #main_visual .container #top_news {
        width: 100%;
        position: relative; }
        #main_visual .container #top_news .flex {
          position: relative;
          z-index: 2;
          padding-top: 20px; }
        #main_visual .container #top_news:before {
          content: "";
          display: block;
          width: 100vw;
          height: 100%;
          position: absolute;
          left: calc(-3% - 1px);
          top: 0;
          background-color: #fff;
          z-index: 0; } }
    #main_visual .container #top_news.slick-initialized .slick-list {
      margin: 0 40px; }
      #main_visual .container #top_news.slick-initialized .slick-list .slick-slide {
        position: relative;
        overflow: hidden;
        display: flex !important;
        display: -webkit-flex !important; }
        #main_visual .container #top_news.slick-initialized .slick-list .slick-slide p.date {
          width: 20%;
          font-family: "Yu Gothic", sans-serif;
        }
          @media only screen and (max-width: 1000px) {
            #main_visual .container #top_news.slick-initialized .slick-list .slick-slide p.date {
              width: 25%; } }
          @media only screen and (max-width: 767px) {
            #main_visual .container #top_news.slick-initialized .slick-list .slick-slide p.date {
              width: 100%; } }
        #main_visual .container #top_news.slick-initialized .slick-list .slick-slide p.post_content {
          width: 80%;
          padding-left: 20px; }
          @media only screen and (max-width: 1000px) {
            #main_visual .container #top_news.slick-initialized .slick-list .slick-slide p.post_content {
              width: 75%; } }
          @media only screen and (max-width: 767px) {
            #main_visual .container #top_news.slick-initialized .slick-list .slick-slide p.post_content {
              width: 100%;
              padding-left: 0; } }
          #main_visual .container #top_news.slick-initialized .slick-list .slick-slide p.post_content a {
            color: #000;
            font-family: "Yu Gothic", sans-serif;
          }
    #main_visual .container #top_news.slick-initialized .slick-prev {
      left: 0;
      width: 20px;
      height: 20px;
      background: #ccc;
      border-radius: 25px; }
      #main_visual .container #top_news.slick-initialized .slick-prev:before {
        color: #000;
        content: "<";
        line-height: 100%;
        color: #fff;
        font-size: 15px; }
    #main_visual .container #top_news.slick-initialized .slick-next {
      right: 0;
      width: 20px;
      height: 20px;
      background: #ccc;
      border-radius: 25px; }
      #main_visual .container #top_news.slick-initialized .slick-next:before {
        color: #000;
        content: ">";
        line-height: 100%;
        color: #fff;
        font-size: 15px; }
  #main_visual .container a#scroll {
    display: inline-block;
    color: #000;
    transform: rotate(90deg);
    position: absolute;
    left: 45%;
    bottom: 0; }
    @media only screen and (max-width: 767px) {
      #main_visual .container a#scroll {
        display: none; } }
    #main_visual .container a#scroll:before {
      content: "";
      display: block;
      width: 1px;
      height: 70px;
      background-color: #000;
      position: absolute;
      left: 120px;
      bottom: -22px;
      transform: rotate(90deg); }


  #main_visual #slider_container {
    margin: 12px 0 0;
  }
  #main_visual #slider_main_container {
    display: block;
    padding: 15px 0 100px;
    background-color: #EEF9FF;
  }
  @media only screen and (max-width: 767px) {
    #main_visual #slider_main_container {
      display: none;
    }
  }
  #main_visual #slider_main_container.sp {
    display: none;
  }
  @media only screen and (max-width: 767px) {
    #main_visual #slider_main_container.sp {
      display: block;
      padding: 15px 0 30px;
    }
  }
  #main_visual #slider_main_container #slider_main {
    max-width: 1300px;
    margin: 15px auto;
    padding: 0 50px;
  }
  @media only screen and (max-width: 767px) {
    #main_visual #slider_main_container #slider_main {
      max-width: 756px;
      margin: 15px auto 20px;
      padding: 0 25px;
    }
  }
  #main_visual #slider_main_container #slider_main .slick-list {
    box-shadow: 2px 2px 15px 0 rgba(0, 0, 0, 0.1);
  }
  #main_visual #slider_main_container #slider_main > div {
    width: 100%;
  }
  #main_visual #slider_main_container #slider_main .slick-dots {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    gap: 20px;
    left: 0;
    margin: 15px auto;
    padding: 0 50px;
    bottom: auto;
  }
  @media only screen and (max-width: 767px) {
    #main_visual #slider_main_container #slider_main .slick-dots {
      position: absolute;
      margin: 15px auto;
      gap: 8px;
    }
  }
  #main_visual #slider_main_container #slider_main .slick-dots li {
    margin: 0;
    max-width: 275px;
    width: 100%;
    height: auto;
  }
  @media only screen and (max-width: 767px) {
    #main_visual #slider_main_container #slider_main .slick-dots li {
      margin: 0;
      width: auto;
      height: auto;
    }
    #main_visual #slider_main_container #slider_main .slick-dots li button:before {
      font-size: 21px;
      color: #D2D2D2;
      opacity: 1;
    }
    #main_visual #slider_main_container #slider_main .slick-dots li.slick-active button:before {
      color: #48A2D8;
    }
  }
  #main_visual #slider_main_container #slider_main .slick-dots li img {
    width: 100%;
    border: 2px solid #EEF9FF;
  }
  #main_visual #slider_main_container #slider_main .slick-dots li.slick-active img {
    border: 2px solid #7DBCDD;
  }
  #main_visual #slider_main_container #slider_main.slick-initialized .slick-prev {
    left: 25px;
    width: 50px;
    height: 50px;
    background: #FFF;
    border-radius: 25px;
    z-index: 5;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.1);
  }
  @media only screen and (max-width: 767px) {
    #main_visual #slider_main_container #slider_main.slick-initialized .slick-prev {
      left: 8px;
      width: 35px;
      height: 35px;
    }
  }
  #main_visual #slider_main_container #slider_main.slick-initialized .slick-prev:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    border-left: 2px solid #AFBBC7;
    border-bottom: 2px solid #AFBBC7;
    display: inline-block;
    top: calc(50% - 3.535px - 2px);
    left: calc(50% - 3.535px);
    transform: rotate(45deg);
  }
  @media only screen and (max-width: 767px) {
    #main_visual #slider_main_container #slider_main.slick-initialized .slick-prev:before {
      width: 8px;
      height: 8px;
      top: calc(50% - 2.828px - 2px);
      left: calc(50% - 2.828px - 1px);
    }
  }
  #main_visual #slider_main_container #slider_main.slick-initialized .slick-next {
    right: 25px;
    width: 50px;
    height: 50px;
    background: #FFF;
    border-radius: 25px;
    z-index: 5;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.1);
  }
  @media only screen and (max-width: 767px) {
    #main_visual #slider_main_container #slider_main.slick-initialized .slick-next {
      right: 8px;
      width: 35px;
      height: 35px;
    }
  }
  #main_visual #slider_main_container #slider_main.slick-initialized .slick-next:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    border-right: 2px solid #AFBBC7;
    border-top: 2px solid #AFBBC7;
    display: inline-block;
    top: calc(50% - 3.535px - 2px);
    left: calc(50% - 10.605px + 2px);
    transform: rotate(45deg);
  }
  @media only screen and (max-width: 767px) {
    #main_visual #slider_main_container #slider_main.slick-initialized .slick-next:before {
      width: 8px;
      height: 8px;
      top: calc(50% - 2.828px - 2px);
      left: calc(50% - 8.484px + 2px);
    }
  }
  #main_visual .container #ab_contents {
    position: relative;
    padding-left: 0;
    padding-right: 0;
  }
  #main_visual .container.top-news {
    margin: 30px 0 0;
  }
  @media only screen and (max-width: 767px) {
    #main_visual .container.top-news {
      margin: 0;
    }
  }
  #main_visual .top-news-container {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 30px 0 0;
    justify-content: space-around;
    gap: 40px;
    max-width: 1200px;
    min-height: 50px;
    width: 100%;
    margin: 0 auto;
  }
  @media only screen and (max-width: 767px) {
    #main_visual .top-news-container {
      width: auto;
      height: auto;
    }
  }
  #main_visual .top-news-container .top-news-header {
    font-family: "Noto Serif JP", serif;
    font-size: 30px;
    flex-basis: 150px;
    white-space: nowrap;
  }
  @media only screen and (max-width: 767px) {
    #main_visual .top-news-container .top-news-header {
      display: none;
    }
  }
  #main_visual #top_news {
    margin-left: 0;
    margin-right: 0;
    flex-grow: 1;
  }
  @media only screen and (max-width: 767px) {
    #main_visual #top_news {
      width: 100%;
    }
    #main_visual #top_news:before {
      display: none;
    }
  }
  @media only screen and (max-width: 767px) {
    #main_visual #top_news.slick-initialized .slick-list .slick-slide {
      flex-direction: column;
    }
    #main_visual #top_news.slick-initialized .slick-list .slick-slide p.post_content {
      padding: 0;
    }
  }

section {
  padding: 3.5em 0 0 0; }
  section h2 {
    letter-spacing: 0.2em;
    font-weight: normal;
    text-align: center;
    font-size: 35px; }
    @media only screen and (max-width: 500px) {
      section h2 {
        font-size: 30px; } }
    @media only screen and (max-width: 425px) {
      section h2 {
        font-size: 26px; } }
#kyozai {
  padding-top: 90px;
}
#kyozai h2 {
  background: #f6d2d2;
  transform: translateY(-50%);
  padding: 22px 0;
  max-width: 640px;
  margin: auto;
}
#kyozai .specialty h2 {
  background: #f5e0bd;
}
@media only screen and (max-width: 767px) {
  #kyozai {
    padding-top: 75px;
  }
  #kyozai h2 {
    font-size: 15px;
    padding: 14px 0;
    max-width: 267px;
  }
}
#kyozai .container > .flex > div {
  width: 48.333333%;
  border: 1px solid #535353;
  padding: 0 30px 30px 30px;
}
@media ( max-width : 767px ) {
  #kyozai .container > .flex > div {
    padding: 0 3% 3% 3%;
  }
}
#kyozai .container > .flex > div.specialty {
  padding: 0 20px 30px 20px;
}
@media ( max-width : 767px ) {
  #kyozai .container > .flex > div.specialty {
    padding: 0 3% 3%;
    margin-top: 25px;
  }
}
#kyozai .container > .flex > div.specialty .sp {
  display: none;
}
@media ( max-width : 767px ) {
  #kyozai .container > .flex > div.specialty .sp {
    display: block;
  }
}
#kyozai .container > .flex > div .flex {
  justify-content: space-between;
}
#kyozai .container > .flex > div .flex > div a.digital {
         font-size: 18px; padding-top: 18px; }
#kyozai .container > .flex > div .flex > div a.digital_txt {
         font-size: 15px; padding: 20px 17px 10px 0px; letter-spacing: -.03em; }
  @media only screen and (max-width: 767px) {
    #kyozai .container > .flex > div {
      width: 100%;
      margin-bottom: 30px; } }
  #kyozai .container > .flex > div h2 {
    margin-bottom: 20px; }
  #kyozai .container > .flex > div p {
    text-align: center;
    margin-bottom: 36px;
    margin-top: -30px;
    font-family: "Yu Gothic", sans-serif; }
  @media only screen and (max-width: 767px) {
    #kyozai .container > .flex > div .flex {
      flex-wrap: wrap;
    }
    #kyozai .container > .flex > div p {
      font-size: 12px;
      margin-bottom: 22px;
    }
  }
  #kyozai .container > .flex > div .flex > div {
    min-height: 54px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 33.33333%;
    max-width: 210px; }
  @media only screen and (max-width: 1520px) {
    #kyozai .container > .flex > div .flex > div {
      width: 32%; } }
  #kyozai .container > .flex > div.specialty .flex > div {
    width: 49%;
    max-width: 330px; }
    @media only screen and (max-width: 1136px) {
      #kyozai .container > .flex > div .flex > div {
        width: 49%; } }
    #kyozai .container > .flex > div .flex > div a {
      display: block;
      text-align: center;
      padding: 16px 20px 10px 10px;
      font-size: 20px;
      border: 1px #000 solid;
      color: #000;
      font-family: "Yu Gothic", sans-serif;
      position: relative;
      text-decoration: none;
      height: 65px;
      width: 100%;
      margin: 0 0 20px; }
		#kyozai .container > .flex > div .flex > div a.blue_box {
			color: #13b9d7;
			border-color: #13b9d7; }
      @media only screen and (max-width: 640px) {
        #kyozai .container > .flex > div .flex > div a {
          font-size: 14px;
          line-height: 2.3;
          margin-bottom: 10px;
          padding-top: 14px;
        }
      }
      #kyozai .container > .flex > div .flex > div a:before {
        content: "";
        display: block;
        width: 8px;
        height: 8px;
        border-bottom: 1px #000 solid;
        border-right: 1px #000 solid;
        transform: rotate(-45deg);
        position: absolute;
        right: 10px;
        top: 42%; }
      #kyozai .container > .flex > div .flex > div a.blue_box:before {
        border-bottom-color: #13b9d7;
        border-right-color: #13b9d7;
}
      #kyozai .container > .flex > div .flex > div a.down_arrow:before {
        transform: rotate(45deg);
        top: calc(42% - 3px); }
      #kyozai .container > .flex > div .flex > div a:hover {
        background-color: #13b9d7;
        color: #fff;
        border-color: #13b9d7; }
        #kyozai .container > .flex > div .flex > div a:hover:before {
          border-color: #fff; }
      @media only screen and (max-width: 1520px) {
        #kyozai .container > .flex > div .flex > div a.digital {
          line-height: 1.6;
          font-size: 15px;
          padding-top: 19px; }
        #kyozai .container > .flex > div .flex > div a.digital_txt {
          padding-top: 11px;}
        #kyozai .container > .flex > div .flex > div a.digital_txt span {
          display: block;} }
      @media only screen and (max-width: 1300px) {
        #kyozai .container > .flex > div .flex > div a.digital {
          font-size: 12px;
          padding-top: 22px; }
        #kyozai .container > .flex > div .flex > div a.digital_txt {
          padding-top: 15px;} }
      @media only screen and (max-width: 1200px) {
        #kyozai .container > .flex > div .flex > div a.digital {
          line-height: 1.3; } }
      @media only screen and (max-width: 1200px) {
        #kyozai .container > .flex > div .flex > div a.digital span {
          display: block;
        }
        #kyozai .container > .flex > div .flex > div a.digital {
          padding-top: 15px;
        }
      }
      @media only screen and (max-width: 450px) {
        #kyozai .container > .flex > div .flex > div a.digital {
          font-size: 14px;
          line-height: 1.3; } }


/*#kyozai .container > .flex > div.specialty .flex.col_3 > div {
    width: 210px; }*/
/*  @media only screen and (max-width: 1480px) {
    #kyozai .container > .flex.specialty > div .flex.col_3 > div {
      width: 49%; } }*/
#kyozai .container > .flex > div.specialty .flex.col_3 > div {
width: 33.33333%;
max-width: 210px;
}
@media only screen and (max-width: 1520px) {
    #kyozai .container > .flex > div.specialty .flex.col_3 > div {
      width: 32%; } }
@media only screen and (max-width: 1136px) {
      #kyozai .container > .flex > div.specialty .flex.col_3 > div {
        width: 49%;
    max-width: 330px; } }

#kyozai .container > .flex > div.specialty .flex.col_3 > div span {
    display: inline-block;}
#kyozai .container > .flex > div .flex.col_3 > div a.digital_txt {
		font-size: 15px;
	line-height: 1.3;
	}
@media only screen and (max-width: 1350px) {
		#kyozai .container > .flex > div .flex.col_3 > div a.digital_txt {
			font-size: 12px;
		}
}
#kyozai .container > .flex > div.specialty .flex.col_3 > div a {
	height: 65px;
	padding: 0 10px 0 10px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

/* 書籍・ダウンロード検索
***********************************/
#download {
  padding-top: 100px;
}
#download h2 {
  background: #bcda95;
  transform: translateY(-50%);
  padding: 22px 0;
  max-width: 640px;
  margin: 0 auto 25px;
}
@media only screen and (max-width: 767px) {
  #download {
    padding: 75px 3% 0;
  }
  #download h2 {
    font-size: 15px;
    padding: 14px 0;
    max-width: 267px;
    margin: 0 auto 10px;
  }
}
#download .container {
  position: relative;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid #535353;
  padding-bottom: 75px; }
#download .searchBox {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  background-color: #fff; }
  @media only screen and (max-width: 767px) {
    #download .searchBox {
      padding: 50px;
    }
    #download .container {
      padding-bottom: 23px;
    }
  }
  @media only screen and (max-width: 650px) {
    #download .searchBox {
      padding: 0 10px; } }
  #download .searchBox input[type=text] {
    border: 1px #bfbfbf solid;
    padding: 25px 30px;
    font-family: "Yu Gothic", YuGothic,"Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-weight: 500;
    font-size: 17px;
    width: 83.33%; }
    @media only screen and (max-width: 450px) {
      #download .searchBox input[type=text] {
        -webkit-appearance: none;
        width: 78%;
        font-size: 10px;
        padding: 20px; } }
  #download .searchBox .btnSearch {
    padding: 15px;
    background-color: #13b9d7;
    color: #fff;
    width: 16.67%;
    font-size: 22px; }
    @media only screen and (max-width: 767px) {
      #download .searchBox .btnSearch {
        font-size: 18px; } }
    @media only screen and (max-width: 450px) {
      #download .searchBox .btnSearch {
        width: 22%;
        font-size: 10px; } }
  #download .searchBox .serachTxtIn {
    margin-bottom: 5px; }
  #download .searchBox .radioBox label {
    font-family: "Yu Gothic", sans-serif; }
  @media only screen and (max-width: 450px) {
    #download .searchBox .radioBox label {
      display: block;
      font-size: 9px;
      margin: 10px 0; } }
  #download .searchBox .buttons {
    margin-top: 32px; }
    @media only screen and (max-width: 520px) {
      #download .searchBox .buttons {
        flex-wrap: wrap;
        margin-top: 25px; } }
    #download .searchBox .buttons > div {
      width: 49%;
      max-width: 420px; }
      @media only screen and (max-width: 520px) {
        #download .searchBox .buttons > div {
          width: 100%;
          margin-bottom: 10px; } }
      #download .searchBox .buttons > div a {
        display: block;
        border: 1px #000 solid;
        padding: 23px 0;
        text-align: center;
        font-size: 20px;
        font-family: "Yu Gothic", sans-serif;
        position: relative;
        color: #000; }
        @media only screen and (max-width: 450px) {
          #download .searchBox .buttons > div a {
            padding: 15px 0;
            font-size: 10px; } }
        #download .searchBox .buttons > div a:before {
          content: "";
          display: block;
          width: 8px;
          height: 8px;
          border-bottom: 1px #000 solid;
          border-right: 1px #000 solid;
          transform: rotate(-45deg);
          position: absolute;
          right: 10px;
          top: 42%; }

/* おすすめコンテンツ
***********************************/
#recommend {}
  #recommend h2 {
    margin-bottom: 50px; }
#recommend .flex > div small{font-size: x-small;}
#recommend .pc-none{display: none;}
  @media only screen and (max-width: 767px) {
    #recommend {
      padding-top: 40px;
    }
    #recommend h2 {
      margin-bottom: 20px;
      font-size: 20px;
    }
#recommend .flex > div small{font-size: 0.5em;}
#recommend .pc-none{display: inherit;}
#recommend .sp-none{display: none;}
  }

  @media only screen and (max-width: 767px) {
    #recommend .container {
      padding-left: 4.3555555%;
      padding-right: 4.3555555%;
    }
    #recommend .flex {
      flex-wrap: wrap; } }
  #recommend .flex > div {
    width: 32.4%;
    display: flex;
    align-items: center;
    height: 140px;
    justify-content: center;
    margin-bottom: 25px;
    border: 1px solid #535353;
    position: relative; }
    @media only screen and (max-width: 767px) {
      #recommend .flex > div {
        width: 44.4444444vw;
        margin-bottom: 10px;
        height: 53px;
        border-color: #c5dfff; } }

    #recommend .flex > div.recom01 {
      background: #bfe5fd; }
    #recommend .flex > div.recom02 {
      background: #e6f9cd; }
    #recommend .flex > div.recom03 {
      background: #fee1e1; }
    #recommend .flex > div.recom04 {
      background: #d3d7f5; }
    #recommend .flex > div.recom05 {
      background: #fce5c4; }
    #recommend .flex > div.recom06 {
      background: fff/*#e7d3f7*/; }
    #recommend .flex > div.recom07 {
      background: fff/*#fef3d5*/; }
    #recommend .flex > div.recom08 {
      background: #d6f7ff; }
    #recommend .flex > div.recom09 {
      background: #c0e7cf; }

    #recommend .flex > div.recom01 a:before {
      background-image: url(../img/top_icon001.png); }
    #recommend .flex > div.recom02 a:before {
      background-image: url(../img/top_icon002.png); }
    #recommend .flex > div.recom03 a:before {
      background-image: url(../img/top_icon003.png); }
    #recommend .flex > div.recom04 a:before {
      background-image: url(../img/top_icon010.png); }
    #recommend .flex > div.recom05 a:before {
      background-image: url(../img/top_icon012.png); }
    #recommend .flex > div.recom06 a:before {
      background-image: url(../img/top_icon011.png); }
    #recommend .flex > div.recom07 a:before {
      background-image: url(../img/top_icon007.png); }
    #recommend .flex > div.recom08 a:before {
      background-image: url(../img/top_icon008.png); }
    #recommend .flex > div.recom09 a:before {
      background-image: url(../img/top_icon009.png); }

    /*#recommend .flex > div.recom01 {
      background-image: url(../img/img_recommend01.jpg); }
    #recommend .flex > div.recom02 {
      background-image: url(../img/img_recommend02.jpg); }
    #recommend .flex > div.recom03 {
      background-image: url(../img/img_recommend03.jpg); }
    #recommend .flex > div.recom04 {
      background-image: url(../img/img_recommend04.jpg); }
    #recommend .flex > div.recom05 {
      background-image: url(../img/img_recommend05.jpg); }
    #recommend .flex > div.recom06 {
      background-image: url(../img/img_recommend06.jpg); }*/



    #recommend .flex > div a {
      color: #000;
      font-size: 23px;
      padding-left: 30px;
      position: relative;
      text-align: center;
      width: 100%;
      letter-spacing: .2em;
      text-decoration: none; }
#recommend .flex > div.recom06 a,#recommend .flex > div.recom07 a  {
          padding-left: 100px; }
#recommend .flex > div.recom06 img.pad,#recommend .flex > div.recom07 img.pad  {
          display: none; }
    #recommend .flex > div a span {
      font-size: 18px;
    }
		#recommend .flex > div a .btn_notice {
      font-size: 12px;
			letter-spacing: 0;
    }
      @media only screen and (max-width: 1500px) {
        #recommend .flex > div a {
          padding-left: 100px; } 
}
      @media only screen and (max-width: 1300px) {
        #recommend .flex > div a {
          font-size: 18px; }
          #recommend .flex > div a span {
            font-size: 15px;
          } }
      @media only screen and (max-width: 1100px) {
        #recommend .flex > div a {
          font-size: 12px; }
        #recommend .flex > div a span {
          font-size: 12px;
        }
				#recommend .flex > div a .btn_notice {
					font-size: 0.7em;
				}

#recommend .flex > div.recom06 img.pad,#recommend .flex > div.recom07 img.pad  {
          display: inherit;}
#recommend .flex > div.recom06 img.pc-sp,#recommend .flex > div.recom07 img.pc-sp  {
          display: none;}
}
      @media only screen and (max-width: 850px) {
        #recommend .flex > div a {
          font-size: 12px;
          line-height: 1.4;
          letter-spacing: .0666em; }
        #recommend .flex > div a span {
          font-size: 9px;
        }


}
      @media only screen and (max-width: 767px) {
        #recommend .flex > div a {
          padding-left: 30px; }
        #recommend .flex > div.recom06 a,#recommend .flex > div.recom07 a  {
          padding-left: 30px; }
		  
.linkBox img {    max-width: 100%;
    max-height: 50px;
	display: block;}
		  
#recommend .flex > div.recom06 img.pad,#recommend .flex > div.recom07 img.pad  {
          display: none;}
#recommend .flex > div.recom06 img.pc-sp,#recommend .flex > div.recom07 img.pc-sp  {
                  display: inherit;
        text-align: center;
        margin: auto;}
		  
}
  #recommend .flex > div a:before {
    content: "";
    position: absolute;
    display: inline-block;
    width: 89px;
    height: 89px;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
  }
  @media only screen and (max-width: 767px) {
    #recommend .flex > div a:before {
      width: 26px;
      height: 26px;
      left: 5px;
      background-size: contain; } }
  #news {
    padding-bottom: 2em;
    margin-top: 0em; }
    #news h2 {
      margin-bottom: 50px;
    }
    @media only screen and (max-width: 767px) {
      #news {
        margin-top: 0;
      }
      #news h2 {
        margin-bottom: 40px;
      }
    }
    #news dl {
      display: flex;
      flex-wrap: wrap;
      font-family: "Yu Gothic", sans-serif; }
      #news dl dt, #news dl dd {
        font-size: 18px;
        margin-bottom: 15px; }
        @media only screen and (max-width: 767px) {
          #news dl dt, #news dl dd {
            font-size: 16px; } }
      #news dl dt {
        width: 10%; }
        @media only screen and (max-width: 1200px) {
          #news dl dt {
            width: 15%; } }
        @media only screen and (max-width: 767px) {
          #news dl dt {
            width: 100%;
            margin-bottom: 0; } }
      #news dl dd {
        width: 90%; }
        @media only screen and (max-width: 1200px) {
          #news dl dd {
            width: 85%; } }
        @media only screen and (max-width: 767px) {
          #news dl dd {
            width: 100%; } }
        #news dl dd a {
          color: #000; }
    #news .backnumber_link {
      margin-top: 30px;
      margin-bottom: 15px;
      text-align: center; }
      #news .backnumber_link a {
        color: #3d3d3d;
        position: relative;
        display: inline-block;
        font-family: "Yu Gothic", sans-serif;
        padding-right: 85px; }
        #news .backnumber_link a:before {
          content: "";
          display: block;
          width: 10px;
          height: 10px;
          border-bottom: 1px #000 solid;
          border-right: 1px #000 solid;
          transform: rotate(-45deg);
          position: absolute;
          right: 0px;
          top: 30%;
          transition: .3s; }
  #recommend #important {
    margin-top: 85px;
    margin-bottom: 85px; }
    @media only screen and (max-width: 767px) {
      #recommend #important {
        margin-top: 50px;
        margin-bottom: 50px; } }
    #recommend #important .container p {
      background-color: #fff;
      box-shadow: 0px 0px 62px 0px rgba(0, 0, 0, 0.06);
      padding: 36px;
      font-size: 22px;
      text-align: center; }
      @media only screen and (max-width: 767px) {
        #recommend #important .container p {
          font-size: 18px; } }
.g-search{display: flex; justify-content: flex-end;}
@media only screen and (max-width: 767px) {
    .g-search {
        display: flex;
        justify-content: flex-start;
        width: auto; /* 幅を自動に設定し、要素の内容に応じて調整 */
        max-width: 200px; /* 最大幅を200pxに制限 */
        margin-right: auto; /* メニューが右上にある場合、右にスペースを空ける */
    }
}


/* おすすめコンテンツ　特別デザインボタン
***********************************/