/* ----------------------------------------------------------------------
 top
---------------------------------------------------------------------- */
#top .image img { width: 100%; }
#top .lead { text-align: center; margin: 0 0 50px; color: #535353; font-size: 2.0rem; }

/* bland */
#top .bland { margin: 0 0 100px; }
#top .bland .wrap { display: flex; justify-content: flex-start; flex-wrap: wrap; max-width: 1220px; }
#top .bland .wrap .box { display: block; width: calc(100% / 7); }
#top .bland .wrap .box a { display: block; padding: 10px; margin: 10px; border: 1px solid #f2f2f2; }

/* new_item */
#top .new_item { background: #fff2f9; padding: 0px 0 80px; }
#top .new_item .main_ttl { color: #a31364; }
#top .new_item ul { display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 0; }
#top .new_item ul li { width: calc(100% / 5); padding: 13px; }
#top .new_item ul li a.item_link { display: block; border: 1px solid #f2f2f2; margin: 0 0 10px; position: relative; }
#top .new_item ul li .name { margin: 0 0 20px; font-size: 1.6rem; height: 5em; overflow: hidden; }
#top .new_item ul li .cate_name { text-align: right; margin-bottom: 10px; }
#top .new_item ul li .cate_name a { display: inline-block; border-radius: 12px; border: 1px solid #f2f2f2; background: #fff; padding: 4px 12px; font-size: 1.2rem; line-height: 1.2; }
#top .new_item ul li .category { color: #707070; font-size: 1.3rem; }
#top .new_item ul li .price { display: block; font-size: 2.2rem; font-weight: bold; text-align: right; }
#top .new_item ul li .price span { font-size: 65%; font-weight: bold; }

/* hot_sell */
#top .hot_sell {  }
#top .hot_sell .main_ttl::before { content: ''; display: block; margin: 0 auto; background: url(https://file003.shop-pro.jp/PA01435/571/img/2019/icon_crown.svg); background-repeat: no-repeat; background-position: center; width: 56px; height: 43px; }
#top .hot_sell .main_ttl { color: #a31364; }
#top .hot_sell ul { display: flex; justify-content: flex-start; flex-wrap: wrap; margin: 0; counter-reset: number 0; }
#top .hot_sell ul li { width: calc(100% / 5); padding: 10px; }
#top .hot_sell ul li a.item_link { display: block; position: relative; margin: 0 0 10px; border: 1px solid #f2f2f2; }
#top .hot_sell ul li a.item_link::before { counter-increment: number 1; content: counter(number) ''; position: absolute; top: -4px; left: -4px; font-weight: bold; font-family: "Times New Roman"; font-size: 1.8rem; color: #fff; line-height: 0.8; text-align: center; z-index: 1; }
#top .hot_sell ul li a.item_link::after { content: ''; position: absolute; width: 28px; height: 28px; border-radius: 50%; top: -10px; left: -13px; }
#top .hot_sell ul li:nth-of-type(1) a.item_link::after { background: #dbbb4c; }
#top .hot_sell ul li:nth-of-type(2) a.item_link::after { background: #c0bebf; }
#top .hot_sell ul li:nth-of-type(3) a.item_link::after { background: #d48854; }
#top .hot_sell ul li:nth-of-type(4) a.item_link::after { background: #eac6d9; }
#top .hot_sell ul li:nth-of-type(5) a.item_link::after { background: #eac6d9; }
#top .hot_sell ul li .name { margin: 0 0 20px; font-size: 1.6rem; height: 5em; overflow: hidden; }
#top .hot_sell ul li .cate_name { text-align: right; margin-bottom: 10px; }
#top .hot_sell ul li .cate_name a { display: inline-block; border-radius: 12px; border: 1px solid #f2f2f2; background: #fff; padding: 4px 12px; font-size: 1.2rem; line-height: 1.2; }

