@charset "utf-8";
/* CSS Document */

* {margin:0; padding:0;  font-family: 'Noto Sans KR', sans-serif; }


ul li {list-style: none; margin:0; padding:0;}
img  {margin: 0; padding:0  vertical-align: middle;}
h1, h2, h3, h4, h5, h6 { padding:0; margin:0;}
a { border:0; text-decoration-line: none; color: #000; }



#cover-sample {width:900px; clear: both; height: auto;}

#cover-sample .cate-img {height:198px;}


#cover-sample .contents_wrap {display: flex; height:calc(100% - 198px); }
.backcolor_20230510{background: url(../images/ko/img-cover/backcolor_g.png) repeat-y; overflow-x: clip;}/*20230510 �߰�*/
#cover-sample .contents_wrap h5 img {vertical-align: middle; margin-bottom: 5px;}

#cover-sample .side-bar {width:160px;   float:left;   background-color: #F2F2F2; vertical-align: top; height:100%; display: block;  box-sizing:border-box;}
#cover-sample .side-bar .side-menu { padding: 30px 25px; }
.mu_sticky{position:sticky;top:0px;} /*��ܰ��� 2023.05.10�߰�*/
#cover-sample .side-bar .side-menu ul li {padding:13px 0; }


#cover-sample .side-bar .side-menu ul li a:hover{ font-weight:bold;}
#cover-sample .side-bar .side-menu ul li.on { font-weight:bold; font-size:18px;}


#cover-sample .contents-box { width:700px; float:left; padding:30px 5px 30px 35px; }
#cover-sample .contents-box .contents {  }	
#cover-sample .contents-box .contents h5 {font-weight: 100; letter-spacing: -0.5px; text-align: center; margin-bottom: 30px; }
#cover-sample .contents-box .contents h4 {font-sizs:18px; text-indent: 5px;}



[class^="ti-"], [class*=" ti-"] {
  font-family: 'themify';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}



.ti-angle-right:before {content:url("../images/ko/img-cover/Icon_next.png")   }

.ti-angle-left:before {content:url("../images/ko/img-cover/Icon_pre.png")  }

.best-wrap{ width:670px; }
.owl-carousel {display: none;  width:100%; position: relative; z-index: 1; }
.owl-carousel .owl-stage { position: relative;  }
.owl-carousel .owl-stage:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
.owl-carousel .owl-stage-outer {position: relative; overflow: hidden;/* fix for flashing background */ -webkit-transform: translate3d(0px, 0px, 0px);}

.owl-carousel .owl-item { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0);  -moz-transform: translate3d(0, 0, 0);  -ms-transform: translate3d(0, 0, 0); text-align: center;}
.owl-carousel .owl-item { position: relative; min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; }
.owl-carousel .owl-item img { display: block;  }

.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-dot { cursor: pointer; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none;  -ms-user-select: none;  user-select: none;}

.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next,
.owl-carousel button.owl-dot {background: none; color: inherit;border: none; padding: 0 !important; font: inherit;}

.owl-carousel.owl-loaded {display: block;}
.owl-carousel.owl-loading {opacity: 0; display: block;}
.owl-carousel.owl-hidden { opacity: 0;}
.owl-carousel.owl-refresh .owl-item {visibility: hidden;}

