@charset "utf-8";
#cpreview{position:fixed; top:150px; left:0; z-index:999}
#cpreview .blockPreview{width:46px; padding:46px 46px 46px 15px}

/* Colorset */
#cpreview .previewColorset{position:relative}
#cpreview #colorsetList{margin:0; padding:0; list-style:none}
#cpreview #colorsetList li{margin:0 0 3px 0; padding:0}
#cpreview #colorsetList li img{width:46px; height:46px}
#cpreview #colorsetList li a.customcs img{width:47px; height:48px}
#cpreview #colorsetList li a:hover {filter: grayscale(1) brightness(0.8); opacity: 0.7;}

/* ¸Þ´º·Î ¹Ù²Ü ¶§ »ç¿ë
#cpreview .blockPreview{width:100px; padding:46px 46px 46px 15px}
#cpreview #colorsetList li {margin: 0 0 5px 0; text-align: center; width: 100%; color: #fff; background-color: #e47c90; box-shadow: 0 3px 4px rgba(0,0,0,.1); padding: 10px 25px; border-radius: 100px!important;}
#cpreview #colorsetList li a {color: #fff !important;}
 */

/* Custom Colorset */
#cs_colorset{display:none}
.sp-replacer{padding:0; background:none; border:0}
.sp-replacer .sp-dd{display:none}
.sp-preview{float:left; width:46px; height:46px; margin-top:10px\9; margin-right:0; border:0; border-radius:100%; z-index:0}
.sp-preview-inner{width:46px; height:46px; border-radius:100%}

@media screen and (max-width:767px){
#cpreview {display: none; left: 0 !important;}
#cpreview .blockPreview {padding: 46px 10px;}
}