h2 {margin: 20px 0 0;text-align: center;}
.h3-sub {
  font-size: 0.625rem;
  margin: 0 0 30px;
  text-align: center;
  text-align: center;
}


.main-slider-wrapper {
  width: 100%;
  overflow: hidden;
  margin: 0 auto !important;
}

.main-slider {
  width: 100%;
}

/* PCでは左右チラ見せ */
#slider .slick-list {
  overflow: visible;
}

#slider .slick-track {
  display: flex;
  align-items: center;
}

#slider .slick-slide {
  height: auto;
  padding: 0 10px;
  box-sizing: border-box;
}

/* スライドの中身を1000pxで固定 */
#slider .slick-slide > * {
  width: 1000px !important;
  max-width: 1000px !important;
  margin: 0 auto;
}

#slider .slick-slide img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto;
  display: block;
}
#slider .slick-slide > div {
  width: 1000px !important;
  max-width: 1000px !important;
  margin: 0 auto;
}

#slider .slick-slide > div > * {
  width: 100%;
  max-width: 100%;
}

@media screen and (max-width: 900px) {
  #slider .slick-list {
    overflow: hidden;
  }

  #slider .slick-slide {
    padding: 0;
  }

  #slider .slick-slide > * {
    width: 100% !important;
    max-width: 100% !important;
  }
  .slick-dots li { bottom:10px !important; }
}

.slide_area {
  width:100%;
  margin:0 auto !important;
}


@media screen and (min-width: 901px) {
  #slider .slick-slide {
    padding: 0 10px;
    box-sizing: border-box;
  }

  #slider .slick-slide > div {
    width: 1000px !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
  }

  #slider .slick-slide > div a {
    display: block;
    width: 100%;
  }

  #slider .slick-slide img {
    display: block;
    width: 100% !important;
    max-width: 1000px !important;
    height: auto !important;
    margin: 0 auto !important;
  }
}

@media screen and (max-width: 900px) {
  #slider .slick-slide {
    padding: 0;
  }

  #slider .slick-slide > div {
    width: 100% !important;
    max-width: 100% !important;
  }

  #slider .slick-slide img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }
}


.box {
    width:100%;
    max-width:1200px;
    margin:0 auto;
    padding: 1rem 0 1.5rem;
    display:flex;
}
.box_concept {width:60%;line-height:2.5 !important;display:block;}
.box_ctegory {width:40%;display:flex;flex-wrap:wrap;}
.box-category_top { width:100%; }
.box-category_bottom { width:100%; }

img.slide_logo {
    max-width: 180px;
    display: block;
    margin: 0 auto;
}

.box ul {
    margin: 0;
    padding:  0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;justify-content: center;
}

