﻿@charset "utf-8";
/* CSS Document */
img {vertical-align: middle}
.item-more-btn { background: #fff; border-image: none; display: inline-block; cursor: pointer; width: 100%; text-align: center; font-weight: bold; color: #666; padding: 10px 0; border: 1px solid #ccc; margin: 20px 0 }
.title .item-more-btn {display: inline-block; padding: 5px; margin: 0; width: auto }

/*메인-상품리스트*/
.block .title { /*font-size: 24px;*/position:relative; font-size: 32px; text-align: center; border-bottom: 1px solid #ccc; padding: 15px 0; /*font-weight: bold;*/ /*font-family: 'Malgun Gothic',Arial,sans-serif*/ font-family: 'Noto Sans KR', Dotum, sans-serif; font-weight:400; }
.block { padding: 50px 0 100px; position: relative }
.block .Item-list li { display: inline-block; width: 200px; min-height: 200px; margin: 10px 20px 40px 0; vertical-align: top }

/*컬럼설정에 따라 테마 가로길이변경(갤러리형, 심플이미지형)*/
.Array06 .Item-list li:nth-child(6n) { margin-right: 0 !important }
.Array06 .Item-list li { width: 163px !important }
.Array06 .Item-list .item-image { height: 163px !important } 
.Array05 .Item-list li:nth-child(5n) { margin-right: 0 !important }
.Array05 .Item-list li { width: 200px !important }
.Array05 .Item-list .item-image { height: 200px !important } 
.Array04 .Item-list li:nth-child(4n) { margin-right: 0 !important }
.Array04 .Item-list li { width: 257px !important }
.Array04 .Item-list .item-image { height: 257px !important } 
.Array03 .Item-list li:nth-child(3n) { margin-right: 0 !important }
.Array03 .Item-list li { width: 351px !important }
.Array03 .Item-list .item-image { height: 351px !important }
.Array02 .Item-list li:nth-child(2n) { margin-right: 0 !important }
.Array02 .Item-list li { width: 538px !important }
.Array02 .Item-list .item-image { height: 538px !important }
.Array01 .Item-list li { margin-right: 0 !important }
.Array01 .Item-list li { width: 1100px !important } 
.Array01 .Item-list .item-image { height: 1100px !important }



/*솔드아웃 표시(텍스트일때)
.Soldout { display: inline-block; padding: 10px; color: #fff; text-align: center; overflow: hidden; position: relative; z-index: 1; position: absolute; right: 0; bottom: 0 }
.Soldout div { background: #333; width: 60px; height: 60px; line-height: 60px; border-radius: 140px;  font-size: 13px }*/

/*솔드아웃 표시(이미지형)*/
.Soldout {display: inline-block; color: #fff; text-align: center; overflow: hidden; position: absolute; left:0; top:0px; z-index: 1; width:100%; height:100%; /*background-image:url('../images/img/layout/soldout.png');*/ background-repeat:no-repeat; background-size:cover }
.Soldout div {display:none }

/*.Array05 .Soldout div {margin: 40px auto;}*/
.Array04 .Soldout div { /*margin: 70px auto;*/}
.Array03 .Soldout div {margin: 121px auto;}
.Array02 .Soldout div {margin: 194px auto; width: 200px; height: 200px; line-height: 200px }
.Array01 .Soldout div { margin: 400px auto; width: 400px; height: 400px; line-height: 400px; border-radius: 400px; font-size: 24px; }

.item-image { border: 1px solid #eee; /*border:1px solid rgba(0,0,0,.04);*/ height: 275px; width: 100%; background-color: #fff; background-repeat: no-repeat; background-position: center; background-size: 100%; position: relative; cursor: pointer;}
.item-image::before { position: absolute; top: 0; bottom: 0; width: 100%; background: rgba(0,0,0,0.02); z-index: 0; content: ''; } 
.item-page-url { position: absolute; width: 100%; height:100%; z-index: 2; /*soldout=1, soldout보다 커야함*/ }

/*아이템 마우스오버시*/
.item-image-hover { position: absolute; bottom: 0; width: 100%; /*height: 50px;*/ height:30px; background: rgba(165,165,165,.6); display: none; z-index: 2; justify-content: center; align-items: center; flex-flow: column nowrap; }
.item-image:hover > .item-image-hover { display: flex }
.item-image-hover .hover-group-btn { width: 100%; text-align: center }
.item-image-hover .hover-btn { display: inline-flex; font-size: 11px; /*width: 40px; height:40px;*/ width:23px; height:23px; border: 1px solid #fff; background: rgba(255,255,255,1); background-repeat: no-repeat; background-position: center; /*background-size: 20px;*/ background-size:13px; border-radius: 50px; vertical-align: middle; text-align: center; margin: 2px; cursor: pointer; color: rgba(0,0,0,0); justify-content: center; align-items: center; padding: 3px; z-index:9 }
.item-image-hover .hover-btn:hover { color: rgba(0,0,0,1); /*background-image: none !important*/ font-size:1px; color:rgba(0,0,0,0) }

.item-image-hover.row { right: 0; width: 50px; height: auto; background: rgba(165,165,165,0); padding:5px 0 }
.item-image-hover.row .hover-btn{box-shadow:0 0 3px rgba(0,0,0,.3); margin:3px}

.item-image-quick{position:absolute; right:-40px; top:0; z-index:3; display:none; width:43px; height:43px; font-size:11px; text-align:center; background-color:#0c58d7;
background-image: url('../images/img/icon-website(2).png'); background-repeat:no-repeat; background-position:center; border-radius:100px; color:rgba(0,0,0,0); justify-content:center; align-items:center}
.item-image-quick:hover{color:#fff; background-image:none}
.item-image:hover > .item-image-quick{display:inline-flex}
/*.item-image-quick ul{width:80px !important; position:relative !important; background:none !important; opacity:1 !important}
.item-image-quick li, .Array04 .item-image-quick li{border:1px solid #e2e2e2; padding:5px; margin:0 0 5px !important; background:#fff; min-height:inherit !important; width:100% !important; font-size:10px}
.item-image-quick li:hover{background:#d1d2d4}*/
.item-image .Number { position: absolute; left: 0; top: 0; background: url(../images/img/clip.png) no-repeat; color: #fff; width: 44px; height: 44px; padding-left: 2px; text-align: center; font-size: 20px; font-family: 'Open Sans', sans-serif;
font-weight: bold; line-height: 105%; display: flex; flex-flow: column nowrap; justify-content: center }
.Number span { font-size: 10px; margin-top: -6px; display: block; font-family: "Open Sans", sans-serif }
.item-image .zzim { position: absolute; right: 0; top: 0; width: 45px; height: 45px; background: url(../images/img/icon-heart-uncheck.png) no-repeat; background-image:none; /*background-color: rgba(255,255,255,.4);*/
background-position: center; background-size: 24px; cursor: pointer; z-index:3; }
.item-image .zzim.pick { background-image: url(../images/img/icon-heart-check.png); background-color: rgba(255,255,255,.4); } 
.item-image .zzim9 { position: absolute; right: 0; top: 0; width: 45px; height: 45px; background: url(../images/img/icon-heart-uncheck.png) no-repeat; background-color: rgba(255,255,255,.4);
background-position: center; background-size: 24px; cursor: pointer } 
.item-image .zzim9.pick { background-image: url(../images/img/icon-heart-check.png); }

/*.item-info div{margin:5px 0}*/
.item-info .SPEC { color: #777 }
.item-info .Name { font-size: 14px; cursor: pointer }
.item-info .option { color: #333; line-height: 150%; margin: 5px 0; }
.item-info .option .select { margin-bottom: 5px }
.item-info .Price, .Price { font-weight: 600; font-size: 16px; font-family: 'Open Sans', sans-serif; }
.item-info .VAT { margin-top:3px; }
.Original-Price { text-decoration: line-through; color: #666; display: block }
.percent { color: #8babec; font-size: 14px }
.item-info .mark-array { display: block; margin-top: 3px }
.item-info .mark-array img { margin: 0 3px 3px 0 }
.item-info .new-mark, .new-mark { background: #f00; color: #fff; display: inline-block; border: 1px solid #d80000; font-weight: normal; font-size: 11px; margin-right: 3px; height: 15px; line-height: 15px; padding: 0 2px }
.item-info .position { display: inline-block; font-size: 11px; color: #777; height: 15px; line-height: 15px; margin: 3px 0 5px; width: 100%; background: #f2f2f2 } 

.deal-info { margin: 5px 0; position: relative; display: block }
.deal-info div { margin: 5px 0 }
.deal-price { width: 100%; font-weight: 600; font-size: 20px; font-family: 'Open Sans', sans-serif; display: flex }
.deal-price .percent { font-size: 16px; padding: 5px 5px 0 0; }

.AddTo { height: 64px;
line-height: 64px
}

.AddTo .Basket, .AddTo .Join { border: 1px solid #677bac; background: #677bac; color: #fff; text-align: center; font-size: 20px; font-weight: bold; margin: 8px 0; cursor: pointer; font-family: 'Noto Sans KR'; }
.AddTo .Buy { border: 1px solid #677bac; background: #fff; color: #424242; text-align: center; font-size: 20px; font-weight: bold; margin: 8px 0; cursor: pointer; font-family: 'Noto Sans KR'; }


/*테마타입*/
/*테마1 - 상품이동형(가로)*/
.Thema-Type01 { position: relative }
.Thema-Type01 .Item-list { overflow: hidden; }
.Thema-Type01 .arrow-left { width: 32px; height: 200px; display: inline-block; position: absolute; left: -35px; top: 10px; background: url(../images/img/layout/arrow.png) no-repeat; background-position: right center; cursor: pointer }
.Thema-Type01 .arrow-right { width: 32px; height: 200px; display: inline-block; position: absolute; right: -35px; top: 10px; background: url(../images/img/layout/arrow.png) no-repeat; background-position: left center; cursor: pointer }
.Thema-Type01 .arrow-left:hover { background: url(../images/img/layout/arrow-hover.png) no-repeat; background-position: right center; }
.Thema-Type01 .arrow-right:hover { background: url(../images/img/layout/arrow-hover.png) no-repeat; background-position: left center; }
.Thema-Type01 ul { width: 2376px }
.Thema-Type01 li { width: 200px !important; }
.Thema-Type01 .Item-list li:nth-child(1n),
.Thema-Type01 .Item-list li:nth-child(2n),
.Thema-Type01 .Item-list li:nth-child(3n),
.Thema-Type01 .Item-list li:nth-child(4n),
.Thema-Type01 .Item-list li:nth-child(5n),
.Thema-Type01 .Item-list li:nth-child(6n){ margin-right: 20px !important }
.Thema-Type01 .item-image { height: 200px; background-size: 100% }

/*테마2 - 상품그룹형*/
.Thema-Type02 { position: relative } 
.Thema-Type02 .Item-list { overflow: hidden; }
.Thema-Type02 .Item-list ul { width: 3000px; }
.Thema-Type02 .Item-list li { width: 530px; margin-right: 40px !important }
.Thema-Type02 .Item-list li:nth-child(2n) { margin-right: 0 !important }
.Thema-Type02 td { width: 258px; vertical-align: top; padding: 0 }
.Thema-Type02 .arrow-left { width: 32px; height: 530px; display: inline-block; position: absolute; left: -35px; top: 10px; background: url(../images/img/layout/arrow.png) no-repeat; background-position: right center; cursor: pointer }
.Thema-Type02 .arrow-right { width: 32px; height: 530px; display: inline-block; position: absolute; right: -35px; top: 10px; background: url(../images/img/layout/arrow.png) no-repeat; background-position: left center; cursor: pointer}
.Thema-Type02 .arrow-left:hover {background: url(../images/img/layout/arrow-hover.png) no-repeat; background-position: right center; }
.Thema-Type02 .arrow-right:hover { background: url(../images/img/layout/arrow-hover.png) no-repeat; background-position: left center; }


/*테마3 - 탭진열형(가로)*/
.Thema-Type03 .tab-header { margin-top: 10px }
.Thema-Type03 .tab-header ul { list-style: none; /*display: flex; */ display: table; width: 100%; margin-top: -1px; }
.Thema-Type03 .tab-header ul:first-child { margin-top: 0px; }
.Thema-Type03 .tab-header ul:first-child li.empty { border-top: 0px; }
.Thema-Type03 .tab-header li { /*flex: 1;*/ border: 1px solid #e2e2e2; border-right: 0px; /*width: 20% width: 16.66%;;*/ width:137px; text-align: center; height: 50px; /*line-height: 50px;*/
background: #f7f7f7; font-size: 14px; /*display: block;*/ display: table-cell; overflow: hidden; cursor:pointer; vertical-align:middle; position:relative; display:inline-flex; justify-content:center; }
.Thema-Type03 .tab-header li span{display:inline-block; /*line-height:45px;*/ font-size:14px; display:inline-flex; justify-content:center; align-items:center}
.Thema-Type03 .tab-header li:last-child,
.Thema-Type03 .tab-header li.last-child { border-right: 1px solid #e2e2e2; } 
.Thema-Type03 .tab-header li.hover { border-bottom-color:#fff; background: #fff; cursor: pointer; vertical-align: middle; position: relative; display: inline-flex; justify-content: center; }
.Thema-Type03 .tab-header li span { display: inline-block; /*line-height:45px;*/ font-size: 14px; display: inline-flex; justify-content: center; align-items: center }
.Thema-Type03 .tab-header li:last-child,
.Thema-Type03 .tab-header li.last-child { border-right: 1px solid #e2e2e2; }
.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 #000; color: #f00; }
.Thema-Type03 .tab-header li.empty { background: #fff; /*border-color:#fff; border-right:0;*/ border: 0; border-top: 1px solid #e2e2e2; cursor: auto; }
.Thema-Type03 .tab-content { position: relative; } /*overflow: hidden 메인화면 웹상품정보가 나오려면 hidden처리하면 안됨*/
.Thema-Type03 .tab-content ul { list-style: none; position: absolute; top: 0; background: #fff; opacity: 0; width: 100%; }
.Thema-Type03 .tab-content li { width: 334px; margin: 30px 15px; display: inline-block; vertical-align: top } 
.Thema-Type03 .tab-content li .item-image { height: 228px; /*background-size: cover; background-size:auto 100%;*/ background-size: 100% }

/*탭진열형 4열시*/

.Array01 .tab-content li { width: 1100px !important; margin: 30px 0 !important; }
.Array01 .tab-content .item-image { height: 1100px !important }
.Array01 .tab-content li:nth-child(1n) { margin-right: 0 !important }

.Array02 .tab-content li { width: 538px !important; margin: 30px 20px 30px 0 !important; }
.Array02 .tab-content .item-image { height: 538px !important }
.Array02 .tab-content li:nth-child(2n) { margin-right: 0 !important }

.Array03 .tab-content li { width: 351px !important; margin: 30px 20px 30px 0 !important; }
.Array03 .tab-content .item-image { height: 351px !important }
.Array03 .tab-content li:nth-child(3n) { margin-right: 0 !important }

.Array04 .tab-content li { width: 257px !important; margin: 30px 20px 30px 0 !important; }
.Array04 .tab-content .item-image { height: 257px !important }
.Array04 .tab-content li:nth-child(4n) { margin-right: 0 !important }

.Array05 .tab-content li { width: 200px !important; margin: 30px 20px 30px 0 !important; }
.Array05 .tab-content .item-image { height: 200px !important }
.Array05 .tab-content li:nth-child(5n) { margin-right: 0 !important }

.Array06 .tab-content li { width: 163px !important; margin: 30px 20px 30px 0 !important; }
.Array06 .tab-content .item-image { height: 163px !important }
.Array06 .tab-content li:nth-child(6n) { margin-right: 0 !important }

/*테마4 - 갤러리형*/
.Thema-Type04 .Item-list .item-image { height: 200px; background-size: 100% }
.Thema-Type04 .Item-list li { width: 200px }
/*테마5 - 동영상플레이어 형태*/
.Thema-Type05 ul { list-style: none }
.Thema-Type05 .tab-content li { width: 368px; height: 200px; margin: 15px; display: inline-block; vertical-align: top }
.Thema-Type05 .Item-list .item-image { height: 275px }
.Thema-Type05 .Item-list li:nth-child(2) { width: 275px }
/*테마6- 슬라이드+이미지고정형*/ .Thema-Type06 .contentBox { width: 580px; height: 200px; border: 1px solid #e2e2e2; display: inline-block; vertical-align: top; margin: 15px 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 .item-image { height: 200px } 
.Thema-Type07 .Item-list li { width: 200px; } 
.Thema-Type07 .Item-list li .item-image-hover { top: 0; height: 100%; background: rgba(50,50,50,.7); }
.Thema-Type07 .Item-list li .item-image-hover .item-info { height: 100%; color: #fff; text-align: center; display: flex; justify-content: center; align-items: center; flex-flow: column nowrap; padding: 10px; padding-bottom:30%; }
.Thema-Type07 .Item-list li .deal-info { margin: 0 }
.Thema-Type07 .Item-list li .deal-info .mark-array { margin-top: 10px }
.Thema-Type07 .Item-list li .deal-price { justify-content: center; }
.Thema-Type07 .Item-list li .item-image-hover .hover-group-btn { /*height: 30%;*/ position:absolute; bottom:20%; z-index:8}
.Thema-Type07 .item-info .Original-Price { color: #fff; display: none }


/*테마11 - 스크롤형*/
.Thema-Type10 { position: relative } 
.Thema-Type10 .Item-list { overflow-x: auto; } 
.Thema-Type10 .arrow-left { width: 32px; height: 200px; display: inline-block; position: absolute; left: -35px; top: 10px; background: url(../image/arrow.png) no-repeat; background-position: right center; cursor: pointer }
.Thema-Type10 .arrow-right { width: 32px; height: 200px; display: inline-block; position: absolute; right: -35px; top: 10px; background: url(../image/arrow.png) no-repeat; 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{width:2376px}가로길이 갯수에따라 사이즈변경가능하도록*/
.Thema-Type10 li { width: 200px !important; margin: 10px 20px 10px 0 !important; }
.Thema-Type10 .Item-list li:nth-child(4n) { margin-right: 20px !important }
.Thema-Type10 .item-image { height: 200px; } 

/*타일형 :상품이동형(세로)*/
.Thema-Type11 { position: relative;  padding-top:10px; }
.Thema-Type11 .Item-list { overflow: hidden; height: 400px; padding: 10px 0; } 
.Thema-Type11 .arrow-top { width: 32px; height: 32px; margin: 0 auto; background: url(../images/img/layout/arrow-row.png) no-repeat; background-position: center bottom; cursor: pointer }
.Thema-Type11 .arrow-bottom { width: 32px; height: 32px; margin: 0 auto; background: url(../images/img/layout/arrow-row.png) no-repeat; background-position: center top; cursor: pointer }
.Thema-Type11 .arrow-top:hover { background: url(../images/img/layout/arrow-row-hover.png) no-repeat; background-position: center bottom; }
.Thema-Type11 .arrow-bottom:hover { background: url(../images/img/layout/arrow-row-hover.png) no-repeat; background-position: center top; }
.Thema-Type11 ul {} 
.Thema-Type11 li { width: 200px !important; margin: 10px 20px 10px 0 !important; }
.Thema-Type11 .item-image { height: 200px }

/*탭진열형 :세로형*/
.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: 265px; 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: 181px; background-size: cover }


/*리스트형*/
.Thema-Type13 .Item-list li { width: 100%; display: block; border-bottom: 1px solid #eee; margin: 0; }
.Thema-Type13 .Item-list .item-image { height: 228px; width: 228px; display: inline-block; vertical-align: middle }
.Thema-Type13 .Item-list .item-info { display: inline-block }
.Thema-Type13 .item-info .txt { font-size: 13px; color: #999 }
.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 50px 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 { display: table; margin-top: 10px; width: 100%; border: 1px solid #d6d6d6; } 
.Thema-Type14 ul, .Thema-Type14 li { list-style: none }
.table-logo { width: 321px; }
.cycle-slideshow { padding: 10px 40px }
.Thema-Type14 .table-logo ul { display: flex; flex-wrap: wrap; margin-bottom: -1px; width: 321px; overflow: hidden }
.Thema-Type14 .table-logo li { width: 107px; height: 107px; border: 1px solid #d6d6d6; border-left: 0; border-top: 0; background-color: #f6f6f6; box-sizing: border-box }
.Thema-Type14 .table-logo li.select { border: 2px solid #f00; margin: 0 }
.Thema-Type14 .table-logo li img { width: 100% } 
.Thema-Type14 .cycle-slideshow .show { display: none } 
.Thema-Type14 .cycle-slideshow #show01 { display: block } 
.Thema-Type14 .Item-list li { width: 200px; margin: 0; margin-right: 40px } 
.Thema-Type14 .Item-list li:last-child { margin-right: 0 } 
.Thema-Type14 .item-image { height: 200px } 
.Thema-Type14 .item-info .Name { white-space: nowrap; text-overflow: ellipsis; overflow: hidden }




/*배너타입*/

/*Wide배너 1920*150*/
.Banner-Type01 { height: 150px; background-position: center; background-repeat: no-repeat; cursor:pointer;}
.Banner-Type01 .Item-list li { width: 100%;}
/*Fixed배너 1100*150*/
.Banner-Type02 { height: 150px; background-position: center; background-repeat: no-repeat; cursor: pointer; }
/*이미지 가로길이 width:1200px*/
.Banner-Type02 .Item-list li { width: 100%;}


/*타일형배너1(이미지4) 275*275*/
.Banner-Type04 { background-position: center; background-repeat: no-repeat;}
/*이미지 가로길이 width:1200px*/
.Banner-Type04 .Item-list { background: #f7f7f7; padding: 20px 0 }
.Banner-Type04 ul { display: flex; flex-wrap: wrap }
.Banner-Type04 .Item-list li { width: 25%; min-height:inherit; margin: 0; cursor: pointer }

/*::타일형배너1(이미지3)*/
.Banner-Type04.Array03 .Item-list li { width: 354px !important; min-height:inherit; margin-left:19px; cursor: pointer }
.Banner-Type04.Array03 .Item-list li:first-child{margin-left:0}

/*타일배너형2(이미지4) 슬라이드부분(2개) : 550*490, 고정이미지부분(2개) 550*245 */
.Banner-Type05 .Item-list ul { display: flex; flex-wrap: wrap; }
.Banner-Type05 .Item-list li { width: 50%; margin: 10px 0; min-height: inherit; cursor: pointer }
.Banner-Type05 .Item-list img { display: block }
.Banner-Type05 .mixSildeImages { display: none; width: auto; height: 490px; background-size: cover; background-position: center }
.Banner-Type05 .slideshow-container { position: relative; margin: auto; }
.Banner-Type05 .prev, .Banner-Type05 .next { cursor: pointer; position: absolute; top: 50%; width: auto; padding: 16px; margin-top: -22px; color: rgba(0,0,0,.3); font-weight: bold; font-size: 18px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; }
.Banner-Type05 .next { right: 0; border-radius: 3px 0 0 3px;}

.Banner-Type05 .prev:hover,
.Banner-Type05 .next:hover { /*background-color: rgba(0,0,0,0.8);*/
    color: #424e6e;
}

.Banner-Type05 .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;
}

.Banner-Type05 .active {
background-color: #717171;
}

.Banner-Type05 .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
    }
}

/*타일형배너3 이미지8 슬라이드부분(2개)고정이미지(2개) : 275*325, 4분할부분(4개) : 137*162 */
.Banner-Type06 .Item-list ul {
    display: flex;
    flex-wrap: wrap;
}

.Banner-Type06 .Item-list li {
    width: 25%;
    margin: 10px 0;
    min-height: inherit;
    cursor: pointer
}

.Banner-Type06 .item-image {
    height: 330px
}

    .Banner-Type06 .item-image .n4 li {
        width: 50%;
        height: 165px;
        cursor: pointer;
        margin: 0;
        z-index:1;
    }

    .Banner-Type06 .item-image .n4 img {
        height: 165px
    }

    .Banner-Type06 .item-image img,
    .Banner-Type06 .mixSildeImages {
        height: 330px
    }

.Banner-Type06 .mixSildeImages {
    display: none;
    width: auto;
    background-size: cover;
    background-position: center
}

.Banner-Type06 .slideshow-container {
    position: relative;
    margin: auto;
}

.Banner-Type06 .prev, .Banner-Type06 .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -22px;
    color: rgba(0,0,0,.3);
    font-weight: bold;
    font-size: 18px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
}

.Banner-Type06 .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

    .Banner-Type06 .prev:hover,
    .Banner-Type06 .next:hover { /*background-color: rgba(0,0,0,0.8);*/
        color: #424e6e;
    }

.Banner-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;
}

.Banner-Type06 .active {
    background-color: #717171;
}

.Banner-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
    }
}

/*배너 링크시 유투브영상일때 팝업창*/
.video-back { position: fixed; z-index: 999; background: rgba(0,0,0,.2); width: 100%; height: 100%; top: 0; display: flex; display:none; justify-content: center; align-items: center; }
.video-block { position: relative; }
.video-close { display: inline-block; position: absolute; right: -12px; top:-12px; width:28px; height:28px; border-radius:100px; background-color:#fff; background-image:url('../images/img/close.png'); background-size:20px; background-position:center; cursor:pointer }

/*리뷰배너1(무한회전루프)*/
.Review-Type01 { position: relative }
.Review-Type01 .Item-list { overflow: hidden; }
.Review-Type01 .arrow-left { width: 32px; height: 380px; display: inline-block; position: absolute; left: -35px; top: 10px; background: url(../images/img/layout/arrow.png) no-repeat; background-position: right center; cursor: pointer }
.Review-Type01 .arrow-right { width: 32px; height: 380px; display: inline-block; position: absolute; right: -35px; top: 10px; background: url(../images/img/layout/arrow.png) no-repeat; background-position: left center; cursor: pointer }
.Review-Type01 .arrow-left:hover { background: url(../images/img/layout/arrow-hover.png) no-repeat; background-position: right center; }
.Review-Type01 .arrow-right:hover { background: url(../images/img/layout/arrow-hover.png) no-repeat; background-position: left center; }
/*.Review-Type01 ul { width: 2376px }*/
.Review-Type01 li { width: 200px; margin-right: 20px; border:1px solid #eee }
.Review-Type01 .Item-list li:nth-child(1n),
.Review-Type01 .Item-list li:nth-child(2n),
.Review-Type01 .Item-list li:nth-child(3n),
.Review-Type01 .Item-list li:nth-child(4n),
.Review-Type01 .Item-list li:nth-child(5n){margin:10px 10px 40px 10px;}
.Review-Type01 li:last-child{margin-right: 0px}
.Review-Type01 .item-image { height: 200px; background-size: 100%; border:0; border-bottom:1px solid #eee }
.Review-Type01 .ReviewContainer { padding:10px}
.Review-Type01 .ReviewContainer .item-image { border:1px solid #eee; width:40px !important; height:40px !important; margin:5px 0}
.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 0;}
.Review-Type01 .Price.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;}

/*리뷰배너2(바둑판나열방식) */
.Review-Type02 { position: relative }
.Review-Type02 .Item-list { overflow: hidden; }
.Review-Type02 .arrow-left, .Review-Type02 .arrow-right {display:none}
/*.Review-Type02 ul { width: 2376px }*/
.Review-Type02 li { width: 200px !important; margin-right: 20px; border:1px solid #eee }
.Review-Type02 .item-image { height: 200px; background-size: 100%; border:0; border-bottom:1px solid #eee }
.Review-Type02 .ReviewContainer { padding:10px}
.Review-Type02 .ReviewContainer .item-image { border:1px solid #eee; width:40px !important; height:40px !important; margin:5px 0}
.Review-Type02 .item-info{padding-bottom:5px; min-height:80px}
.Review-Type02 .review-title {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:5px 0; font-weight:bold; font-size:14px; display:none}
.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 0;}
.Review-Type02 .Price.Review-Type01 .Price, .Review-Type01 .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;}

/*리뷰배너1(swiper무한회전루프)*/
.Review-Type03 { position: relative }
.Review-Type03 .Item-list { overflow: hidden; }
.Review-Type03 .arrow-left { width: 32px; height: 380px; display: inline-block; position: absolute; left: -35px; top: 10px; background: url(../images/img/layout/arrow.png) no-repeat; background-position: right center; cursor: pointer }
.Review-Type03 .arrow-right { width: 32px; height: 380px; display: inline-block; position: absolute; right: -35px; top: 10px; background: url(../images/img/layout/arrow.png) no-repeat; background-position: left center; cursor: pointer }
.Review-Type03 .arrow-left:hover { background: url(../images/img/layout/arrow-hover.png) no-repeat; background-position: right center; }
.Review-Type03 .arrow-right:hover { background: url(../images/img/layout/arrow-hover.png) no-repeat; background-position: left center; }
/*.Review-Type03 ul { width: 2376px }*/
.Review-Type03 li { width: 200px; margin-right: 20px; border:1px solid #eee }
.Review-Type03 .Item-list li:nth-child(1n),
.Review-Type03 .Item-list li:nth-child(2n),
.Review-Type03 .Item-list li:nth-child(3n),
.Review-Type03 .Item-list li:nth-child(4n),
.Review-Type03 .Item-list li:nth-child(5n){margin:10px 10px 40px 10px;}
.Review-Type03 li:last-child{margin-right: 0px}
.Review-Type03 .item-image { height: 200px; background-size: 100%; border:0; border-bottom:1px solid #eee }
.Review-Type03 .ReviewContainer { padding:10px}
.Review-Type03 .ReviewContainer .item-image { border:1px solid #eee; width:40px !important; height:40px !important; margin:5px 0}
.Review-Type03 .item-info{padding-bottom:5px; min-height:80px}
.Review-Type03 .review-title {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:5px 0; font-weight:bold; font-size:14px; display:none}
.Review-Type03 .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-Type03 .star{margin:5px 0;}
.Review-Type03 .Price.Review-Type01 .Price, .Review-Type01 .Name{font-size:12px}
.Review-Type03 .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;}
