/*===============================================
 responsive width-1000
===============================================*/
@media only screen and (max-width: 1000px) {
  .wrapper {
    padding-top: 100px; }
  .wrapper_products {
    padding-top: 60px; }
  .header_pc {
    display: none; }
  .header_sp {
    display: block; }
  .spnav {
    display: block; }
  .st11_01 .box .js-fixed-area {
    width: 300px; }
  .st11_01 .box .js-fixed-elm.is-fixed {
    width: 300px; }
  .st11_01 .box .boxL {
    padding-right: 350px; }
  footer {
    background: #F6FAFB;
    margin-bottom: 60px;
    color: #231815; }
    footer .group01,
    footer .group02 {
      display: none; }
    footer .group03 {
      padding: 50px 0; }
      footer .group03 .box {
        justify-content: center; }
        footer .group03 .box nav {
          display: none; }
        footer .group03 .box div {
          font-size: clamp(0.5rem, calc(0.442rem + 0.19vw), 0.625rem); } }

/*===============================================
 responsive width-812
===============================================*/
@media only screen and (max-width: 812px) {
  body {
    min-width: 740px; }
  .list01 li {
    width: 30%;
    margin-right: 5%; }
    .list01 li a .cat {
      padding: 8px 20px;
      margin: 15px 0; }
    .list01 li:nth-of-type(4n) {
      margin-right: 5%; }
    .list01 li:nth-of-type(3n) {
      margin-right: 0; }
    .list01 li:nth-of-type(4) {
      margin-top: 50px; }
  .st01_01 .list01 li:nth-of-type(1) {
    width: 46%;
    margin-right: 6%; }
  .st01_01 .list01 li:nth-of-type(4) {
    margin-right: 8%; }
  .st10_01 .cat {
    padding: 8px 20px;
    margin: 15px 0; } }

/*===============================================
 responsive width-480
===============================================*/
@media only screen and (max-width: 480px) {
  body {
    min-width: inherit; }
  .mb50 {
    margin-bottom: 30px !important; }
  .mb80 {
    margin-bottom: 50px !important; }
  .mb100 {
    margin-bottom: 80px !important; }
  .pt50 {
    padding-top: 30px; }
  .pb100 {
    padding-bottom: 80px; }
  .container {
    padding-left: 15px;
    padding-right: 15px; }
  .tit01 {
    height: 80px; }
  .btn01 {
    width: 200px; }
  .list01 li {
    width: 47.5%;
    margin-right: 5%;
    margin-top: 30px; }
    .list01 li a .pic {
      border-radius: 10px; }
    .list01 li a .cat {
      padding: 6px 20px; }
    .list01 li:nth-of-type(3n) {
      margin-right: 4%; }
    .list01 li:nth-of-type(2n) {
      margin-right: 0; }
    .list01 li:nth-of-type(3) {
      margin-top: 30px; }
    .list01 li:nth-of-type(4) {
      margin-top: 30px; }
  .list03 {
    display: block; }
    .list03 .box {
      width: 80%;
      margin: 0 10%; }
      .list03 .box .boxL {
        width: 50px;
        margin-right: 25px; }
      .list03 .box:first-of-type {
        margin-right: 0;
        margin-bottom: 50px; }
  .list04 ul li {
    width: 47.5%;
    margin-right: 5%;
    margin-top: 30px; }
    .list04 ul li:nth-of-type(3n) {
      margin-right: 5%; }
    .list04 ul li:nth-of-type(2n) {
      margin-right: 0; }
    .list04 ul li:nth-of-type(3) {
      margin-top: 30px; }
  .table01 {
    border: 1px solid #231815;
    border-bottom: none; }
    .table01 th,
    .table01 td {
      display: block;
      text-align: left;
      vertical-align: middle;
      border: none;
      border-bottom: 1px solid #231815;
      padding: 15px 20px;
      line-height: 1.6; }
    .table01 th {
      min-width: 250px;
      font-weight: bold; }
  .pagenavi {
    margin-top: 50px; }
  .wp-pagenavi a, .wp-pagenavi span {
    margin: 0; }
  .pager ul li a {
    letter-spacing: 0;
    text-indent: 0; }
  .pager ul li.prev {
    margin-right: 30px; }
    .pager ul li.prev a::before {
      width: 6px;
      height: 6px;
      margin-right: 10px; }
  .pager ul li.next {
    margin-left: 30px; }
    .pager ul li.next a::after {
      width: 6px;
      height: 6px;
      margin-left: 10px; }
  .swiper_area .swiper .swiper-wrapper .swiper-slide img {
    border-radius: 15px; }
  .swiper_area .swiper .swiper-controller {
    margin-top: 20px; }
  .st01_01 .list01 {
    padding-left: 0; }
    .st01_01 .list01 li {
      width: 46%;
      margin-right: 8%; }
      .st01_01 .list01 li a .num {
        position: absolute;
        z-index: 1;
        left: 0;
        top: 0;
        background: url(../images/01/ico_ranking04.png) no-repeat center center;
        background-size: 51px;
        width: 51px;
        height: 51px;
        padding: 6px 10px;
        font-size: clamp(0.813rem, calc(0.524rem + 0.96vw), 1.125rem); }
      .st01_01 .list01 li:nth-of-type(1) {
        position: relative;
        width: 70%;
        margin: 0 15%;
        height: inherit; }
        .st01_01 .list01 li:nth-of-type(1) a .num {
          background-size: 60px;
          width: 60px;
          height: 60px; }
        .st01_01 .list01 li:nth-of-type(1) a .cat {
          margin: 20px 0; }
        .st01_01 .list01 li:nth-of-type(1) a .price {
          margin-top: 20px; }
      .st01_01 .list01 li:nth-of-type(2) {
        margin-top: 30px; }
      .st01_01 .list01 li:nth-of-type(4) {
        margin-top: 30px; }
  .st01_04 {
    margin: 50px 0; }
  .st02_01 .header_brand {
    padding-top: 30px; }
  .st02_01 .box {
    height: 80px; }
    .st02_01 .box .ico {
      width: 26px;
      margin-right: 15px; }
  .st03_01 .list ul li {
    padding-top: 20px;
    margin: 0 15px; }
  .st08_01 .btn {
    width: 100%;
    max-width: 300px;
    padding: 20px; }
  .st09_01 table tr th,
  .st09_01 table tr td {
    display: block;
    padding-top: 0; }
  .st09_01 table tr th {
    text-align: left;
    padding-right: 0;
    padding-top: 30px;
    margin-bottom: 10px; }
  .st09_01 table tr td div {
    width: 100%; }
  .st09_01 table tr:first-of-type th {
    padding-top: 0; }
  .st10_01 .cat {
    padding: 6px 20px; }
  .st11_01 .pc_only {
    display: none; }
  .st11_01 .box .js-fixed-area {
    position: relative;
    right: inherit;
    top: inherit;
    height: inherit;
    width: 100%; }
  .st11_01 .box .js-fixed-elm {
    position: relative;
    top: inherit !important; }
  .st11_01 .box .js-fixed-elm.is-fixed {
    position: relative;
    width: 100%; }
  .st11_01 .box .boxL {
    padding-right: 0; }
  footer .group01 {
    padding: 30px; }
    footer .group01 img {
      width: 200px; }
  footer .group02 {
    padding: 30px 0 50px; }
    footer .group02 .box .block {
      width: 50%;
      padding: 0; }
      footer .group02 .box .block:nth-of-type(3) {
        margin: 30px 0 50px; }
      footer .group02 .box .block:last-of-type {
        width: 100%; }
  footer .group03 .box nav ul li {
    margin-right: 20px; } }
