.clearfix:after {
 content: "";
 clear: both;
 display: block;
}
#slick li {
  text-align: center;
  padding-top: 30px;
}
#slick li div {
  max-width: 900px;
  margin: auto;
  position: relative;
}
#slick li h2 {
  position: absolute;
  bottom: 30px;
  left: 50px;
  font-size: 28px;
  color: #fff;
  letter-spacing: 0.05em;
  text-shadow: black 0 0 5px;
}
#slick img {
 width: 100%;
 max-width: 100;
}
.slick-dots li button {
  padding: 0 !important;
  background: #ccc !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 50%;
}
.slick-dots li.slick-active  button {
  background: #555 !important;
}
.slick-dots li button:before {
  content: '' !important; 
}
.slick-dots {
  bottom: -30px !important; 
}
.bg-slider {
	width: 100%;
	height: calc(100vh - 136px);
	background-position:center center;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
    overflow: hidden;
    margin-top: 3px;
}
.bg-slider__title{
	color: #fff;
	font-size: 48px;
	line-height: 1.5;
	font-weight: bold;
	text-align:center;
	text-shadow: 1px 1px 1px #000;
}
@media screen and (max-width: 800px) {
  .bg-slider { height: 50vh;}
  .bg-slider__title{ font-size: 22px;}
}
#container .thumb-container, #container #box_sellers { text-align: center !important; }
#container #box_sellers¡¡{ padding-top: 70px; }

ul.top-category { list-style: none; }
ul.top-category li { width:16.666666%; box-sizing: border-box; padding: 5px; float: left; }
ul.top-category li img { width: 100%; height: auto; }

ul.top-collection { list-style: none; }
ul.top-collection li { width:25%; box-sizing: border-box; padding: 8px; float: left; }
ul.top-collection li img { width: 100%; height: auto; }

#sb-site, .sb-site-container {
  /* You may now use class .sb-site-container instead of #sb-site and use your own id. However please make sure you don't set any of the following styles any differently on your id. */
  width: 100%;
  /* min-height: 100vh; */
  position: relative;
  z-index: 1;
  /* Site sits above Slidebars */
  background-color: #ffffff;
  /* Default background colour, you can overwrite this with your own css. I suggest moving your html or body background styling here. Making this transparent will allow the Slidebars beneath to be visible. */ }

/* Micro clearfix by Nicolas Gallagher, ensures the site container hits the top and bottom of the screen. */
#sb-site:before, #sb-site:after, .sb-site-container:before, .sb-site-container:after {
  content: ' ';
  display: table; }

#sb-site:before, #sb-site:after, .sb-site-container:before, .sb-site-container:after {
  clear: both; }

#sb-site { margin-top: 15px; }

-------------------------------------------------------------

HOME SLIDER

