@charset "utf-8";

/* CSS Document */

* {

  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;

  font-size: 16px; /* 基準のフォントサイズを16pxとする */

  -webkit-text-size-adjust: 100%; /* ブラウザ側での自動調整をなしにする */

}

img {

  width: 100%;

  max-width: 100%;

  display: block;

}

#item_area a:hover, .floating a:hover {

  display: block;

  background: #FFF;

}

#banner_area a:hover {

  background: #FFF;

}

a img:hover {

  opacity: 0.8;

}

body {

  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif;

}

#wrap {

  background:#f4f9fc;

}

#header {

  background: #f4f9fc;

}

.topimg_sp {

  display: none;

}

#mokuji h2 {

  background: #1d2c57;

  padding: 1% 0;

  color: #fff;

  text-align: center;

  font-size: 30px;

  font-weight: bold;

  font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;

  letter-spacing: 0.08em;

}

#event_menu {

  background: url(../img/bg01.gif);

}

#event_menu {

  padding: 2% 0;

}

#event_menu ul {

  overflow: hidden;

  padding-top: 2%;

}

#event_menu ul li {

  float: left;

  width: 49%;

}

#event_menu ul li:hover {

  background: #FC6;

}

#event_menu ul li:first-child {

  margin-right: 2%;

}

#item_area h3 {

  background: #003300;

  color: #000;

  text-align: center;

  font-weight: bold;

  font-size: 30px;

  padding: 1% 0;

  margin-top: 5%;

}

.item_img_l {

  margin-top: 5%;

}

.item_img_m {

  margin-top: 3%;

  overflow: hidden;

  display: flex;

  flex-wrap: wrap;

}

.item_img_m li {

  width: 48%;

  float: left;

  margin-right: 2%;

  margin-top: 2%;

}

.item_img_m li:nth-child(2n) {

  margin-right: 0;

}

.item_img_s {

  margin-top: 3%;

  overflow: hidden;

}

.item_img_s li {

  width: 31.5%;

  float: left;

  margin-right: 2.25%;

  margin-top: 2.25%;

}

.item_img_s li:nth-child(3n) {

  margin-right: 0;

}

#banner_area {

  background: #FFF;

  padding: 3% 0;

  margin-top: 5%;

}

#banner_area .item_img_m li {

  padding: 2%;

  border-radius: 20px;

  background: #FFF;

  box-sizing: border-box;

  text-align: center;

}

#banner_area .item_img_m li img {

  margin-bottom: 2%;

}

#banner_area .item_img_m li a {

  text-decoration: none;

  color: #3b030a;

  font-weight: bold;

  font-size: 18px;

}

#banner_area h3 {

  text-align: center;

  font-size: 40px;

  font-weight: bold;

  color: #000;

}

#footer {

  margin-top: 40px;

  background: #1d2c57;

}

#footer .copyright {

  color: #fff;

  text-align: center;

  padding: 1% 0;

}

/**PC用CSS

------------------------------------------------**/

@media (min-width: 1401px) {

  .contents {

    width: 1100px;

    margin: 0 auto;

  }

  #mokuji h2 br {

    display: none;

  }

  .floating {

    width: 120px;

    position: fixed;

    top: 50px;

    right: 0px;

  }

  .floating img {

    margin-bottom: 10px;

  }

  .pagetop {

    position: fixed;

    bottom: 10px;

    right: 15px;

    width: 80px;

  }

  #floating_left {

    display: block;

    background: url("../img/float_left.jpg");

    width: 150px; /*画像幅*/

    height: 890px; /*画像高さ*/

    text-indent: -9999px;

    position: fixed;

    left: 0px;

    top: 0;

  }

  #floating_top {

    display: none !important;

  }

}

/**タブレット用CSS

------------------------------------------------**/

@media (max-width: 1400px) and (min-width: 768px) {

  .contents {

    width: 95%;

    margin: 0 auto;

  }

  #mokuji h2 {

    font-size: 20px;

  }

  #item_area h3 {

    font-size: 20px;

  }

  .pagetop {

    display: none;

  }

  .floating {

    width: 120px;

    position: fixed;

    bottom: 140px;

    right: 0px;

  }

  .floating img {

    margin-bottom: 10px;

  }

  .sp_hidden {

    display: none;

  }

  #floating_top {

    position: fixed;

    bottom: 0;

    background: #000;

    width: 100%;

  }

  #floating_top img {

    max-width: 960px;

    display: block;

    margin: 0 auto;

  }

}

/**スマホ用CSS

------------------------------------------------**/

@media (max-width: 767px) {

  .contents {

    width: 95%;

    margin: 0 auto;

  }

  .topimg_pc {

    display: none;

  }

  .topimg_sp {

    display: block;

  }

  #mokuji h2 {

    padding: 1% 2.5%;

    font-size: 13px;

  }

  #item_area h3 {

    font-size: 15px;

  }

  #banner_area .item_img_m li {

    border-radius: 5px;

  }

  #banner_area .item_img_m li a {

    font-size: 13px;

  }

  #footer .copyright {

    font-size: 10px;

  }

  .floating {

    width: 60px;

    position: fixed;

    bottom: 0px;

    right: 0px;

  }

  .floating img {

    margin-bottom: 10px;

  }

  .pagetop {

    display: none;

  }

  .sp_hidden {

    display: none;

  }

  #floating_top {

    position: fixed;

    top: 0;

  }

}