/* BASIC css start */
#stylingWrap { margin: 0 80px 240px; overflow: hidden; }
#stylingWrap .wrap_title { margin: 0 0 50px; position: relative; }
#stylingWrap .wrap_title span { float: none; font-size: 17px; font-weight: 100; position: absolute; top: 15px; margin-left: 20px; }

#stylingWrap .item { width: 100%; font-size: 0; text-align: left; }
#stylingWrap .item .lst.on, #stylingWrap .item:hover .lst.on { width: 57.7%; }
#stylingWrap .item:hover .lst { width: 20%; }
#stylingWrap .lst { display: inline-block; vertical-align: top; position: relative; width: 20%; margin-left: 1.1%; height: 614px; overflow: hidden; font-size: 16px; background-repeat: no-repeat; background-position: center center;
                           -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; -ms-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; background-color: #f5f5f5; 
                         }
#stylingWrap .lst:first-child { margin-left: 0; }
#stylingWrap .lst > .outer { width: 100%; }
#stylingWrap .lst .bg { position: absolute; left: 0; top: 0; z-index: 2; -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; -ms-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out;
                               transition: all 500ms ease-in-out; background-color: #f5f5f5; width: 100%; height: 100%; background-repeat: no-repeat; background-position-x: center; }
#stylingWrap .lst.on .bg { left: 0; width: 51%; }
#stylingWrap .lst .cont { position: absolute; left: 20%; top: 0; width: 100%; height: 100%; z-index: 1; color: #000; opacity: 0; -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out;
                                 -ms-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; font-size: 16px; }
#stylingWrap .lst.on .cont { opacity: 1; left: 0; }
#stylingWrap .lst .rgh { position: absolute; right: 4%; top: 5%; z-index: 2; width: 41%; }
#stylingWrap .lst .rgh .prd { width: 100%; height: 8.9vw; max-height: 170.88px; margin-bottom: 20px; background-color: #fff; position: relative; }
#stylingWrap .lst .rgh .prd a { display: inline-block; width: 100%; height: 100%; }
#stylingWrap .lst .rgh .prd .txt { position: absolute; top: 0; left: 6%; z-index: 2; width: 45%; height: 100%; -ms-word-break: keep-all; word-break: keep-all; }
#stylingWrap .lst .rgh .prd .txt .h { font-size: 14px; line-height: 19px; word-break: keep-all; margin-top: 25px; }
#stylingWrap .lst .rgh .prd .txt .money { position: absolute; bottom: 25px; }
#stylingWrap .lst .rgh .prd .txt .money > span { display: inline-block; font-size: 15px; font-weight: bold; margin-right: 7px; }
#stylingWrap .lst .rgh .prd .txt .money > span.sale { font-size: 13px; text-decoration: line-through; color: #8c8c8c; float: none; font-weight: 300; }
#stylingWrap .lst .rgh .prd .img { position: absolute; right: 0; top: 0; z-index: 1; }
#stylingWrap .lst .rgh .prd .img img { height: 8.9vw; max-height: 170.88px; box-sizing: border-box; border: 1px solid #e2e2e2; }
/* BASIC css end */