#top .hot_sell ul li .price { display: block; font-size: 2.2rem; font-weight: bold; text-align: right; }
#top .hot_sell ul li .price span { font-size: 65%; font-weight: bold; }

/* service */
#top .service { background: #96a8b1; position: relative; margin: 100px 0 0; padding: 0 0 80px; }
#top .service h2 { padding: 100px 0 50px; color: #fff; font-weight: bold; text-align: center; }
#top .service .inner { margin: 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 860px; }
#top .service .inner > div { padding: 40px; width: 400px; font-size: 2.0rem; background: #fff; border-radius: 6px; text-align: center; font-weight: bold; line-height: 1.4; }
#top .service .inner .first .image { width: 36%; margin: 0 auto 10px; }
#top .service .inner .free .image { width: 31%; margin: 0 auto 10px; }
#top .service .service_bnr { display: flex; justify-content: space-between; max-width: 860px; margin: 0 auto; }
#top .service .service_bnr li { width: 47%; }

/*
#top .service .inner div::before { content: ''; display: block; vertical-align: middle; margin: 0 auto 10px; background-repeat: no-repeat; background-position: center; width: 116px; height: 109px; }
#top .service .first::before { background: url(https://file003.shop-pro.jp/PA01435/571/img/icon_service_01.svg); background-size: 116px 107px; }
#top .service .free::before { background: url(https://file003.shop-pro.jp/PA01435/571/img/icon_service_02.svg); background-size: 96px 109px; }
#top .service .fax::before { background: url(https://file003.shop-pro.jp/PA01435/571/img/icon_service_03.svg); background-size: 100px 95px; }
*/
#top .service .inner span { color: #9e1818; font-weight: bold; font-size: 200%; display: inline-block; }
#top .service_tri {  }

/* category */
#top .category {  }
#top .category .wrap { display: flex; justify-content: flex-start; flex-wrap: wrap; }
#top .category .box { width: calc(100% / 5); padding: 10px; margin: 0 0 50px; border-right: 2px solid #efefef; }
#top .category .box:nth-of-type(5n) { border-right: 2px solid #fff; }
#top .category a { display: block; position: relative; margin: 0 0 20px; }
#top .category a img {  }
#top .category .product_name { font-weight: bold; font-size: 1.6rem; text-align: center; color: #535353; }
#top .category .box:hover .product_name { color: #053535; }
#top .category a:after {  }

/* news */
#top .news { background: #F8F8F8; padding: 30px 0 0; margin: 100px 0 0; }
#top .news .wrap { padding: 0px 0% 60px; max-width: 800px; }
#top .news .main_ttl { margin: 0px 0 15px; }
#top .news .box { display: flex; justify-content: space-between; margin: ; border-top: 1px solid #E6E6E6; padding: 20px 0; }
#top .news .box:first-of-type { border-top: none; }
#top .news .date { width: 106px; font-size: 1.8rem; }
#top .news .ttl { width: calc(100% - 146px); font-size: 1.8rem; }


/*------------------------------------------------------------------------
                                < 1200
------------------------------------------------------------------------*/

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

#top .category .box {  }

}


/*------------------------------------------------------------------------
                                < 900
------------------------------------------------------------------------*/

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

  #top .bland .wrap .box { width: calc(100% / 5); }
#top .category .box { width: calc(100% / 3); margin: 0 0 60px; }
#top .category .box:nth-of-type(5n) { border-color: #efefef; }
#top .category .box:nth-of-type(3n) { border-color: #fff; }

#top .service .inner > div { padding: 40px 20px; width: calc(100% / 2.1); font-size: 80%; justify-content: space-between; }
#top .service .inner > div::before { display: block; margin: 0 auto 10px; }
  #top .new_item ul li { width: calc(100% / 3); }
  #top .hot_sell ul li { width: calc(100% / 3); }
  
  
}


