@charset "utf-8";
/* ------------------------------------------------------------------------------------
 MUSUBI カスタムCSS（レスポンシブ）
 TCDテーマ本体（css/responsive.css）は直接編集せず、カスタマイズはこのファイルに記述する。
 読み込み: functions/head.php（responsive.css の直後、同じ media 指定 max-width:1500px）
------------------------------------------------------------------------------------ */

@media screen and (max-width:900px) {
  #archive_product {
    padding: 100px 30px 150px;
    width: auto;
  }
}

@media screen and (max-width:650px) {
  #archive_product {
    padding: 40px 20px;
  }

  #product_list .item {
    margin: 0 0 30px;
    padding: 30px 20px;
  }

  #product_list .link {
    height: 300px;
  }

  #product_list .title_area {
    padding: 16px 20px;
  }

  #product_list .category {
    display: none;
  }

  #product_list .category:before {
    display: none;
  }

  #product_list .excerpt {
    font-size: 14px;
    line-height: 2.3;
    max-height: 6.9em;
    margin: 10px 0 0 0;
  }

  #product_list .excerpt span {
    -webkit-line-clamp: 3;
  }
}

@media screen and (max-width:450px) {
  #product_list .link {
    height: 195px;
  }

  #product_list .category a {
    min-width: 130px;
  }
}

#page_header {
  height: 280px;
}

#page_header_catch {
  top: 50%;
}

@media screen and (max-width:650px) {
  #header_logo img {
    width: 50px;
    height: auto;
  }

  #product_list .detail-button {
    font-size: 10px;
  }

  #page_header {
    height: 190px;
  }

  #page_header_catch {
    top: 50%;
  }
}