@charset "UTF-8";
.hero_area_2nd {
  background: url(../../img/information/img01.jpg) center center no-repeat;
  background-size: cover; }
  .hero_area_2nd h2 {
    color: #000; }

.flex_area {
  width: 100%;
  max-width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  font-family: "中ゴシックBBB JIS2004", "Gothic Medium BBB JIS2004", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif; }
  @media screen and (max-width: 644px) {
    .flex_area {
      display: block; } }
  .flex_area .art_area {
    width: 74.77%; }
    @media screen and (max-width: 644px) {
      .flex_area .art_area {
        width: 100%;
        max-width: 100%; } }
    .flex_area .art_area .cat_area {
      width: 100%;
      max-width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
      .flex_area .art_area .cat_area dt {
        width: 28.3%;
        max-width: 150px;
        margin-right: 3%;
        margin-bottom: 30px; }
        @media screen and (max-width: 644px) {
          .flex_area .art_area .cat_area dt {
            margin-bottom: 0px; } }
        .flex_area .art_area .cat_area dt a, .flex_area .art_area .cat_area dt span {
          display: block;
          font-size: 16px;
          color: #fff;
          line-height: 1;
          text-align: center;
          padding: 5px; }
          @media screen and (max-width: 644px) {
            .flex_area .art_area .cat_area dt a, .flex_area .art_area .cat_area dt span {
              font-size: 12px;
              margin-bottom: 10px; } }
      .flex_area .art_area .cat_area dd {
        font-size: 16px;
        color: #666666; }
        @media screen and (max-width: 644px) {
          .flex_area .art_area .cat_area dd {
            font-size: 12px; } }
    .flex_area .art_area .img_main {
      margin-bottom: 40px; }
      @media screen and (max-width: 644px) {
        .flex_area .art_area .img_main {
          margin-bottom: 20px; } }
    .flex_area .art_area .tit01 {
      font-size: 20px;
      font-weight: bold;
      color: #666;
      margin-bottom: 10px; }
      @media screen and (max-width: 644px) {
        .flex_area .art_area .tit01 {
          font-size: 15px;
          color: #666; } }
    .flex_area .art_area .tit02 {
      color: #666666;
      font-weight: bold;
      font-size: 32px;
      margin-bottom: 20px; }
      @media screen and (max-width: 644px) {
        .flex_area .art_area .tit02 {
          font-size: 16px;
          margin-bottom: 10px; } }
    .flex_area .art_area .txt01 {
      font-size: 16px;
      color: #666666; }
      @media screen and (max-width: 644px) {
        .flex_area .art_area .txt01 {
          font-size: 14px; } }
    .flex_area .art_area .mb {
      margin-bottom: 100px; }
    .flex_area .art_area .btn_back {
      width: 32.53%;
      max-width: 270px;
      margin: 0px auto;
      border: 1px solid #666666;
      padding: 10px 0px;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      font-size: 16px;
      color: #666666;
      text-align: center;
      background: url(../../img/common/icon_cur_bk_re.png) 10% center no-repeat;
      background-size: 12px 22px; }
      @media screen and (max-width: 644px) {
        .flex_area .art_area .btn_back {
          width: 90%;
          max-width: 900px; } }
    .flex_area .art_area a.sec {
      width: 100%;
      max-width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between;
      margin-bottom: 80px; }
      @media screen and (max-width: 644px) {
        .flex_area .art_area a.sec {
          margin-bottom: 40px; } }
      .flex_area .art_area a.sec .img_area {
        width: 33.13%;
        position: relative;
        overflow: hidden; }
        @media screen and (max-width: 644px) {
          .flex_area .art_area a.sec .img_area {
            width: 100%;
            max-width: 100%;
            margin-bottom: 10px; } }
        .flex_area .art_area a.sec .img_area .posi {
          position: absolute;
          left: 0px;
          top: 0px;
          width: 100%;
          max-width: 100%; }
      .flex_area .art_area a.sec .txt_area {
        width: 63.85%; }
        @media screen and (max-width: 644px) {
          .flex_area .art_area a.sec .txt_area {
            width: 100%;
            max-width: 100%; } }
    .flex_area .art_area .nonble_area {
      width: 100%;
      max-width: 100%; }
      @media screen and (max-width: 644px) {
        .flex_area .art_area .nonble_area {
          width: 100%;
          max-width: 100%;
          margin-bottom: 50px; } }
      .flex_area .art_area .nonble_area ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; }
        .flex_area .art_area .nonble_area ul li {
          border: 1px solid #666666;
          margin: 0px 10px 10px; }
          @media screen and (max-width: 644px) {
            .flex_area .art_area .nonble_area ul li {
              margin: 10px 10px; } }
          .flex_area .art_area .nonble_area ul li a {
            display: block;
            line-height: 50px;
            width: 50px;
            height: 50px;
            text-align: center;
            color: #666666;
            font-size: 16px; }
            @media screen and (max-width: 644px) {
              .flex_area .art_area .nonble_area ul li a {
                line-height: 36px;
                width: 36px;
                height: 36px; } }
          .flex_area .art_area .nonble_area ul li .cur {
            background-color: #666666;
            color: #fff; }
        .flex_area .art_area .nonble_area ul li:nth-last-child(1) {
          border: none; }
          .flex_area .art_area .nonble_area ul li:nth-last-child(1) img {
            width: 12px;
            height: auto;
            vertical-align: middle; }
  .flex_area .menu_area {
    width: 18.01%; }
    @media screen and (max-width: 644px) {
      .flex_area .menu_area {
        width: 100%;
        max-width: 100%; } }
    .flex_area .menu_area .tit_menu01 {
      font-size: 22px;
      margin-bottom: 10px; }
      @media screen and (max-width: 644px) {
        .flex_area .menu_area .tit_menu01 {
          font-size: 14px; } }
    .flex_area .menu_area .cat_menu {
      margin-bottom: 40px; }
      .flex_area .menu_area .cat_menu li {
        margin-bottom: 15px; }
        @media screen and (max-width: 644px) {
          .flex_area .menu_area .cat_menu li {
            margin-bottom: 10px; } }
        .flex_area .menu_area .cat_menu li a {
          padding: 10px 0px;
          font-size: 16px;
          color: #fff;
          text-align: center;
          background-image: url(../../img/common/icon_cur_w.png);
          background-position: 95% center;
          background-repeat: no-repeat;
          background-size: 12px 22px; }
          @media screen and (max-width: 644px) {
            .flex_area .menu_area .cat_menu li a {
              font-size: 12px; } }
      .flex_area .menu_area .cat_menu li:nth-last-child(1) {
        margin-bottom: 0px; }
    .flex_area .menu_area .history_menu {
      border-bottom: 1px solid #666666; }
      .flex_area .menu_area .history_menu li {
        border-top: 1px solid #666666; }
        .flex_area .menu_area .history_menu li a {
          padding: 10px 0px;
          font-size: 16px;
          color: #666666;
          text-align: center;
          background-image: url(../../img/common/icon_cur_bk.png);
          background-position: 95% center;
          background-repeat: no-repeat;
          background-size: 12px 22px; }
          @media screen and (max-width: 644px) {
            .flex_area .menu_area .history_menu li a {
              font-size: 14px; } }
      .flex_area .menu_area .history_menu li:nth-last-child(1) {
        margin-bottom: 0px; }

.cat_type01 {
  background-color: #a08b55; }

.cat_type02 {
  background-color: #00c2b9; }

.cat_type03 {
  background-color: #000; }