﻿@charset "utf-8";
/* CSS Document */

/*컬럼설정에 따라 테마 가로길이변경(갤러리형, 심플이미지형)*/ 
.Array03 .Item-list li:nth-child(3n) {  margin-right: 0 !important }
.Array03 .Item-list li{width:33% !important; margin:0 0 10px!important;}

.Array02 .Item-list li:nth-child(2n) {  margin-right: 0 !important }
.Array02 .Item-list li{width:50% !important; margin:0 0 10px!important;}

.Array01 .Item-list li {margin-right: 0 !important }
.Array01 .Item-list li{width:100% !important; border-bottom:1px solid #eee}
.Array01 .Item-list li:last-child{border-bottom:0px}


/*인기상품 슬라이더에 적용*/
.Thema-Type01{position:relative}
.Thema-Type01 .Item-list{overflow:hidden; /*margin:0 50px width:240px;*/margin:0 24px}
.Thema-Type01 .arrow-left{width:32px; height:80%; display:inline-block; position:absolute; top:10px; background:url(../images/arrow.png) no-repeat; background-size:auto 32px; background-position:right center; cursor:pointer}
.Thema-Type01 .arrow-right{width:32px; height:80%; display:inline-block; position:absolute; right:0px; top:10px; background:url(../images/arrow.png) no-repeat; background-size:auto 32px; background-position:left center; cursor:pointer}
.Thema-Type01 .arrow-left:hover{background:url(../images/arrow-hover.png) no-repeat; background-position:right center;}
.Thema-Type01 .arrow-right:hover{background:url(../images/arrow-hover.png) no-repeat; background-position:left center;}
.Thema-Type01 ul{display:flex; flex-wrap:nowrap}
.Thema-Type01 li{width:120px !important; padding: 15px 10px!important; margin:0 !important; display:table-cell}
.Thema-Type01 .item-image img{width:100%}
/*
@media screen and (min-width:600px){
    .Thema-Type01 .arrow-left{height:400px}
    .Thema-Type01 .Item-list{width:400px}
    .Thema-Type01 .Item-list li {
        width: 200px !important;
    }
}
@media screen and (min-width:800px) {
    .Thema-Type01 .arrow-left{height:560px}
    .Thema-Type01 .Item-list{width:560px}
    .Thema-Type01 .Item-list li {width: 280px !important;}
}

*/
/*테마2 - 3단 타일 가로슬라이드형*/
.Thema-Type02 {
    position: relative;
    padding: 15px 10px
}
.Thema-Type02 .Item-list li{width:100%;}
.Thema-Type02 td{width:260px; vertical-align:top}
.Thema-Type02 .arrow-left{width:32px; height:550px; display:inline-block; position:absolute; left:-35px; top:10px; background:url(../image/arrow.png) no-repeat; background-size:auto 32px; background-position:right center; cursor:pointer}
.Thema-Type02 .arrow-right{width:32px; height:550px; display:inline-block; position:absolute; right:-35px; top:10px; background:url(../image/arrow.png) no-repeat; background-size:auto 32px; background-position:left center; cursor:pointer}
.Thema-Type02 .arrow-left:hover{background:url(../image/arrow-hover.png) no-repeat; background-position:right center;}
.Thema-Type02 .arrow-right:hover{background:url(../image/arrow-hover.png) no-repeat; background-position:left center;}
@media screen and (min-width: 768px) {
 .Thema-Type02 .Item-list ul{display:flex; flex-wrap:wrap}
 .Thema-Type02 .Item-list li{width:50% !important}
 .Thema-Type02 .Item-list li:nth-child(1n){padding-right:7px}
 .Thema-Type02 .Item-list li:nth-child(2n){padding-left:7px}
}
/*테마3 - 탭진열형*/
.Thema-Type03 .tab-header ul{list-style:none; display:flex;}
.Thema-Type03 .tab-header li{flex:1; width:20%; border:1px solid #e2e2e2; border-right:0px; width:240px; text-align:center; vertical-align:middle; background:#f7f7f7; font-size:14px;}
.Thema-Type03 .tab-header li:last-child{border:1px solid #e2e2e2;}
.Thema-Type03 .tab-header li span{display:inline-block; line-height:45px;}   
.Thema-Type03 .tab-header li.hover{ border-bottom-color:#fff; background:#fff; cursor:pointer; font-weight:bold}
.Thema-Type03 .tab-header li.hover span{ border-bottom:3px solid #1b448e }
.Thema-Type03 .tab-header li.empty { background:#fff; border-color:#fff; border-top:0px; cursor:auto; }
.Thema-Type03 .tab-header li.last-child { border-right: 1px solid #e2e2e2;}
.Thema-Type03 .tab-content ul{list-style:none; display:none; margin:15px 0; flex-wrap:wrap;}
.Thema-Type03 .tab-content li{width:50%; padding:10px 10px 30px; display:inline-block; vertical-align:top}
.Thema-Type03 .tab-content li .item-image{height:auto; background-size:cover}

/*테마4-갤러리형*/
.Thema-Type04 .Item-list ul{width:100%; display:flex; flex-wrap:wrap}
.Thema-Type04 .Item-list li{padding:15px 10px}
/*@media screen and (min-width: 768px) {
 .Thema-Type04 .Item-list li{width:33.33% !important}


}*/
		
/*동영상플레이어 형태*/
.Thema-Type05 ul{list-style:none; width:100%; display:flex; flex-wrap:wrap}
.Thema-Type05 li:first-child{display:block; margin: 0px; padding: 10px 0px 40px 0px; width: 100%; min-height:320px}
.Thema-Type05 li:last-child{width: 100%; margin-right:0}
@media screen and (min-width: 768px) {
 .Thema-Type05 .Item-list li{padding:10px}
 .Thema-Type05 .Item-list li:first-child{width:60%}
 .Thema-Type05 .Item-list li:last-child{width:40%}
}


/*슬라이드*/
.Thema-Type06 .contentBox{width:100%; height:200px; border:1px solid #e2e2e2; display:inline-block; vertical-align:top; margin:15px 0 0; background-position:center}
.Thema-Type06 .SildeImages01, 
.Thema-Type06 .SildeImages02 {display: none; width:100%; height:200px;  background-size:cover; background-position:center}
.Thema-Type06 .slideshow-container {position: relative; margin: auto;}
.Thema-Type06 .prev, 
.Thema-Type06 .next {cursor: pointer; position: absolute; top: 50%; width: auto; padding: 16px; margin-top: -22px; color: white; font-weight: bold; font-size: 18px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none;}
.Thema-Type06 .next {right: 0; border-radius: 3px 0 0 3px;}
.Thema-Type06 .prev:hover, 
.Thema-Type06 .next:hover {background-color: rgba(0,0,0,0.8); color:#fff;}
.Thema-Type06 .dot {height: 15px; width: 15px; margin: 0 2px; background-color: #bbb; border-radius: 50%; display: inline-block; transition: background-color 0.6s ease; cursor:pointer;}
.Thema-Type06 .active {background-color: #717171;}
.Thema-Type06 .fade { -webkit-animation-name: fade; -webkit-animation-duration: 1.5s; animation-name: fade; animation-duration: 1.5s;}
		@-webkit-keyframes fade {
		  from {opacity: .4} 
		  to {opacity: 1}
		}
		
		@keyframes fade {
		  from {opacity: .4} 
		  to {opacity: 1}
		}

/*타일형 : 심플이미지형*/
.Thema-Type07 .Item-list ul{display:flex; flex-wrap:wrap; padding-top:5px}
.Thema-Type07 .Item-list li {width: 100% !important; /*margin: 0 !important;*/ padding: 10px 10px; /*min-height:inherit*/ border-bottom:1px solid #eee;}
.Thema-Type07 .Item-list li:last-child{border-bottom:0px}
.Thema-Type07 .Item-list .item-image{height:auto}

/*타일형 : 말풍선형*/
.Thema-Type08 .Item-list ul{display:flex; flex-wrap:wrap; width:100%}
.Thema-Type08 .Item-list li{width:50%; padding:15px 10px; margin:0}
.Thema-Type08 .item-info .txt{font-size:13px; color:#999}
@media screen and (min-width: 768px) {
 .Thema-Type08 .Item-list li{width:33.33% !important}
}
/*타일형 : 선택강조형*/
.Thema-Type09 .Item-list .item-image{height:275px}
.Thema-Type09 .Item-list li{width:275px}
.Thema-Type09 .item-image-hover{height:70px; top:auto; bottom:0;}

/*타일형 :스크롤형*/
.Thema-Type10{position:relative}
.Thema-Type10 .Item-list{overflow-x:auto;}
.Thema-Type10 .arrow-left{width:32px; height:260px; display:inline-block; position:absolute; left:-35px; top:10px; background:url(../image/arrow.png) no-repeat; background-size:auto 32px; background-position:right center; cursor:pointer}
.Thema-Type10 .arrow-right{width:32px; height:260px; display:inline-block; position:absolute; right:-35px; top:10px; background:url(../image/arrow.png) no-repeat; background-size:auto 32px; background-position:left center; cursor:pointer}
.Thema-Type10 .arrow-left:hover{background:url(../image/arrow-hover.png) no-repeat; background-position:right center;}
.Thema-Type10 .arrow-right:hover{background:url(../image/arrow-hover.png) no-repeat; background-position:left center;}
.Thema-Type10 ul{display:flex; flex-wrap:nowrap /*display:table*/}/*가로길이 갯수에따라 사이즈변경가능하도록*/
.Thema-Type10 .Item-list li {margin: 0 !important; padding: 15px 10px;}
/*스크롤 길이or높이*/
.Thema-Type10 ::-webkit-scrollbar {height: 3px; -webkit-appearance: none;}
/* Track-전체스크롤 */
.Thema-Type10 ::-webkit-scrollbar-track {border-radius: 1px;}
/* Handle-스크롤링바*/
.Thema-Type10 ::-webkit-scrollbar-thumb {background: #bfbfbf; border-radius: 1px;}

/*@media screen and (min-width:600px){
    .Thema-Type10 .Item-list li {width: 200px !important;}
}
@media screen and (min-width:800px) {
    .Thema-Type10 .Item-list li {width: 280px !important;}
}*/


/*타일형 :세로이동형*/
.Thema-Type11{position:relative}
.Thema-Type11 .Item-list{overflow:hidden; height:400px; padding:10px 0;}
.Thema-Type11 .arrow-top{width:32pc; height:32px; margin:0 auto; background:url(../image/arrow-row.png) no-repeat; background-position:center bottom; cursor:pointer}
.Thema-Type11 .arrow-bottom{width:32px; height:32px; margin:0 auto; background:url(../image/arrow-row.png) no-repeat; background-position:center top; cursor:pointer}
.Thema-Type11 .arrow-top:hover{background:url(../image/arrow-row-hover.png) no-repeat; background-position:center bottom;}
.Thema-Type11 .arrow-bottom:hover{background:url(../image/arrow-row-hover.png) no-repeat; background-position:center top;}
.Thema-Type11 ul{}
.Thema-Type11 li{width:228px !important; margin:10px 12px 0 0!important;}
.Thema-Type11 li:nth-child(5n){margin-right:0 !important}
.Thema-Type11 .item-image{height:228px}


/*탭진열형 :가로형*/
.Thema-Type12{display:flex}
.Thema-Type12 .tab-header{width:200px}
.Thema-Type12 .tab-header ul{list-style:none;}
.Thema-Type12 .tab-header li{border-bottom:1px solid #e2e2e2; border-right:0px; width:100%; text-align:center; height:50px; line-height:50px; background:#f7f7f7; font-size:14px; display:block}
.Thema-Type12 .tab-header li.hover{background:#fff; cursor:pointer}
.Thema-Type12 .tab-content{width:1000px}
.Thema-Type12 .tab-content ul{list-style:none; display:none; padding-left:15px}
.Thema-Type12 .tab-content li{width:300px; margin:15px 15px 30px; display:inline-block; vertical-align:top}
.Thema-Type12 .tab-content li:nth-child(3n){margin-right:0}
.Thema-Type12 .tab-content li .item-image{height:228px; background-size:cover}


/*리스트형*/
.Thema-Type13 table, .Thema-Type13 th, .Thema-Type13 td{border:0}
.Thema-Type13 .Item-list li{width:100%; min-height:auto; display:block; border-bottom:1px solid #eee; margin:0; padding:10px 0}
.Thema-Type13 .Item-list li td:first-child{width:33%}
.Thema-Type13 .Item-list .item-image{width:100%; /*display:inline-block;*/ display:inline-flex; vertical-align:middle}	
.Thema-Type13 .Item-list .item-info{display:block}
.Thema-Type13 .item-info .txt{font-size:13px; color:#999}
.Thema-Type13 .item-info .deal-price{align-items:center}
.Thema-Type13 .item-info .deal-price span{display:inline-block}

/*.Thema-Type13 .Item-list td{padding:10px 0}*/
.Thema-Type13 .Item-list td:nth-child(1){width:200px;}
.Thema-Type13 .Item-list td:nth-child(2){padding:0 0 0 20px}
/*.Thema-Type13 .Item-list td:nth-child(3){width:200px; text-align:center; padding-right:50px}*/
.Thema-Type13 .Item-list td:nth-child(3){text-align:right; width:260px; padding-right:80px}
.Thema-Type13 .Item-list td:nth-child(4){width:150px;}
.Thema-Type13 .AddTo{height:auto; width:100px;}
.Thema-Type13 .AddTo div{font-size:16px; line-height:32px; font-weight:normal}

/*전체이미지*/
.Thema-Type14 .Item-list li {
    width: 100%;
    margin: 10px 0;
    padding: 0 0 30px;
    border-bottom: 1px solid #ccc
}




/*wide배너 가로길이 750*세로길이무한*/
.Banner-Type01 {background-position:center; background-repeat:no-repeat}
/*fixed배너 가로길이 750*세로길이무한*/
.Banner-Type02 {background-position:center; background-repeat:no-repeat; padding:0 10px}

/*타일형배너1*/
.Banner-Type04 {background-position:center; background-repeat:no-repeat;} /*이미지 가로길이 width:1200px*/
.Banner-Type04 .Item-list {background:#f7f7f7; padding:20px}
.Banner-Type04 ul{display:flex; flex-wrap:wrap; justify-content:center}
.Banner-Type04 .Item-list li{width:50%; min-height:inherit; margin:0; cursor:pointer}
.Banner-Type04 .Item-list li img{width:100%}
@media screen and (min-width:1024px){
    .Banner-Type04 .Item-list li{width:25%; min-height:inherit; margin:0; cursor:pointer}
}

/*타일형배너2 이미지(1)600*600, 위아래분할이미지(2)400*300 */
.Banner-Type05 .Item-list ul {display:flex; flex-wrap:wrap;}
.Banner-Type05 .Item-list li {margin:10px 0; min-height:inherit; cursor:pointer}
.Banner-Type05 .Item-list li:first-child{width:40%}
.Banner-Type05 .Item-list li:last-child{width:60%}
.Banner-Type05 .Item-list li img{width:100%}

/*타일형배너3 이미지(1)600*600, 위아래분할이미지(2)400*300 */
.Banner-Type06 .Item-list ul {display:flex; flex-wrap:wrap;}
.Banner-Type06 .Item-list li {margin:10px 0; min-height:inherit; cursor:pointer}
.Banner-Type06 .Item-list li:first-child{width:60%}
.Banner-Type06 .Item-list li:last-child{width:40%}
.Banner-Type06 .Item-list li img{width:100%}

/*타일형배너4*/
.Banner-Type07 {background-position:center; background-repeat:no-repeat;} /*이미지 가로길이 width:1200px*/
.Banner-Type07 ul{display:flex; flex-wrap:wrap; /*justify-content:center*/}
.Banner-Type07 .Item-list li{width:50%; min-height:inherit; margin:0; cursor:pointer;}
.Banner-Type07 .Item-list li:nth-child(2n){padding-right:0}
.Banner-Type07 .Item-list li img{width:100%; border:1px solid #fff}

/*
    **모바일 배너사이즈

1. 상단슬라이드(좌->우)  ERP : 100
가로: 400px 이상
세로: 250 이상

2. 확장배너(이미지1개)  ERP : 300
가로: 최소400이상
세로 최소150이상

3. 고정배너(이미지1개)  ERP : 400
가로:최소400이상
최소150이상

4. 타일형배너1(이미지4개)  ERP : 500
가로: 300이상
세로: 최소150이상

5. 타일형배너2(이미지3개)  ERP : 600
   1번이미지사이즈 : 400 *600
   2,3번 이미지 - 가로: 600*300

6. 타일형배너3(이미지3개)  ERP : 700
    1번이미지사이즈 : 600 *600
   2,3번 이미지 - 가로: 400*300

7.타일형배너4 (이미지3개)  ERP : 900
- 만들어진 html소스가 없어 가로,세로길이 알수없음. 
   PC만 만들어짐

*/

/*리뷰배너1*/
.Review-Type01 { position: relative; overflow:hidden; padding:10px 0}
.Review-Type01 .swiper-wrapper{transform:translate3d(0px, 0px, 0px)}
.Review-Type01 .swiper-pagination { position: relative; padding-top:10px}
.Review-Type01 .swiper-pagination span { margin: 0 3px}

.Review-Type01 .Item-list { overflow: hidden; }
.Review-Type01 ul { width: 100%; display: flex; flex-wrap: wrap; }
.Review-Type01 li { width: 200px !important; background:none !important;}
.Review-Type01.Array02 li:nth-child(2n-1){padding-right:10px}
.Review-Type01 .outline{background:#fff; border :1px solid #eee}
.Review-Type01 .item-image { height: 200px; background-size: 100%; border:0; border-bottom:1px solid #eee }
.Review-Type01 .ReviewContainer { padding:10px; text-align:left;}
.Review-Type01 .ReviewContainer .item-image { border:1px solid #eee; width:50px !important; height:50px !important; margin:5px 0}
.Review-Type01 .ReviewContainer > .table .td:first-child { width:50px}
.Review-Type01 .item-info{padding-bottom:5px; min-height:80px}
.Review-Type01 .review-title {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:5px 0; font-weight:bold; font-size:14px; display:none}
.Review-Type01 .review-content{overflow:hidden; text-overflow:ellipsis; word-break:break-word; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; height:3.6em; line-height:1.2em; margin:5px 0;}
.Review-Type01 .star{margin:5px 5px 5px 0; display:inline-block; vertical-align:middle}
.Review-Type01 .Price, .Review-Type01 .Name{font-size:12px;}
.Review-Type01 .selectedOptions{color:#5f5f5f; font-size:12px; overflow:hidden; text-overflow:ellipsis; word-break:break-word; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; height:1.2em; line-height:1.2em;}
.Review-Type01 .wirte-date{display:inline-block; vertical-align:middle}

.Review-Type02 .Item-list ul{width:100%; display:flex; flex-wrap:wrap}
.Review-Type02 .Item-list li{padding:15px 10px}
.Review-Type02 .item-image { height: 200px; background-size: 100%;  }
.Review-Type02 .ReviewContainer { padding:10px 0; text-align:left;}
.Review-Type02 .ReviewContainer .item-image { border:1px solid #eee; width:50px !important; height:50px !important; margin:5px 0}
.Review-Type02 .ReviewContainer > .table .td:first-child { width:50px}
.Review-Type02 .review-content{overflow:hidden; text-overflow:ellipsis; word-break:break-word; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; height:3.6em; line-height:1.2em; margin:5px 0;}
.Review-Type02 .star{margin:5px 5px 5px 0; display:inline-block; vertical-align:middle}
.Review-Type02 .Price, .Review-Type02 .Name{font-size:12px;}
.Review-Type02 .selectedOptions{color:#5f5f5f; font-size:12px; overflow:hidden; text-overflow:ellipsis; word-break:break-word; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; height:1.2em; line-height:1.2em;}
.Review-Type02 .wirte-date{display:inline-block; vertical-align:middle}
.Review-Type02 .item-more-btn{margin-top:0}

 /*goodsReview-detail 페이지에 사용됨*/
.reviewpage-page.detail .reviewStyle02 .title{padding:10px 0px}
.reviewpage-page.detail .reviewStyle02 .title .td{font-size:18px; font-weight:bold}
.reviewpage-page.detail .reviewStyle02 .title .td:last-child{text-align:right}
.reviewpage-page.detail .reviewStyle02 li { border-bottom: 1px solid #e5e5e5; padding:20px 10px; margin:0}
.reviewpage-page.detail .reviewStyle02 li * { font-size:13px }
.reviewpage-page.detail .reviewStyle02 .td{vertical-align:top}
.reviewpage-page.detail .reviewStyle02 .photo-review{margin:0; padding-top:20px}
.reviewpage-page.detail .reviewStyle02 .photo-review li{padding:0; border:0}
.reviewpage-page.detail .reviewStyle02 .photo-review .representativeImg{width:110px; height:110px;}
.reviewpage-page.detail .reviewStyle02 .info{color:#5f5f5f; display:inline-block; float:right; margin:5px}
.reviewpage-page.detail .reviewStyle02 .info span{margin-right:5px; font-size:12px}
.reviewpage-page.detail .reviewStyle02 .info .item{color:#1453bb}
.reviewpage-page.detail .reviewStyle02 .inquiry-details{background: #f7f7f7 !important; padding:20px; min-height: 80px; line-height: 150%; margin:0; cursor:pointer}
.reviewpage-page.detail .reviewStyle02 .inquiry-details .td:nth-child(2){display:none}
.reviewpage-page.detail .reviewStyle02 .inquiry-details img { /*max-width: 300px;*/ width:100%; margin-bottom: 10px; }
.reviewpage-page.detail .reviewStyle02 .inquiry-details .btn{border:1px solid #ccc;padding: 3px 5px;font-weight:normal;margin: 0 2px;vertical-align: middle;}
.reviewpage-page.detail .reviewStyle02 .all-images{display:none; padding:15px 0}
.reviewpage-page.detail .reviewStyle02 .all-images img{border-radius:5px}
.reviewpage-page.detail .reviewStyle02 .inquiry-details .all-images{display:block}
.reviewpage-page.detail .reviewStyle02 .inquiry-details .photo-review{display:none}
.reviewpage-page.detail .reviewStyle02 .seller{margin-top:15px;}
.reviewpage-page.detail .reviewStyle02 .seller-comment{margin-top:5px; line-height:150%; background:rgba(0,0,0,.03); padding:10px; border-radius:5px}