*/
.hero-slider {
  position: relative;
  x-index: 97;
  overflow: hidden; }
  .hero-slider h2 {
    color: black;
    margin: 0px 0px 20px 0px;
    font-size: 40px; }
    @media (max-width: 1600px) {
      .hero-slider h2 {
        font-size: 35px; } }
    @media (max-width: 1440px) {
      .hero-slider h2 {
        font-size: 25px; } }
    @media (max-width: 1000px) {
      .hero-slider h2 {
        font-size: 35px; }}
    @media (max-width: 760px) {
      .hero-slider h2 {
        font-size: 25px; } }
  .hero-slider h3 {
    font-size: 11px;
    color: #9f9f9f;
    font-family: "azo-sans-web", sans-serif;
    font-weight: 700; }
    @media (max-width: 1200px) {
      .hero-slider h3 {
        font-size: 9px; } }
    @media (max-width: 1000px) {
      .hero-slider h3 {
        padding: 0px 20px;
        font-size: 11px; } }
  .hero-slider .content-wrapper, .hero-slider .image-container {
    float: left;
    width: 50%;
    position: relative;
    height: 497px; }
    @media (max-width: 1260px), (max-height: 720px) {
      .hero-slider .content-wrapper, .hero-slider .image-container {
        } }
    @media (max-width: 1000px) {
      .hero-slider .content-wrapper, .hero-slider .image-container {
        float: none;
        width: 100%;
        max-height: none; } }
  @media (max-width: 1000px) {
    .hero-slider .image-container {
      display: none; } }
  .hero-slider .brand-caption {
    position: absolute;
    bottom: 50px;
    right: 50px;
    text-align: center;
    text-align: center;
    max-width: 300px;
    line-height: 1.2;
    -webkit-transition: all 1.5s cubic-bezier(0.23, 1, 0.32, 1);
    -moz-transition: all 1.5s cubic-bezier(0.23, 1, 0.32, 1);
    -ms-transition: all 1.5s cubic-bezier(0.23, 1, 0.32, 1);
    -o-transition: all 1.5s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 1.5s cubic-bezier(0.23, 1, 0.32, 1);
    -webkit-transform: translate3d(0px, -300px, 0px);
    -moz-transform: translate3d(0px, -300px, 0px);
    -ms-transform: translate3d(0px, -300px, 0px);
    transform: translate3d(0px, -300px, 0px);
    opacity: 0; }
    .hero-slider .brand-caption strong {
      color: white; }
    .hero-slider .brand-caption img {
      margin: 10px auto 0px auto;
      display: block; }
  .hero-slider .content-wrapper {
    position: relative;
    height: 100%; }
  .hero-slider .content-product {
    position: absolute;
    right: 0px;
    width: 700px;
    height: 550px;
    margin-top: -50px;
    margin-right: -60px;
    -webkit-transform: translate(0px, 50%);
    -moz-transform: translate(0px, 50%);
    -ms-transform: translate(0px, 50%);
    transform: translate(0px, 50%); }
    @media (max-width: 2000px) {
      .hero-slider .content-product {
        margin-top: -145px; } }
    @media (max-width: 1740px) {
      .hero-slider .content-product {
        margin-top: -210px; } }
    @media (max-width: 1600px) {
      .hero-slider .content-product {
        width: 480px;
        height: 470px;
        margin-top: -150px;
        margin-right: 0px;
        right: auto;
        left: 50%;
        margin-left: -240px; } }
    @media (max-width: 1440px) {
      .hero-slider .content-product {
        margin-top: -200px;
        width: 450px;
        margin-left: -225px; } }
    @media (max-width: 1200px) {
      .hero-slider .content-product {
        width: 450px;
        margin-left: -200px;
        margin-top: -130px;
        height: 400px;
        right: auto; } }
    @media (max-width: 1000px) {
      .hero-slider .content-product {
        display: block;
        position: relative;
        left: auto;
        -webkit-transform: translate(0px, 0px);
        -moz-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
        height: auto;
        width: 100%;
        margin: 80px auto;
        text-align: center; } }
    @media (max-width: 760px) {
      .hero-slider .content-product {
        margin-top: 20px; margin-bottom: 30px; } }
  .hero-slider .image-container .hero-img {
    width: 100%;
    margin-bottom: -15px; }
  .hero-slider .text-shift {
    font-size: 36px;
    font-weight: 700;
    font-family: 'Open Sans', '¥Ò¥é¥®¥Î³Ñ¥´ ProN W3', 'Hiragino Kaku Gothic ProN', '¥á¥¤¥ê¥ª', Meiryo, '£Í£Ó £Ð¥´¥·¥Ã¥¯', Sans-serif;
    line-height: 1;
    color: #555;
    margin: 0px 0px 30px 0px;
    -webkit-transition: all 0.75s cubic-bezier(0.23, 1, 0.32, 1);
    -moz-transition: all 0.75s cubic-bezier(0.23, 1, 0.32, 1);
    -ms-transition: all 0.75s cubic-bezier(0.23, 1, 0.32, 1);
    -o-transition: all 0.75s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 0.75s cubic-bezier(0.23, 1, 0.32, 1);
    -webkit-transform: translate3d(0px, -150px, 0px);
    -moz-transform: translate3d(0px, -150px, 0px);
    -ms-transform: translate3d(0px, -150px, 0px);
    transform: translate3d(0px, -150px, 0px);
    opacity: 0; }

    @media (max-width: 1600px) {
      .hero-slider .text-shift {
        font-size: 45px; } }
    @media (max-width: 1440px) {
      .hero-slider .text-shift {
        font-size: 24px; } }
    @media (max-width: 1200px) {
      .hero-slider .text-shift {
        font-size: 24px; } }
    @media (max-width: 1000px) {
      .hero-slider .text-shift {
        font-size: 24px; } }
    @media (max-width: 760px) {
      .hero-slider .text-shift {
        font-size: 20px; } }
  .hero-slider .product-shift {
    -webkit-transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
    -moz-transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
    -ms-transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
    -o-transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
    -webkit-transform: translate3d(-500px, 0px, 0px);
    -moz-transform: translate3d(-500px, 0px, 0px);
    -ms-transform: translate3d(-500px, 0px, 0px);
    transform: translate3d(-500px, 0px, 0px);
    opacity: 0; }
    @media (max-width: 1440px) {
      .hero-slider .product-shift {
        width: 300px; } }
    @media (max-width: 1000px) {
      .hero-slider .product-shift {
        width: 100%;
        max-width: 500px; } }
    @media (max-width: 760px) {
      .hero-slider .product-shift {
        width: 280px; } }
  .hero-slider .image-shift {
    -webkit-transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1);
    -moz-transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1);
    -ms-transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1);
    -o-transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1);
    transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1);
    opacity: 0; }
  .hero-slider .product-title {
    -webkit-transition: all 1.15s cubic-bezier(0.23, 1, 0.32, 1);
    -moz-transition: all 1.15s cubic-bezier(0.23, 1, 0.32, 1);
    -ms-transition: all 1.15s cubic-bezier(0.23, 1, 0.32, 1);
    -o-transition: all 1.15s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 1.15s cubic-bezier(0.23, 1, 0.32, 1);
    -webkit-transform: translate3d(0px, 150px, 0px);
    -moz-transform: translate3d(0px, 150px, 0px);
    -ms-transform: translate3d(0px, 150px, 0px);
    transform: translate3d(0px, 150px, 0px);
    opacity: 0;
    margin-top: 30px; }
    @media (max-width: 1440px) {
      .hero-slider .product-title {
        margin-top: 0px; } }
    @media (max-width: 1000px) {
      .hero-slider .product-title h3 {
        float: none;
        margin-right: 0px; } }
    .hero-slider .product-title .btn-lrg {
      margin-top: 30px; }
      @media (max-width: 1200px) {
        .hero-slider .product-title .btn-lrg {
          margin-top: 10px; } }
      @media (max-width: 1000px) {
        .hero-slider .product-title .btn-lrg {
          margin-top: 30px; } }

