/*Noto Sans / font weight -Thin(100) -Light(300) -Regular(400) -Medium(500) -Bold(700) -Black(900) */ /*이사만루체 300*400*700*/ @font-face { font-family: 'GongGothicMedium'; src: url(/resource/common/font/gothic/GongGothicMedium.woff) format('woff'); font-weight: normal; font-style: normal; } /*------------------------------PC------------------------------*/ /*---------------Layer---------------*/ /*------------------------------추가: 인터뷰 영상 스타일링------------------------------*/ #review_video_wrap {width: 960px; position: relative; border-top: 1px solid #8491a7;} #review_video_wrap h2.sub_title{font-weight: 400; color: #666; line-height: 30px;} #review_video_wrap .play_review_video {width: 700px; margin: 0 auto;} #review_video_wrap .swiper_area {position: relative;} /* 영상 리스트 */ #review_video_wrap .slide_size {width: 290px; margin-right: 25px; box-sizing: border-box;} #review_video_wrap .swiper-slide {transition: 0.15s;transform: scale(1); cursor: pointer; background-color: #ffffff; position: relative; padding: 10px 0;} #review_video_wrap .swiper-slide:hover {transition: 0.15s; transform: scale(1.05);} #review_video_wrap .swiper-slide.on {transform: scale(1.05);} #review_video_wrap .swiper-slide .review_title_wrap {display: flex; justify-content: center; align-items: center; width: 290px; height: 70px; margin-top: -6px; padding: 15px; background: #fff; border: 1px solid #ddd; border-top: 0; box-sizing: border-box; text-align: center;} #review_video_wrap .swiper-slide .review_title {font-size: 16px; line-height: 20px;} #review_video_wrap .swiper-slide .review_title>span {font-weight: bold;} #review_video_wrap .swiper-slide a {position: relative; display: inline-block; margin: 0 auto; width: 290px; height: 162px;} #review_video_wrap .swiper-slide a::after {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); content: url('/resource/common/images/community_review/play_list/icon_play.png'); } #review_video_wrap .swiper-slide a:hover::after, #review_video_wrap .swiper-slide.on a::after {content: url('/resource/common/images/community_review/play_list/icon_play_on.png'); } /* 좌우 화살표 */ #review_video_wrap .swiper-arrow {position: absolute; cursor: pointer; width: 40px; height: 40px; top: 140px; border-radius: 20px; background-color: #ffffff; box-shadow: -1px 1px 2px 1px #1f222233; z-index: 2; outline: none; user-select: none;} #review_video_wrap .swiper-arrow.next {right: 3px; cursor: pointer;} #review_video_wrap .swiper-arrow.prev {left: 0; cursor: pointer;} #review_video_wrap .swiper-arrow span {position: absolute; width: 11px; display: inline-block; top: 11px; left: 14px;} #review_video_wrap .swiper-arrow span svg polyline {stroke: #bab9b9;} #review_video_wrap .swiper-arrow:hover span svg polyline {stroke: #706f6f;} #review_video_wrap .swiper-arrow.next span {left: 16px;} /* 페이지네이션 */ #review_video_wrap .swiper-pagination-wrap {padding: 30px 0;} #review_video_wrap .swiper-pagination-wrap .swiper-pagination {position: relative;} #review_video_wrap .swiper-pagination-wrap .swiper-pagination .swiper-pagination-bullet { border-radius: 100px; margin-left: 10px; width: 12px; height: 12px; } #review_video_wrap .swiper-pagination-wrap .swiper-pagination .swiper-pagination-bullet:first-of-type {margin-left:0px; } #review_video_wrap .swiper-pagination-wrap .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {width: 32px; opacity: 1; background:#3267e9; } .landingpage_j #review_video_wrap .swiper-pagination-wrap .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {background:#00993a; } /*----------Best awards / Before selection of a gift----------*/ #pc_layer_bestawards_pre{clear: both; width: 600px; height: 420px; margin: 0;} #pc_layer_bestawards_pre .content{width: 600px; height: 420px; position: relative;} #pc_layer_bestawards_pre .content .select_wrap{width: 520px; height: 103px; position: absolute; top: 220px; left: 40px;} /*middle select area*/ #pc_layer_bestawards_pre .content .select_wrap .select_box{width: 160px; height: 103px; float: left; margin-right: 20px; border: none;} #pc_layer_bestawards_pre .content .select_wrap .select_box.select_03{margin-right: 0px;} #pc_layer_bestawards_pre .content .select_wrap .select_box label{width: 158px; height: 101px; position: absolute; cursor: pointer; transition: all 0.2s;} #pc_layer_bestawards_pre .content .select_wrap .select_box label:hover, #pc_layer_bestawards_pre .content .select_wrap .select_box label:focus{border: 1px solid #ffc730;} #pc_layer_bestawards_pre .content .select_wrap .select_box [type="radio"]{appearance: none;} #pc_layer_bestawards_pre .content .select_wrap .select_box.selected_coupon label{border: 1px solid #ffc730;} /*bottom Button*/ #pc_layer_bestawards_pre .content .btn_bottom{width: 220px; height: 52px; position: absolute; bottom: 25px; left: 190px; background: url('../images/community_review/btn_pc_layer_bestawards_prev_off.png') no-repeat center/cover; cursor: pointer; transition: all 0.2s;} #pc_layer_bestawards_pre .content .btn_bottom:hover, #pc_layer_bestawards_pre .content .btn_bottom:focus{background: url('../images/community_review/btn_pc_layer_bestawards_prev_on.png') no-repeat center/cover;} /*Background*/ #pc_layer_bestawards_pre .content.content_g{background: url('../images/community_review/bg_pc_layer_bestawards_prev_g.png') no-repeat center/cover;}/*---Gunsul-Net---*/ #pc_layer_bestawards_pre .content.content_j{background: url('../images/community_review/bg_pc_layer_bestawards_prev_j.png') no-repeat center/cover;}/*---Jungi-Net---*/ /*----------Best awards / After selection of a gift----------*/ #pc_layer_bestawards_next{clear: both; width: 600px; height: 420px; margin: 0;} #pc_layer_bestawards_next .content{width: 600px; height: 420px; position: relative;} #pc_layer_bestawards_next .content.coupon_oil{background: url('../images/community_review/bg_pc_layer_bestawards_next_oil.png') no-repeat center/cover;} #pc_layer_bestawards_next .content.coupon_site{background: url('../images/community_review/bg_pc_layer_bestawards_next_site.png') no-repeat center/cover;} #pc_layer_bestawards_next .content.coupon_class{background: url('../images/community_review/bg_pc_layer_bestawards_next_class.png') no-repeat center/cover;} /*close button*/ #pc_layer_bestawards_next .content .btn_close{width: 30px; height: 30px; position: absolute; top: 0; right: 0; background: url('../images/community_review/btn_close_pc_layer_bestawards_next_off.png') no-repeat center/cover; cursor: pointer; transition: all 0.1s;} #pc_layer_bestawards_next .content .btn_close:hover, #pc_layer_bestawards_next .content .btn_close:focus{background: url('../images/community_review/btn_close_pc_layer_bestawards_next_on.png') no-repeat center/cover;} #pc_layer_bestawards_pre .content .btn_close{width: 30px; height: 30px; position: absolute; top: 0; right: 0; background: url('../images/community_review/btn_close_pc_layer_bestawards_next_off.png') no-repeat center/cover; cursor: pointer; transition: all 0.1s;} #pc_layer_bestawards_pre .content .btn_close:hover, #pc_layer_bestawards_next .content .btn_close:focus{background: url('../images/community_review/btn_close_pc_layer_bestawards_next_on.png') no-repeat center/cover;} /*---middle coupon area---*/ #pc_layer_bestawards_next .content .coupon_box{width: 160px; height: 103px; position: absolute; top: 242px; left: 220px;} /*coupon 01 / SK 모바일 주유권*/ #pc_layer_bestawards_next .content .coupon_box.coupon_01{background: url('../images/community_review/coupon01_pc_layer_bestawards_next.png') no-repeat center/cover;} /*coupon 02 / 사이트 2개월 무료 이용권*/ #pc_layer_bestawards_next .content.content_g .coupon_box.coupon_02{background: url('../images/community_review/coupon02_pc_layer_bestawards_next_g.png') no-repeat center/cover;}/*---Gunsul-Net---*/ #pc_layer_bestawards_next .content.content_j .coupon_box.coupon_02{background: url('../images/community_review/coupon02_pc_layer_bestawards_next_j.png') no-repeat center/cover;}/*---Jungi-Net---*/ /*coupon 03 / VIP클래스 분석교육 50% 할인권*/ #pc_layer_bestawards_next .content .coupon_box.coupon_03{background: url('../images/community_review/coupon03_pc_layer_bestawards_next.png') no-repeat center/cover;} /*bottom Button*/ #pc_layer_bestawards_next .content .btn_bottom{width: 600px; height: 50px; position: absolute; bottom: 0px; left: 0px; background: url('../images/community_review/btn_pc_layer_bestawards_next_off.png') no-repeat center/cover; cursor: pointer; transition: all 0.2s;} #pc_layer_bestawards_next .content .btn_bottom:hover, #pc_layer_bestawards_next .content .btn_bottom:focus{background: url('../images/community_review/btn_pc_layer_bestawards_next_on.png') no-repeat center/cover;} /*----------First ranking congratulation----------*/ #pc_layer_firstranking{clear: both; width: 600px; height: 420px; margin: 0;} #pc_layer_firstranking .content{width: 600px; height: 420px; position: relative;} /*close button*/ #pc_layer_firstranking .content .btn_close{width: 30px; height: 30px; position: absolute; top: 0; right: 0; background: url('../images/community_review/btn_close_pc_layer_first-ranking_off.png') no-repeat center/cover; cursor: pointer; transition: all 0.1s;} #pc_layer_firstranking .content .btn_close:hover, #pc_layer_firstranking .content .btn_close:focus{background: url('../images/community_review/btn_close_pc_layer_first-ranking_on.png') no-repeat center/cover;} /*---Middle contents---*/ #pc_layer_firstranking .content .contents_wrap{width: 420px; height: 94px; position: absolute; top: 225px; left: 85px; text-align: center;} /*ranker-name*/ #pc_layer_firstranking .content .contents_wrap .ranker_name{width: 420px; height: 30px; margin: 0; text-align: center; font-family: 'noto_sans_kr'; font-size: 22px; font-weight: 700; color: #202020; line-height: 30px;} #pc_layer_firstranking .content .contents_wrap .ranker_name span.thinner{font-family: 'noto_sans_kr'; font-weight: 500;} /*project-name*/ #pc_layer_firstranking .content .contents_wrap .inner_wrap{width: 420px; height: 20px; margin-top: 2px; text-align: center; font-family: 'noto_sans_kr'; font-weight: 400; color: #333; word-spacing: -1px; letter-spacing: -1px;} #pc_layer_firstranking .content .contents_wrap .inner_wrap .border_box{display: inline-block; width: 50px; height: 18px; margin: 0; border:1px solid #333; border-radius: 3px; text-align: center; font-size: 11px; line-height: 19px;} #pc_layer_firstranking .content .contents_wrap .inner_wrap .project_name{display: inline-block; width: fit-content; max-width: 364px; height: 20px; margin-left: 6px; text-align: left; font-size: 18px; line-height: 20px;} /*price*/ #pc_layer_firstranking .content .contents_wrap .price{width: 420px; height: 32px; margin-top: 10px; text-align: center; font-family: 'GongGothicMedium'; font-size: 32px; font-weight: 700; color: #3267e9; line-height: 32px;} #pc_layer_firstranking .content .contents_wrap .price span.won{width: fit-content; margin: 0 0 0 -3px; text-align: left; font-family: 'GongGothicMedium'; font-size: 18px; color: #333;} /*bottom Button*/ #pc_layer_firstranking .content .btn_bottom{width: 600px; height: 56px; position: absolute; bottom: 0px; left: 0px; background: url('../images/community_review/btn_pc_layer_first-ranking_off.png') no-repeat center/cover; cursor: pointer; transition: all 0.2s;} #pc_layer_firstranking .content .btn_bottom:hover, #pc_layer_firstranking .content .btn_bottom:focus{background: url('../images/community_review/btn_pc_layer_first-ranking_on.png') no-repeat center/cover;} /*---Gunsul-Net---*/ /*Background*/ #pc_layer_firstranking .content.content_g{background: url('../images/community_review/bg_pc_layer_first-ranking_g.png') no-repeat center/cover;} /*---Jungi-Net---*/ /*Background*/ #pc_layer_firstranking .content.content_j{background: url('../images/community_review/bg_pc_layer_first-ranking_j.png') no-repeat center/cover;} /*---------------Landing page---------------*/ /*----------Best Awards of reviews----------*/ #pc_landing_bestawards{width: 960px; height: 2108px; margin: 0; overflow: hidden;} #pc_landing_bestawards .align_center{text-align: center;} #pc_landing_bestawards .align_left{text-align: left;} #pc_landing_bestawards .wrap_content .star_mark.full_star{background: url('../images/community_review/star_full.png') no-repeat center/100%;} #pc_landing_bestawards .wrap_content .star_mark.half_star{background: url('../images/community_review/star_half.png') no-repeat center/100%;} #pc_landing_bestawards .wrap_content .star_mark.empty_star{background: url('../images/community_review/star_empty.png') no-repeat center/100%;} #pc_landing_bestawards .wrap_content{width: 960px; position: relative; margin: 0;} /*-----Upper part-----*/ #pc_landing_bestawards .wrap_content.upper_zone{height: 759px;} /*title of page*/ #pc_landing_bestawards .wrap_content.upper_zone .title_page{width: 960px; height: 80px; position: absolute; top: 45px; left: 0; font-family: 'noto_sans_kr'; font-size: 35px; font-weight: 700; color: #202020; line-height: 41px; word-spacing: -2px; letter-spacing: -1px;} #pc_landing_bestawards .wrap_content.upper_zone .title_page span.deep_color{font-size: 38px;} #pc_landing_bestawards .wrap_content.upper_zone .upper_text{width: 960px; height: 50px; position: absolute; top: 146px; left: 0; /*font-family: 'noto_sans_kr';*/ font-size: 18px; /*font-weight: bold;*/ color: #666; line-height: 28px; word-spacing: -1px; letter-spacing: -0.5px;} /*-main content-*/ #pc_landing_bestawards .wrap_content.upper_zone .main_content{width: 960px; height: 482px; position: absolute; top: 232px; left: 0;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide{width: 840px; height: 482px; position: absolute; top: 0; left: 60px; overflow: hidden;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide{box-sizing: border-box; width: 410px; height: 482px; padding: 0 30px; float: left; margin-right: 20px; position: relative; font-family: 'noto_sans_kr'; color: #202020; cursor: pointer; transition: all 0.2s;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide:last-child{margin-right: 0;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide .month{width: 350px; height: 40px; position: absolute; top: 67px; font-size: 40px; font-weight: 700; line-height: 40px; word-spacing: -1px; letter-spacing: -1px;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide .reviewr_name{width: 350px; height: 30px; position: absolute; top: 143px; font-size: 28px; font-weight: 700; line-height: 30px; word-spacing: -3px; letter-spacing: -1.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide .title_review{width: 350px; height: 20px; position: absolute; top: 196px; font-size: 18px; font-weight: 700; line-height: 20px; word-spacing: -1.5px; letter-spacing: -1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide .used_program{width: 350px; height: 23px; position: absolute; top: 229px; font-size: 13px; font-weight: 400; line-height: 23px; word-spacing: -1px; letter-spacing: -1px;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide .contents_review{width: 350px; height: 150px; position: absolute; top: 260px; font-size: 15px; font-weight: 400; color: #555; line-height: 22px; word-spacing: 0; letter-spacing: -1px; word-break: break-all; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide .date_registration{width: 120px; height: 18px; position: absolute; top: 426px; font-size: 12px; font-weight: 300; color: #aaa; line-height: 18px; word-spacing: -1px; letter-spacing: -0.5px;} /*score mark*/ #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide .score_mark{width: 114px; height: 21px; position: absolute; top: 424px; right: 30px;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide .score_mark .star_mark{width: 22px; height: 21px; float: left; margin-right: 1px;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .box_slide .score_mark .star_mark:last-child{ margin-right: 0;} /*arrow button*/ #pc_landing_bestawards .wrap_content.upper_zone .main_content .arrow_btn{width: 21px; height: 39px; position: absolute; top: 222px; z-index: 10; cursor: pointer; transition: all 0.2s;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .arrow_btn.arrow_prev{position: absolute; left: 21px; background: url('../images/community_review/arrow_prev_off.png') no-repeat center/cover;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .arrow_btn.arrow_prev:hover, #pc_landing_bestawards .wrap_content.upper_zone .main_content .arrow_btn.arrow_prev:focus{background: url('../images/community_review/arrow_prev_on.png') no-repeat center/cover;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .arrow_btn.arrow_next{position: absolute; right:21px; background: url('../images/community_review/arrow_next_off.png') no-repeat center/cover;} #pc_landing_bestawards .wrap_content.upper_zone .main_content .arrow_btn.arrow_next:hover, #pc_landing_bestawards .wrap_content.upper_zone .main_content .arrow_btn.arrow_next:focus{background: url('../images/community_review/arrow_next_on.png') no-repeat center/cover;} /*comming soon banner*/ /*#pc_landing_bestawards .wrap_content.upper_zone .main_content .wrap_slide .wrap_banner_last{height: 482px; width: 100%; background: url('../images/community_review/banner_comming_soon_pc_landing_bestawards.png') no-repeat center/cover;}*/ /*-----Middle part-----*/ #pc_landing_bestawards .wrap_content.middle_zone{height: 190px; margin-top: 10px; overflow: hidden;} #pc_landing_bestawards .wrap_content.middle_zone .wrap_banner{width: 960px; height: 190px; float: left; margin: 0; /*cursor: pointer;*/} /*background banner img*/ #pc_landing_bestawards .wrap_content.middle_zone .wrap_banner.banner_01{background: url('../images/community_review/banner01_pc_landing_bestawards_middle.png') no-repeat center/cover;} #pc_landing_bestawards .wrap_content.middle_zone .wrap_banner.banner_01_v2{background: url('../images/community_review/banner01_pc_landing_bestawards_middle_v2.png') no-repeat center/cover;} #pc_landing_bestawards .wrap_content.middle_zone .wrap_banner.banner_02{background: url('../images/community_review/banner02_pc_landing_bestawards_middle_g.png') no-repeat center/cover;} #pc_landing_bestawards .wrap_content.middle_zone .wrap_banner.banner_03{background: url('../images/community_review/banner03_pc_landing_bestawards_middle.png') no-repeat center/cover;} #pc_landing_bestawards .wrap_content.middle_zone .wrap_banner.banner_03_v2{background: url('../images/community_review/banner03_pc_landing_bestawards_middle_v2.png') no-repeat center/cover;} /*pagination*/ #pc_landing_bestawards .wrap_content.middle_zone .wrap_pagination{z-index: 1; width: 46px; height: 12px; position: absolute; top: 158px; right: 25px;}/*if the number of boxes is 3, width: 46px, 4 is 63px, 5 is 80px...+ 17px*/ #pc_landing_bestawards .wrap_content.middle_zone .wrap_pagination .box_page{width: 100px; height: 12px; margin-right: 5px; opacity: 0.2;} #pc_landing_bestawards .wrap_content.middle_zone .wrap_pagination .box_page:last-child{margin-right: 0;} #pc_landing_bestawards .wrap_content.middle_zone .wrap_pagination .box_page.active{opacity: 0.5;} /*-----Lower part-----*/ #pc_landing_bestawards .wrap_content.lower_zone{height: 1119px; margin-top: 30px; font-family: 'noto_sans_kr';} #pc_landing_bestawards .wrap_content.lower_zone .inner{width: 100%; margin: 0;} /*---upper---*/ #pc_landing_bestawards .wrap_content.lower_zone .inner.upper{height: 30px;} /*subtitle*/ #pc_landing_bestawards .wrap_content.lower_zone .inner.upper .subtitle{width: 600px; height: 30px; float: left; margin: 0; font-size: 24px; font-weight: 700; color: #202020; line-height: 30px; word-spacing: -2.5px; letter-spacing: -0.5px;} #pc_landing_bestawards .wrap_content.lower_zone .inner.upper .subtitle span{font-size: 14px; font-weight: 400; color: #8491a7; word-spacing: -1px; letter-spacing: -0.5px;} /*search zone / delete below img, and apply this area*/ #pc_landing_bestawards .wrap_content.lower_zone .inner.upper .search_zone{width: 341px; height: 30px; float: right; margin: 0;/* background: url('../images/community_review/search_zone_pc_bestawards.png') no-repeat center/cover;*/} /*---main contents/ review---*/ #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content{/*height: 908px;*/ margin-top: 15px; position: relative;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review{box-sizing: border-box; width: 960px; height: 151px; margin: 0; padding: 0 30px 0 20px; border-bottom: 1px solid #d7dce5; cursor: pointer;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review:first-child{height: 152px; border-top: 2px solid #d7dce5;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review:last-child{height: 152px; border-bottom: 2px solid #d7dce5;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box{box-sizing: border-box; height: 150px; float: left; position: relative;} /*deco*/ #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_01{width: 55px; margin-right : 30px;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_01 .mark_best_month{box-sizing: border-box; width: 55px; height: 75px; padding-top: 22px; border-radius: 0 0 27.5px 27.5px; font-size: 16px; font-weight: 700; color: #fff; line-height: 18px; word-spacing: -1px; letter-spacing: -0.5px;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_01 .mark_best_month span.smaller{font-size: 14px; font-weight: 500;} /*content of review*/ #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02{width: 471px; overflow: hidden;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02 .title_review{width: 100%; height: 22px; margin-top: 18px; font-size: 18px; font-weight: 700; color: #202020; line-height: 22px; word-spacing: -2px; letter-spacing: -1px; overflow: hidden;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02 .used_program{width: 100%; height: 17px; margin-top: 5px; font-size: 13px; font-weight: 400; color: #202020; line-height: 17px; word-spacing: -1px; letter-spacing: -0.5px;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02 .contents_review{width: 100%; height: 60px; margin-top: 8px; font-size: 14px; font-weight: 400; color: #555; line-height: 21px; word-spacing: -0.5px; letter-spacing: -0.5px; word-break: break-all; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;} /*score mark or bidcoaching mark*/ #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03{width: 180px; padding: 60px 0 0 11px; margin-right: 44px; font-size: 22px; font-weight: 700; color: #333; line-height: 21px; word-spacing: -0.5px; letter-spacing: -0.5px;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03 .score_mark{width: 115px; height: 21px; float: left; margin-right: 4px;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03 .score_mark .star_mark{width: 22px; height: 21px; margin-right: 1px; float: left;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03 .score_mark .star_mark:last-child{margin-right: 0;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03 span{font-size: 14px; font-weight: 400; color: #666;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03 .logo_bidcoaching{width: 158px; height: 32px; float: left; background: url('../images/community_review/logo_bidcoaching_pc_landing.png') no-repeat center/cover;} /*data*/ #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_04{width: 130px; position: relative;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_04 ul{width: 130px; height: 66px; position: absolute; top: 50%; transform: translateY(-50%);} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_04 ul li{width: 130px; height: 20px; margin-bottom: 3px; font-size: 12px; font-weight: 400; color: #aaa; line-height: 20px; word-spacing: 0; letter-spacing: 0;} #pc_landing_bestawards .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_04 ul li:last-child{margin-bottom: 0;} /*---lower---*/ #pc_landing_bestawards .wrap_content.lower_zone .inner.lower{box-sizing: border-box; height: 165px; margin: 0; position: relative} #pc_landing_bestawards .wrap_content.lower_zone .inner.lower .btn_bottom{width: 130px; height: 40px; position: absolute; top: 15px; right: 0; cursor: pointer; transition: all 0.1s;} /*delete below img, and apply this area*/ #pc_landing_bestawards .wrap_content.lower_zone .inner.lower .pagination_zone{width: fit-content; min-width: 376px; height: 30px; position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%);/* background: url('../images/community_review/pagination_zone_pc_bestawards.png') no-repeat center/cover;*/} /*---Gunsul-Net---*/ /*-upper zone-*/ #pc_landing_bestawards.landingpage_g .upper_zone{background-color: #f7f9ff;} #pc_landing_bestawards.landingpage_g .upper_zone .title_page span.deep_color{color: #1449c9;} #pc_landing_bestawards.landingpage_g .wrap_content.upper_zone .main_content .wrap_slide .box_slide{background: url('../images/community_review/slide_pc_landing_bestawards_g.png') no-repeat center/contain;} #pc_landing_bestawards.landingpage_g .wrap_content.upper_zone .main_content .wrap_slide .box_slide:hover, #pc_landing_bestawards.landingpage_g .wrap_content.upper_zone .main_content .wrap_slide .box_slide:focus{background: url('../images/community_review/slide_pc_landing_bestawards_on_g.png') no-repeat center/contain;} #pc_landing_bestawards.landingpage_g .wrap_content.upper_zone .main_content .wrap_slide .box_slide .month{color: #9cb4fc;} #pc_landing_bestawards.landingpage_g .wrap_content.upper_zone .main_content .wrap_slide .box_slide .title_review{color: #3267e9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} /*-middle zone*/ #pc_landing_bestawards.landingpage_g .wrap_content.middle_zone .wrap_banner.banner_02{background: url('../images/community_review/banner02_pc_landing_bestawards_middle_g.png') no-repeat center/cover;} #pc_landing_bestawards.landingpage_g .wrap_content.middle_zone .wrap_pagination .box_page{background-color: #3267e9;} /*-lower zone*/ #pc_landing_bestawards.landingpage_g .wrap_content.lower_zone .inner.main_content .review:hover{background-color: #f7f9ff;} #pc_landing_bestawards.landingpage_g .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_01 .mark_best_month{background-color: #329ee9;} #pc_landing_bestawards.landingpage_g .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02 .used_program{color: #3267e9;} #pc_landing_bestawards.landingpage_g .wrap_content.lower_zone .inner.lower .btn_bottom{background: url('../images/community_review/btn_pc_landing_bestawards_lower_off_g.png') no-repeat center/cover;} #pc_landing_bestawards.landingpage_g .wrap_content.lower_zone .inner.lower .btn_bottom:hover, #pc_landing_bestawards.landingpage_g .wrap_content.lower_zone .inner.lower .btn_bottom:focus{background: url('../images/community_review/btn_pc_landing_bestawards_lower_on_g.png') no-repeat center/cover;} /*---Jungi-Net---*/ /*-upper zone-*/ #pc_landing_bestawards.landingpage_j .upper_zone{background-color: #f4faf4;} #pc_landing_bestawards.landingpage_j .upper_zone .title_page span.deep_color{color: #00772f;} #pc_landing_bestawards.landingpage_j .wrap_content.upper_zone .main_content .wrap_slide .box_slide{background: url('../images/community_review/slide_pc_landing_bestawards_j.png') no-repeat center/contain;} #pc_landing_bestawards.landingpage_j .wrap_content.upper_zone .main_content .wrap_slide .box_slide:hover, #pc_landing_bestawards.landingpage_j .wrap_content.upper_zone .main_content .wrap_slide .box_slide:focus{background: url('../images/community_review/slide_pc_landing_bestawards_on_j.png') no-repeat center/contain;} #pc_landing_bestawards.landingpage_j .wrap_content.upper_zone .main_content .wrap_slide .box_slide .month{color: #70d170;} #pc_landing_bestawards.landingpage_j .wrap_content.upper_zone .main_content .wrap_slide .box_slide .title_review{color: #00993a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} /*-middle zone*/ #pc_landing_bestawards.landingpage_j .wrap_content.middle_zone .wrap_banner.banner_02{background: url('../images/community_review/banner02_pc_landing_bestawards_middle_j.png') no-repeat center/cover;} #pc_landing_bestawards.landingpage_j .wrap_content.middle_zone .wrap_pagination .box_page{background-color: #00993a;} /*-lower zone*/ #pc_landing_bestawards.landingpage_j .wrap_content.lower_zone .inner.main_content .review:hover{background-color: #f4faf4;} #pc_landing_bestawards.landingpage_j .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_01 .mark_best_month{background-color: #06bf00;} #pc_landing_bestawards.landingpage_j .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02 .used_program{color: #00772f;} #pc_landing_bestawards.landingpage_j .wrap_content.lower_zone .inner.lower .btn_bottom{background: url('../images/community_review/btn_pc_landing_bestawards_lower_off_j.png') no-repeat center/cover;} #pc_landing_bestawards.landingpage_j .wrap_content.lower_zone .inner.lower .btn_bottom:hover, #pc_landing_bestawards.landingpage_j .wrap_content.lower_zone .inner.lower .btn_bottom:focus{background: url('../images/community_review/btn_pc_landing_bestawards_lower_on_j.png') no-repeat center/cover;} /*----------Review Board----------*/ #pc_landing_review_board{width: 960px; margin: 0; overflow: hidden;} #pc_landing_review_board .align_center{text-align: center;} #pc_landing_review_board .align_left{text-align: left;} #pc_landing_review_board .wrap_content .star_mark.full_star{background: url('../images/community_review/star_full.png') no-repeat center/100%;} #pc_landing_review_board .wrap_content .star_mark.half_star{background: url('../images/community_review/star_half.png') no-repeat center/100%;} #pc_landing_review_board .wrap_content .star_mark.empty_star{background: url('../images/community_review/star_empty.png') no-repeat center/100%;} #pc_landing_review_board .wrap_content .star_mark_detail.full_star{background: url('../images/community_review/star_full_detail.png') no-repeat center/100%;} #pc_landing_review_board .wrap_content .star_mark_detail.half_star{background: url('../images/community_review/star_half_detail.png') no-repeat center/100%;} #pc_landing_review_board .wrap_content .star_mark_detail.empty_star{background: url('../images/community_review/star_empty_detail.png') no-repeat center/100%;} #pc_landing_review_board .wrap_content{width: 960px; position: relative; margin: 0;} /*-----Upper part-----*/ #pc_landing_review_board .wrap_content.upper_zone{box-sizing: border-box; height: 351px; border-top: 1px solid #8491a7;} #pc_landing_review_board .wrap_content.upper_zone .title_page{width: 960px; height: 60px; margin: 30px 0; font-family: 'noto_sans_kr'; font-size: 22px; font-weight: 400; color: #666; line-height: 30px; word-spacing: -2.5px; letter-spacing: -0.5px;} #pc_landing_review_board .wrap_content.upper_zone .title_page span.point_color{font-weight: 700;} /*---table / analysis program data---*/ #pc_landing_review_board .wrap_content.upper_zone .table_program{width: 960px; height: 230px; margin: 0;} /*upper part*/ #pc_landing_review_board .wrap_content.upper_zone .table_program table{box-sizing: border-box; width: 960px; height: 50px; border-collapse: collapse;} #pc_landing_review_board .wrap_content.upper_zone .table_program table tr.upper_line{box-sizing: border-box; width: 100%; height: 50px;} #pc_landing_review_board .wrap_content.upper_zone .table_program table td{box-sizing: border-box; /*min-width: 87px;*/ width: 11%; height: 50px; padding: 0 10px; border: 1px solid #d7dce5; text-align: center; font-family: 'noto_sans_kr'; font-size: 14px; font-weight: 400; color: #5c667b; line-height: 50px; word-spacing: -1px; letter-spacing: -0.5px;} #pc_landing_review_board .wrap_content.upper_zone .table_program table td:hover, #pc_landing_review_board .wrap_content.upper_zone .table_program table td:focus {color: #fff;} #pc_landing_review_board .wrap_content.upper_zone .table_program table td:hover{cursor: pointer;} /*장시혁 추가*/ #pc_landing_review_board.landingpage_g .wrap_content.upper_zone .table_program table td.selected_anl{color: #fff; background-color: #3267e9;} #pc_landing_review_board.landingpage_j .wrap_content.upper_zone .table_program table td.selected_anl{color: #fff; background-color: #00993a;} /*lower part*/ #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box{box-sizing: border-box; width: 960px; height: 180px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content{box-sizing: border-box; height: 180px; padding-top: 30px; float: left; text-align: center;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.vertical_line{width: 2px; height: 120px; background-color: #fff; float: left; margin-top: 30px;} /*font size and weight*/ #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .font_50{font-size: 50px; word-spacing: -2px; letter-spacing: -2px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .font_45{font-size: 45px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .font_40{font-size: 40px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .font_38{font-size: 38px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .font_22{font-size: 22px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .font_20{font-size: 20px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .font_18{font-size: 18px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .font_16{font-size: 16px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .font_13{font-size: 13px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .font_light{font-weight: 300;} /*common*/ #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .subject{width: 100%; height: 22px; margin-top: 7px; color: #333; line-height: 22px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content.col_1 .subject{margin-top: 12px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .answer{width: 100%; font-weight: 700; color: #202020;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .answer span{margin-left: 3px; color: #333;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .score_mark{width: 165px; height: 30px; margin: 0 auto;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .score_mark .star_mark_detail{width: 30px; height: 30px; float: left;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .wrap_answer{height: 87px; text-align: center; margin-top: 12px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .wrap_answer .line{width: 100%; height: 25px; margin-bottom: 6px; text-align: center;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .wrap_answer .line.line_03{margin-bottom: 0;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box li.col_content .wrap_answer .boder_box{box-sizing: border-box; width: fit-content; height: 25px; display: inline-block; padding: 0 10px; border: 1px solid; border-radius: 12px; text-align: center; line-height: 23px; margin-right: 4px; margin-bottom: 6px;} /*in case, the number of columns is 2 */ #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_2{padding: 0 40px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_2 li.col_content{width: 439px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_2 li.col_content.col_1{padding-right: 19px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_2 li.col_content.col_2{padding-left: 19px;} /*in case, the number of columns is 3 */ #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_3{padding-left: 10px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_3 li.col_content{width: 310px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_3 li.col_content.col_3{width: 316px; padding-left: 10px;} /*전체, */ #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_2.case_ver1 li.col_content.col_1 .answer{height: 50px; line-height: 50px; margin-top: 25px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_2.case_ver1 li.col_content.col_2 .score_mark{margin-top: 2px;} /*발주처 낙찰분석, 통합분석, 솔로몬, 원클릭, COA, AOA*/ #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_3.case_ver2 li.col_content.col_1 .subject{margin-top: 13px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_3.case_ver2 li.col_content.col_2 .subject{margin-top: 9px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_3.case_ver2 li.col_content.col_3 .subject{margin-top: -1px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_3.case_ver2 li.col_content.col_1 .answer{height: 50px; line-height: 50px; margin-top: 22px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_3.case_ver2 li.col_content.col_2 .score_mark{margin-top: 2px;} /*낙찰코칭서비스*/ #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_2.case_ver8 li.col_content.col_2 .subject{margin-top: -1px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_2.case_ver8 li.col_content.col_1 .answer{height: 50px; line-height: 50px; margin-top: 24px;} #pc_landing_review_board .wrap_content.upper_zone .table_program ul.lower_box.col_2.case_ver8 li.col_content.col_2 .score_mark{margin-top: 2px;} /*-----Lower part-----*/ #pc_landing_review_board .wrap_content.lower_zone{margin-top: 30px; font-family: 'noto_sans_kr';} #pc_landing_review_board .wrap_content.lower_zone .inner{width: 100%; margin: 0;} /*---upper---*/ #pc_landing_review_board .wrap_content.lower_zone .inner.upper{height: 30px;} /*search zone / delete below img, and apply this area*/ #pc_landing_review_board .wrap_content.lower_zone .inner.upper .search_zone{/*width: 338px;*/ height: 30px; float: right; margin: 0;/* background: url('../images/community_review/search_zone_pc_bestawards.png') no-repeat center/cover;*/} /*---main contents/ review---*/ #pc_landing_review_board .wrap_content.lower_zone .inner.main_content{margin-top: 15px; position: relative;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review{box-sizing: border-box; width: 960px; height: 151px; margin: 0; padding: 0 30px 0 20px; border-bottom: 1px solid #d7dce5; cursor: pointer;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review:first-child{height: 152px; border-top: 2px solid #d7dce5;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review:last-child{height: 152px; border-bottom: 2px solid #d7dce5;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box{box-sizing: border-box; height: 150px; float: left; position: relative;} /*deco*/ #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_01{width: 55px; margin-right : 30px; font-size: 14px; font-weight: 400; color: #888; line-height: 18px; word-spacing: -1px; letter-spacing: -0.5px; line-height: 152px;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_01 .mark_best{box-sizing: border-box; width: 55px; height: 65px; padding-top: 22px; border-radius: 0 0 27.5px 27.5px; font-size: 16px; font-weight: 700; color: #fff; line-height: 18px; word-spacing: -1px; letter-spacing: -0.5px;} /*content of review*/ #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02{width: 465px; overflow: hidden;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02 .title_review{width: 100%; height: 22px; margin-top: 18px; font-size: 18px; font-weight: 700; color: #202020; line-height: 22px; word-spacing: -2px; letter-spacing: -1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02 .used_program{width: 100%; height: 17px; margin-top: 5px; font-size: 13px; font-weight: 400; color: #202020; line-height: 17px; word-spacing: -1px; letter-spacing: -0.5px;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02 .contents_review{width: 100%; height: 60px; margin-top: 8px; font-size: 14px; font-weight: 400; color: #555; line-height: 21px; word-spacing: -0.5px; letter-spacing: -0.5px; word-break: break-all; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;} /*score mark or bidcoaching mark*/ #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03{width: 180px; padding: 60px 0 0 10px; margin-right: 30px; font-size: 22px; font-weight: 700; color: #333; line-height: 21px; word-spacing: -0.5px; letter-spacing: -0.5px;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03 .score_mark{width: 115px; height: 21px; float: left; margin-right: 4px;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03 .score_mark .star_mark{width: 22px; height: 21px; margin-right: 1px; float: left;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03 .score_mark .star_mark:last-child{margin-right: 0;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03 span{font-size: 14px; font-weight: 400; color: #666;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_03 .logo_bidcoaching{width: 158px; height: 32px; float: left; background: url('../images/community_review/logo_bidcoaching_pc_landing.png') no-repeat center/cover;} /*data*/ #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_04{width: 130px; position: relative;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_04 ul{width: 130px; height: 66px; position: absolute; top: 50%; transform: translateY(-50%);} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_04 ul li{width: 130px; height: 20px; margin-bottom: 3px; font-size: 12px; font-weight: 400; color: #aaa; line-height: 20px; word-spacing: 0; letter-spacing: 0;} #pc_landing_review_board .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_04 ul li:last-child{margin-bottom: 0;} /*---lower---*/ #pc_landing_review_board .wrap_content.lower_zone .inner.lower{box-sizing: border-box; height: 165px; margin: 0; position: relative} #pc_landing_review_board .wrap_content.lower_zone .inner.lower .btn_bottom{height: 40px; position: absolute; top: 15px; cursor: pointer; transition: all 0.1s;} #pc_landing_review_board .wrap_content.lower_zone .inner.lower .btn_bottom.btn_01{width: 180px; position: absolute; right: 124px;} #pc_landing_review_board .wrap_content.lower_zone .inner.lower .btn_bottom.btn_02{width: 120px; position: absolute; right: 0;} /*delete below img, and apply this area*/ /*페이징 사진 삭제*/ /*#pc_landing_review_board .wrap_content.lower_zone .inner.lower .pagination_zone{width: fit-content; min-width: 376px; height: 30px; position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); background: url('../images/community_review/pagination_zone_pc_bestawards.png') no-repeat center/cover;}*/ #pc_landing_review_board .wrap_content.lower_zone .inner.lower .pagination_zone{width: 100%; height: 100px; position: absolute; top: 40px; left: 50%; transform: translateX(-50%); } /*---Gunsul-Net---*/ /*-upper zone-*/ #pc_landing_review_board.landingpage_g .wrap_content.upper_zone .title_page span.point_color{color: #1449c9;} #pc_landing_review_board.landingpage_g .wrap_content.upper_zone .table_program ul.lower_box{background-color: #f1f5ff;} #pc_landing_review_board.landingpage_g .wrap_content.upper_zone .table_program table td:hover, #pc_landing_review_board.landingpage_g .wrap_content.upper_zone .table_program table td:focus {background-color: #3267e9;} #pc_landing_review_board.landingpage_g .wrap_content.upper_zone .table_program ul.lower_box li.col_content .wrap_answer .boder_box{border-color: #3267e9; color: #3267e9;} /*-lower zone*/ #pc_landing_review_board.landingpage_g .wrap_content.lower_zone .inner.main_content .review:hover{background-color: #f7f9ff;} #pc_landing_review_board.landingpage_g .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_01 .mark_best{background-color: #329ee9;} #pc_landing_review_board.landingpage_g .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02 .used_program{color: #3267e9;} #pc_landing_review_board.landingpage_g .wrap_content.lower_zone .inner.lower .btn_bottom.btn_01{background: url('../images/community_review/btn_pc_landing_reviewboard_lower01_off_g.png') no-repeat center/cover;} #pc_landing_review_board.landingpage_g .wrap_content.lower_zone .inner.lower .btn_bottom.btn_01:hover, #pc_landing_review_board.landingpage_g .wrap_content.lower_zone .inner.lower .btn_bottom.btn_01:focus {background: url('../images/community_review/btn_pc_landing_reviewboard_lower01_on_g.png') no-repeat center/cover;} #pc_landing_review_board.landingpage_g .wrap_content.lower_zone .inner.lower .btn_bottom.btn_02{background: url('../images/community_review/btn_pc_landing_reviewboard_lower02_off_g.png') no-repeat center/cover;} #pc_landing_review_board.landingpage_g .wrap_content.lower_zone .inner.lower .btn_bottom.btn_02:hover, #pc_landing_review_board.landingpage_g .wrap_content.lower_zone .inner.lower .btn_bottom.btn_02:focus {background: url('../images/community_review/btn_pc_landing_reviewboard_lower02_on_g.png') no-repeat center/cover;} /*---Jungi-Net---*/ /*-upper zone-*/ #pc_landing_review_board.landingpage_j .wrap_content.upper_zone .title_page span.point_color{color: #00772f;} #pc_landing_review_board.landingpage_j .wrap_content.upper_zone .table_program ul.lower_box{background-color: #f4faf4;} #pc_landing_review_board.landingpage_j .wrap_content.upper_zone .table_program table td:hover, #pc_landing_review_board.landingpage_j .wrap_content.upper_zone .table_program table td:focus {background-color: #00993a;} #pc_landing_review_board.landingpage_j .wrap_content.upper_zone .table_program ul.lower_box li.col_content .wrap_answer .boder_box{border-color: #00993a; color: #00993a;} /*-lower zone*/ #pc_landing_review_board.landingpage_j .wrap_content.lower_zone .inner.main_content .review:hover{background-color: #f4faf4;} #pc_landing_review_board.landingpage_j .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_01 .mark_best{background-color: #06bf00;} #pc_landing_review_board.landingpage_j .wrap_content.lower_zone .inner.main_content .review .inner_box.inner_box_02 .used_program{color: #00772f;} #pc_landing_review_board.landingpage_j .wrap_content.lower_zone .inner.lower .btn_bottom.btn_01{background: url('../images/community_review/btn_pc_landing_reviewboard_lower01_off_j.png') no-repeat center/cover;} #pc_landing_review_board.landingpage_j .wrap_content.lower_zone .inner.lower .btn_bottom.btn_01:hover, #pc_landing_review_board.landingpage_j .wrap_content.lower_zone .inner.lower .btn_bottom.btn_01:focus {background: url('../images/community_review/btn_pc_landing_reviewboard_lower01_on_j.png') no-repeat center/cover;} #pc_landing_review_board.landingpage_j .wrap_content.lower_zone .inner.lower .btn_bottom.btn_02{background: url('../images/community_review/btn_pc_landing_reviewboard_lower02_off_j.png') no-repeat center/cover;} #pc_landing_review_board.landingpage_j .wrap_content.lower_zone .inner.lower .btn_bottom.btn_02:hover, #pc_landing_review_board.landingpage_j .wrap_content.lower_zone .inner.lower .btn_bottom.btn_02:focus {background: url('../images/community_review/btn_pc_landing_reviewboard_lower02_on_j.png') no-repeat center/cover;} /*----------First ranking congratulation----------*/ #pc_landing_firstranking{clear: both; width: 100%; min-width: 1200px; height: 1289px; margin: 0; text-align: center;} #pc_landing_firstranking .wrap{width: 100%; min-width: 1200px; text-align: center; overflow: hidden;} #pc_landing_firstranking .wrap .inner_1200{width: 1200px; margin: 0 auto; position: relative;} #pc_landing_firstranking .wrap .inner_1920{width: 1920px; margin: 0 auto; position: relative;} /*-----Header-----*/ #pc_landing_firstranking .wrap.header{height: 70px; background-color: #fff;} #pc_landing_firstranking .wrap.header .inner_1200{height: 70px;} #pc_landing_firstranking .wrap.header .inner_1200 .logo_box{width: 120px; height: 70px; float: left; cursor: pointer;} /*-----Upper part-----*/ #pc_landing_firstranking .wrap.upper_part{height: 480px; background-color: #001034;} #pc_landing_firstranking .wrap.upper_part .inner_1920{height: 480px;} /*table*/ #pc_landing_firstranking .wrap.upper_part .inner_1920 table{width: 610px; height: 82px; position: absolute; top: 338px; left: 405px; border-collapse: collapse; border: none;} #pc_landing_firstranking .wrap.upper_part .inner_1920 table tr{width: 610px; height: 40px; padding: 0;} #pc_landing_firstranking .wrap.upper_part .inner_1920 table tr td{height: 40px; padding: 0; font-family: 'noto_sans_kr'; font-size: 18px; line-height: 40px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #pc_landing_firstranking .wrap.upper_part .inner_1920 table tr.first_line{font-weight:700; color: #001035;} #pc_landing_firstranking .wrap.upper_part .inner_1920 table tr.second_line td{width: 305px; font-weight: 400;} #pc_landing_firstranking .wrap.upper_part .inner_1920 table tr.second_line td.ranker_name{color: #b4e9ff;} #pc_landing_firstranking .wrap.upper_part .inner_1920 table tr.second_line td.price{font-size: 20px; color: #fff36d;} #pc_landing_firstranking .wrap.upper_part .inner_1920 table tr.second_line td.price span.won{font-size: 18px; color: #fff;} /*-----Lower part-----*/ #pc_landing_firstranking .wrap.lower_part{height: 739px; background-color: #f3f3f3;} #pc_landing_firstranking .wrap.lower_part .inner_1200{height: 739px;} /*left part*/ #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_left{width: 610px; height: 659px; position: absolute; top: 30px; left: 45px;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_left .banner_lower{width: 610px; float: left;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_left .banner_lower.banner_01{height: 291px; background: url('../images/community_review/banner01_pc_landing_first-ranking_lower.png') no-repeat center/cover;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_left .banner_lower.banner_01_v2{height: 291px; background: url('../images/community_review/banner01_pc_landing_first-ranking_lower_v2.png') no-repeat center/cover;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_left .banner_lower.banner_02{height: 368px;} /*right part */ #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right{width: 515px; height: 659px; position: absolute; top: 30px; right: 0; background: url('../images/community_review/bg_pc_landing_first-ranking_lower_right.png') no-repeat center/cover;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right .text_box_long{width: 350px; height: 40px; position: absolute; right: 30px; padding: 0 10px; border: none; outline: none; background: transparent; text-align: left; font-family: 'noto_sans_kr'; font-size: 15px; font-weight: 400; color: #202020; line-height: 40px; word-spacing: -1px; letter-spacing: -1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} /*project name*/ #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right .text_box_long.project_name{position: absolute; top: 109px;} /*title of review*/ #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right [type="text"].text_box_long.title_review{position: absolute; top: 157px;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right [type="text"]::placeholder{color: #b8b8b8;} /*---select bar---*/ #pc_landing_firstranking .wrap.lower_part .inner_1200 .selection{box-sizing: border-box; height: 40px; position: absolute; top: 205px; margin: 0; padding: 0 20px; border: 1px solid #aab6cb; outline: none; text-align: left; font-family: 'noto_sans_kr'; font-size: 15px; font-weight: 400; color: #333; line-height: 40px; word-spacing: -1px; letter-spacing: -1px;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .selection:hover{border-color: #8491a7; background-color: #f1f5ff;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .selection:focus{border-color: #8491a7; color: #202020;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .selection.select_program{width: 215px; position: absolute; left: 30px;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .selection.select_score{width: 230px; position: absolute; right: 30px;} /*icon select*/ #pc_landing_firstranking .wrap.lower_part .inner_1200 .selection .icon_select{width: 14px; height: 9px; background: url('../images/community_review/icon_select.png') no-repeat center/cover; float: right; margin-top: 14px;} /*score mark*/ #pc_landing_firstranking .wrap.lower_part .inner_1200 .wrap_score{width:118px; height: 21px; margin: 8px 5px 0 0; float: left;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .wrap_score .star_mark{width: 22px; height: 21px; float: left; margin-right: 2px;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .wrap_score .star_mark:last-child{margin-right: 0;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .wrap_score .star_mark.full_star{background: url('../images/community_review/star_full.png') no-repeat center/100%;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .wrap_score .star_mark.half_star{background: url('../images/community_review/star_half.png') no-repeat center/100%;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .wrap_score .star_mark.empty_star{background: url('../images/community_review/star_empty.png') no-repeat center/100%;} /*list of selection*/ #pc_landing_firstranking .wrap.lower_part .inner_1200 .list_selection{display: none; box-sizing: border-box; height:fit-content; position: absolute; top: 244px; margin: 0; background: #fff; border: 1px solid #aab6cb; border-top: none; outline: none; text-align: left; font-family: 'noto_sans_kr'; font-size: 15px; font-weight: 400; color: #333; line-height: 40px; word-spacing: -1px; letter-spacing: -1px; z-index: 5;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .list_selection.list_program{width: 215px; position: absolute; left: 30px;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .list_selection.list_score{width: 230px; position: absolute; right: 30px;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .list_selection li{height: 40px; padding: 0 20px; cursor: pointer;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .list_selection.list_program li{width: 215px;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .list_selection.list_score li{width: 230px;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .list_selection li:hover{background-color: #f1f5ff;} /*contents of review*/ #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right textarea.contents_review{box-sizing: border-box; width: 455px; height: 284px; position: absolute; top: 260px; right: 30px; padding: 20px; border: none; outline: none; background: transparent; text-align: left; font-family: 'noto_sans_kr'; font-size: 16px; font-weight: 400; color: #333; line-height: 25px; word-spacing: -1px; letter-spacing: -1px; word-break: break-all; overflow-y: scroll; overflow-x: hidden;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right textarea.contents_review::placeholder{color: #b8b8b8;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right textarea.contents_review::-webkit-scrollbar {display: block;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right textarea.contents_review::-webkit-scrollbar-track, ::-webkit-scrollbar-button {display: none;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right textarea.contents_review::-webkit-scrollbar-thumb {background-color: #d7dce5;} /*submit button*/ #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right .btn_submit{width: 515px; height: 85px; position: absolute; bottom: 0; background: url('../images/community_review/btn_pc_landing_first-ranking_lower_off.png') no-repeat center/cover; cursor: pointer; transition: all 0.2s;} #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right .btn_submit:hover, #pc_landing_firstranking .wrap.lower_part .inner_1200 .box_right .btn_submit:focus{background: url('../images/community_review/btn_pc_landing_first-ranking_lower_on.png') no-repeat center/cover;} /*---Gunsul-Net---*/ /*Header_logo*/ #pc_landing_firstranking.landingpage_g .wrap.header .inner_1200 .logo_box{background: url('../images/community_review/logo_pc_landing_first-ranking_header_g.png') no-repeat center/cover;} /*Upper part_Background*/ #pc_landing_firstranking.landingpage_g .wrap.upper_part .inner_1920{background: url('../images/community_review/bg_pc_landing_first-ranking_upper_g.png') no-repeat center/cover;} /*Lower part_banner02*/ #pc_landing_firstranking.landingpage_g .wrap.lower_part .inner_1200 .box_left .banner_lower.banner_02{background: url('../images/community_review/banner02_pc_landing_first-ranking_lower_g.png') no-repeat center/cover;} /*---Jungi-Net---*/ /*Header_logo*/ #pc_landing_firstranking.landingpage_j .wrap.header .inner_1200 .logo_box{background: url('../images/community_review/logo_pc_landing_first-ranking_header_j.png') no-repeat center/cover;} /*Upper part_Background*/ #pc_landing_firstranking.landingpage_j .wrap.upper_part .inner_1920{background: url('../images/community_review/bg_pc_landing_first-ranking_upper_j.png') no-repeat center/cover;} /*Lower part_banner02*/ #pc_landing_firstranking.landingpage_j .wrap.lower_part .inner_1200 .box_left .banner_lower.banner_02{background: url('../images/community_review/banner02_pc_landing_first-ranking_lower_j.png') no-repeat center/cover;} /*-----+ popup layer / submitted! -----*/ #pc_landing_firstranking .wrap.wrap_layer{height: 1289px; position: fixed; top: 0; left: 0; background: rgba(0,0,0,0.5); z-index: 10;} #pc_landing_firstranking .wrap.wrap_layer{display: none;}/*if you want to check the popup-layer, delete this line*/ #pc_landing_firstranking .wrap.wrap_layer .inner_1200{height: 1289px;} #pc_landing_firstranking .wrap.wrap_layer .inner_1200 .area_layer{width: 1155px; height: 659px; position: absolute; top: 580px; left: 45px; background: url('../images/community_review/bg_pc_landing_first-ranking_popuplayer.png') no-repeat center/cover;} #pc_landing_firstranking .wrap.wrap_layer .inner_1200 .area_layer.v2{width: 1155px; height: 659px; position: absolute; top: 580px; left: 45px; background: url('../images/community_review/bg_pc_landing_first-ranking_popuplayer_v2.png') no-repeat center/cover;} /*bottom button*/ #pc_landing_firstranking .wrap.wrap_layer .inner_1200 .area_layer .btn_layer{width: 423px; height: 65px; position: absolute; top: 455px; cursor: pointer; transition: all 0.2s;} #pc_landing_firstranking .wrap.wrap_layer .inner_1200 .area_layer .btn_layer.btn_lt{position: absolute; left: 135px; background: url('../images/community_review/btn_pc_landing_first-ranking_popup_lt_off.png') no-repeat center/cover;} #pc_landing_firstranking .wrap.wrap_layer .inner_1200 .area_layer .btn_layer.btn_rt{position: absolute; right:135px; background: url('../images/community_review/btn_pc_landing_first-ranking_popup_rt_off.png') no-repeat center/cover;} #pc_landing_firstranking .wrap.wrap_layer .inner_1200 .area_layer .btn_layer.btn_lt:hover, #pc_landing_firstranking .wrap.wrap_layer .inner_1200 .area_layer .btn_layer.btn_lt:focus{background: url('../images/community_review/btn_pc_landing_first-ranking_popup_lt_on.png') no-repeat center/cover;} #pc_landing_firstranking .wrap.wrap_layer .inner_1200 .area_layer .btn_layer.btn_rt:hover, #pc_landing_firstranking .wrap.wrap_layer .inner_1200 .area_layer .btn_layer.btn_rt:focus{background: url('../images/community_review/btn_pc_landing_first-ranking_popup_rt_on.png') no-repeat center/cover;} /*---------------Portion---------------*/ /*----------Reaction area / review detail page----------*/ #pc_reaction_area{width: 960px; height: 115px; margin-top: 40px; margin-bottom: 50px;} #pc_reaction_area ul{width: 604px; height: 115px; position: relative; margin: 0 auto;} #pc_reaction_area ul li{box-sizing: border-box; width: 120px; height: 115px; float: left; cursor: pointer;} #pc_reaction_area ul li.reaction_box .box_icon{width: 120px; height: 55px; margin-top: 10px;} #pc_reaction_area ul li.reaction_box .reaction_text{width: 120px; text-align: center; font-family: 'noto_sans_kr'; font-weight: 500; word-spacing: -1px; letter-spacing: -1px;} #pc_reaction_area ul li.reaction_box .reaction_text.phrase{height: 21px; margin-top: 4px; font-size: 15px; color: #333; line-height: 21px;} #pc_reaction_area ul li.reaction_box .reaction_text.count_reaction{height: 22px; margin: 0; font-size: 20px; color: #8491a7; line-height: 22px;} #pc_reaction_area ul .vertical_line{width: 1px; height: 115px; float: left; background-color: #d7dce5;} /*---Gunsul-Net---*/ #pc_reaction_area.content_g ul li.reaction_box .box_icon.box_icon_01{background: url('../images/community_review/reaction_icon01_g.png') no-repeat center/cover;} #pc_reaction_area.content_g ul li.reaction_box .box_icon.box_icon_02{background: url('../images/community_review/reaction_icon02_g.png') no-repeat center/cover;} #pc_reaction_area.content_g ul li.reaction_box .box_icon.box_icon_03{background: url('../images/community_review/reaction_icon03_g.png') no-repeat center/cover;} #pc_reaction_area.content_g ul li.reaction_box .box_icon.box_icon_04{background: url('../images/community_review/reaction_icon04_g.png') no-repeat center/cover;} #pc_reaction_area.content_g ul li.reaction_box .box_icon.box_icon_05{background: url('../images/community_review/reaction_icon05_g.png') no-repeat center/cover;} #pc_reaction_area.content_g ul li.reaction_box .reaction_text.count_reaction.count_on{color: #3267e9;} /*---Jungi-Net---*/ #pc_reaction_area.content_j ul li.reaction_box .box_icon.box_icon_01{background: url('../images/community_review/reaction_icon01_j.png') no-repeat center/cover;} #pc_reaction_area.content_j ul li.reaction_box .box_icon.box_icon_02{background: url('../images/community_review/reaction_icon02_j.png') no-repeat center/cover;} #pc_reaction_area.content_j ul li.reaction_box .box_icon.box_icon_03{background: url('../images/community_review/reaction_icon03_j.png') no-repeat center/cover;} #pc_reaction_area.content_j ul li.reaction_box .box_icon.box_icon_04{background: url('../images/community_review/reaction_icon04_j.png') no-repeat center/cover;} #pc_reaction_area.content_j ul li.reaction_box .box_icon.box_icon_05{background: url('../images/community_review/reaction_icon05_j.png') no-repeat center/cover;} #pc_reaction_area.content_j ul li.reaction_box .reaction_text.count_reaction.count_on{color: #00993a;} /*------------------------------APP------------------------------*/ /*---------------Layer---------------*/ /*----------Best awards / Before selection of a gift----------*/ #app_layer_bestawards{clear: both; width: 656px; height: 879px; margin: 0;} #app_layer_bestawards .content{width: 656px; height: 879px; position: relative;} #app_layer_bestawards .content .select_wrap{width: 556px; height: 103px; position: absolute; top: 666px; left: 50px;} /*middle select area*/ #app_layer_bestawards .content .select_wrap .select_box{width: 180px; height: 103px; float: left; margin-right: 8px; border: none;} #app_layer_bestawards .content .select_wrap .select_box.select_03{margin-right: 0px;} #app_layer_bestawards .content .select_wrap .select_box label{width: 178px; height: 101px; position: absolute; cursor: pointer; transition: all 0.2s;} #app_layer_bestawards .content .select_wrap .select_box label:hover, #app_layer_bestawards .content .select_wrap .select_box label:focus{border: 1px solid #ffc730;;} #app_layer_bestawards .content .select_wrap .select_box [type="radio"]{appearance: none;} /*bottom Button*/ #app_layer_bestawards .content .btn_bottom{width: 656px; height: 80px; position: absolute; bottom: 0; left: 0; background: url('../images/community_review/btn_app_layer_bestawards_off.png') no-repeat center/cover; cursor: pointer; transition: all 0.2s;} #app_layer_bestawards .content .btn_bottom:hover, #app_layer_bestawards .content .btn_bottom:focus{background: url('../images/community_review/btn_app_layer_bestawards_on.png') no-repeat center/cover;} /*Background*/ #app_layer_bestawards .content.content_g{background: url('../images/community_review/bg_app_layer_bestawards_g.png') no-repeat center/cover;}/*---Gunsul-Net---*/ #app_layer_bestawards .content.content_j{background: url('../images/community_review/bg_app_layer_bestawards_j.png') no-repeat center/cover;}/*---Jungi-Net---*/ /*---------------Landing page---------------*/ /*----------01 / First ranking congratulation----------*/ #app_landing01{clear: both; width: 100vw; height: 100vh; min-height: 212.43vw; margin: 0; position: relative;} /*---Middle contents---*/ #app_landing01 .contents_wrap{width: 86.11vw; height: 18.75vw; position: absolute; top: 62.43vw; left: 6.94vw; text-align: center;} /*ranker-name*/ #app_landing01 .contents_wrap .ranker_name{width: 100%; height: 4.16vw; margin: 0; text-align: center; font-family: 'noto_sans_kr'; font-size: 3.47vw; font-weight: 700; color: #202020; line-height: 4.16vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} #app_landing01 .contents_wrap .ranker_name span.thinner{font-family: 'noto_sans_kr'; font-weight: 500;} /*project-name*/ #app_landing01 .contents_wrap .inner_wrap{width: 100%; height: 3.47vw; margin-top: 2.43vw; text-align: center; font-family: 'noto_sans_kr'; color: #333; font-weight: 400; word-spacing: -0.06vw; letter-spacing: -0.06vw;} #app_landing01 .contents_wrap .inner_wrap .border_box{display: inline-block; width: 10.42vw; height: 3.33vw; margin: 0; border: 0.06vw solid #333; border-radius: 0.2vw; text-align: center; font-size: 2.43vw; line-height: 3.33vw;} #app_landing01 .contents_wrap .inner_wrap .project_name{display: inline-block; width: fit-content; max-width: 81.25vw; height: 3.47vw; margin-left: 0.5vw; text-align: left; font-size: 3.125vw; line-height: 3.47vw;} /*price*/ #app_landing01 .contents_wrap .price{width: 100%; height: 6.25vw; margin-top: 2.43vw; text-align: center; font-family: 'GongGothicMedium'; font-size: 5.56vw; font-weight: 700; color: #3267e9; line-height: 6.25vw; word-spacing: -0.03vw; letter-spacing: -0.03vw;} #app_landing01 .contents_wrap .price span.won{width: fit-content; margin-left: 0.5vw; text-align: left; font-family: 'GongGothicMedium'; font-size: 3.125vw; color: #333;} /*bottom Button*/ #app_landing01 .btn_bottom{width: 86.11vw; height: 13.89vw; position: absolute; bottom: 10.42vw; left: 6.94vw; background: url('../images/community_review/btn_app_landing01_off.png') no-repeat center/cover; cursor: pointer; transition: all 0.2s;} #app_landing01 .btn_bottom:hover, #app_landing01 .btn_bottom:focus{background: url('../images/community_review/btn_app_landing01_on.png') no-repeat center/cover;} /*---Gunsul-Net---*/ /*Background*/ #app_landing01.landingpage_g{background: url('../images/community_review/bg_app_landing01_g.png') no-repeat center/cover;} /*---Jungi-Net---*/ /*Background*/ #app_landing01.landingpage_j{background: url('../images/community_review/bg_app_landing01_j.png') no-repeat center/cover;} /*----------02 / Write a review----------*/ #app_landing02{clear: both; width: 100vw; height: 100vh; min-height: 212.43vw; position: relative; background: url('../images/community_review/bg_app_landing02.png') no-repeat center/cover; margin: 0;} #app_landing02 .text_box_long{box-sizing: border-box; width: 86.11vw; height: 11.11vw; position: absolute; left: 6.94vw; background-color: #fff; padding: 0 4.17vw; border: 0.06vw solid #aab6cb; outline: none; text-align: left; font-family: 'noto_sans_kr'; font-size: 3.33vw; font-weight: 400; color: #202020; line-height: 11.11vw; word-spacing: -0.06vw; letter-spacing: -0.06vw; overflow: hidden;} /*project name*/ #app_landing02 .text_box_long.project_name{position: absolute; top: 54.58vw;} /*title of review*/ #app_landing02 [type="text"].text_box_long.title_review{position: absolute; top: 69.17vw} #app_landing02 [type="text"]::placeholder{color: #b8b8b8;} /*---select bar---*/ #app_landing02 .selection{box-sizing: border-box; height: 11.11vw; position: absolute; top: 83.75vw; background-color: #fff; margin: 0; padding: 0 4.17vw; border: 0.06vw solid #aab6cb; outline: none; text-align: left; font-family: 'noto_sans_kr'; font-size: 3.33vw; font-weight: 400; color: #333; line-height: 11.11vw; word-spacing: -0.06vw; letter-spacing: -0.06vw;} #app_landing02 .selection:hover{border-color: #8491a7; background-color: #f1f5ff;} #app_landing02 .selection:focus{border-color: #8491a7; color: #202020;} #app_landing02 .selection.select_program{width: 43.75vw; position: absolute; left: 6.94vw;} #app_landing02 .selection.select_score{width: 38.89vw; position: absolute; right: 6.94vw;} /*icon select*/ #app_landing02 .selection .icon_select{width: 2.78vw; height: 1.81vw; background: url('../images/community_review/icon_select_app.png') no-repeat center/cover; float: right; margin-top: 4.65vw;} /*score mark*/ #app_landing02 .wrap_score{width:23.7vw; height: 4.03vw; margin: 3.26vw 0 0 0; float: left;} #app_landing02 .wrap_score .star_mark{width: 4.24vw; height: 4.03vw; float: left; margin-right: 0.625vw;} #app_landing02 .wrap_score .star_mark:last-child{margin-right: 0vw;} #app_landing02 .wrap_score .star_mark.full_star{background: url('../images/community_review/star_full.png') no-repeat center/100%;} #app_landing02 .wrap_score .star_mark.half_star{background: url('../images/community_review/star_half.png') no-repeat center/100%;} #app_landing02 .wrap_score .star_mark.empty_star{background: url('../images/community_review/star_empty.png') no-repeat center/100%;} /*list of selection*/ #app_landing02 .list_selection{display: none;}/*if you want to check the popup-layer, delete this line*/ #app_landing02 .list_selection{box-sizing: border-box; height:fit-content; position: absolute; top: 94.79vw; margin: 0; background: #fff; border: 0.06vw solid #aab6cb; border-top: none; outline: none; text-align: left; font-family: 'noto_sans_kr'; font-size: 3.33vw; font-weight: 400; color: #333; line-height: 11.11vw; word-spacing: -0.06vw; letter-spacing: -0.06vw; z-index: 5;} #app_landing02 .list_selection.list_program{width: 43.75vw; position: absolute; left: 6.94vw;} #app_landing02 .list_selection.list_score{width: 38.89vw; position: absolute; right: 6.94vw;} #app_landing02 .list_selection li{height: 11.11vw; padding: 0 4.17vw; cursor: pointer;} #app_landing02 .list_selection.list_program li{width: 43.75vw;} #app_landing02 .list_selection.list_score li{width: 38.89vw;} #app_landing02 .list_selection li:hover{background-color: #f1f5ff;} /*contents of review*/ #app_landing02 textarea.contents_review{box-sizing: border-box; width: 86.11vw; height: 76.39vw; position: absolute; top: 98.33vw; left: 6.94vw; background-color: #fff; padding: 4.17vw; border: 0.06vw solid #aab6cb; outline: none; text-align: left; font-family: 'noto_sans_kr'; font-size: 3.33vw; font-weight: 400; color: #333; line-height: 5.56vw; word-spacing: -0.06vw; letter-spacing: -0.06vw; word-break: break-all; overflow-y: scroll; overflow-x: hidden;} #app_landing02 textarea.contents_review::-webkit-scrollbar {display: block;} #app_landing02 textarea.contents_review::-webkit-scrollbar-track, ::-webkit-scrollbar-button {display: none;} #app_landing02 textarea.contents_review::-webkit-scrollbar-thumb {background-color: #d7dce5;} /*bottom Button*/ #app_landing02 .btn_bottom{width: 86.11vw; height: 13.89vw; position: absolute; bottom: 10.42vw; left: 6.94vw; background: url('../images/community_review/btn_app_landing02_off.png') no-repeat center/cover; cursor: pointer; transition: all 0.2s;} #app_landing02 .btn_bottom:hover, #app_landing02.btn_bottom:focus{background: url('../images/community_review/btn_app_landing02_on.png') no-repeat center/cover;} /*----------03 / Submission of review----------*/ #app_landing03{clear: both; width: 100vw; height: 100vh; min-height: 212.43vw; margin: 0; position: relative;} /*---Middle contents---*/ #app_landing03 .contents_wrap{width: 86.11vw; height: 20.35vw; position: absolute; top: 103.125vw; left: 6.94vw; text-align: center;} /*ranker-name*/ #app_landing03 .contents_wrap .reviewer_name{width: 100%; height: 5.56vw; margin: 0; text-align: center; font-family: 'noto_sans_kr'; font-size: 4.58vw; font-weight: 700; color: #202020; line-height: 5.56vw;} #app_landing03 .contents_wrap .reviewer_name span.thinner{font-family: 'noto_sans_kr'; font-weight: 500;} /*project-name*/ #app_landing03 .contents_wrap .inner_wrap{width: 100%; height: 4.03vw; margin-top: 2.08vw; text-align: center; font-family: 'noto_sans_kr'; color: #333; font-weight: 400; word-spacing: -0.15vw; letter-spacing: -0.06vw;} #app_landing03 .contents_wrap .inner_wrap .border_box{display: inline-block; width: 10.42vw; height: 3.91vw; position: relative; top: -1vw; margin: 0; border: 0.06vw solid #333; border-radius: 0.2vw; text-align: center; font-size: 2.43vw;line-height: 3.91vw;} #app_landing03 .contents_wrap .inner_wrap .project_name{display: inline-block; width: fit-content; max-width: 67.36vw; height: 4.03vw; margin: 0 0 0 1vw; text-align: left; font-size: 3.82vw; line-height: 4.03vw; overflow: hidden;} /*price*/ #app_landing03 .contents_wrap .price{width: 100%; height: 6.6vw; margin-top: 2.08vw;; text-align: center; font-family: 'GongGothicMedium'; font-size: 6.6vw; font-weight: 700; color: #3267e9; line-height: 6.6vw; word-spacing: -0.03vw; letter-spacing: -0.03vw;} #app_landing03 .contents_wrap .price span.won{width: fit-content; margin-left: 0.56vw; text-align: left; font-family: 'GongGothicMedium'; font-size: 3.82vw; color: #333;} /*---Gunsul-Net---*/ /*Background*/ #app_landing03.landingpage_g{background: url('../images/community_review/bg_app_landing03_g.png') no-repeat center/cover;} /*---Jungi-Net---*/ /*Background*/ #app_landing03.landingpage_j{background: url('../images/community_review/bg_app_landing03_j.png') no-repeat center/cover;} /*----------04 / First ranking congratulation----------*/ #app_landing04{clear: both; width: 100vw; height: 100vh; min-height: 212.43vw; margin: 0; position: relative;} /*---Middle contents---*/ #app_landing04 .contents_wrap{width: 86.11vw; height: 18.75vw; position: absolute; top: 176.67vw; left: 6.94vw; text-align: center;} /*ranker-name*/ #app_landing04 .contents_wrap .ranker_name{width: 100%; height: 4.16vw; margin: 0; text-align: center; font-family: 'noto_sans_kr'; font-size: 3.47vw; font-weight: 700; color: #202020; line-height: 4.16vw;} #app_landing04 .contents_wrap .ranker_name span.thinner{font-family: 'noto_sans_kr'; font-weight: 500;} /*project-name*/ #app_landing04 .contents_wrap .inner_wrap{width: 100%; height: 3.47vw; margin-top: 2.43vw; text-align: center; font-family: 'noto_sans_kr'; color: #333; font-weight: 400; word-spacing: -0.06vw; letter-spacing: -0.06vw;} #app_landing04 .contents_wrap .inner_wrap .border_box{display: inline-block; width: 10.42vw; height: 3.33vw; margin: 0; border: 0.06vw solid #333; border-radius: 0.2vw; text-align: center; font-size: 2.43vw; line-height: 3.33vw;} #app_landing04 .contents_wrap .inner_wrap .project_name{display: inline-block; width: fit-content; max-width: 81.25vw; height: 3.47vw; margin-left: 0.5vw; text-align: left; font-size: 3.125vw; line-height: 3.47vw;} /*price*/ #app_landing04 .contents_wrap .price{width: 100%; height: 6.25vw; margin-top: 2.43vw; text-align: center; font-family: 'GongGothicMedium'; font-size: 5.56vw; font-weight: 700; color: #3267e9; line-height: 6.25vw; word-spacing: -0.03vw; letter-spacing: -0.03vw;} #app_landing04 .contents_wrap .price span.won{width: fit-content; margin-left: 0.5vw; text-align: left; font-family: 'GongGothicMedium'; font-size: 3.125vw; color: #333;} /*---Gunsul-Net---*/ /*Background*/ #app_landing04.landingpage_g{background: url('../images/community_review/bg_app_landing04_g.png') no-repeat center/cover;} /*---Jungi-Net---*/ /*Background*/ #app_landing04.landingpage_j{background: url('../images/community_review/bg_app_landing04_j.png') no-repeat center/cover;} .swiper-container { margin: 0 auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1 } .swiper-wrapper{ position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; box-sizing: content-box } .middle_zone .swiper-pagination-bullets { z-index: 1; width: 100px; height: 12px; position: absolute; top: 158px; right: 25px; display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 3px; } .landingpage_g .swiper-pagination-bullet { width: 12px; height: 12px; background: #3267e9; opacity: 0.2; cursor: pointer;} .landingpage_j .swiper-pagination-bullet { width: 12px; height: 12px; background: #00993a; opacity: 0.2; cursor: pointer;} .landingpage_g .swiper-pagination-bullet-active { opacity: 0.5; } .landingpage_j .swiper-pagination-bullet-active { opacity: 0.5; } /**/