/* BASIC css start */
.item-wrap {overflow: hidden;padding: 4% 20px 0;margin: 0 auto;max-width: 1560px;min-width: 1060px;}

/* 메인 이미지 배너 */
#slides{position:relative;z-index:10;min-width:1200px;height:1200px;}
#slides .slides-container{display:none;}
#slides .slides-pagination{position:absolute;bottom: 40px;left:0;right:0;z-index:40;text-align:center;font-size:0;}
#slides .slides-pagination a{display:inline-block;margin: 5px;width: 12px;height: 12px;border: 1px solid #333;border-radius:50%;font-size:0;}
#slides .slides-pagination a:hover, #slides .slides-pagination .current{background-color:#333;}

/* NEW ARRIVALS */
#newWrap .item-wrap .item-cont .item-list {float:left;width: 23.5%;}

/* Compare Two Images */
.image-comparison{display:block;position:relative;overflow:hidden;--percent: 95%}@media screen and (min-width: 750px){.image-comparison{--percent: 98%}}.image-comparison[animate]{--percent: 50%}.image-comparison.animating .image-comparison__button{transition-property:top,left;transition-duration:var(--duration-animate);transition-timing-function:ease}.image-comparison.animating .image-comparison__after{transition-property:clip-path;transition-duration:var(--duration-animate);transition-timing-function:ease}.image-comparison__animate{display:block;position:absolute;bottom:0;left:0;width:100%;height:.1rem;pointer-events:none}.image-comparison__after{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;overflow:hidden}.image-comparison[data-layout=horizontal] .image-comparison__after{clip-path:inset(0px 0px 0px var(--percent))}.image-comparison[data-layout=vertical] .image-comparison__after{clip-path:inset(var(--percent) 0px 0px 0px)}.image-comparison__button{position:absolute;z-index:2;color:inherit;background-color:transparent;border:none;padding:0;cursor:pointer}.image-comparison[data-layout=horizontal] .image-comparison__button{top:0;left:var(--percent);width:2.8rem;height:100%;margin-left:-1.4rem;cursor:col-resize}.image-comparison[data-layout=vertical] .image-comparison__button{left:0;top:var(--percent);width:100%;height:2.8rem;margin-top:-1.4rem;cursor:row-resize}.image-comparison__button:before,.image-comparison__button:after{content:"";position:absolute;background-color:rgb(var(--color-border));pointer-events:none}.image-comparison[data-layout=horizontal] .image-comparison__button:before,.image-comparison[data-layout=horizontal] .image-comparison__button:after{width:.3rem;height:50%;left:50%;margin-left:-.15rem}.image-comparison[data-layout=vertical] .image-comparison__button:before,.image-comparison[data-layout=vertical] .image-comparison__button:after{width:50%;height:.3rem;top:50%;margin-top:-.15rem}.image-comparison[data-layout=horizontal] .image-comparison__button:before{top:0;margin-top:-2rem}.image-comparison[data-layout=horizontal] .image-comparison__button:after{bottom:0;margin-bottom:-2rem}.image-comparison[data-layout=vertical] .image-comparison__button:before{left:0;margin-left:-2rem}.image-comparison[data-layout=vertical] .image-comparison__button:after{right:0;margin-right:-2rem}.image-comparison__button span{visibility: visible;position:absolute;top:50%;left:50%;width:2.8rem;height:4.8rem;margin-left:-1.4rem;margin-top:-2.4rem;border-radius:4rem;background-color:rgb(var(--color-border));pointer-events:none;display:flex;align-items:center;justify-content:center}.image-comparison[data-layout=vertical] .image-comparison__button span{transform:rotate(90deg)}.image-comparison__button .icon{height:1.6rem;width:auto}.image-comparison__title{position:absolute;margin:0;min-width:unset;pointer-events:none;transition:opacity var(--duration-default) ease}.image-comparison[data-layout=horizontal] .image-comparison__before .image-comparison__title{left:2rem}.image-comparison[data-layout=horizontal] .image-comparison__after .image-comparison__title{right:2rem}.image-comparison[data-layout=horizontal] .image-comparison__item--start .image-comparison__title{top:2rem}.image-comparison[data-layout=horizontal] .image-comparison__item--end .image-comparison__title{bottom:2rem}.image-comparison[data-layout=horizontal] .image-comparison__item--center .image-comparison__title{top:50%;transform:translateY(-50%)}.image-comparison[data-layout=vertical] .image-comparison__before .image-comparison__title{top:2rem}.image-comparison[data-layout=vertical] .image-comparison__after .image-comparison__title{bottom:2rem}.image-comparison[data-layout=vertical] .image-comparison__item--start .image-comparison__title{left:2rem}.image-comparison[data-layout=vertical] .image-comparison__item--end .image-comparison__title{right:2rem}.image-comparison[data-layout=vertical] .image-comparison__item--center .image-comparison__title{left:50%;transform:translate(-50%)}.image-comparison.scrolling .image-comparison__title{opacity:0}.image-comparison__before .comparison-placeholder{background-color:#00000080}
#comparison {
    --section-padding-top: 36px;
    --section-padding-bottom: 0px;
    --image-ratio-percent: 56.22561191912026%;
    --image-position: ;
}
#comparison{
    --color-border: 255, 255, 255;margin: 0 auto;max-width: 1560px;min-width: 1060px;
}
/* Duration */