.thumb-container {
  border-top: solid 1px #dbdbdb;
  border-bottom: solid 1px #dbdbdb;
  padding: 40px 0px 20px;
  position: relative; }
  @media (max-width: 1260px), (max-height: 720px) {
    .thumb-container {
      padding: 15px 0px; } }
  @media (max-width: 1260px), (max-height: 720px) {
    .thumb-container .container {
      width: 1000px; } }
  @media (max-width: 1000px) {
    .thumb-container .container {
      width: 92%; margin-right: auto; margin-left: auto; } }
  .thumb-container .heroslider-previous, .thumb-container .heroslider-next {
    cursor: pointer;
    display: block;
    height: 80px;
    width: 80px;
    border: solid 1px #dbdbdb;
    text-align: center;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
    border-radius: 100%;
    line-height: 80px;
    -webkit-transition: border, 300ms;
    -moz-transition: border, 300ms;
    -ms-transition: border, 300ms;
    -o-transition: border, 300ms;
    transition: border, 300ms;
    z-index: 99; }
    @media (max-width: 1260px), (max-height: 720px) {
      .thumb-container .heroslider-previous, .thumb-container .heroslider-next {
        width: 60px;
        height: 60px;
        line-height: 60px; } }
    @media (max-width: 1440px) {
      .thumb-container .heroslider-previous, .thumb-container .heroslider-next {
        display: none; } }
    .thumb-container .heroslider-previous:hover, .thumb-container .heroslider-next:hover {
      border: solid 1px #d2aa60; }
      .thumb-container .heroslider-previous:hover img, .thumb-container .heroslider-next:hover img {
        opacity: .5; }
    .thumb-container .heroslider-previous img, .thumb-container .heroslider-next img {
      vertical-align: middle; }
  .thumb-container .heroslider-previous {
    position: absolute;
    left: 40px;
    top: 37px; }
    @media (max-width: 1260px), (max-height: 720px) {
      .thumb-container .heroslider-previous {
        left: 30px;
        top: 20px; } }
  .thumb-container .heroslider-next {
    position: absolute;
    right: 40px;
    top: 37px; }
    @media (max-width: 1260px), (max-height: 720px) {
      .thumb-container .heroslider-next {
        right: 30px;
        top: 20px; } }

.thumb-slider .item {
  -webkit-transform: scale(0.85);
  -moz-transform: scale(0.85);
  -ms-transform: scale(0.85);
  transform: scale(0.85);
  -webkit-transition: all 1.15s cubic-bezier(0.23, 1, 0.32, 1);
  -moz-transition: all 1.15s cubic-bezier(0.23, 1, 0.32, 1);
  -ms-transition: all 1.15s cubic-bezier(0.23, 1, 0.32, 1);
  -o-transition: all 1.15s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 1.15s cubic-bezier(0.23, 1, 0.32, 1);
  cursor: pointer; }
  @media (max-width: 1260px), (max-height: 720px) {
    .thumb-slider .item img {
      width: 100px;
      margin: 5px auto 0px auto; } }
  @media (max-width: 1440px) {
    .thumb-slider .item img {
      max-width: 95%;
      padding: 0px 2.5%; } }
.thumb-slider .synced .item {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1); }
.thumb-slider .synced .item img { border-bottom: 3px solid #bbb; }

.active .brand-caption {
  -webkit-transform: translate3d(0px, 0px, 0px);
  -moz-transform: translate3d(0px, 0px, 0px);
  -ms-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px);
  opacity: 1; }
