/* TABLE OF CONTENTS:
 * 
 * 00 どのサイズでも共通で適用されるスタイル
 *    - ビルボード
 *    - 新着情報
 * 01 幅 768 未満
 *    - ビルボード
 * 02 幅 480px 以上
 * 03 幅 768px 以上
 *    - ビルボード
 * 04 幅 880px 以上
 *    - 新着情報
 * 05 幅 1072px 以上
 * 06 幅 1264px 以上
 */

/* --------------------------------------------------------------------------------------------------------
   00
 *
 * どのサイズでも共通で適用されるスタイル
 */



  /* ビルボード */
  .site-main #mainImg {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    font-family: 'Yu Mincho', YuMincho, 'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'HGP明朝B', serif;
    padding: 1em;
  }



  /* 新着情報 */
  #news {
    padding: 0 !important;
    position: relative;
  }
  #news img {
    vertical-align: bottom;
  }
  #news dl {
    margin: 0;
  }
  #news dl dt {
    background-color: #316745;
    color: #FFF;
    font-family: 'Yu Mincho', YuMincho, 'Hiragino Mincho ProN', 'Hiragino Mincho Pro', 'HGP明朝B', serif;
    font-weight: normal;
    padding: 0.5em 0;
  }
  #news dl dt span {
    background-image: url('data:image/svg+xml;charset=utf8,%3C!--%20Generator%3A%20Adobe%20Illustrator%2018.1.1%2C%20SVG%20Export%20Plug-In%20.%20SVG%20Version%3A%206.00%20Build%200)%20--%3E%3Csvg%20version%3D%221.1%22%20id%3D%22_x32_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%20style%3D%22width%3A%2048px%3B%20height%3A%2048px%3B%20opacity%3A%201%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%234B4B4B%3B%7D%3C%2Fstyle%3E%3Cg%3E%20%3Cpath%20class%3D%22st0%22%20d%3D%22M255.992%2C0.008C114.626%2C0.008%2C0%2C114.626%2C0%2C256s114.626%2C255.992%2C255.992%2C255.992%20C397.391%2C511.992%2C512%2C397.375%2C512%2C256S397.391%2C0.008%2C255.992%2C0.008z%20M300.942%2C373.528c-10.355%2C11.492-16.29%2C18.322-27.467%2C29.007%20c-16.918%2C16.177-36.128%2C20.484-51.063%2C4.516c-21.467-22.959%2C1.048-92.804%2C1.597-95.449c4.032-18.564%2C12.08-55.667%2C12.08-55.667%20s-17.387%2C10.644-27.709%2C14.419c-7.613%2C2.782-16.225-0.871-18.354-8.234c-1.984-6.822-0.404-11.161%2C3.774-15.822%20c10.354-11.484%2C16.289-18.314%2C27.467-28.999c16.934-16.185%2C36.128-20.483%2C51.063-4.524c21.467%2C22.959%2C5.628%2C60.732%2C0.064%2C87.497%20c-0.548%2C2.653-13.742%2C63.627-13.742%2C63.627s17.387-10.645%2C27.709-14.427c7.628-2.774%2C16.241%2C0.887%2C18.37%2C8.242%20C306.716%2C364.537%2C305.12%2C368.875%2C300.942%2C373.528z%20M273.169%2C176.123c-23.886%2C2.096-44.934-15.564-47.031-39.467%20c-2.08-23.878%2C15.58-44.934%2C39.467-47.014c23.87-2.097%2C44.934%2C15.58%2C47.015%2C39.458%20C314.716%2C152.979%2C297.039%2C174.043%2C273.169%2C176.123z%22%20style%3D%22fill%3A%20rgb(255%2C%20255%2C%20255)%3B%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat;
    background-position: 12px center;
    background-size: auto 70%;
    display: block;
    max-width: 1000px;
    margin-right: auto;
    margin-left: auto;
    padding: 0.1em 0.8em 0.1em 2em;
  }
  #news dl dd {
    margin: 0;
  }
  #news dl dd ul:not(.swiper-wrapper) {
    max-width: 1000px;
    margin-right: auto;
    margin-left: auto;
  }
  #news dl dd ul:not(.swiper-wrapper) li {
    border-bottom: 1px #CCC solid;
    list-style: none;
    display: flex;
    margin-top: 0;
    padding: 1em 0;
  }
  #news dl dd ul:not(.swiper-wrapper) li .thumb {
    margin-right: 1em;
    width: 60px;
  }
  #news dl dd ul:not(.swiper-wrapper) li .thumb + div {
    flex: 1;
  }
  #news dl dd ul:not(.swiper-wrapper) li .date {
    background: #6C6C6C;
    border-radius: 5px;
    color: #FFF;
    display: inline-block;
    text-align: center;
    font-size: 0.8em;
    margin-right: 0.5em;
    padding: 0.1em 0.5em;
  }
  #news dl dd ul:not(.swiper-wrapper) li .shop {
    display: inline-block;
  }
  #news dl dd ul:not(.swiper-wrapper) li .label {
    background: #999999;
    border-radius: 5px;
    color: #FFF;
    display: inline-block;
    text-align: center;
    font-size: 0.8em;
    margin-right: 0.5em;
    padding: 0.1em 0.5em;
  }
  #news dl dd ul:not(.swiper-wrapper) li .label.campaign {
    background: #b75300;
  }
  #news dl dd ul:not(.swiper-wrapper) li .label.info {
    background: #3b7551;
  }
  #news dl dd ul:not(.swiper-wrapper) li a {
    display: inline-block;
    margin-top: 0.5em;
    width: 100%;
  }
  #news dl dd:not(.btn) {
    padding: 0 1em 1em;
  }
  #news dl dd.btn {
    text-align: right;
    position: absolute;
    top: 10px;
    right: 0;
    left: 0;
    max-width: 1000px;
    margin: 0 auto;
    padding-right: 10px;
  }
  #news dl dd.btn a {
    background: #19482a;
    border-radius: 3px;
    color: #d4ab3c;
    display: inline-block;
    font-size: 0.8em;
    padding: 0.1em 0.8em;
  }
  #news dl dd.btn a:after {
    font-family: "Font Awesome 5 free";
    font-weight: 900;
    content: "\f105";
    display: inline-block;
    margin-left: 0.5em;
  }

  /* 検索窓の設置 */
  .search-form {
    width: 80%;
    display: block;
    margin: auto;
  }
  .search-field {
    color: #333 !important;
  }
  /* TOPのみに古銭地域テスト表示 */
  #old-coin-link {
    text-align: center;
  }
  #old-coin-link h3 {
    font-size: 1rem;
  }
  #old-coin-link a {
    text-decoration: none;
  }
  #old-coin-link a:hover {
    color: #e1b746;
    text-decoration: none;
  }
