/* BASIC css start */
section{margin-bottom: 60px;}
section .sec_inner{padding: 0 5%;}
section h2{text-align: center;margin-bottom: 30px;color: #333;font-family: 'Jost', sans-serif; font-size: 23px; font-weight: 600; letter-spacing: 3px; }

section .sec_inner .more {position: absolute; top: 0; right: 20px; font-weight: bold; font-size: 13px; color:#8d8d8d; margin:0; text-align:right}
section .sec_inner .more:hover {color:#000000}
section .sec_inner .more img {width:12px; vertical-align: bottom; margin-bottom: 3px;}


#sec1{ width:100%; }
#sec1 .swiper-slide img{
  width:100%;
  height:auto;
  display:block;
}
#sec1 .swiper{}
#sec1 .swiper ul{width: 100%;}
#sec1 .swiper ul li{width: 100%;}
#sec1 .swiper ul li a{display: block;width: 100%;}
#sec1 .swiper ul li a img{width: 100%;}
#sec1 .swiper-pagination{bottom: 20px;}
#sec1 .swiper-pagination-bullet{width: 20px; height: 3px; border-radius: 0; background-color: #fff; }
#sec1 .swiper{position:relative}
#sec1 .swiper_btn_prev{position: absolute; top: 50%; left: 10%; z-index: 10; transform: translateY(-50%); cursor: pointer; } 
#sec1 .swiper_btn_next{position: absolute; top: 50%; right: 10%; z-index: 10; transform: translateY(-50%); cursor: pointer;}
#sec1 .swiper_btn_prev img{transform:scale(.66); transform-origin:left center}
#sec1 .swiper_btn_next img{transform:scale(.66); transform-origin:right center}


#sec2{margin-bottom:80px}
#sec2 .swiper{}
#sec2 .swiper ul{}
#sec2 .swiper ul li{position: relative; overflow: hidden;width:80%;}
#sec2 .swiper ul li img{cursor:pointer;width:90%;}
#sec2 .swiper ul li a:hover{background-color: rgba(255,255,255,.2);}
#sec2 .swiper ul li:nth-child(1) a:hover img{content: url(/design/supercle1/card01-1.png);}
#sec2 .swiper ul li:nth-child(2) a:hover img{content: url(/design/supercle1/card02-1.png);}
#sec2 .swiper ul li:nth-child(3) a:hover img{content: url(/design/supercle1/card03-1.png);}





#sec4 ul li{width:75%}
#sec4 .sec_inner{position:relative}
#sec4 .item_list .info .prdname{font-size:17px; padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid #eee}
#sec4 .item_list .info .prdetc{font-size:14px}
#sec4 .item_list .info p{margin-bottom:8px}




#sec5{margin-bottom:80px}
#sec5 a{display: block; width: 100%;}
#sec5 a img{width: 100%;}



#sec6{}
#sec6 .sec_inner{}
#sec6 .sec_inner h2{margin-bottom:20px}
#sec6 .sec_inner .sec6_cate{margin: 0px 0 40px;}
#sec6 .sec_inner .sec6_cate ul{ }
#sec6 .sec_inner .sec6_cate ul li{margin:0 30px 0 0; width:auto !important;}
#sec6 .sec_inner .sec6_cate ul li a{font-family: 'Noto Sans KR', sans-serif; transition:border-color .3s; border-bottom:2px solid transparent; color:#bbbbbb; font-size: 15px; display: block;font-weight: 400;text-align:center;   padding: 8px 0; transition:border-color .2s, color .2s;}
#sec6 .sec_inner .sec6_cate ul li.on>a{ color: #000;border-color:#000;}

#sec6 .sec_inner .sec6_prd{}
#sec6 .sec_inner .sec6_prd>div{display:none;}
#sec6 .sec_inner .sec6_prd>div.show{display: block;}

#sec6 .sec_inner .sec6_prd>div>ul{width: 100%; display: flex; flex-wrap: wrap; }
#sec6 .sec_inner .sec6_prd>div>ul>li{width:31%; margin-right:3.5%;  position: relative; margin-bottom: 15px; border-radius: 10px; overflow: hidden;}
#sec6 .sec_inner .sec6_prd>div>ul>li:nth-child(3n){margin-right:0 }




#sec7{margin-bottom:90px}
#sec7 .sec_inner{position:relative}
#sec7 .sec_inner h2{}
#sec7 .sec_inner ul{border-top: 1px solid #eee;width: 100%;}
#sec7 .sec_inner ul li{border-bottom: 1px solid #eee; width: 100%;}
#sec7 .sec_inner ul li .content {display: flex; width: 100%; flex-direction: row; align-items: center; padding: 20px 0;}
#sec7 .sec_inner ul li .content .thumb{width: 30%;}
#sec7 .sec_inner ul li .content .thumb img{width: 100%; border-radius: 10px;}
#sec7 .sec_inner ul li .content .info{width: 70%; padding-left: 5%;}
#sec7 .sec_inner ul li .content .info p{margin: 10px 0;}
#sec7 .sec_inner ul li .content .info p.prdname{font-family: 'Noto Sans KR', sans-serif; font-size: 14px; color: #000; font-weight: 500;word-break: keep-all;}
#sec7 .sec_inner ul li .content .info p.prdcont{color: #999999; font-size: 13px; font-family: 'Noto Sans KR', sans-serif; font-weight: 500;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    }
#sec7 .sec_inner ul li .content .info p.prdheart{display: flex; align-items: center;}
#sec7 .sec_inner ul li .content .info p.prdheart img{transform: scale(.66); transform-origin: left center;}
#sec7 .sec_inner ul li .content .info p.prdheart span{font-size: 13px; color: #242424; font-family: 'Jost', sans-serif;  display: inline-block; margin-left: 1px; font-weight: 600;}
#sec7 .sec_inner ul li .content .info .star {color:#999999 !important}


/* START : 이미지 상품리뷰 */
/* START : 이미지 상품리뷰 */
.review_img_info {
margin-top: 20px;
display: blcok;
}

.review_img_info .name {
float: left;
margin-right: 10px;
display: block;
}

.review_img_info .date {
margin-top: 5px;
color: #000;
display: flex;
align-items: center;
}

.review_img_info .date img {
width: 18px;
margin-right: 5px;
}

.review_score {
display: flex;
float: left;
justify-content: center;
align-items: center;
}

.review_score li {
position: relative;
margin-right: 2px;
}

.review_score li:last-child {
margin-right: 0;
}

.review_score li>img {
position: relative;
z-index: 5;
width: 15px;
height: auto;
display: block;
}

.review_score li>span.rating {
position: absolute;
z-index: 4;
top: 1px;
left: 1px;
display: block;
width: 85%;
height: 85%;
background-color: #f27370;
}

.review_img_title {
margin: 20px 0 0;
padding: 0 5%;
word-break: keep-all;
}

.review_img_title b {
font font-family: 'Noto Sans KR', sans-serif;
font-size: 18px;
letter-spacing: -.7px;
font-weight: 500;
margin-bottom: 5px;
display: block;
color: #000;
}

.review_img_wrap {
width: 100%;
margin: 0 auto;
padding: 20px 0 20px;
position: relative;
}

.review_img_wrap H3 {
text-align: center;
margin-bottom: 40px;
color: #333;
font-family: 'Jost', sans-serif;
font-size: 32px;
font-weight: bold;
letter-spacing: 13px;
}

.review_img_wrap .swiper-wrapper {
overfhow: hidden;
}

.review_img_wrap .img {
width: 35vw;
height: 35vw;
max-width: 300px;
max-height: 300px;
overflow: hidden;
display: flex;
align-items: center;
flex-direction: row;
justify-content: center;
border-radius: 50%;
position: relative;
z-index: 4;
}

.review_img_wrap .img img {
min-width: 100%;
min-height: 100%;
height: auto
}

.review_img_wrap .review_content_wrap {
width: 35vw;
max-width: 300px;
}

.review_img_wrap .content {
position: relative;
cursor: pointer;
}

div#reviewBnr {
padding: 0 10px 0
}

.review_img_wrap .review_img_info .name {
color: #aaaaaa;
}

.review_img_wrap .swiper-button-prev {
left: -90px;
color: #bcbcbc;
width: 70px;
height: 70px;
transition: 0.2s;
border-radius: 50%;
top: 130px;
}

.review_img_wrap .swiper-button-next {
right: -90px;
color: #bcbcbc;
width: 70px;
height: 70px;
transition: 0.2s;
border-radius: 50%;
top: 130px;
}

.review_img_wrap .swiper-button-prev:after,
.review_img_wrap .swiper-button-next:after {
font-size: 30px;
}

.review_img_wrap .swiper-button-d:hover,
.review_img_wrap .swiper-button-next:hover {
background: #dadada;
color: #fff;
}

.review_img_wrap .review_img_info {
overflow: hidden;
display: flex;
justify-content: center;
padding: 10px 0;
margin-top: 0;
border-bottom: 1px solid #e5e5e5;
}

.review_img_wrap .review_img_info .date {
display: none;
}

.review_img_wrap .review_title {
font-size: 12px;
margin-top: 10px;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
word-break: keep-all;
text-align: center;
position: relative;
transition: 0.2s;
}

.review_img_wrap .review_content {
display: none;
}

.review_img_wrap .review_content_wrap {
display: flex;
flex-direction: column-reverse;
}

.review_layer_popup {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgb(147 147 147 / 34%);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}

.review_layer_popup .popup_inner {
width: 90vw;
height: 90vh;
padding: 0;
position: relative;
background: #fff;
}

.review_layer_popup .popup_top {
position: relative;
border-bottom: 1px solid #000;
font-size: 15px;
padding: 15px;
font-weight: bold;
}

.review_layer_popup .popup_top .btn_close {
width: 25px;
height: 25px;
position: absolute;
top: 10px;
right: 10px;
background: none;
border: none;
font-size: 18px;
cursor: pointer;
}

.review_layer_popup .popup_top .btn_close img {
width: 100%;
height: auto;
display: block
}

.review_layer_popup #popupContentWrap {
	height: calc(100% - 50px);
	position: relative;
	overflow: hidden;
	overflow-y: auto;
	box-sizing: border-box;
	background: #fff;
	display: flex;
	flex-direction: column;
}