.active .text-shift, .active .product-title {
  -webkit-transform: translate3d(0px, 0px, 0px);
  -moz-transform: translate3d(0px, 0px, 0px);
  -ms-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px);
  opacity: 1; }
.active .product-shift {
  -webkit-transform: translate3d(0px, 0px, 0px);
  -moz-transform: translate3d(0px, 0px, 0px);
  -ms-transform: translate3d(0px, 0px, 0px);
  transform: translate3d(0px, 0px, 0px);
  opacity: 1; }
.active .image-shift {
  opacity: 1; }

/* 
 *  Core Owl Carousel CSS File
 *  v1.3.3
 */
/* clearfix */
.owl-carousel .owl-wrapper:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0; }

/* display none until init */
.owl-carousel {
  display: none;
  position: relative;
  width: 100%;
  -ms-touch-action: pan-y; }

.owl-carousel .owl-wrapper {
  display: none;
  position: relative;
  -webkit-transform: translate3d(0px, 0px, 0px); }

.owl-carousel .owl-wrapper-outer {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.owl-carousel .owl-wrapper-outer.autoHeight {
  -webkit-transition: height 500ms ease-in-out;
  -moz-transition: height 500ms ease-in-out;
  -ms-transition: height 500ms ease-in-out;
  -o-transition: height 500ms ease-in-out;
  transition: height 500ms ease-in-out; }

.owl-carousel .owl-item {
  float: left; }

.owl-controls .owl-page,
.owl-controls .owl-buttons div {
  cursor: pointer; }

.owl-controls {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent; }

/* mouse grab icon */
.grabbing {
  cursor: url(grabbing.png) 8 8, move; }

/* fix */
.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0); }

/* 
 *  Owl Carousel CSS3 Transitions 
 *  v1.3.2
 */
.owl-origin {
  -webkit-perspective: 1200px;
  -webkit-perspective-origin-x: 50%;
  -webkit-perspective-origin-y: 50%;
  -moz-perspective: 1200px;
  -moz-perspective-origin-x: 50%;
  -moz-perspective-origin-y: 50%;
  perspective: 1200px; }

/* fade */
.owl-fade-out {
  z-index: 10;
  -webkit-animation: fadeOut .7s both ease;
  -moz-animation: fadeOut .7s both ease;
  animation: fadeOut .7s both ease; }

.owl-fade-in {
  -webkit-animation: fadeIn .7s both ease;
  -moz-animation: fadeIn .7s both ease;
  animation: fadeIn .7s both ease; }

