/* BASIC css start */
/* ===== 패널기본소스 ===== */

.side-r-box {width:200px; position:fixed; top:0px; right:-200px; z-index:999999; height:100%; background:#fff; border-left:1px solid #eee;  }
.side-r-box .r_quick_inner { width:200px; position:relative; z-index:2; height:100%; }
.side-r-box .r_quick_inner .r_box { margin:0 auto; width:160px; }
.side-r-box .r_quick_inner .r_box .line { width:100%; height:1px ;  background:rgba(0,0,0,0.7); }

.door_toggle { position: absolute;  top: 50%;  margin-top:-220px; left: -42px;  border-radius: 0%; -webkit-border-radius: 0%;  cursor: pointer;}

.side-r-box .hamburger { text-align:center;  background:#333 ; padding:0px; width: 41px; height: 40px; border-bottom:1px solid #eee }
.side-r-box .hamburger .hamburger-box {  width: 40px; height: 40px;  display: inline-block; position: relative; text-align:center;   }
.side-r-box .hamburger .hamburger-inner { display: block; top: 50%;  margin-top: -2px; left:23%}
.side-r-box .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after{ position: absolute; background:#fff !important; width:20px !important; height:2px!important;/* 두께 */  border-radius: 4px; position: absolute;  transition-property: transform;transition-duration: 0.15s;transition-timing-function: ease; }
.side-r-box .hamburger:hover { opacity: 0.7; }
.side-r-box .hamburger-inner::before, .hamburger-inner::after {  content: "";  display: block; }
.side-r-box .hamburger-inner::before { top: -5px; }
.side-r-box .hamburger-inner::after { bottom: -5px; }

.hamburger--spin-r .hamburger-inner {
transition-duration: 0.22s;
transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--spin-r .hamburger-inner::before {
transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; }
.hamburger--spin-r .hamburger-inner::after {
transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin-r.is-active .hamburger-inner {
transform: rotate(-225deg);
transition-delay: 0.12s;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--spin-r.is-active .hamburger-inner::before {
top: 0;
opacity: 0;
transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; }
.hamburger--spin-r.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(90deg);
transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }



/* ===== 아이콘  ===== */
.side-r-box .r_quick_inner .scroll {width:180px; height:100%; } /* 스크롤박스 */
.side-r-box .r_icon { position:relative; display:block; text-align:center;  width: 40px;  height: 40px; background:#fff; border-left:1px solid #eee;   border-bottom:1px solid #eee }
.side-r-box .r_icon a {display:block; }
.side-r-box .r_icon i { padding:0px !important; color:#777; line-height:40px;}
.side-r-box .r_icon:hover i{color:#333;}
.side-r-box .r_icon .cart { position:absolute; top:4px; left:0px; width:15px; height:15px;line-height:15px; background:#ffbb28;border-radius:50%;text-align:center;color:#fff;font-size:9px;font-weight:400;}


.side-r-box .r_bnr1 { margin-top:20px; }



/* ===== 사각박스메뉴 ===== */
.side-r-box .r_quick_inner .r_box .r_board_box {width:160px;margin-top:10px;  } 
.side-r-box .r_quick_inner .r_box .r_board_box ul {}
.side-r-box .r_quick_inner .r_box .r_board_box li { display:inline-block; _display:inline; *display:inline;  }
.side-r-box .r_quick_inner .r_box .r_board_box li a {display:block;  color:#7c7c7c; width:78px; padding:5px; margin-bottom:2px;box-sizing:border-box;border:1px solid #eee; text-align:center;font-size:11px; letter-spacing: 0px; -webkit-transition:all 0.35s ease;-khtml-transition:all 0.35s ease;-moz-transition:all 0.35s ease;-ms-transition:all 0.35s ease;-o-transition:all 0.35s ease;transition:all 0.35s ease;}
.side-r-box .r_quick_inner .r_box .r_board_box li a:hover {color:#fff; background:#333;border:1px solid #333; }

.side-r-box .r_bnr2 { margin-top:10px;  }


/* ===== 고객센터 ===== */
.side-r-box .r_quick_inner .r_box .r_call { margin-top:30px; }
.side-r-box .r_quick_inner .r_box .r_call .tit { margin: 8px 0 10px; font-size: 11px; color: #666; }  
.side-r-box .r_quick_inner .r_box .r_call .tel { font-size:15px; color: #333;font-weight: 700; padding: 0 0 10px; }  
.side-r-box .r_quick_inner .r_box .r_call .line { width:10px;height:2px; margin:10px 0; background:#999; }
.side-r-box .r_quick_inner .r_box .r_call p { font-size:11px; color: #666;  }
.side-r-box .r_quick_inner .r_box .r_call p em { letter-spacing: -1px;
    width: 32px;
    height: 18px;
    line-height: 18px;
    background: #f2f2f2;
    display: inline-block;
    text-align: center;
    border-radius: 5px;
    margin:5px 0;
}


/* ===== 뱅크센터 ===== */

.side-r-box .r_quick_inner .r_box .r_bank { }
.side-r-box .r_quick_inner .r_box .r_bank .tit {  margin: 8px 0 10px; font-size: 11px; color: #666;}  
.side-r-box .r_quick_inner .r_box .r_bank .line { width:10px;height:2px; margin:10px 0; background:#999; }
.side-r-box .r_quick_inner .r_box .r_bank p { font-size:11px; color: #666; line-height: 17px;  }




/* ===== 오늘본상품  ===== */

.vtit { width:160px; text-align:left; margin:0 auto;padding:5px 0px; border-top:0px solid #d5d5d5; border-bottom:0px solid #d5d5d5; margin-bottom:0px; font-size:11px;font-weight:700; color:#333;  }


#viewArea { position:relative;width:160px;margin:0 auto; over-flower}

#viewArea .s-item { position:relative;display:block; text-align:center;  }  
#viewArea .s-item img{ margin:0 auto;  width:160px; /* height:px; */ text-align:center;}
#viewArea .slick-slider {position: relative;display:block;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-ms-touch-action: pan-y;touch-action: pan-y;-webkit-tap-highlight-color: transparent;}
#viewArea .imgList .slick-slider:hover .slick-next,#viewArea .imgList .slick-slider:hover .slick-prev{display:block !important;}
#viewArea .imgList .invisible{visibility: hidden;}
#viewArea .imgList .slick-list{position: relative;overflow: hidden;display:block;margin:0;padding:0;}
#viewArea .imgList .slick-list:focus{outline: none;}
#viewArea .imgList .slick-list.dragging{cursor: pointer;cursor: hand;}
#viewArea .imgList .slick-slider .slick-track,#viewArea .slick-slider .slick-list{-webkit-transform: translate3d(0,0,0);-moz-transform: translate3d(0,0,0);-ms-transform: translate3d(0,0,0);-o-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}
#viewArea .imgList .slick-track{position: relative;left:0;top:0;display:block;}
#viewArea .imgList .slick-track:before,.slick-track:after{content: "";display: table;}
#viewArea .imgList .slick-track:after{clear:both;}
#viewArea .imgList .slick-loading .slick-track{visibility: hidden;}
#viewArea .imgList .slick-slide{ float: left;height:100%;min-height:1px;display: none;}
[dir="rtl"] .imgList .slick-slide{ }
#viewArea .imgList .slick-slide img{ display:block; }
#viewArea .imgList .slick-slide.slick-loading img{display: none;}
#viewArea .slick-slide.dragging img{pointer-events: none;}
#viewArea .slick-initialized .slick-slide {display:block;}
#viewArea .imgList .slick-loading .slick-slide{visibility: hidden;}
#viewArea .imgList .slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent;}
#viewArea .imgList .slick-prev,#viewArea .imgList .slick-next {position:absolute;display:block !important;cursor: pointer;width:16px;height:30px;font-size:0;top:50%;margin-top:-15px;outline: none;padding:0;border:0; opacity:0; filter:alpha(opacity=0);background:transparent; z-index:2;}   /* 화살표 처음위치 */
#viewArea .imgList .slick-prev{left:5px; background:url(/design/jclassic/wizdesign/slide3_prev.png) 50% 50% no-repeat; }   /* 이전화살표 이미지경로 */
#viewArea .imgList .slick-next{right:5px; background:url(/design/jclassic/wizdesign/slide3_next.png) 50% 50% no-repeat; }  /* 다음화살표 이미지경로 */
#viewArea .imgList:hover .slick-prev{  opacity:1;filter:alpha(opacity=100);} /* 이전마우스오버시 위치 */
#viewArea .imgList:hover .slick-next{ opacity:1;filter:alpha(opacity=100);}  /* 다음마우스오버시 위치 */
#viewArea .imgList .slick-prev:hover{ opacity:0.5; filter:alpha(opacity=50);}  /* 이전화살표 마우스오버시 효과 */
#viewArea .imgList .slick-next:hover{ opacity:0.5; filter:alpha(opacity=50);}  /* 다음화살표 마우스오버시 효과 */
#viewArea .imgList .slick-prev,#viewArea .imgList .slick-next{-o-transition:0.3s !important;-ms-transition:0.3s !important;-moz-transition:0.3s !important;-webkit-transition:0.3s !important;transition:0.3s !important;}
#viewArea .imgList .slick-slider{margin-bottom:0;}
#viewArea .imgList .slick-dots{ position:absolute;bottom:0px;padding:0;display:block;list-style: none;display:block;text-align:center;width:100%;}
#viewArea .imgList .slick-dots li {position: relative;display: inline-block;margin:0 2px;padding:0;cursor: pointer;}
#viewArea .imgList .slick-dots li button{border:0;background: transparent;display:block;outline: none;line-height:0;font-size:0;color: transparent;padding:0;cursor: pointer;}
#viewArea .imgList .slick-dots li button:hover,.slick-dots li button:focus{outline: none;}
#viewArea .imgList .slick-dots li button:hover:before,.slick-dots li button:focus:before{opacity:1;}
#viewArea .imgList .slick-dots li button:before{display:block;width:5px;height:5px;content: "";;background:#888; border-radius:100px;border:0px solid #888;font-size:0;text-align:center;color: white;opacity:1;-o-transition:0.3s !important;-ms-transition:0.3s !important;-moz-transition:0.3s !important;-webkit-transition:0.3s !important;transition:0.3s !important;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing: grayscale;}
#viewArea .imgList .slick-dots li.slick-active button:before {   background:#333; width:10px;  /* 도트사이즈 */ opacity: 1; }  /* 현재도트사이즈 */




/* BASIC css end */