/* --------------------------------------------------------------------------------------------------------
   01
 *
 * 幅 768px 未満
 */
@media screen and (max-width: 767px) {



  /* ビルボード */
  .site-main #mainImg {
    background-image: url(../img/top/top-bil-bg-sp.webp);
    aspect-ratio: 39 /35;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  .site-main #mainImg p {
    margin-bottom: 0;
    width: 100%;
  }
  
  /* 新着情報 */
  #news dl dd ul:not(.swiper-wrapper) li .label {
    margin-left: 1em;
  }

  /* 検索窓の設置 */
  .search-form {
    width: 100%;
  }
}/* End max 767px */



/* --------------------------------------------------------------------------------------------------------
   02
 *
 * 幅 480px 以上
 */
@media screen and (min-width: 30em) {

    /* ここにスタイル */

}/* End min 480px */



/* --------------------------------------------------------------------------------------------------------
   03
 *
 * 幅 768px 以上
 */
@media screen and (min-width: 48em) {

  /* ビルボード */
  .site-main #mainImg {
    background-image: url(../img/top/top-bil-bg.webp);
  }


}/* End min 768px */



/* --------------------------------------------------------------------------------------------------------
   04
 *
 * 幅 880px 以上
 */
@media screen and (min-width: 55em) {


  /* 新着情報 */
  #news dl dd ul:not(.swiper-wrapper) li {
    padding: 2em 0;
  }
  #news dl dd ul:not(.swiper-wrapper) li .thumb {
    width: 100px;
  }


}/* End min 880px */



/* --------------------------------------------------------------------------------------------------------
   05
 *
 * 幅 1072px 以上
 */
@media screen and (min-width: 67em) {

    /* ここにスタイル */

}/* End min 1072px */



/* --------------------------------------------------------------------------------------------------------
   06
 *
 * 幅 1264px 以上
 */
@media screen and (min-width: 79em) {

    /* ここにスタイル */

}/* End min 1264px */