/* BASIC css start */
/* 메인 비쥬얼 배너 */
#mainSpot { position:relative; overflow:hidden }
#mainSpot .inner_slide {min-width:1200px;}
#mainSpot .inner_slide img { width:100%; height:auto;}
#mainSpot .bx-pager { position:absolute; bottom:15px; left:0; right:0; height:11px; text-align:center }
#mainSpot .bx-pager .bx-pager-item { display:inline-block;  margin:0 7px }
*:first-child+html #mainSpot .bx-pager .bx-pager-item { display:inline } /* IE7 Hack */
#mainSpot .bx-pager .bx-pager-item a { display:block; width:11px; height:11px; text-indent:-9999em; background:url(//image.makeshop.co.kr/makeshop/d3/basic_simple/main/sp_spot_pager.png) 0 0 no-repeat }
#mainSpot .bx-pager .bx-pager-item a.active { background-position:0 -11px }

/* 이미지 배너 */
.imgBanner { margin:30px auto 0; position:relative; width:1200px; overflow:hidden }
.imgBanner ul { *zoom:1 }
.imgBanner ul:after { display:block; clear:both; content:'' }
.imgBanner ul li { margin-right:10px; float:left; position:relative; width:595px; height:300px;}
.imgBanner ul li:last-child {margin-right:0px;}
.imgBanner ul li a:hover {opacity:0.8; transition:0.3s;}


/* 상품 목록 영역 */
.product-wrap { margin:0 auto; position:relative; width:1200px }

/* 고정 이미지 배너 */
.fixedBnnr { position:relative; width:100%; min-width:1100px; height:280px; background:url('http://www.theshopjewelry.com/design/skacjswod9/uju/img/midbn_bg01.jpg') center top no-repeat fixed }
.fixedBnnr .inner { margin:0 auto; position:relative; width:1100px; text-align:center }
.fixedBnnr .inner .tx { padding-top:100px; font-size:16px; color:#fff; letter-spacing:16px }




/*---------------*/
/***** Bubba *****/
/*---------------*/

.effect-bubba {
	background: #000;
}

.effect-bubba img { width:100%; height:100%;
	opacity: 1;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}
.effect-bubba:hover img {
	opacity: 0.7;
}

.effect-bubba .imgbn_in img {opacity:1;}
.effect-bubba:hover .imgbn_in img {
	opacity: 1;
}
.effect-bubba .imgbn_in {position:absolute; top:0; left:0;}
.effect-bubba .imgbn_in::before,
.effect-bubba .imgbn_in::after {
	position: absolute;
	top: 30px;
	right: 30px;
	bottom: 30px;
	left: 30px;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

.effect-bubba .imgbn_in::before {
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	-webkit-transform: scale(0,1);
	transform: scale(0,1);
}

.effect-bubba .imgbn_in::after {
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	-webkit-transform: scale(1,0);
	transform: scale(1,0);
}

.effect-bubba h2 {
	padding-top: 30%;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,-20px,0);
	transform: translate3d(0,-20px,0);
}

.effect-bubba p {
	padding: 20px 2.5em;
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
}

.effect-bubba:hover .imgbn_in::before,
.effect-bubba:hover .imgbn_in::after {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}

.effect-bubba:hover h2,
.effect-bubba:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}