:root {
  --duration-short: 100ms;
  --duration-default: 250ms;
  --duration-long: 500ms;
  --duration-animate: 1000ms;
  --image-position: center center;
}

.media {
    display: block;
    position: relative;
    overflow: hidden;
}
.media--400px {
    height: 400px;
} 
.media>img {
    backface-visibility: hidden;
    object-fit: cover;
    object-position: var(--image-position);
    transition: opacity var(--duration-long) ease;
}
.media>*:not(.zoom,.deferred-media__poster-button), .media model-viewer {
    display: block;
    max-width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}
.title-wrapper  {
    text-align: center;
    padding: 60px 0 20px;
}
.title-wrapper .h1 {
    font-size: 35px;
    font-weight: 800;
}



#timeSale {
    background: linear-gradient(360deg, rgb(255, 255, 255) 80%, rgb(247, 247, 247) 100%);
    z-index: 1;
    /* border-bottom: 1px solid #f3f4f6; */
    margin-top: 60px;
}
#timeSale .inner {
    display: block;
    height: 320px;
    padding: 48px 32px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right bottom;
    background-image: url(https://public.realclass.co.kr/images/promotion/4.0/lucky-scholarship/lucky-scholarship-background-lg.png);
    margin: 0 auto;
    max-width: 1560px;
    min-width: 1060px;
    box-sizing: border-box;
}

#timeSale .title {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    margin-top: 10px;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -1px;
}
#timeSale .title h1 {
    margin-right: 20px;
    font-size: 35px;
    font-weight: 900;
}

#timeSale .title div{
    padding: 3px 6px;
    background-color: #e6f9ed;
    color: #00d37a;
    border-radius: 8px;
    font-weight: 800;
}
#timeSale .title div + div{
    margin-left: 0.5rem;
} 
#timeSale .title b {
    margin: 0 8px;
    color: #00d37a;
    text-transform: uppercase;
    font-weight: 800;
}
.moreBtn {
    margin-top: 20px;
}

.moreBtn a {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.5px;
    border-radius: 30px;
    height: 50px;
    line-height: 50px;
    padding: 0 35px;
    background: #00d37a;
    border: 0px;
    color: #ffffff;
    box-sizing: border-box;
    display: inline-block;
}
.moreBtn a:hover {
    background: #00c170;
}
.moreBtn a svg {
    top: 1px;
    display: inline-block;
    position: relative;
    margin-left: 6px;
}

/* BASIC css end */

