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


.slide_area{display: flex;justify-content: space-between;max-width: 1600px;margin: 0 auto 4rem;}

.slider {width: 65vw;max-width: 1040px}
.slider02 {width: 31vw;max-width: 496px}

.box {
    padding: 2rem 2rem;
}

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

.box h1 {
    font-size: 14px;text-align: center;
}

.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){
	.slide_area{    flex-wrap: wrap;margin: 0 auto 0rem;}
    .slider {left:0;width: 90vw;margin-top: 80px !important;}
	.slider02{width: 100%;max-width: 100%}
	.slider02 .bx-wrapper{width: 30vw;margin: -10vw 0 0 auto !important;}
	img.slide_logo{    max-width: 62vw;margin: 0 auto 1rem 0;}
	.box {padding: 1rem 1rem 2rem;margin-top: -10vh;margin-bottom:-1.5em;}
    #container{overflow-x: hidden;padding-top: 20px;margin-top: -20px; } 
    .box h1 { font-size: 14px;text-align:left;}
    .box li { padding: .5rem .375rem;margin: 0 .375em .5rem; }
}


.gnav-wrapper{border-bottom:none !important;}
.slider{margin-top: 0px;}
.bx-wrapper .bx-pager.bx-default-pager a{background: #eee !important;}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {background: #ccc !important;}
.bx-wrapper .bx-pager{/*bottom: 20px !important;*/}
@media (max-width: 1000px){
.bx-wrapper .bx-caption span{color: #000 !important;font-size: 30px !important;text-align: right;letter-spacing: 3px;}
.bx-wrapper .bx-caption span span{padding:0;font-size: 16px !important;letter-spacing: 1px;}
}
@media (max-width: 600px){
.bx-wrapper #slider div.bx-caption {position: absolute;bottom: 12px;right: 10px;left:auto; background: none !important;width: auto !important;}
.bx-wrapper .bx-caption span{color: #000 !important;font-size: 20px !important;text-align: right;letter-spacing: 3px;}
.bx-wrapper .bx-caption span span{padding:0;font-size: 12px !important;letter-spacing: 1px;}
.bx-wrapper .bx-pager{bottom:-20px !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 .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: 32px;padding: 9px 0 7px;position: absolute;top: 2px;right: 17px;z-index:1;}
 .ranking .prd-lst li:nth-child(1):before {background: #fa0;}
 .ranking .prd-lst li:nth-child(2):before {background: #bbb;}
 .ranking .prd-lst li:nth-child(3):before {background: #930;}

.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; }


@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; }
}


@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%;  }
}