/* Large Tablet Devices */
@media only screen and (max-width: 1200px) {
  .logo-wrapper { width: 415px; padding-bottom: 0; }
  .logo-wrapper a img { height: auto; }
}

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

  .logo-wrapper { width: 350px; padding: 27px 0 27px 20px; padding-bottom: 0; }
  .logo-wrapper a img { height: auto; }
  .head-tabs { padding-right: 20px; width: auto; }
  .head-tabs ul li:first-child img { max-height: 50px; }
  .head-tabs ul li:last-child img { max-height: 50px; }
}

@media only screen and (max-width: 1140px) {
  .container { width: 100%; }
}

/* Tablet Devices */
@media only screen and (max-width: 744px) {
  .pc-only { display: none; }
  .sp-only { display: block; }
  section, footer.page-footer { padding: 20px 0; }
  section .container, footer.page-footer .container { padding: 0 20px; }
  header.page-header { background-color: #FFF; overflow: visible; position: fixed; z-index: 999999; }
  header.page-header .container { min-height: 70px; width: 744px; }
  .toplinks { display: none; }
  .logo-wrapper { width: auto; padding: 10px 20px 0 20px; }
  .logo-wrapper.sp-only { display: block; }
  .logo-wrapper a img { height: 50px; }
  .logo-wrapper a span { font-size: 12px; }
  .menu-toggle { top: 0; right: 0; }
  .menu-toggle small.op,
  .menu-toggle small.cl { display: block; margin-top: 5px; }
  .btn-tel { right: 70px; }
  header.page-header .container { position: initial; }
  .navSpOpen { display: block; }

  .head-tabs { display: none; }

  .bg-nav-sp { position: fixed; top: 60px; left: 0; background: rgba(32, 33, 64, 0.5); box-sizing: border-box; width: 100%; height: 100vh; z-index: 9997; opacity: 0; display: none; }
  nav { overflow-y: scroll; position: fixed; top: 60px; right: -81%; background: #FFFFFF; width: 81%; height: 100%; z-index: 9998; -webkit-overflow-scrolling: touch; }
  .bg-nav-sp.active { opacity: 0.8; display: block; }
  .navSpClose.active { opacity: 1; display: block; }
  nav.open { right: 0; }

  body.noscroll { overflow-y: scroll; position: fixed; width: 100%; }

}

/* Smartphones */
@media only screen and (max-width: 400px) {
  .logo-wrapper { padding: 10px 0 0 10px; }
  .logo-wrapper a img { height: 33px; vertical-align: middle; }
}