.review_layer_popup #popupContent {
height: calc(100vh - 50px);
position: relative;
}

.review_layer_popup #popupContent img {
max-width: 100%
}

.review_layer_popup #popupContent .img {
width: 100%;
height: 50vh;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
background: #000;
}

.review_layer_popup #popupContent .img img {
width: 100%;
height: auto;
}

.review_layer_popup #popupContent .review_content_wrap {
padding: 20px 20px;
width: 100%;
}

.review_layer_popup #popupContent .review_content_wrap.active {
z-index: 100;
position: absolute;
top: 20vh;
height: calc(100vh - 20vh - 50px);
}

.review_layer_popup #popupContent .review_content_wrap.active .review_content {
display: block
}

.review_layer_popup #popupContent .review_title {
font-size: 18px;
font-weight: bold;
line-height: 1.5;
}

.review_layer_popup #popupContent .review_img_info {
border: 1px solid #000;
border-left: 0;
border-right: 0;
position: relative;
display: flex;
align-items: center;
}

.review_layer_popup #popupContent .review_img_info>* {
padding: 10px 0;
width: 50%;
box-sizing: border-box;
float: left;
margin: 0;
text-align: center;
}

.review_layer_popup #popupContent .review_img_info>*+* {
border-left: 1px solid #000;
}

