@charset "utf-8";

/* ======================================================
 * layout_sp.css
 * ------------------------------------------------------
 * @media only screen and (max-width: 767px)
 * - Common
 * - Header
 * - Gnav
 * - Main
 * - Assist
 * - Footer
 * - Other
 * - Clearfix
 * Media Queries
====================================================== */

@media only screen and  (max-width: 1023px) {

  /* ----- a ----- */

  .header-menu .nav_global > li > .a-blank {
    color: #333;
  }
  .header-menu .nav_global > li > .a-blank {
    display: block;
    width: 100%;
    position: relative;
    padding: 12px 55px 12px 15px;
    font-size: 1.5rem;
    font-weight: bold;
    background-color: #f2f3f5;
    text-align: left;
  }
  .header-menu .nav_global > li > .a-blank::after {
    position: absolute;
    right: 18px;
    width: 14px;
    height: 14px;
    top: 35%;
    background-position: 0px -250px;
    display: inline-block;
    background-image: url(/common/img/cmn_sprite_ic01-r2x.png);
    background-repeat: no-repeat;
    background-size: 600px 600px;
    vertical-align: middle;
    content: "";
  }


  /* ------------------------------------------------------
   * Footer
  ------------------------------------------------------ */

  .footer-nav .nav_menu_main > li > a.a-blank {
    position: relative;
  }
  .footer-nav .nav_menu_main > li > a.a-blank::after {
    position: absolute;
    right: 15px;
    width: 14px;
    height: 14px;
    top: 35%;
    background-position: 0px -250px;
    display: inline-block;
    background-image: url(/common/img/cmn_sprite_ic01-r2x.png);
    background-repeat: no-repeat;
    background-size: 600px 600px;
    vertical-align: middle;
    content: "";
  }
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
  /* ----- header-menu ----- */
  .header-menu .nav_global > li > .a-blank {
    padding: 12px 70px 12px 40px;
    font-size: 17px;
  }
  .header-menu .nav_global > li > .a-blank.is-active {
    background-color: #fff;
  }
  .header-menu .nav_global > li > .a-blank::after {
    right: 46px;
  }
}