.box li {
    border: 1px solid #0a243d;
    padding: .5rem .75rem;
    font-size: 12px;
    margin: 0.2rem;
}
.box li a { display:block;width:100%;height:100%; }
.box li:hover { background:#0a243d;text-decoration:none; } 
.box li:hover a { color:#fff !important;text-decoration:none; }


@media (max-width: 768px){
  .box {
    display:block;
    max-width:100%;
    padding: 0 2% ;
    margin-bottom:-2em;
  }
  .box_concept {width:92%;margin:-1em auto 0;line-height:1.5 !important;font-weight:500;display:block;}
  .box_ctegory {width:92%;margin:0 auto;display:block;}
    #container{overflow-x: hidden;padding-top: 20px;margin-top: -20px; } 
    .box h3 { font-size:.9em;font-weight:500; }
  	img.slide_logo { display:none;}
    .box li { padding: .5rem .5rem .75rem;margin: 0 .5em .5em; }
    .box-category_bottom { margin:0 auto 2.75em !important; }
}


.gnav-wrapper{border-bottom:none !important;}


.cate_banner {
  display:flex;
  justify-content:space-between;
  flex-wrap:nowrap;
  margin:-.5em auto -1.5em;
}
.cate_item { width:32%; }

.prd-lst{justify-content: center;}

@media only screen and (min-width: 481px){
  .prd-lst li:nth-child(6){display:none;  }
}

.prd-lst-unit{height: auto !important;margin-bottom: 20px;}

@media (max-width: 600px){
  .prd-lst-unit{padding: 0 15px;}
  .row.unstyled{margin-left: -15px;}
}

.ranking-image-wrap {
  position: relative;
  display: inline-block;
}

.ranking-icon {
  position: absolute;
  top: 0;
  right: 0;
  width: 38px;
  height: 38px;
  z-index: 10;
  background-size: contain;
  background-repeat: no-repeat;
}

/* 1〜3位 */
.rank-1 { background-image: url('https://img07.shop-pro.jp/PA01442/000/etc_base64/cmFua18x.png'); }
.rank-2 { background-image: url('https://img07.shop-pro.jp/PA01442/000/etc_base64/cmFua18y.png'); }
.rank-3 { background-image: url('https://img07.shop-pro.jp/PA01442/000/etc_base64/cmFua18z.png'); }

/* PC側の4位以降 */
.ranking .prd-lst {
  counter-reset: wpp-ranking;
}
.ranking .prd-lst li {
  position: relative;
}
.ranking .prd-lst li::before {
  background: #999;
  border-radius: 50%;
  content: counter(wpp-ranking, decimal);
  counter-increment: wpp-ranking;
  color: #fff;
  font-size: 14px;
  line-height: 1;
  width: 28px;
  height:auto;
  padding: 5px 0 7px;
  position: absolute;
  top: 2px;
  right: 17px;
  z-index: 1;
  text-align: center;
}
.ranking .prd-lst li:nth-child(1)::before,
.ranking .prd-lst li:nth-child(2)::before,
.ranking .prd-lst li:nth-child(3)::before {
  background: transparent;
}

@media screen and (max-width:767px) {
  .rank-4,
  .rank-5,
  .rank-6,
  .rank-7,
  .rank-8,
  .rank-9,
  .rank-10{
    width: 28px !important;
    height: 28px !important;
    border-radius: 50%;
    background: #999;
    color: #fff;
  }

  .rank-4::before{
    content: "4";
    display: block;
    line-height: 28px;
    font-size: 14px;
    text-align: center;
  }
  .rank-5::before{
    content: "5";
    display: block;
    line-height: 28px;
    font-size: 14px;
    text-align: center;
  }
  .rank-6::before{
    content: "6";
    display: block;
    line-height: 28px;
    font-size: 14px;
    text-align: center;
  }
  .rank-7::before{
    content: "7";
    display: block;
    line-height: 28px;
    font-size: 14px;
    text-align: center;
  }
  .rank-8::before{
    content: "8";
    display: block;
    line-height: 28px;
    font-size: 14px;
    text-align: center;
  }
  .rank-9::before{
    content: "9";
    display: block;
    line-height: 28px;
    font-size: 14px;
    text-align: center;
  }
  .rank-10::before{
    content: "10";
    display: block;
    line-height: 28px;
    font-size: 12px;
    text-align: center;
  }
}

@media screen and (max-width:767px) {
  .ranking-sp-list {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .ranking-sp-item {
    box-sizing: border-box;
    padding: 0 8px;
  }

  .ranking-sp-item img {
    display: block;
    width: 100%;
    height: auto;
  }
}


@media screen and (max-width:767px) {
  #slick_container {
    max-width: 100vw;
    margin: 0 auto -3em;
    position: relative;
    overflow: hidden;
  }
  .autoplay {
    margin: 0 auto;
    max-width: 100%;
    padding: 0;
    list-style: none;
  }
  .autoplay .prd-lst-unit {
    box-sizing: border-box;
  }
}


.new-wrap { 
  position: relative;
  display: inline-block; 
}
.new_txt {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px; 
  height: 28px; 
  z-index: 10;
  background-size: contain;
  background-repeat: no-repeat;
}
 .new-items .prd-lst {counter-reset: wpp-ranking;}
 .new-items .prd-lst li {position: relative;}
 .new-items .prd-lst li:before{background: #ffa71e;border-radius: 2%;content:"NEW"; color: #fff;font-size: 14px;line-height: 1;width: 30px;padding: 2px 4px 4px;position: absolute;top: 0px;right: 15px;z-index:1;}

.info {margin: 0 -15px 80px;border-top: 1px solid #ccc;border-bottom: 1px solid #ccc;}
.info li{padding: 10px;list-style: none;}
.info li +li{border-top: 1px solid #ccc;}
.info li dd{margin-left: 0}

.topics a {display: block;text-decoration: none;}
.topics h3{margin: 10px 0 5px;}
.topics p{margin-bottom: 30px;}

.free_space div div{padding: 15px;border: 2px dashed #b30000;color: #b30000;text-align: center}
@media (max-width: 600px){.free_space div div{font-size: 12px;text-align:left}
}
.btn-more{max-width: 300px;width: 100%;margin: 0 auto 60px;display: block;border: 1px solid #ccc;}


.banner.category a{border:none;display: flex;align-items: center;}

.banner.category a:hover{opacity:.6;}

.banner.category a::after{border:none;}

.banner a img{width: 55px;height: auto;display: block;margin-right: .5rem;}


.banner_d {
    margin-bottom:3em;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
}
.banner_d .b_d {
    width:23.25%;
    border: 1px solid #0a243d;
    text-align:center;
    padding: .875rem 0;   
    margin-bottom: 1.85rem;
    box-sizing:border-box;    
}
.banner_d .b_d a { 
    font-size: 15px;
    font-weight:600;
    display:block;
    width:100%;
    height:100%; 
}

.banner_d .b_d:hover { background:#0a243d;text-decoration:none; } 
.banner_d .b_d:hover a { color:#fff !important;text-decoration:none; }


.cate_group span,.cate_group a { border:1px solid #555;padding:0 1.50em 0 !important; } 
.banner.category .cate_group a::after{border:none;}


@media only screen and (max-width: 768px){	
	.h3-sub{}
    .banner a{font-size:11px;}
	.banner.category{margin: 2rem 0 0px;}
    .banner.category a{justify-content: center; flex-wrap: wrap;}
	.banner.category a span{display: block;width: 100%;  line-height: 1.4;}
    .banner a img{width: 50px; height: auto;	margin-right: 0;margin-bottom: .5rem;}
	.banner.category .col-lg-3{padding-right: .5rem; padding-left: .5rem;}
    .banner_d .b_d { width:32%;padding:.5em .25rem;margin-bottom:1.25em;height:3.2rem;box-sizing:border-box; align-items:center; }
    .banner_d .b_d a { font-size: 12px;font-weight:normal; }
    .cate_group span,.cate_group a { border:1px solid #555;padding:1em 0em !important; }
}


@media (min-width: 576px){
  .col-lg-2{width:20%;max-width:20%;flex: 0 0 20%;  }
}
@media (min-width: 992px){
  .col-lg-2{width:20%;max-width:20%;flex: 0 0 20%;  }
}