.items_bg {width:100%; background:#f4f4f4; height:960px; border-top:solid 1px #ddd; border-bottom:solid 1px #ddd;}
.tabback {background:#fff; font-size:16px; }
.tab_on {background:#ccc; color:#fff; font-size:16px; text-shadow:3px 3px 3px #666;}
.main_mslide {width:100%;  margin-top:30px; }
.pitembox {width:100%; }
.mslidebox {overflow:hidden; width:1140px;  margin:0 auto; }

.main_mslide { width:1200px; margin:0 auto; position:relative;}
.taps {overflow:hidden; width:1200px;  margin:0px auto ; cursor:pointer; padding:30px 0 0px;}
.taps li {width:237px; margin-left:3px; float:left; height:50px; padding-top:12px;  text-align:center; float:left;   font-weight:700; line-height:20px;}

.taps li:first-child {margin-left:0;}
.taps li .on {display:none;}
.taps li .over {display:block; margin:0 auto;}
.taps li:hover .on {display:block; margin:0 auto;}
.taps li:hover .over {display:none;}

.main_slide02 {margin:80px auto 100px; width:1200px;}
.etc_info_slide {color:#ef4f98;}
.slide02 {width:1200px;}
.slide02 > .item-list02 {float:left; width:200px; height:300px; }
.slide02 .item-list02 .thumb-text {width:190px; padding-left:5px;}
.slide02 .item-list02 .thumb-text img {width:190px; height:auto;}

.mslidebox {width:750px; position:absolute; overflow:hidden; top:120px; right:-10px;}

.mslidebox .item-list3 {float:left; width:240px; height:360px; background:#fff; margin-bottom:10px;  transition:0.3s; margin-right:10px; }
.mslidebox .item-list3 .prdname {border-top:1px dashed #c6c6c6; }
.mslidebox .item-list3 .prdname a {font-size:14px; line-height:26px;}
.mslidebox .item-list3 .price {font-size:16px; font-weight:600; padding-left:10px; color:#de293a;}
.mslidebox .item-list3 .etc_info span {background:#04b8ab; color:#fff; font-weight:600; padding:0px 4px;}
.mslidebox .item-list3:hover {box-shadow:5px 5px 5px #d7ba9d;}
.mslidebox .item-list3 .thumb_sm img {width:240px; height:240px; display:block; margin:10px auto;}
.mslidebox .item-list3:first-child {display:none;}



.thumb-text {text-align:center;}
.prdname_big a {font-size:18px; line-height:30px;}
.big_strike {font-size:14px; color:#888; line-height:24px;}
.price_big {font-size:20px; font-weight:600; color:#de293a;}
.sale_big {font-size:14px; padding-right:10px; margin-left:-16px;}
.prd-icobig {border-top:1px dashed #c6c6c6; padding-top:12px; width:340px; margin:0 auto;}
.big_item01 {width:440px; position:absolute; top:120px; left:0; height:730px; background:#fff; transition:0.3s;}
.best_hd {position:absolute; top:-12px; left:-12px; width:130px; height:130px; background:url('/design/skacjswod9/uju/img/best_bg.png'); box-shadow:5px 5px 5px #CCC;}
.best_hd p {text-align:center; font-size:18px; color:#fff;  font-family: 'Abril Fatface', cursive; padding-top:34px;  }
.best_hd p span {  font-family: 'Abril Fatface', cursive; color:#fff; font-size:34px; line-height:40px}
.big_item01:hover {box-shadow:10px 10px 10px #d7ba9d;}
.big_item01 .thumb_img img {display:block; width:440px; height:440px; margin-top:80px;}
.main_slide02 .slick-prev {position:absolute; right:-22px; top:70px; width:25px; height:63px; background:url('/design/skacjswod9/uju/img/arb_r.png'); font-size:0; border:0; z-index:1003; opacity:0; transition:0.3s;}
.main_slide02 .slick-next {position:absolute; left:-22px; top:70px; width:25px; height:63px; background:url('/design/skacjswod9/uju/img/arb_l.png'); font-size:0; border:0; z-index:1003; opacity:0; transition:0.3s;}

.main_slide02 {position:relative;}
.slide02:hover .slick-prev {opacity:1;}
.slide02:hover .slick-next {opacity:1;}

.imgbn_full {width:100%; height:250px; background:#ddd;}

.min_box02_top {width:400px; height:300px; background:#eee;}
.min_box02_02 ul {overflow:hidden;}
.min_box02_02 ul li {float:left; width:200px; height:300px; background:#888; }
.min_box02_02 ul li:first-child {float:left; width:200px; height:300px; background:#ddd; }
.min_box02 {height:600px; overflow:hidden; width:1200px; margin:50px auto;}
.mid3bn a:hover {opacity:0.8; transition:0.3s;}
.min_box02_01 {float:left; width:400px; height:600px;  background:#ccc;}
.min_box02_02 {float:left; width:400px; height:600px;  background:#ccc;}
.min_box02_03  {float:left; width:400px; height:600px;  background:#ccc; position:relative;}
.prdname_slide a {font-size:14px; font-weight:600}
.price_slide {font-size:16px; font-weight:600;  color:#de293a;}

.prd_line {width:20px; height:2px; background:#ddd; margin:4px auto;}

/* Dots */




.spsc_box {width:1200px; position:relative; height:520px; margin-top:60px; margin-bottom:60px;}

.spsc_box_item {width:804px; height:520px; top:0; left:0; }
.spsc_box_img {position:absolute; bottom:0; right:0; width:370px; height:520px;}

.spsc_box_itemtop {width:804px; height:250px; margin-bottom:20px;}
.spsc_box_itembtm {width:804px; height:250px; overflow:hidden;}
.spsc_box_itemle {float:left; width:396px; height:250px;}
.spsc_box_itemri {float:right; width:396px; height:250px;}
.spsc_box a {opacity:1; transition:0.3s;}
.spsc_box a:hover {opacity:0.7;}


.imgBanner {position:relative;}

.mainimg_sbn {width:1200px; height:295px; overflow:hidden; margin-bottom:60px;}
.mainimg_sbn li {width:400px; height:295px; float:left;}

.main_itembn {width:300px; height:770px; position:absolute; left:0; top:0px;}

.blank_item dl:nth-child(-n+6) {display:none}

.main_itembn .slick-dots {position:absolute; overflow:hidden; bottom:5px; right:5px;}
.main_itembn .slick-dots li {margin-left:4px; height:10px; width:10px; float:left; background:#fcfdf6; background:rgba(252,253,247,0.8); font-size:0px;}    

.main_itembn .slick-dots li button {background:none; width:100%; height:100%; font-size:0px}
.main_itembn .slick-dots .slick-active {background:#555;}
.main_itembn .slick-dots .slick-active button {font-size:0px;}



.imgBanner .slick-dots {position:absolute; overflow:hidden; bottom:5px; right:5px;}
.imgBanner .slick-dots li {margin-left:4px; height:10px; width:10px; float:left; background:#fcfdf6; background:rgba(252,253,247,0.8); font-size:0px;}    

.imgBanner .slick-dots li button {background:none; width:100%; height:100%; font-size:0px}
.imgBanner .slick-dots .slick-active {background:#555;}
.imgBanner .slick-dots .slick-active button {font-size:0px;}


/* Dots */
#mainSpot .slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

#mainSpot .slick-dots
{
    position: absolute;
    bottom: 10px;
    z-index:200;
    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
#mainSpot .slick-dots li
{
    position: relative;

    display: inline-block;

    width: 16px;
    height: 16px;
    margin: 0 3px;
    padding: 0;

    cursor: pointer;
   
}
#mainSpot .slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 16px;
    height: 16px;

    cursor: pointer;

    color: transparent;
    outline: none;
    background: transparent;
}
#mainSpot .slick-dots li button:hover,
#mainSpot .slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
#mainSpot .slick-dots li button:before
{
    font-family: 'slick';
    font-size: 0px;
    line-height: 16px;

    position: absolute;
    top: 0;
    left: 0;

    width: 16px;
    height: 16px;

    content: ' "';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background:#ccc;
}
#mainSpot .slick-dots li.slick-active button:before
{
    opacity: .5;
    color: black;
}

.item-wrap .item-rigblk {padding-left:304px; width:912px;}

/* BASIC css end */

