@charset "utf-8"; 
/** REVIEW - 고객후기 **/
.review_section .inner { padding: 42px 0 80px; } 
.section_title { font-size: 40px; font-weight: 400; padding: 0 24px; } 

/* 차트 */
.postscript_data_view { padding: 0 24px; margin-top: 36px; } 
.data_view_box { background: #f9f9f9; border-radius: var(--border-radius); padding: 18px 0; } 
.data_view_box > ul { justify-content: center; display: flex; } 
.data_view_box > ul .view_box + .view_box { margin-left: 28px; } 
.data_view_box .view_box { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; } 
.data_view_box .total_area .text_view { margin-top: 16px; } 
.data_view_box .total_area .text_view b { display: inline-block; font-size: 36px; font-weight: 700; line-height: 30px; } 
.data_view_box .total_area .text_view span { display: inline-block; font-size: var(--font-small); color: rgba(34, 34, 34, 0.24); line-height: 20px; margin-left: 1px; } 
.data_view_box .total_area .star_area { display: flex; justify-content: center; align-items: center; margin-top: 16px; } 
.data_view_box .total_area .star_area img { width: 16px; } 
.data_view_box .total_area .star_area img + img { margin-left: 6px; }
.data_view_box .graph_area .graph_box ul { display: flex; justify-content: center; align-items: flex-start; } 
.data_view_box .graph_area .graph_box .box { position: relative; text-align: center; padding-top: 24px; } 
.data_view_box .graph_area .graph_box .box + .box { margin-left: 8px; } 
.data_view_box .graph_area .graph_box .graph_label { position: absolute; left: 50%; top: 0; transform: translateX(-50%); display: inline-block; height: 18px; font-size: 11px; font-weight: 700; color: var(--color-white); line-height: 20px; padding: 0 4px; background: rgba(251, 80, 88, 0.7); border-radius: 4px; } 
.data_view_box .graph_area .bar_wrap { position: relative; width: 9px; height: 44px; background-color: rgba(34,34,34,0.1); border-radius: var(--border-radius); margin: 0 auto; overflow: hidden; } 
.data_view_box .graph_area .bar_wrap .bar { position: absolute; left: 0; bottom: 0; width: 100%; border-radius: var(--border-radius); background: rgba(251, 80, 88, 0.7); } 
.data_view_box .graph_area .point { display: inline-block; font-size: var(--font-small); color: rgba(34, 34, 34, 0.24);; line-height: 20px; margin-top: 6px; } 

/* 게시글 없을 때 */
.none_post_area { width: 100%; text-align: center; background: var(--bg-gray); padding: 40px 0; margin-top: 36px; } 
.none_post_area i { display: block; width: 26px; height: 24px; background: url(../../image/icon/icon_none_post.svg) no-repeat center center; background-size: contain; margin: 0 auto 12px; } 
.none_post_area p { font-size: var(--font-regular); font-weight: 500; color: var(--color-gray); line-height: 22px; } 

/* 리뷰 목록 */
.point_list_area { width: 100%; padding: 24px; overflow: hidden; transition: height 0.5s; } 
.list_top_area { display: flex; justify-content: space-between; align-items: center; padding-bottom: 8px; } 
.list_top_area .total_view { font-size: var(--font-regular); font-weight: 700; line-height: 22px; } 
.list_top_area .photo_chk_area input[type="checkbox"] { display: none; } 
.list_top_area .photo_chk_area input[type="checkbox"] + label { position: relative; display: inline-block; font-size: var(--font-small); line-height: 24px; padding-left: 28px; background-image: url(../../image/icon/agree_chk.svg); background-repeat: no-repeat; background-position: left center; background-size: 24px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } 
.list_top_area .photo_chk_area input[type="checkbox"]:checked + label { font-weight: 700; background-image: url(../../image/icon/agree_chk_on.svg); } 
.point_list_wrap { border-bottom: var(--border); } 
.point_list_wrap .list { position: relative; border-top: var(--border); padding: 24px 0 32px; } 
.point_list_wrap .list .info_area { position: relative; width: 100%; } 
.point_list_wrap .list .top_area { display: flex; justify-content: space-between; align-items: center; width: 100%; } 
.point_list_wrap .list .top_area .point { font-size: var(--font-small); font-weight: 500; color: var(--color-gray); height: 20px; line-height: 22px; display: inline-block; padding-left: 140px; background-position: left center; background-repeat: no-repeat; background-size: 132px; } 
.point_list_wrap .list .top_area .point.type5 { background-image: url(../../image/icon/icon_point5.svg) } 
.point_list_wrap .list .top_area .point.type4 { background-image: url(../../image/icon/icon_point4.svg) } 
.point_list_wrap .list .top_area .point.type3 { background-image: url(../../image/icon/icon_point3.svg) } 
.point_list_wrap .list .top_area .point.type2 { background-image: url(../../image/icon/icon_point2.svg) } 
.point_list_wrap .list .top_area .point.type1 { background-image: url(../../image/icon/icon_point1.svg) } 
.point_list_wrap .list .name_area { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-top: 16px; } 
.point_list_wrap .list .name_area .label { display: inline-block; height: 20px; font-size: var(--font-small); font-weight: 700; color: var(--color-main); line-height: 20px; padding: 0 8px; background-color: rgba(138,82,220,0.1); border-radius: 30px; } 
.point_list_wrap .list .name_area .name { display: inline-block; font-size: var(--font-small); line-height: 20px; padding-left: 8px; } 
.point_list_wrap .list .name_area .date { font-size: var(--font-small); color: var(--color-gray); line-height: 20px; } 
.point_list_wrap .list .text_view_wrap { height: 88px; overflow: hidden; margin-top: 8px; } 
.point_list_wrap .list .text_view_wrap .text_view_area { max-height: 88px; font-size: var(--font-small); line-height: 22px; display: -webkit-box; word-wrap: break-word; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } 
.point_list_wrap .list .text_view_wrap .text_view_area.on { -webkit-line-clamp: unset; height: auto; max-height: unset; } 
.point_list_wrap .list .text_more_btn { display: flex; align-items: center; font-size: var(--font-small); font-weight: 700; color: var(--color-main); line-height: 24px; margin-top: 8px; } 
.point_list_wrap .list .text_more_btn i { display: inline-block; margin-left: 4px; width: 24px; height: 24px; background: url(../../image/icon/icon_arrow_pp03.svg) no-repeat center center; } 
.point_list_wrap .list .text_more_btn.on i { transform: rotate(180deg); } 
.point_list_wrap .list .img_view_area { margin-top: 16px; } 
.point_list_wrap .list .img_view_area ul { width: 100%; white-space: nowrap; overflow: hidden; } 
.point_list_wrap .list .img_view_area ul li { position: relative; display: inline-block; width: 60px; height: 60px; background: var(--bg-gray); cursor: pointer; overflow: hidden; margin-right: 4px; } 
.point_list_wrap .list .img_view_area ul li img { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: auto; min-height: 100%; } 
.point_list_wrap .list .img_view_area ul li video { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: auto; min-height: 100%; } 

/* 뷰어 */
.viewer_wrap { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 2000; }
.viewer_wrap.active { display: block; }
.viewer_wrap .exit_area { width: 100%; height: 100%; }
.viewer_wrap .exit_btn { position: absolute; top: 16px; right: 16px; width: 40px; height: 40px; border-radius: 50%; background: url(../../image/icon/icon_exit_w02.svg) no-repeat center center, var(--color-black); background-size: 24px; display: inline-block; z-index: 3000; }
.viewer_wrap .viewer_swiper { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; max-width: 480px; height: 500px; overflow: hidden; }
.viewer_wrap .viewer_swiper .swiper-slide { position: relative; overflow: hidden; }
.viewer_wrap .viewer_swiper .swiper-slide img { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.viewer_wrap .viewer_swiper .swiper-slide video { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.viewer_wrap .viewer-pager { position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%); }
.viewer_wrap .viewer-pager .swiper-pagination-bullet { width: 10px; height: 10px; background: #c4c4c4; opacity: 1; transition: width 0.3s; border-radius: 33px; }
.viewer_wrap .viewer-pager .swiper-pagination-bullet + .swiper-pagination-bullet { margin-left: 8px; }
.viewer_wrap .viewer-pager .swiper-pagination-bullet.swiper-pagination-bullet-active { background: var(--color-main); width: 28px; }
.viewer_wrap .swiper-button { position: absolute; top: 50%; width: 56px; height: 56px; background: url(../../image/icon/icon_arrow_white03.svg) no-repeat center center; cursor: pointer;}
.viewer_wrap .swiper-button.btn-prev { transform: translateY(-50%); left: 0; }
.viewer_wrap .swiper-button.btn-next { transform: translateY(-50%) rotate(180deg); right: 0; }