/* common value, do not edit unless you have global search and confirm it is safe */
/* Color Theme */
/* Color theme for landing */
/* header scss variable */
/* (Flexbox Mixin Helper) */
/* (Calc Mixin Helper) */
/*  START: Animation Mixin */
/* Clockwise Spinning */
/* Anti-clockwise Spinning */
/*  END: Animation Mixin */
/* line 14, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
.ymal-container .ui-you-may-also-like {
  margin: 0 auto;
}
/* line 18, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
.ymal-container .slick-list {
  padding: 50px 0 37px 0;
  margin: -50px auto -35px auto;
  z-index: 3;
}
/* line 24, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
.ymal-container .popUpMenuContainer {
  transform-origin: 50% 450px;
  -webkit-transform-origin: 50% 450px;
  -ms-transform-origin: 50% 450px;
  -moz-transform-origin: 50% 450px;
}
/* line 32, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
.ymal-container .products .product-brief {
  display: inline-block;
  vertical-align: top;
}
/* line 35, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
.ymal-container .products .product-brief.BMSM {
  height: auto;
  height: initial;
  padding: 0;
  margin: 0;
}
/* line 45, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
.ymal-container .product-brief-wrapper.first .popUpMenuContainer {
  transform-origin: -4px 450px;
  -webkit-transform-origin: -4px 450px;
  -ms-transform-origin: -4px 450px;
  -moz-transform-origin: -4px 450px;
}
/* line 52, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
.ymal-container .product-brief-wrapper.last .popUpMenuContainer {
  transform-origin: 116px 450px;
  -webkit-transform-origin: 116px 450px;
  -ms-transform-origin: 116px 450px;
  -moz-transform-origin: 116px 450px;
}
/* line 59, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
.ymal-container .product-brief-wrapper .saveMore {
  bottom: 19px;
}
/* line 62, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
.ymal-container .product-brief-wrapper .product-brief.BMSM .saveMore {
  bottom: 13px;
  cursor: default;
}

/* line 70, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .ui-you-may-also-like {
  width: 1280px;
}
/* line 74, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .header {
  position: relative;
  text-align: center;
  height: 59px;
  margin-top: 17px;
}
/* line 80, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .header:before {
  position: absolute;
  top: 29px;
  left: 0;
  display: block;
  height: 2px;
  width: 100%;
  background-color: #36b449;
  z-index: 1;
  content: "";
}
/* line 92, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .header .title {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 50%;
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  padding: 0 25px;
  background-color: #FFF;
  font-size: 24px;
  line-height: 59px;
  font-weight: bold;
  color: #36b449;
  z-index: 2;
}
/* line 106, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .header .title:after {
  display: inline-block;
  margin-top: 5px;
  margin-left: 10px;
  vertical-align: middle;
  content: url("/_ui/desktop/common/svg/common/icSupermarketLandinglike.svg");
}
/* line 116, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .products {
  padding: 0 35px;
  margin-bottom: 24px;
}
/* line 120, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .products .product-brief {
  width: 181px;
  height: 355px;
  padding: 5px;
  margin-right: 10px;
}
/* line 125, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .products .product-brief.BMSM {
  height: auto;
  height: initial;
  padding: 0;
  margin: 0;
}
/* line 133, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .products .bnArrowLeft {
  position: absolute;
  top: 50%;
  left: 0;
  -moz-transform: translate(-100%, -50%);
  -ms-transform: translate(-100%, -50%);
  -webkit-transform: translate(-100%, -50%);
  transform: translate(-100%, -50%);
  background-image: url(/_ui/desktop/common/images/sprite/sprite1511-s6c86c57acc.png);
  background-position: -985px -117px;
  background-repeat: no-repeat;
  overflow: hidden;
  display: inline-block;
  height: 55px;
  width: 35px;
  height: 56px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
  /* line 133, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
  #ymal-1-container .products .bnArrowLeft {
    background-image: url(/_ui/desktop/common/images/sprite/sprite1511-2x-s50e7106e33.png);
    background-size: 1189px 180px;
    background-position: -985px -117px;
    height: 55px;
    width: 35px;
  }
}
/* line 140, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .products .bnArrowLeft:hover {
  background-image: url(/_ui/desktop/common/images/sprite/sprite1511-s6c86c57acc.png);
  background-position: -1087px -62px;
  background-repeat: no-repeat;
  overflow: hidden;
  display: inline-block;
  height: 55px;
  width: 35px;
  height: 56px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
  /* line 140, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
  #ymal-1-container .products .bnArrowLeft:hover {
    background-image: url(/_ui/desktop/common/images/sprite/sprite1511-2x-s50e7106e33.png);
    background-size: 1189px 180px;
    background-position: -1087px -62px;
    height: 55px;
    width: 35px;
  }
}
/* line 146, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .products .bnArrowRight {
  position: absolute;
  top: 50%;
  right: 0;
  -moz-transform: translate(100%, -50%);
  -ms-transform: translate(100%, -50%);
  -webkit-transform: translate(100%, -50%);
  transform: translate(100%, -50%);
  background-image: url(/_ui/desktop/common/images/sprite/sprite1511-s6c86c57acc.png);
  background-position: -915px -117px;
  background-repeat: no-repeat;
  overflow: hidden;
  display: inline-block;
  height: 55px;
  width: 35px;
  height: 56px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
  /* line 146, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
  #ymal-1-container .products .bnArrowRight {
    background-image: url(/_ui/desktop/common/images/sprite/sprite1511-2x-s50e7106e33.png);
    background-size: 1189px 180px;
    background-position: -915px -117px;
    height: 55px;
    width: 35px;
  }
}
/* line 153, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-1-container .products .bnArrowRight:hover {
  background-image: url(/_ui/desktop/common/images/sprite/sprite1511-s6c86c57acc.png);
  background-position: -950px -117px;
  background-repeat: no-repeat;
  overflow: hidden;
  display: inline-block;
  height: 55px;
  width: 35px;
  height: 56px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
  /* line 153, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
  #ymal-1-container .products .bnArrowRight:hover {
    background-image: url(/_ui/desktop/common/images/sprite/sprite1511-2x-s50e7106e33.png);
    background-size: 1189px 180px;
    background-position: -950px -117px;
    height: 55px;
    width: 35px;
  }
}

/* line 162, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-2-container .ui-you-may-also-like {
  width: 1188px;
}
/* line 166, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-2-container .header {
  width: 1188px;
  height: 59px;
  margin-top: 20px;
  margin-bottom: 30px;
  border-bottom: 2px solid #DDD;
}
/* line 173, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-2-container .header:before {
  display: inline-block;
  background-image: url("/_ui/desktop/common/svg/supermarket/icSupermarketLandinglike2.svg");
  width: 35px;
  height: 35px;
  margin: 10px 12px 12px 12px;
  vertical-align: top;
  content: "";
}
/* line 183, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-2-container .header .title {
  color: #FFA800;
  font-size: 24px;
  line-height: 59px;
  font-weight: bold;
}
/* line 192, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-2-container .products .product-brief-list:not(:empty) {
  margin-right: -30px;
  margin-bottom: -49px;
}
/* line 197, ../../../../resource/compass/_ui/desktop/common/css/sfpi-supermarket-rec.scss */
#ymal-2-container .products .product-brief {
  width: 171px;
  height: 330px;
  padding: 5px;
  margin-right: 30px;
  margin-bottom: 49px;
}