@charset "utf-8";

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

   second

--------------------------------------------------------------------------------------------------*/
.banner-sp
 {
  display:none;
}


@media all and (max-width: 1023px) {
  
  .cb-search-columnlist,
  .banner-sp {
    display:block;
  }
  
  .banner-pc {
    display:none;
  }
/*------------------------------------------------------------------------------------------------
  header
--------------------------------------------------------------------------------------------------*/
  .container {
    width:100%;
  }
  
  .banner-sp {
    width:100%;
  }
  
  header .info {
    top: 10%;
    height: 90%;
    background-size:13px auto;
  }
  
  header .info img {
    width:60%;
  }
  
  header .info p {
    margin-top: 20px;
    line-height: 17px;
    font-size: 12px;
    padding: 0 27px;
  }
  /*------------------------------------------------------------------------------------------------
  index
--------------------------------------------------------------------------------------------------*/
  .frame01 {
    padding-bottom:0;
  }
  
  .frame01 li {
    margin-left:20px;
    margin-right:20px;
    margin-left: 15px;
    margin-right: 15px;
    height:auto;
  }
  
  .frame01 li img {
    width:120px;
  }
  
  .frame02 .list-product a {
    width: 46%;
    margin: 0 0.5% 3% 2.5%;
  }
  
  .frame02 .list-product a h3 {
    font-size: 14px;
    line-height: 16px;
  }
  
  .frame02 .list-product a p {
    font-size:10px;
    line-height: 16px;
    padding: 8px 0 0px 0;
  }
  
  .frame02 .list-product a .box-btn {
    margin-bottom: 2px;
  }
  
  .frame02 .list-product a .btn {
    padding:1px 5px;
  }
  
  .frame02 .list-product img {
    width:100%;
  }
  
  .frame02 .list-product a .img-new {
    width:auto;
  }
  
  .frame01 h1 {
    margin: 25px 0 25px 0;
  }
  
  .frame01 h1 img {
    width:150px;
  }
  
  .frame02 .box {
    padding: 25px 0 25px 0;
  }
  
  .frame02 .box-green h1 img {
    width:290px;
  }
  
  .frame02 .box-white h1 img {
    width:280px;
  }
  
  .frame02 .box-yellow h1 img {
    width:160px;
  }
  
  .frame02 .text {
    font-size:11px;
    line-height: 16px;
    margin: 10px 2% 20px 2%;
  }
  
  .frame02 .list-product a .info {
    padding: 10px;
  }
  
  .frame02 .list-product a .img-new {
    top: 10px;
  }
  
  .frame02 .btn-big {
    width: auto;
    padding: 12px;
    margin: 0px 10px 0 10px;
  }
  
/*------------------------------------------------------------------------------------------------
  header
--------------------------------------------------------------------------------------------------*/

  .footer-top {
    padding:12px 10px; 
    background:#fff;
  }

  .footer-top img {
    padding:8px 0;
    width:100%;
  }

  .footer-bottom {
    padding:0 10px 15px 10px;
  }

  .footer-bottom img {
    padding:20px 0;
    width:100%;
  }

}