/*------------------------------------------------------------------------
                                < 768
------------------------------------------------------------------------*/

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

  .slider .wrap { padding: 0; }
  #top .bland .wrap .box { width: calc(100% / 3); }
  .new_item .inner {  }
  .new_item .inner ul {  }
  .hot_sell .inner {  }
  .hot_sell .inner ul {  }
  #top .new_item ul li { width: calc(100% / 2); }
  #top .hot_sell ul li { width: calc(100% / 2); }
  #top .hot_sell ul li a.item_link::before { top: -10px; left: 1px; font-size: 3.0rem; }
  #top .hot_sell ul li a.item_link::after { width: 46px; height: 46px; top: -20px; left: -13px; }

  #top .lead { font-size: 2.6rem; }
/*
#top .service { font-size: 2.4rem; }
*/


  #top .category .wrap { justify-content: space-between; }
  #top .service { padding: 0 0 100px; }
  #top .service .inner div { font-size: 2.0rem; }
  #top .service .service_bnr { display: block; }
  #top .service .service_bnr li { width: 80%; margin: 0 auto 30px; }
  #top .category { padding: 35px 0 0; }
/*
  #top .category .product_name { font-size: 2.6rem; }
  #top .new_item ul li .cate_name a { font-size: 2.0rem; }
  #top .new_item ul li .name { font-size: 2.6rem; }
  #top .new_item ul li .price { font-size: 3.3rem; }
  #top .hot_sell ul li .price { font-size: 3.3rem; }
  #top .hot_sell ul li .name { font-size: 2.6rem; }
  #top .hot_sell ul li .cate_name a { font-size: 2.0rem; }
*/
  #top .news { margin: 40px 0 0; }
  #top .news .box { display: block; padding: 20px 20px; }
  #top .news .date { width: 100%; font-size: 1.8rem; }
  #top .news .ttl { width: 100%; font-size: 1.6rem; }
  #top .news .main_ttl { padding: 90px 0 50px; }


  
}






/*------------------------------------------------------------------------
                                < 620
------------------------------------------------------------------------*/

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


/*
#top .service .inner div { width: 400px; }
#top .service .inner .first { margin-bottom: 20px; }
*/

}




/*------------------------------------------------------------------------
                                < 480
------------------------------------------------------------------------*/

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


    #top .bland { margin: 0 0 50px; }
    #top .bland .wrap .box { width: calc(100% / 3); }
/*
    #top .category .box { width: calc(100% / 2); }
    #top .category .box:nth-of-type(3n) { border-color: #efefef; }
    #top .category .box:nth-of-type(2n) { border-color: #fff; }
*/
    #top .service .inner div { font-size: 60%; }

/* font-sizeÄ´À° */
    #top .lead { font-size: 1.3rem; margin: 0 0 30px; }
    #top .new_item ul li .name { font-size: 1.3rem; margin: 0 0 10px; }
    #top .new_item ul li .cate_name a { font-size: 1.0rem; margin-bottom: 5px; }
    #top .new_item ul li .price { font-size: 1.7rem; }
    #top .hot_sell  ul li .name { font-size: 1.3rem; }
    #top .hot_sell  ul li .cate_name a { font-size: 1.0rem; }
    #top .hot_sell  ul li .price { font-size: 1.7rem; }
    #top .hot_sell ul li a.item_link::before { font-size: 1.5rem; }
    #top .hot_sell ul li a.item_link::after { width: 23px; height: 23px; top: -16px; left: -7px; }
    #top .service { padding: 0 0 50px; margin: 50px 0 0; }
    #top .service h2 { padding: 50px 0 25px; }
    #top .service .inner div { font-size: 1.0rem; }
    #top .category .box { margin: 0 0 30px; }
    #top .category .product_name { font-size: 1.3rem; }
    #top .news { margin: 20px 0 0; }
    #top .news .wrap { padding: 0 0 20px; }
    #top .news .main_ttl { margin: 0; padding: 45px 0 20px; }
    #top .news .ttl { font-size: 1.3rem; padding: 10px 0; }
    #top .news .date { font-size: 1.3rem; }




}
