.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
  max-height: 100%; }

a.category_oil{
  color: #D67834;
}

a.category_oil .img{
  border: 1px solid #D67834;
  position: relative;
}
a.category_oil:hover .img:before {
  position: absolute;
  background-color: rgba(214,120,52,.2);
  z-index: 2;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  content: "";
}

a.category_garden{
  color: #368744;
}

a.category_garden .img {
  border: 1px solid #368744;
  position: relative;
}

a.category_garden:hover .img:before {
  position: absolute;
  background-color: rgba(54, 135, 68, .2);
  z-index: 2;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  content: "";
}

a.category_plastic{
  color: #A04793;
}

a.category_plastic .img {
  border: 1px solid #A04793;
  position: relative;
}

a.category_plastic:hover .img:before {
  position: absolute;
  background-color: rgba(160, 71, 147, .2);
  z-index: 2;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  content: "";
}

a.category_physics{
  color: #3D8CC8;
}

a.category_physics .img {
  border: 1px solid #3D8CC8;
  position: relative;
}

a.category_physics:hover .img:before {
  position: absolute;
  background-color: rgba(61, 140, 200, .2);
  z-index: 2;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  content: "";
}

a.category_parts{
  color: rgb(233, 86, 154);
}

a.category_parts .img {
  border: 1px solid rgb(233, 86, 154);
  position: relative;
}

a.category_parts:hover .img:before {
  position: absolute;
  background-color: rgba(233, 86, 154, .2);
  z-index: 2;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  content: "";
}

.danger {
  border-bottom: 3px solid #FFB100;
}

.petroleum {
  border-bottom: 3px solid #D67834;
}

.rohs {
  border-bottom: 3px solid rgba(214, 120, 52, 0.4); }

.yuuki {
  border-bottom: 3px solid rgba(54, 135, 68, 0.4); }

.doku {
  border-bottom: 3px solid rgba(160, 71, 147, 0.4); }

.prtr {
  border-bottom: 3px solid rgba(61, 140, 200, 0.4); }
.flex{
  display: flex;
}
.huge {
  font-size: 2rem; }

.large {
  font-size: 1.857rem; }

.bigger {
  font-size: 1.429rem; }

.big {
  font-size: 1.143rem; }

.regular {
  font-size: 1rem; }

.small {
  font-size: .85rem; }

.text-center {
  text-align: center; }

.text-right {
  text-align: right; }

.bold {
  font-weight: bold; }

nav ul a {
  color: #444 !important; }

li.slide-item img {
  width: 100%;
  height: auto; }

.slick-slider {
  height: 100%;
  width: auto;
  margin: 0; }
  .slick-slider div {
    height: 100% !important; }
.slick-slider li.slick-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#thumbnail-list {
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }

.thumbnail-item {
  position: relative;
  width: 40%;
  padding-bottom: 38%;
  margin-bottom: 10px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 5px;
}
  .thumbnail-item:after {
    content: '';
    background-color: rgba(255, 255, 255, 0.5);
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    right:0;
    bottom: 0;
    /* width: 100%;
    padding-bottom: 100%; */
    opacity: 1;
    -webkit-transition: .3s opacity linear;
    transition: .3s opacity linear;
    border-radius: 3px; }
  .thumbnail-item.thumbnail-current:after {
    opacity: 0; }
  .thumbnail-item img {
    position: absolute;
    max-width: 80%;
    max-height: 80%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: auto;
    height: auto;
    object-fit: cover;
    border-radius: 5px; }

.slider-img {
  width: 100%;
  height: auto!important;
  max-height: 80%;
  object-fit: contain;
  margin: auto;
  font-family: 'object-fit: contain;'
}

.screen-reader-text{
  display:none!important;
}

.flex-between{
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media screen and (max-width: 768px){
  .item_detail_img_container{
    flex-wrap: wrap;
  }
  .item_detail_img_container .product_img_container{
    width: 100%!important;
  }
  .item_detail_img_container .product_thumbnail_container{
    margin-top: 2rem;
    width: 100%!important;
  }
  .thumbnail-item {
    width: 20%;
    padding-bottom: 20%;
  }
}

.postal_code_wrapper{
  display: flex; 
  align-items: baseline;
  max-width: 300px;
}