.review_layer_popup #popupContent .review_img_info .date {
border: 0;
padding: 0;
position: absolute;
bottom: -30px;
right: 0;
width: auto;
display: none;
}

.review_layer_popup #popupContent .review_content {
line-height: 21px;
margin-top: 20px;
font-size: 14px;
}

.review_layer_popup #popupContent .moreBtn {
margin-top: 10px;
float: right;
border: 0;
border-top: 1px solid #ababab;
box-shadow: none;
/* border-top-right-radius: 6px; */
/* border-top-left-radius: 6px; */
padding: 6px 20px;
position: absolute;
bottom: -2px;
left: 50%;
transform: translate(-50%, 0);
border-bottom: 0;
z-index: 200;
font-weight: bold;
background: #fff;
width: 100%;
text-align: center;
height: 30px;
box-sizing: border-box;
}

.review_layer_popup .review_score li>img {
width: 20px;
}

.review_pop_list_wrap {
z-index: 10;width: 100%;position:relative;}
.review_pop_list_wrap .img {
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
}

.review_pop_list_wrap .img img {
width: 100%;
height: auto;
}

.review_pop_list_wrap .content {
transform: 0.2s;
box-sizing: border-box;
height: 50vh;
background:#000;
}

.review_pop_list_wrap #reviewPopBnr {}

.review_pop_list_wrap #reviewPopBnr .img {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.review_pop_list_wrap #reviewPopBnr .img img {
	width: 100%;
	height: atuo
}

.review_pop_list_wrap .content {
	cursor: pointer;
	overflow: hidden;
	transition: 0.2s;
}

.review_pop_list_wrap .swiper-button-prev,
.review_pop_list_wrap .swiper-button-next {
	color: #000;
	top: 50%;
}

.review_pop_list_wrap .swiper-button-prev:after,
.review_pop_list_wrap .swiper-button-next:after {
	font-size: 30px
}

/* END : 이미지 상품리뷰 */

/* END : 이미지 상품리뷰 */

/* BASIC css end */