@charset "utf-8";

.lec_sub_banner.std-review .lec_banner-inwrap .design-fst-tag:nth-child(1) .bg {background-image:url('/img/sub/review/std-review-topbg.jpg')}
.lec_sub_banner.std-license .lec_banner-inwrap .design-fst-tag:nth-child(1) .bg {background-image:url('/img/sub/review/std-license-topbg.jpg')}

.lec_sub_banner.community {height:799px}
.lec_sub_banner.community .lec_banner-inwrap .design-fst-tag .inset {bottom:auto; top:173px}
.lec_sub_banner.community .lec_banner-inwrap .design-fst-tag .inset .hd3 { 
	font-size:22px
}
.lec_sub_banner.community .lec_banner-inwrap .design-fst-tag .hd3 .ft { 
	font-size:16px;     
	line-height: 1.4; margin-bottom:95px
}


.borad_menu {overflow:hidden}
.borad_menu .sns-titset { 	
	display:flex; justify-content: space-between;
	width:1180px; margin:62px auto 0
}
.borad_menu .sns-titset .hd3 { 
	font-family: 'Y_Spotlight';
	padding: 0;
}
.borad_menu .sns-titset .hd3 .tit {
	color:#222222;
	font-size:31px;
	line-height: 1.2;
	position:relative;
}
.borad_menu .sns-titset .hd3 .tit::after { 
	content:""; display:block; 
	width:32px; height:36px;
	background:url('/img/sub/review/crown.png') no-repeat 0 0;
	position:absolute; top:-5px; right:-5px;
	z-index:-1

}