/* backSlide */
.owl-backSlide-out {
  -webkit-animation: backSlideOut 1s both ease;
  -moz-animation: backSlideOut 1s both ease;
  animation: backSlideOut 1s both ease; }

.owl-backSlide-in {
  -webkit-animation: backSlideIn 1s both ease;
  -moz-animation: backSlideIn 1s both ease;
  animation: backSlideIn 1s both ease; }

/* goDown */
.owl-goDown-out {
  -webkit-animation: scaleToFade .7s ease both;
  -moz-animation: scaleToFade .7s ease both;
  animation: scaleToFade .7s ease both; }

.owl-goDown-in {
  -webkit-animation: goDown .6s ease both;
  -moz-animation: goDown .6s ease both;
  animation: goDown .6s ease both; }

/* scaleUp */
.owl-fadeUp-in {
  -webkit-animation: scaleUpFrom .5s ease both;
  -moz-animation: scaleUpFrom .5s ease both;
  animation: scaleUpFrom .5s ease both; }

.owl-fadeUp-out {
  -webkit-animation: scaleUpTo .5s ease both;
  -moz-animation: scaleUpTo .5s ease both;
  animation: scaleUpTo .5s ease both; }

.slide-item-img .image-shift {
  width: 75%;
  height: auto;
  margin: auto;
  max-height: 270px;
}
.slide-item-img {
  margin-bottom: 35px;
  text-align: center;
}
.view-more {
  font-size: 14px;
  padding: 7px 40px 9px;
  border: 1px solid #888;
  text-decoration: none;
}
.view-more:hover {
  text-decoration: none;
}

#index-under { clear: both; padding-top: 35px; }
#index-under .box { width: 65%; float: left; margin-bottom: 60px; }
#index-under .side-right { width: 30%; float: right; margin-bottom: 60px; }
#index-under .side-right img { width: 100%; }
#index-under .side-right iframe { width: 100%; }
#index-under .side-right .fb-page { margin-top: 20px; }
#box_sellers h3, #box_news h3 { font-size: 24px; color: #333; margin-bottom: 30px; }
#box_sellers h3.title-seller { text-align: center; padding-top: 70px; }
.thumb-container h3 { font-size: 22px; color: #333; margin-bottom: 0px; text-align: center; }

#banner-area { padding-top: 5px; }
#banner-area .new, #banner-area .mens, #banner-area .womens { width: 30%; float: left; margin-bottom: 55px; }
#banner-area .new img, #banner-area .mens img, #banner-area .womens img { width: 100%; height: auto; }
#banner-area .mens { margin: 0 5% 45px; }

.news-area { height: 470px; overflow-y: auto; }

.promo_box img { max-width: 100%; height: auto; }

@media screen and (max-width: 1000px) {
      .slide-item-img .image-shift {
        max-height: unset;
      }
}
  
@media screen and (max-width: 480px) {
#sb-site { margin-top: 58px; }
  #index-under .box { width: 94%; float: none; margin: 0 auto 40px; }
  #index-under .side-right { width: 94%; float:none; margin: 0 auto 40px; }
  #banner-area .new, #banner-area .mens, #banner-area .womens { width: 90%; float: none; margin: 0 auto 20px; }
  #banner-area .womens { margin-bottom: 50px; }
  ul.top-category li { width:33.3333%; box-sizing: border-box; padding: 5px; float: left; }
  ul.top-collection li { width:50%; box-sizing: border-box; padding: 8px; float: left; }
  #slick {margin-top: 27px;}
  #slick li h2 {bottom: 20px; left: 30px; font-size: 22px;}
}

.mobus_lite_bnr {
  margin: 0 auto;
  padding-top: 30px;
  max-width: 900px !important;
}
.mobus_lite_bnr .left {
  width: 48%;
  float: left;
  margin-right: 4%;
}
.mobus_lite_bnr .right {
  width: 48%;
  float: left;
}

@media screen and (max-width: 600px) {
  .mobus_lite_bnr {
    width: 300px;
  }
  .mobus_lite_bnr .left {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }
  .mobus_lite_bnr .right {
    width: 100%;
  }
}