.owl-theme .owl-nav {margin-top: 10px; text-align: center; -webkit-tap-highlight-color: transparent;}
.owl-theme .owl-nav [class*='owl-'] {color: #FFF; font-size: 14px; margin: 5px; padding: 4px 7px; background: #D6D6D6; display: inline-block; cursor: pointer; }
.owl-theme .owl-nav [class*='owl-']:hover {background: #869791; color: #FFF; text-decoration: none;}
.owl-theme .owl-nav .disabled {opacity: 0.5; cursor: default;}



.best-list ul li.img-wrap  { border:1px solid #e2e2e2; width: 210px; height: 210px;}
.best-list .pdtImg {display: block; position: relative; z-index: 4;  overflow: hidden; text-align: center;} 
.best-list .pdtImg>img { z-index: 2; transition: all .3s; transform: rotateY(0);backface-visibility: hidden; margin:15px auto; box-shadow:2px 2px 4px rgba(0, 0, 0, 0.25);} 
.best-list .pdtImg>img.over {position: absolute; top: -2px; left: -2px;transform: rotateY(180deg); transition: all .3s; backface-visibility: hidden;opacity: 0; margin:0;  }
.best-list .pdtImg::before { content: '';   z-index: 3; } 

.best-list .pdtOver:hover .pdtImg>img {transform: rotateY(180deg);z-index: 1;opacity: 0;} 
.best-list .pdtOver:hover .pdtImg>img.over {transform: rotateY(0);z-index: 2;opacity: 1; } 

.best-list .pdtOver{display: block;}
.best-list .pdtOver:after {content: "";bottom: 0; left: -1px; box-sizing: border-box; opacity: 0;transition: opacity .3s; border-radius: 5px; overflow: hidden; } 
.best-list .pdtOver:hover:after {opacity: 1;z-index: 3; } 
.best-list .pdtOver:hover .pdtUtil {z-index: 4;opacity: 1; } 

.best-list .cover-info  { padding:8px 5px; width: 210px;  text-align: left;}
.best-list .cover-info .title { font-size:16px; font-weight: 500; color: #323232;}
.best-list .cover-info .price_box {padding:3px 0;}
.best-list .cover-info .price_box .percentage {color:#044DD5; font-weight: 600; font-size: 15px;}
.best-list .cover-info .price_box .percentage b { font-size:12px;}
.best-list .cover-info .price_box .price { font-weight: 600; font-size: 15px; color: #060606;}
.best-list .cover-info .price_box .old_price { color: #999; text-decoration: line-through; display: inline-block;   font-size: 12px; }



.owl-theme .owl-nav {position: absolute; top: 26%; transform: translateY(-30%); left: 0; width: 100%; margin: 0 !important; }
.owl-prev,
.owl-next {width: 40px;  height: 40px; position: absolute; top: 0; display: block !important; background: #fff !important; line-height: 46px !important; box-shadow:2px 2px 4px rgba(0, 0, 0, 0.25);!important;}
.owl-prev {left: -22px;   }
.owl-next {right: -22px;}

.owl-prev i,
.owl-next i {font-size: 21px; font-size: 1.3125rem; color: #ccc; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.owl-prev i:hover,
.owl-next i:hover { color: #000;}

.owl-prev.disabled i:hover,
.owl-next.disabled i:hover { color: #000;}



.pro-wrap { width:100%; padding:20px; }
.pro-wrap  p { margin-bottom: 20px;}
.pro-wrap  p span { color:#DE1E1E; font-weight: 600;}
.pro-wrap  ul li { /*clear:both;*/display: flex;flex-wrap: wrap;justify-content: flex-start;align-items: flex-start;}

.pro-wrap .pro-list { display:inline-block; width:24%; margin: 0 auto 30px;  }
.pro-wrap .pro-list .pro-box  { margin:0 auto;  	  }
.pro-wrap .pro-list .pro-box .img-wrap { width:120px; height: 170px;  position: relative;}
.pro-wrap .pro-list .pro-box .img-wrap img { border: 1px solid #DBDBDB;width: 120px;height: 170px;}

.pro-wrap .pro-list .pro-box  .cover-info {padding:8px 0;}
.pro-wrap .pro-list .pro-box  .cover-info .title { font-size:14px; font-weight: 500; color: #323232;}
.pro-wrap .pro-list .pro-box  .cover-info .price_box {padding:1px 0; letter-spacing: -0.3px; font-size: 11px;}
.pro-wrap .pro-list .pro-box  .cover-info .price_box .percentage {color:#044DD5; font-weight: 600; font-size:14px;}
.pro-wrap .pro-list .pro-box  .cover-info .price_box .percentage b { font-size:12px;}
.pro-wrap .pro-list .pro-box  .cover-info .price_box .price { font-weight: 600; font-size: 14px;  color: #060606;}
.pro-wrap .pro-list .pro-box  .cover-info .price_box .old_price { color: #999; text-decoration: line-through; display: inline-block;font-size: 14px; }


.premium { background-image: url("../images/ko/img-cover/icon_crown_on.png");  position: absolute;  z-index: 1; width:30px; height:30px; bottom:8px; right:8px;}


.filter { padding:12px; /*margin-top: 90px;*/ position: fixed; bottom: 0px;}

.filter h3 {padding:5px; border-bottom: 1px solid #D8D8D8; font-size: 16px; font-weight:600;}
.filter h3 img {vertical-align: middle;}

.filter  ul { padding:15px 5px ;  border-bottom: 1px solid #D8D8D8; }
.filter  ul li{ font-size:12px; letter-spacing: -1px; line-height:22px; }

.filter  input[type=checkbox] {
    display:none;
}
.filter input[type=checkbox] + label { 
    cursor: pointer; 
    padding-left: 20px; 
	padding-bottom :2px;
    background-repeat: no-repeat;
    background-image: url('../images/ko/img-cover/checkbox.png');
}
.filter input[type=checkbox]:checked + label {
    background-image: url('../images/ko/img-cover/checkbox_checked.png');
}

.filter .button-area {text-align:center;}
.filter .button-area button { padding:8px 10px; background-color:#5C5C5C; text-align: center; margin: 10px auto; border:none; cursor: pointer;}
.filter .button-area button span { color:#fff; font-weight: 600;}