.borad_menu .sns-titset .hd3 .tit .gra { 
    background: linear-gradient(to right, #c1bfe6, #dd99e0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
	margin-right:9px	
}

.borad_menu .sns-titset .hd3 .tit .gra .line {display:inline-block}
.borad_menu .sns-titset .hd3 .tit .gra .line::after { 
	content:""; display:block; height:2px; background: linear-gradient(to right, #c1bfe6, #dd99e0);
}
.borad_menu .sns-titset .hd3 .smtxt {
	transform: rotate(-0.05deg);
	font-size:17px;
	display: inline-block;
}

.borad_menu .sns-titset .sns-write-wrap { }
.borad_menu .sns-titset .sns-write-wrap .hd4 {
	background:none;
	transform: rotate(-0.05deg);
	font-family: 'Y_Spotlight';
	font-size:13px;
	color:#393939;
	display:inline-block; 
	vertical-align: middle;
}

.borad_menu .sns-titset .sns-write-wrap .hd4::before { 
	content:""; display:inline-block;
	width:18px; height:23px;
	background:url('/img/sub/review/std-review-write-icon.png') no-repeat 0 0;
	vertical-align: middle;
	margin-right:5px;
	margin-bottom:3px
}

.borad_menu .sns-titset .sns-write-wrap .hd4 + .sns-list {margin-left:10px}
.borad_menu .sns-titset .sns-write-wrap .sns-list {overflow:hidden; display:inline-block; vertical-align: middle}
.borad_menu .sns-titset .sns-write-wrap .sns-list li {float:left}
.borad_menu .sns-titset .sns-write-wrap .sns-list li + li {margin-left:5px}

.borad_menu .sns-titset .sns-write-wrap .btn_logout { 
	margin:0 0 0 2px; padding:0; display:inline-block; width:inherit; height:inherit; vertical-align: middle;
}

.bestreview-wrap .best-box { 
	position:relative; width:1266px; margin:0 auto
}


.bestreview-wrap .best-box .swiper-button-prev:after, 
.bestreview-wrap .best-box .swiper-container-rtl .swiper-button-next:after,
.bestreview-wrap .best-box .swiper-button-next:after, 
.bestreview-wrap .best-box .swiper-container-rtl .swiper-button-prev:after { 
	display:none
}


.bestreview-wrap .best-box [class^="swiper-button"] { 
	width:23px; height:40px;
	background:url('/img/sub/review/bestreview-ctr-arrow.png') no-repeat 0 0 / 46px auto
}
.bestreview-wrap .best-box .swiper-button-next { 
	background-position:-23px 0
}


.reviewBox_wrap.best {margin:0 auto; width:1180px}
.reviewBox_wrap.best .review-msg {color:#c9c9c9; font-size:10px; text-align: right; font-family: "NotoSansKR-Bold"; margin-top:15px}
.reviewBox_wrap.best .swiper-slide {width:283px}
.reviewBox_wrap.best .tit_wrap .snsIcon {flex:none}
.reviewBox_wrap.best .reviewBox {
	position:relative;
	width:inherit; height:370px;
	background: rgb(193,191,230);
	background: linear-gradient(120deg, rgba(193,191,230,1) 0%, rgba(233,138,222,1) 100%);	
	border:none;
	margin-left:0
}
.reviewBox_wrap.best .reviewBox .reviewBoxinfo {position:relative; z-index: 10; overflow: hidden;}
.reviewBox_wrap.best .reviewBox::after { 
	content:""; display:block; position:absolute; top:1px; left:1px; right:1px; bottom:1px; background:#fff; border-radius:14px
}
.reviewBox_wrap.best .reviewBox .tit_wrap {width:250px;display: flex;align-items: center;position: relative;left: 0;transform: translateX(0);/* justify-content: center; */margin: 0 auto;}
.reviewBox_wrap.best .reviewBox .tit_wrap .titBox {
	width:auto;
    display: flex;
    flex-direction: column;
    justify-content: center;	
}
.reviewBox_wrap.best .tit_wrap .titBox .review_date {margin-top:3px}

.reviewBox_wrap.best .reviewBox .tit_wrap .titBox .top_txt_box { 
	display: flex;
	
}

.reviewBox_wrap.best .reviewBox .tit_wrap .titBox .top_txt_box .review_tit  {
width:auto; flex:1
}
.reviewBox_wrap.best .reviewBox .re_centerLine {
	width: auto;
	/* padding: 0 14px; */
	left: 7px;
	right: 7px;
	margin: 78px auto 0;
	transform: translateX(0);
	margin: 15px 7px 0 7px;
	position: relative;
	left: 0;
	right: 0;
}

.reviewBox_wrap.best .reviewBox .review_body {
	width: 100%;
	height:inherit;
	position: relative;
	left: 0;
	transform: translateX(0);
	margin-top: 15px;
}

.borad_menu .icon-grade {display:block; text-align:center}
.borad_menu .icon-grade::before {
	content:
	"";
	display:
	block;
	width: 50px; height:48px;
	background: url('/img/sub/review/review-best-smile-iconset.png') no-repeat 0 0 / 253px 48px;
	margin:0 auto
}
.borad_menu .icon-grade .line-txt {margin-top:7px}
.borad_menu .icon-grade .line-txt::before { 
	content:""; display:block;
    transform: rotate(-0.05deg);
    font-family: 'Y_Spotlight';
	position:relative; 
	z-index: 10;	
	line-height: 1;
    background: linear-gradient(to right, #918de5, #e951d6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;	

}

.borad_menu .icon-grade.grade01::before {background-position:0 0}
.borad_menu .icon-grade.grade02::before {background-position: -50px 0;width: 53px;}
.borad_menu .icon-grade.grade03::before {background-position: -103px 0;}
.borad_menu .icon-grade.grade04::before {background-position: -153px 0;}
.borad_menu .icon-grade.grade05::before {background-position: -203px 0;}


.borad_menu .icon-grade.grade01 .line-txt::before {content:"최고에요!"}
.borad_menu .icon-grade.grade02 .line-txt::before {content:"추천해요"}
.borad_menu .icon-grade.grade03 .line-txt::before {content:"만족스러워요"}
.borad_menu .icon-grade.grade04 .line-txt::before {content:"좋아요"}
.borad_menu .icon-grade.grade05 .line-txt::before {content:"보통이에요"}


.borad_menu .icon-grade .line-txt { 
	position:relative;
	display:inline-block;
	background: rgb(193,191,230);
	background: linear-gradient(120deg, rgba(193,191,230,1) 0%, rgba(233,138,222,1) 100%);
	border-radius: 50px;
	padding:4px 10px 3px;
	font-size:12px;
	z-index:10		
}
.borad_menu .icon-grade .line-txt::after { 
	content:""; display:block; position:absolute; top:1px; left:1px; right:1px; bottom:1px; background:#fff; border-radius:50px
}


.streview-titset {display: flex;
    justify-content: space-between;
    width: 1180px;
    margin: 188px auto 0;}
.streview-titset .hd3 {font-family: 'Y_Spotlight'; padding: 0;}    
.streview-titset .hd3 .tit {color: #222222;
    font-size: 31px;
    line-height: 1.2;
    position: relative;}
.streview-titset .hd3 .smtxt {transform: rotate(-0.05deg);
    font-size: 17px;
    display: inline-block;}    

.reviewBox_wrap.best .reviewBox .review_body {-webkit-line-clamp: 8}

.reviewBox_wrap.best .line-txt.more {
	line-height:1;
	position:absolute; 
	bottom:14px; right:18px;
	padding: 5px 10px 4px;
}
.reviewBox_wrap.best .line-txt.more .txt {
	position:relative; z-index: 10;
    transform: rotate(-0.05deg);
    font-family: 'Y_Spotlight';
	z-index: 10;	
	line-height: 1;
    background: linear-gradient(to right, #918de5, #e951d6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
	font-size:10px;
	display:block;
	width:inherit
}
.reviewBox_wrap.best .line-txt.more .txt::after { 
	content:""; display:inline-block; width:9px; height:9px;
	background:url('/img/sub/review/bestreview-moreicon.png') no-repeat 0 0;
	vertical-align: middle;
	margin:0 0 0.07em 3px
}


.reviewBox_wrap.best .line-txt.more::after { 
	
}

/*
.reviewBox_wrap.best .reviewBox .review_body .icon .common-new {height:auto; font-size:12px; transform: rotate(0);}
.reviewBox_wrap.best .reviewBox .review_body .icon .common-new::before { 
	content:"추천해요!"; display:block; transform: rotate(-0.1deg);
}
*/




.reviewBox_wrap.best .reviewBox .review_body > p { 
	padding:22px 17px 0; font-size:12px; color:#606060
}

.reviewBox_wrap.best .tit_wrap .titBox {margin-left:15px}
.reviewBox_wrap.best .tit_wrap .titBox .review_date p { 
	margin:0
}
.reviewBox_wrap.best .reviewBox .tit_wrap {margin-top:15px}
.reviewBox_wrap.best .reviewBox .tit_wrap .snsIcon  {margin:0}

.reviewBox_wrap.best .tit_wrap .titBox .review_date p + .common-new { 
	margin-left:7px
}

.common-new {
	display:
	inline-block;
	border-radius: 3px; 	
	height:13px;
	background: rgb(193,191,230);
	background: -moz-linear-gradient(152deg, rgba(193,191,230,1) 0%, rgba(234,136,222,1) 100%);
	background: -webkit-linear-gradient(152deg, rgba(193,191,230,1) 0%, rgba(234,136,222,1) 100%);
	background: linear-gradient(152deg, rgba(193,191,230,1) 0%, rgba(234,136,222,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c1bfe6",endColorstr="#ea88de",GradientType=1);
	background-size: 400% 400%; margin-left:0;
	animation: gradient 1s ease infinite;
color:#fff; font-size:10px;
	text-align:
	center;
	/* line-height:11px; */
	padding: 0 4px;
	font-family: 'Y_Spotlight';
	transform: rotate(-0.1deg);
}


.borad_menu .satis-wrap-outer {width:1346px; margin:0 auto}
.borad_menu .satis-wrap-outer + .content #review-list-result {margin-top:33px}
.borad_menu .satis-wrap-outer .msg { 
    color: #c9c9c9;
    font-size: 10px;
    text-align: right;
    font-family: "NotoSansKR-Bold";
    margin-top: 15px;
	margin-right:88px
}
.borad_menu .satis-wrap { 
	position:relative;
	width:1346px;
	height:196px;
	background: rgb(193,191,230);
	background: linear-gradient(120deg, rgba(193,191,230,1) 0%, rgba(233,138,222,1) 100%);
	margin:164px auto 0;
	border-radius: 300px;

}
.borad_menu .satis-wrap::after { 
	content:""; display:block;
	position:absolute; top:1px; left:1px; right:1px; bottom:1px;
	background:#fff; border-radius: 300px; background:#fff	
}

.borad_menu .inwrap {position: relative;z-index: 10;}
.borad_menu .inwrap .titset {text-align: center;}
.borad_menu .inwrap .titset .hd3 {font-family: 'Y_Spotlight';font-size: 25px;transform: translateY(-50%) rotate(-0.1deg);background: #fff;display: inline-block;/* transform: rotate(-0.1deg); */}
.borad_menu .inwrap .titset .hd3 .gra {background: linear-gradient(to right, #918de5, #e951d6);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.borad_menu .inwrap .titset .hd3 .stxt {display: block;font-size: 15px;margin-top: 2px;}

.satis-gra-outer {display: flex;justify-content: space-between;margin: 0 60px;}
.satis-gra-outer .satis-graph {position:relative;display: flex;/* border: 1px solid #f00; */}
.satis-gra-outer .satis-graph .icon-grade {text-align: left;/* display:inline-block; */position: relative;z-index: 10;z-index: 10000;display: inline-block;vertical-align: middle;/* border: 1px solid #f00; */min-width: 90px;text-align: center;}
.satis-gra-outer .satis-graph .icon-grade .line-txt { }
.satis-gra-outer .satis-graph .icon-grade::before {z-index:100; position:relative;width: 55px;height: 53px;background-size: auto 53px;}

.satis-gra-outer .satis-graph .icon-grade.grade01::before {background-position:0 0}
.satis-gra-outer .satis-graph .icon-grade.grade02::before {background-position: -55px 0;width: 59px;transform: translateX(-2px);}
.satis-gra-outer .satis-graph .icon-grade.grade03::before {background-position: -114px 0;}
.satis-gra-outer .satis-graph .icon-grade.grade04::before {background-position: -169px 0;}
.satis-gra-outer .satis-graph .icon-grade.grade05::before {background-position: -224px 0;}


.satis-gra-outer .satis-graph .icon-grade::after {
	content:
	"";
	display:
	block;
	width: 61px;
	height: 61px;
	background: #fff;
	position:
	absolute;
	top: -4px; left:0;
	margin:
	auto;
	right: 0;
	border-radius: 50%;
}

.satis-gra-outer .satis-graph .bar-outer {
    position: relative;
    width: 130px;
    height: 38px;
    background: #f1efef;
    top: 7px;
    border-radius: 0 50px 50px 0;
    left: -30px;
    /* border: 1px solid #f00; */
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
}	

.satis-gra-outer .satis-graph .count {
	margin:16px 0 0 -14px;
	background: linear-gradient(to right, #918de5, #e951d6);
    -webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-size:14px;
	font-family: 'Y_Spotlight';
	transform: rotate(-0.05deg);


 }

.satis-gra-outer .satis-graph .bar {
    position: absolute;
    /* width: 150px; */
    height: 38px;
    background: #f1efef;
    top: 0;
    border-radius: 0 50px 50px 0;
    left: 47px;
    /* overflow: hidden; */
    right: 0;
}
.satis-gra-outer .satis-graph .bar::after {
	content:
	"";
	display:
	block;
	position:
	absolute; top:0;
	left: -10px; width:10px; bottom:0;
	background: #f1efef;
}
.satis-gra-outer .satis-graph .bar-outer .bar-in {
	position: absolute;
	background: rgb(193,191,230);
	background: -moz-linear-gradient(152deg, rgba(193,191,230,1) 0%, rgba(234,136,222,1) 100%);
	background: -webkit-linear-gradient(152deg, rgba(193,191,230,1) 0%, rgba(234,136,222,1) 100%);
	background: linear-gradient(152deg, rgba(193,191,230,1) 0%, rgba(234,136,222,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c1bfe6",endColorstr="#ea88de",GradientType=1);
	width: calc(var(--gradient-width) - 35px);
	height: 100%;
	width: 150px;
	border-radius: 0 50px 50px 0;
	left: 0px;
	transform: translateX(-100%);
	margin-left: calc(var(--gradient-width));
	/* border: 1px solid #f00; */
	z-index: 1000;
	}

	.good-flag-wrap {
		display: inline-block;
		vertical-align: middle;
	}
	.good-flag-wrap + a {display:inline-block; vertical-align: middle; margin-bottom:4px}
	.good-flag-wrap::after { 
		content:""; display:inline-block; width:1px; height:26px;
		background:#cccccc; margin:0 10px;
		vertical-align: top;
		margin-top: 4px;		
	}

	.good-flag-wrap .good-flag { 
	    height: 20px;
		background: url(/img/sub/review/review-grade-txtset.png) no-repeat 0 0 / 252px 20px;	    
	    position: relative;
	    display: inline-block;
	    right: auto;
	    vertical-align: middle;
	    margin-bottom: 3px;
	}

.good-flag-wrap .good-flag.grade01 { 
	width:48px;
	background-position:0 0	
}
.good-flag-wrap .good-flag.grade02 { 
	width:47px;
	background-position:-48px 0	
}
.good-flag-wrap .good-flag.grade03 { 
	width:63px;
	background-position:-95px 0	
}
.good-flag-wrap .good-flag.grade04 { 
	width:39px;
	background-position:-158px 0	
}
.good-flag-wrap .good-flag.grade05 { 
	width:56px;
	background-position:-197px 0	
}

.good-flag-wrap .good-flag + .icon-grade {margin-left:5px}


.good-flag-wrap .icon-grade	{display:inline-block; vertical-align:middle} 
.good-flag-wrap .icon-grade::before {z-index:100; position:relative;width: 33px;height: 32px;background-size: auto 32px;}

.good-flag-wrap .icon-grade.grade01::before {background-position:0 0}
.good-flag-wrap .icon-grade.grade02::before {background-position: -33px 0;width: 35px;}
.good-flag-wrap .icon-grade.grade03::before {background-position: -69px 0;/* width:33px; */}
.good-flag-wrap .icon-grade.grade04::before {background-position: -102px 0;}
.good-flag-wrap .icon-grade.grade05::before {background-position: -136px 0; width:33px}

.reviewBox .tit_wrap .titBox .top_txt_box {white-space: nowrap; display: flex;}
.reviewBox .tit_wrap .titBox {width: 290px; }
.reviewBox .tit_wrap .titBox .top_txt_box .review_tit {width:auto}
.reviewBox .tit_wrap .review_more {margin-top:2px}