/* ////////// 240304 new ver /////////// */

/* 가격정보 */
/* .lowestprice_mall { border-radius: 1rem; padding: 1rem 1.4rem; background-color: var(--rebgcolor); } */
.lowestprice_mall { border-radius: 1rem; padding: 1rem 1.4rem; background-color: #fff; box-shadow: 5px 5px 3px #666;
        border-top: 0.1rem solid rgba(200, 200, 200, 0.1); border-left: 0.1rem solid rgba(200, 200, 200, 0.1); }
.lowest_mall_price { width: 100%; }
.lowestmall_name { width: 55%; }
.lowestprice_mall .common_img { vertical-align: middle;}
.lowestprice_mall .mall_icon { width:50%; line-height:4.8rem;}
/* .lowestprice .mallname { font-size: 3rem; line-height: 4.8rem; font-weight: 400; } */
.lowestprice .lowest_mallname { font-size: 1.7rem; line-height: 4.8rem; font-weight: 600; }
.lowestprice .mall_category { width: 100%; gap: 0.3rem; color: #595959; font-size: 1.2rem; font-weight: 600; }
.lowestprice .low_nplay_icon { text-align: center; vertical-align: middle; margin-right:0.2rem; }
.lowestprice img.npay { width: 30%; }
.lowestprice .npay_icon { flex:1; }
/* .lowestprice img.npay { width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } */

/* .mall_lowest_price { width: 45%; text-align: right; font-size: 1.5rem; font-weight: 400; } */
.mall_lowest_price { width: 45%; text-align: right; font-size: 1.5rem; font-weight: 600; }
/* .lowest_pirce { font-size: 2rem; color: #fff; line-height: 4.8rem;
justify-content: right; gap: 0.2rem; } */
.lowprice_danawa { justify-content: space-between; }
.danawa_lowest { margin-right: 1rem; }
.lowest_pirce { font-size: 2.8rem; color: #FC5230; align-items: center; height:100%; justify-content: right; gap: 0.2rem; }
.danawa_lowest_price { font-size: 1.2rem; color: #000;/*#595959;*/ justify-content: right; gap: 0.1rem; }
.current_datetime { font-size: 1rem; color: #000;/*#595959;*/ justify-content: right;
gap: 0.1rem; letter-spacing: -.04rem; }
.lowest_link { justify-content: center; margin-top: 3rem; }
.lowest_btn { background-color: var(--btncolor); color: #fff; padding: 1rem 0;
width: 70%; text-align: center; border-radius: 0.5rem; cursor: pointer; font-weight: 700; }

.realtimeprice { margin-top: 2.4rem; }
.realtime_mall_price_info { flex-wrap: wrap; width: 100%;
        border-radius: .5rem; box-shadow: 5px 5px 3px #666; 
        border-top: 0.1rem solid rgba(200, 200, 200, 0.1);
        border-left: 0.1rem solid rgba(200, 200, 200, 0.1);}
/* .realtime_mall_price_info { background-color: var(--rebgcolor); flex-wrap: wrap; width: 100%; } */
/* .real_info { width: calc(100% - 2.8rem); align-items:center; gap: 1rem; padding: 1rem 1.4rem;
border-bottom: 0.1rem solid #000; } */
.real_info { width: calc(100% - 2.8rem); align-items:center; gap: 1rem; padding: 1rem 1.4rem; 
        border-bottom: 0.1rem solid #ccc; }
/* .ad_mall_info.real_info, .remain_info { background-color: #F6FBFD; border-radius: .5rem; } */
.ad_mall_info.real_info, .remain_info { background-color: #F6FBFD; }
.ad_icon { font-size: .8rem; color: #FF4E2A; border: 0.1rem solid #FF4E2A;
padding: 0.1rem 0.2rem; border-radius: 0.3rem; transform: translate(-1.4rem, -3rem); }
.real_mall_name { width: 70%; font-weight: 600; }
.real_mall_name .category, .real_mall_name .ad_category { font-weight: 600; }
.mall_cate_name { align-items: baseline; color: #595959; gap: 0.5rem; }
.mall_icon { width: 30%; }



/* 상품명 */
/* .lowestprice .prd_name { font-size: 1.6rem; text-overflow: ellipsis; overflow: hidden; display: -webkit-box;
-webkit-line-clamp: 1; -webkit-box-orient: vertical; color:var(--afcolor); font-weight: 300; } */
.lowestprice .lowest_prd_name { font-size: 1.6rem; text-overflow: ellipsis; overflow: hidden; display: -webkit-box;
-webkit-line-clamp: 1; -webkit-box-orient: vertical; color:#000; font-weight: 400; }
/* .realtimeprice .prd_name { font-size: 1.2rem; font-weight: 400; color:var(--afcolor); } */
.realtimeprice .prd_name { font-size: 1.2rem; font-weight: 400; color:#000;/*#000;var(--linecolor)*/ }
/* .real_mall_price { width: 30%; text-align:right; } */
.realtimeprice .prd_name { text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1;
-webkit-box-orient: vertical; }
.realtimeprice .ad_prd_name { font-size: 1.2rem; font-weight: 400; color:#000;/*#000;var(--afcolor);*/ }
.realtimeprice .ad_prd_name { text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1;
-webkit-box-orient: vertical; }


.real_mall_price { width: 30%; text-align:right; }
/* .realtimeprice .prdprice { color: #fff; vertical-align: bottom; font-size: 1.5rem; font-weight: 400; } */
.realtimeprice .prdprice { color: #000; /*#0030FF;*/ vertical-align: bottom; font-size: 1.5rem; font-weight: 500; }
.realtimeprice .npay_icon { gap:0.2rem; justify-content: right;}
.npay_img { width:33%; vertical-align: middle; }
.npay_img .common_img { vertical-align: initial; }
.realtimeprice .npay_icon .max_acc { color: #9E9E9E; font-size: 1.1rem; }
/* .real_info .mallname { font-size:1.7rem; color:#fff; } */
.real_info .mallname, .real_info .ad_mallname { font-size:1.7rem; color:#000; }
/* .prd_charact, .ad_prd_charact { color: #017f67; font-weight: 600; font-size: 1.2rem; } */
.prd_charact, .ad_prd_charact { font-weight: 600; font-size: 1.2rem; color: #FF4E2A;
        /*background-color: #444;*/ border-radius: .3rem; /*padding: 0 .4rem; display:flex;*/ gap:0.2rem; }
.char_v_img img { width: 100%; vertical-align: bottom; }
.char_v_img { display:inline-block; width: 1.4rem; margin-right:.2rem; }
.char_group { margin-right: .4rem; }

.price_info_more { padding: 1rem 0; width: 100%; background-color:#F6FBFD; border-radius: 0.5rem; }
.priceinfo_more { justify-content: center; }
.more_priceinfo { background-color: #F6FBFD; padding: 0.4rem 1.2rem; border-radius: 1rem; gap:.2rem; cursor: pointer;
color:#000; font-weight: 600; }
.arrow_img { padding: 0 0.3rem; border-radius: 1rem; }
.arrow_img i { font-size: 1.2rem; }

.more_mall_info { width:100%; }


/* 사양정보 샘플 */
.sample_img { margin:1rem 0; }

.sample_img3 { margin-top:8rem; }

/* ///////////////////////////////////// */


#container { padding-bottom:0px; height:100%; }
#container { background-color: var(--BGcolor); color:#000; }

#howResult { font-family:Noto Sans KR; /*letter-spacing: -0.8px;*/ background-color: var(--BGcolor); color:#000; }
#howResult { padding-bottom:5rem; }
#howResult.howResult { padding-top:5rem; }

/* head */
#header { z-index:10; width:100%; height:6.2rem; border-bottom:.1rem solid var(--botcolor); }
#header { background-color: var(--BGcolor); color:#000; }  /* 230511  040919 */
#header .header { justify-content: space-between; height:5rem; padding: .6rem 2rem; font-size:2.4rem; }
/* #header .ch_logo { width: 60%; text-align: center; position: relative; } 240206 */
#header .ch_logo { width: 100%; text-align: center; position: relative; }
#header .ch_logo img { height:5rem; }
#header .ch_log_txt { font-size: 1rem; position: absolute; left: 50%; transform: translateX(-50%); top: 3.4rem; color: var(--bfcolor); }
#header #hs_title { padding: 1rem 0 2rem; }
#header .main_left i, #header .restart i { cursor:pointer; }

#header .header.reheader { justify-content:center; }


/* 230615 new ver */

/* 결과 헤더 */
.result__img { width:100%; }
.lastq_link { color: #03A687; }

#container { background-color: var(--BGcolor); }
#container #howResult, #container #howShare_fix, #container #header { background-color: var(--BGcolor); }

#container #header { height:unset; border-bottom: unset; }
#container #header { font-family: Noto Sans KR; /*letter-spacing: -0.8px;*/ color: #000; }
#container #howResult { padding-top:0; }
.result_fixmenu { background-color: var(--BGcolor);}

/* 상단 */
.resulttag_img { width:100%; }
.result_fixmenu { padding: 1rem 1rem 0rem 1rem; }
/* .rp_name { font-size: 3rem; font-weight: bold; } */
/* .rp_name { color: #6FBFE6; font-size: 1.7rem; padding: 1rem 0; } */
.rp_name { color: #03A687; font-size: 1.7rem; padding: 1rem 0; }
.tabmenu a { color:#000; }
/* 제목과 태그 바뀜 */
/* .rp_tag { width:75%; gap:.4rem; } */
/* .rp_cost { width:24%; } */
.rp_tag { gap:.4rem; }

/* .rp_tag_cost { color: #6FBFE6; justify-content: space-between; font-size: 1.7rem;
letter-spacing: 0.05rem; padding: 1rem 0; gap:1%; } */
.rp_tag_cost { justify-content: space-between; font-size: 2.4rem; font-weight: bold;
gap:1%; }
.r_tabmenu { border-top: 0.01rem solid var(--linecolor); 
border-bottom: 0.01rem solid var(--linecolor); }
.r_menu { justify-content: space-around; font-size: 1.4rem; }
.tabmenu { padding: 1rem 0.6rem; }
.tabmenu.select { border-bottom: 0.01rem solid var(--rfcolor); }
.tabmenu a.select { color:var(--rfcolor); }
.fixed .result_fixmenu { z-index: 10;}

.result_tab { padding:1rem; }
.rgroup_part { padding: 0.6rem; padding-bottom: 4rem; border-bottom: 0.1rem solid var(--linecolor); }
.r_group04 .rgroup_part:last-child { border-bottom:0; }
/* .r_group03, .r_group04 { padding-top: 4rem; } */


/* 가격정보 */
.lowcost_mall { margin-bottom: 2rem; }
.r1_title, .r2_title, .r3_title, .r4_title { color: #000; font-size: 1.8rem; margin-bottom: 1rem; font-weight: 700;}
.lowestprice .r1_title { font-size: 2.2rem; }
.r3_title, .r4_title { margin: 1.4rem 0 1rem; }
.lowcost { padding: 1.6rem; border-radius: 1rem; background-color: var(--rebgcolor); }
.mall_name_cost { align-content: center; justify-content: space-between; }
.mall_name { width: 45%; }
.mall_img { width:100%; }
.mall_cost .txt_cost { font-size: 3rem; padding:0; font-weight: bold; padding-bottom: 1rem; }
.mall_txt_info { align-content: center; justify-content: space-between;
color: #95E1D3; font-size: 1.1rem; font-weight: 100; }
.mall_info { padding-left: 4%; font-size: 1.6rem; letter-spacing: 0.05rem; color: var(--rfcolor); }
.site_go { padding-top: 3rem; }
.sitego { background-color: var(--btncolor); padding: 0.6rem; position:relative; 
font-size: 1.5rem; color: white; font-weight: bold; border-radius: 0.8rem; }
.mall_remain .mall_link1, .mall_remain .mall_link2, .mall_link, .rm_mall_link { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
.rm_mall_cost .txt_cost { font-size: 1.5rem; padding:0; font-weight: 500; }
/* .rm_mall_cost .txt_cost { font-size: 1.5rem; padding: 0; font-weight: 200; } */

.remain_mall { gap: 1rem; }
.rm_mall { padding: 1rem; background-color: var(--rebgcolor); width: 33.33%; 
border-radius: 1rem; position: relative;}
.mall_remain .mall_info { color: var(--rfcolor); font-weight: 100; font-size: 1rem; 
letter-spacing: 0.05rem; margin-bottom: 1rem; }

/*ceo*/
.mall_info1 { color: #95E1D3; font-size: 2.2rem; padding-left: 12%; }
.company_info { color: #03A687; cursor:pointer; }
.company_info.low_company { font-size:1.2rem; padding-left: 12%; }
.mall_cost_dix { width:50%; justify-content: flex-end; display: flex; align-items: flex-end; padding-bottom: 0.5rem; }
.mall_cost { flex-direction: column; align-items: flex-end; }
.lowcost .txt_cost1 { font-size: 2.8rem; font-weight: 600; }
.vat { color: #595959; }
.vat.low_company { font-size: 1.5rem; }
.lowcost_mall .r1_title { color:#fff; }


.site_standard { font-size:1.2rem; color: #03A687; padding-left:2rem; cursor:pointer; }
.remain_mall .rm_mall { width:unset; position:relative; }
.remain_mall .rm_mall .mall_info { padding:0; font-size:1.6rem; font-weight: 400; margin-bottom:unset; }
.rm_mall_name { width:52%; }
.rm_mall .company_info { font-size: 1.2rem; }
.rm_mall_img { align-items: center; justify-content: space-between; }
/* .remain_mall .rm_mall .mall_img { width:60%; } */
.rm_mall_cost { width: 48%; flex-direction: column; justify-content: center;
align-items: flex-end; padding-right: 1rem; }
.remain_mall .rm_mall .rm_mall_cost .txt_cost { font-size:2rem; }
.rmmall_img { width:60%; }
.rmmall_name { padding-left:5%; }


.company_info_popup { z-index: 2; background-color: black; width: 70%; padding: 1rem;
top: calc(100% + 1rem ); left: 50%; transform: translateX(-34%); border: 1px solid #eee;
border-radius: 0.5rem; }
.company_info_img1, .company_info_img { width: 40%; }
.c_info_logo { width: 100%; justify-content: space-between; }
.c_info_close i { font-size: 2rem; cursor:pointer; }
.c_info_popup { color: #03A687; font-size: 1.2rem; padding-left:.8rem; }
.c_info_part { padding: 0 0.8rem 0.6rem; }
.c_info_title { font-size: 1.5rem; padding: 0.8rem 0 0.4rem; }
.c_info_explain { font-size: 1.3rem; color: #C2C2C2; padding-left: 0.5rem; letter-spacing: 0;}

.site_standard_popup { width: 50%; z-index: 2; background-color: black; padding: 1rem;
border: 1px solid #eee; border-radius: 0.5rem; left: 50%; transform: translateX(-15%); }
.stan_title { font-size: 1.5rem; justify-content: space-between; }
.stan_explain { color: #C2C2C2; padding: 1rem 0; }
.stan_close i { font-size: 1.8rem; cursor: pointer; }
.popup { cursor:pointer; }


/* 사양정보 */
.r2_title { padding: 0.6rem 0 0.4rem; }
.r2_title { margin-bottom:unset; }
.spec_info { padding: 1.6rem; border-radius: 1rem; box-shadow: 5px 5px 3px #666; 
        border-top: 0.1rem solid rgba(200, 200, 200, 0.1);
        border-left: 0.1rem solid rgba(200, 200, 200, 0.1); }
/* .spec_info { padding: 1.6rem; background-color: var(--rebgcolor); border-radius: 1rem; } */
/* .spec_info { margin-top:1.4rem; } */
.youtube_wrap { position: relative; height: 0; padding-top: 0px; 
padding-bottom: 56.25%; overflow: hidden; margin: 1rem 0 2rem; }
.youtube_wrap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.spec { color: var(--rfcolor); font-weight: 600; line-height: 2.8rem; font-size: 1.5rem;
padding-left: 1.4rem; }
.etc_info { padding-left: 1.4rem; margin-top: 1rem; font-weight: 500; font-size: 1.5rem; word-break: keep-all; }

/* WHY? */
.recom_why { width: 46%; padding: 2%; }
.recom_why_img { width:100%; vertical-align: bottom; }
.why_recom_img { width:100%; vertical-align: bottom; }

.good_recom { border: 0.1rem solid #1187CF; padding: 1rem 0.6rem; margin-bottom: 2rem; }
.bad_recom { border: 0.1rem solid #FC5230; padding: 1rem 0.6rem; }
.good_recom .recom_title { color: #3A5FFF; }
.bad_recom .recom_title { color: #D94925; }
.recom_title { padding-bottom: 1rem; }
.recom_title i { font-size: 2.4rem; padding-right: 1rem; }
.recom_content { gap: 2%; }
.recom_content .txt_content { padding:0.6rem 0; }

/* AI_review */
.r3_subtitle { padding-top: 2rem; }
.review_part { padding: 2rem 1.6rem 3rem; }
.title_question { width: 3rem; height: 3rem; background-color: #C2C2C2;
border-radius: 1.5rem; font-size: 1.7rem; margin-left: 1rem; cursor: pointer; }
.rv_question { z-index:1; top:10; width:95%; border: 0.4rem solid darkgray; }
.rvq_x_div { top:0; right:0; }
.rvq_x { font-size:2rem; left:-2rem; color:black; }
.rvq_x i { cursor: pointer; }
.rv_question_img { width:100%; vertical-align:bottom; }

.rv_score_safety { width: 40%; }
.rv_graph { width: 60%; }

.rv_score_safety_title { width: 50%; justify-content: center; gap: 30%;
padding-left: 10%; font-size: 1.8rem; }
.rv_score_safety_num { width: 50%; gap: 15%; justify-content: center; }
.rv_score_num { font-size: 2.8rem; line-height: 2.8rem; }
.rv_score_star { width: 60%; }
.star_img { width: 100%; }
.rv_safety { font-size: 2.8rem; }

.graph_icon { width:50%; margin-top:0.4rem; }
.graph_icon_img { width:100%; }

/* 그래프 */
.graph_progress-bar { width: 16%; height: 8rem; background-color: #dedede;
font-weight: 600; font-size: .8rem; align-items: end; border-radius: 1rem; }
.graph_progress-bar .graph_progress { width: 100%; height: 0%; padding: 0;
background-color: #4F98FF; border-radius: 1rem; }
.graph_div { width:20%; align-items: center; }
.graph_num { padding-bottom: 0.2rem; }
.graph_emoji { font-size: 2.3rem; }
.rv_graph_5 { color: #FF4E2A; }

/* 긍정리뷰, 부정리뷰 */
.rv_pick_btn { gap: 0.6rem; padding: 0 3rem; }
/* .rv_btn { color: white; font-size: 1.7rem; padding: 0.8rem 0px; border-radius: 0.6rem;
background-color: var(--rebgcolor); width:50%; opacity: 0.2; gap:0.2rem; } */
.rv_btn { color: #000; font-size: 1.7rem; padding: 0.8rem 0px; border-radius: 0.6rem;
background-color: #fff; width: 50%; opacity: 0.2; gap: 0.2rem;
box-shadow: 5px 5px 3px #666;
border-top: 0.1rem solid rgba(200, 200, 200, 0.1);
border-left: 0.1rem solid rgba(200, 200, 200, 0.1); }
.rv_btn.selected { opacity: 1; }
.rv_emoji { font-size: 3.2rem; width:3rem; height:3rem; }
.rv_emoji_img { width:100%; }
.pick { font-style: italic; font-size: 1.8rem; transform: translateY(0.3rem); }

.txt_content { width:90%; font-size:1.5rem; }
.quoto { width:8%; display:none; }
.quoto_img { width:100%; }
.quoto_end { position: relative; }
.quoto_end_img { position: absolute; top: 100%; transform: translateY(-100%); }

#rv_content { padding: 1rem 0; }
.review_content { padding-bottom: 2rem; }
.rv_slider { padding: 1rem 3rem; }
.rv_slider_div { padding: 1.6rem 0; background-color: #fff; 
border-radius: 1rem; box-shadow: 5px 5px 3px #666;
border-top: 0.1rem solid rgba(200, 200, 200, 0.1);
border-left: 0.1rem solid rgba(200, 200, 200, 0.1); }
.rv_content_img { width:100%; }
.joayo { padding-right: 2rem; display:flex; justify-content: flex-end; }
.joayo_icon { color: #556482; font-size: 1.6rem; } 
/* .joayo_num { background-color: #303A5B; font-size: 1.4rem; color: #74819c; } 74819c C2C2C2 */
.joayo_num { background-color: #fff; font-size: 1.4rem; color: #74819c; }
/* .joayo_icon_num { justify-content: end; cursor:pointer; background-color: #303A5B;
border-radius: 0.5rem; gap:0.6rem; padding:0.2rem 0.6rem; } */
.joayo_icon_num { justify-content: end; cursor:pointer; background-color: #fff; gap:0.6rem;
border-radius: 0.5rem; padding:0.2rem 0.6rem; border: .1rem solid rgba(200, 200, 200, 0.3); }
.joayo_icon_num.selected { background-color:#556482; }
.joayo_icon_num.selected .joayo_icon { color:#e5e5e5; }
.joayo_icon_num.selected .joayo_num { background-color: #556482; color:#e5e5e5; }
.rv_txt_content { padding: 1rem 0.4rem; }
.rv_txt_content .txt_content { font-size: 1.5rem; color: #000; font-weight: 100;
margin: 1rem 0.2rem; height: 10rem; line-height: 2rem; font-weight: 500; }
/* .rv_txt_content .txt_content { font-size: 1.5rem; color: var(--rfcolor); color:white;
font-weight: 100; margin: 1rem 0.2rem; height: 10rem; line-height: 2rem; font-weight:400; } */
#rv_content .txt_content { white-space: normal; display:-webkit-box;
-webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow:hidden; }
.rv_write_user { padding: 1rem 2rem; gap: 0.7rem; }
.user_icon { background-color: #7081BC; padding: 0.3rem 0.5rem; border-radius: 0.5rem; }
.user_icon i { color: #CACACA; font-size: 1.6rem; }
/* .user_name { font-size: 1.3rem; color:rgba(255,255,255,0.5); } */
.user_name { font-size: 1.3rem; color:rgba(0,0,0,0.8); }

#hidden_iframe { visibility: hidden; z-index:-99; }
.joayo_alink { position:absolute; width: 100%; height: 100%; top: 0; left: 0; }

.rv_no_exsit { padding: 1rem 3rem; }
/* .rv_no_content { background-color: var(--rebgcolor); border-radius: 1rem; font-size: 1.4rem;
color: var(--rfcolor); padding: 3rem 2rem; font-weight: 100; } */
.rv_no_content { background-color: #fff; border-radius: 1rem; font-size: 1.4rem;  
        color: #000; padding: 3rem 2rem; font-weight: 400;
        box-shadow: 5px 5px 3px #666;
        border-top: 0.1rem solid rgba(200, 200, 200, 0.1);
        border-left: 0.1rem solid rgba(200, 200, 200, 0.1); }
.rv_explain { text-indent: -1.5rem; margin-left: 1.5rem; }

/* 사용자 질문 그래프 */
.purpose, .big_data, .resolution_chart, .cost_chart { margin-top:4rem; }
/* .c_chart, .r_chart { padding:1rem; } */
.c_chart { padding:1rem; }
.resolution_chart .q_title, .cost_chart .q_title { padding-bottom:1rem; }
/* .q_title { font-size: 1.8rem; padding:0 2rem; color:#fff; } */
.q_title { font-size: 1.8rem; padding:0 2rem; color:#000; }
.q_mark { color: var(--qcolor); }
.poll { padding: 1rem; margin: 1rem;
border-radius: 1rem; box-shadow: 5px 5px 3px #666;
border-top: 0.1rem solid rgba(200, 200, 200, 0.1);
border-left: 0.1rem solid rgba(200, 200, 200, 0.1);}
.chart { padding: 0 1rem; }
/* .chart_graph { justify-content: space-between; background-color: white; color: black; gap:.2rem;
margin: 2rem 0; font-weight: 500; padding: 1rem; z-index: 0; font-size: 1.4rem; border-radius: 0.8rem; } */
.chart_graph { justify-content: space-between; background-color: rgba(200, 200, 200, 0.2); color: black; gap:.2rem;
margin: 2rem 0; font-weight: 600; padding: 1rem; z-index: 0; font-size: 1.4rem; border-radius: 0.8rem; }
.chart_q, .chart_percent { text-indent: -1.8rem; margin-left: 1.8rem; z-index:2; }
.chart_percent { margin: auto 0; }
.chart_q { margin-right:2.8rem; }
/* .chart_graph_bar { background-color: rgba(192,194,194,0.5); height: 100%; top: 0; left: 0;
z-index: 1; border-top-left-radius: 0.8rem; border-bottom-left-radius: 0.8rem; } */
.chart_graph_bar { background-color: rgba(150,150,150,0.6); height: 100%; top: 0; left: 0;
        z-index: 1; border-top-left-radius: 0.8rem; border-bottom-left-radius: 0.8rem; }
.chart_graph_bar.first_bar { background-color: rgba(38,127,122,0.5); }


/* 다른 추천 pc */
.gudokpc_img, .othpc_img { width:100%; }
.other_recom_product { padding: 1.6rem 1.6rem 0; justify-content: space-between; }
.gudokpc, .other_product { width: 47%; background-color: var(--rebgcolor);
border-bottom-left-radius: 1rem; border-bottom-right-radius: 1rem; }
.gd_explain, .other_explain { padding: 0.4rem; }
.gudok_name_explain { justify-content: space-between; }
.gudok_name { padding-left: 0.8rem; }
.gd_title { font-weight: bold; letter-spacing: -0.06rem; font-size: 1.7rem; }
.gd_subtitle { font-size: 1rem; font-weight: 100; color: var(--rfcolor); }
.gudok_explain { font-size: .8rem; font-weight: 500; }
.gudok_cost, .othpc_cost { font-size: 2rem; align-items: baseline; padding: 1rem 0;
gap: 0.4rem; }
span.vat { font-size: .8rem;  align-items: baseline; font-weight: 100; }
.r_group04 .site_go { padding: 0.3rem; }
.r_group04 .sitego { font-size: 1.2rem; font-weight: 300; padding: 0.4rem 0; position: relative; }
.oth_name { font-size: 1.7rem; font-weight: bold; white-space: normal; display: -webkit-box; 
-webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.oth_tag { font-size: .8rem; font-weight: 100; color: var(--rfcolor);
padding: 0.2rem 0; gap:0.4rem; }
.other_link, .gudok_link { position: absolute; width: 100%; height: 100%; 
top: 0; left: 0; border-radius: 0.8rem; }

/* //230615 new ver// */

/* 230717 test ver  */
.comhow_buy { margin-top: 1rem; }
.ch_buy_title { font-size: 2rem; padding: 2rem 0; font-weight: 600; }
.ch_buy { background-color: var(--botcolor); border-radius: 1rem; padding: 1rem; }
.ch_thumnail { width: 50%; }
.ch_cost_info { width: 50%; flex-direction: column; vertical-align: middle; }
.ch_mall { width: 60%; }
.ch_cost { font-size: 2.6rem; width: 90%; justify-content: flex-end; }
.ch_sale_link { justify-content: flex-end; width: 90%; gap: 10%; margin-top: 1rem; }
.ch_sale { color: #03A687; }
.f_right { float: right; }
.ch_link_btn { padding: 0.5rem; background-color: #03A687; border-radius: 0.5rem; cursor: pointer; }
.ch_info { padding: 1rem; font-size: 1.6rem; }
.ch_info_title { font-size: 1.7rem; padding: 1rem 0; }
.ch_info_txt { padding-left: 0.5rem; }
.gudok_ad { margin-top: 3.4rem; cursor: pointer; }
.gd_ad_txt { top: 1rem; left: 1rem; }
.last_qustion { margin: 4rem 0 3rem; }
.last_qtitle { font-size: 1.7rem; font-weight: 600; }
.last_qbtn { padding: 0.6rem 1rem; background-color: #03A687; font-size: 1.6rem; border-radius: 0.5rem;
font-weight: 500; cursor:pointer; }

/* bigdata */
.big_data_img { padding: 2rem 1rem 1rem; }


/* piechart */
.chart_div { width:45%; }
#pie_chart { width:100%; }
/* .chart { width:100%; }
#pie_chart { width:100%; }
.chart_label { width:0%; } */
.chart_label_div { width: 55%; }
/* .label { align-items: center; letter-spacing: -0.03rem; color:rgba(255,255,255,0.5); } */
.label { align-items: center; letter-spacing: -0.03rem; color:rgba(0,0,0,0.5); }
/* .label:first-child { color:rgba(255,255,255,1); } */
.label:first-child { color:rgba(0,0,0,1); }
.chart_label { padding-top: 1rem; }
.chart_circle {
width: 1.2rem;
height: 1.2rem;
border-radius: 100rem;
background-color: white;
display: block;
margin-right: 0.5rem;
}
.chart_label .label:nth-child(1) .chart_circle { background-color: rgba(255, 99, 132, 1); }
.chart_label .label:nth-child(2) .chart_circle { background-color: rgba(255, 114, 0, 0.5); }
.chart_label .label:nth-child(3) .chart_circle { background-color: rgba(255, 205, 86, 0.5); }
.chart_label .label:nth-child(4) .chart_circle { background-color: rgba(75, 192, 192, 0.5); }
.chart_label .label:nth-child(5) .chart_circle { background-color: rgba(54, 162, 235, 0.5); }
.chart_label .label:nth-child(6) .chart_circle { background-color: rgba(190, 54, 235, 0.5); }
.cc_resolution { padding: 0 0.3rem; }

/* 마지막질문 background-color: #000; border: 1px solid #eee; padding: 1rem;*/
.rp_name_last_q { justify-content: space-between;}
.last_q_div { align-items: flex-end; }
.last_q { top: 100%; left: 0%; width:100%; }
.lastq_txt_div { background-color: #000; border: 1px solid #eee; padding: 1rem; align-items: flex-end; }
.lastq_btn { margin-right: 4%; }
.last_q_txt { float: right; cursor: pointer; color:#03A687; }
.lastq_arrow { cursor:pointer; color:#03A687; /*width:2rem;*/ font-weight: 900; }
.ex_circle { border: 2px solid #03A687;
        border-radius: 99rem;
        width: 2rem;
        font-size: 1.3rem; }

.shadow_box {
animation: shadow-drop-2-center 2s infinite, shake-horizontal 1s ease-in-out infinite;
}
.shadow_box1 {
animation: shadow-drop-2-bottom 2s infinite;
}
.shadow_box2 {
animation: shake-horizontal 2s infinite;
}

/* //////////////// */

/* QNA */
.qna_chat, .qna_faq { width: 100%; background: #eeeeee; padding: 1rem 0; align-items: center; }
.qna_chat { margin: 1rem 0;}
.qna_chat_icon, .qna_faq_icon { padding: 0 1.4rem; }
.qna_chat_title, .qna_faq_title { width: 35%; font-size: 1.4rem; font-weight: 800; }
.qna_chat_info, .qna_faq_info { width: 70%; font-size: 1.2rem; }
.qna_chat_link, .qna_faq_link { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }

.qna_faq_popup { position: fixed; top: 15%; background-color: #fff; overflow: auto; width: calc(100% - 3.2rem);
z-index: 99; margin: 0 auto; border: .1rem solid #0e6d62; cursor: pointer; max-width:calc(450px - 3.2rem); }
.qna_popup_img { max-width: 450px; width: 100%; }

/* howshare */
.howShare { display: flex; width: 100%; justify-content: center; gap: 2%; padding: 0.5rem 0; background-color: var(--bgcolor); margin-top: 2rem; }
/* #howShare_fix { border-top: 0.1rem solid #333; max-width: 450px; margin: 0 auto; bottom:0; } */
#howShare_fix { border-top: 0.1rem solid #f2f2f2; max-width: 450px; margin: 0 auto; bottom:0; }
.share_btn { border: 0.1rem solid #777; width: 47%; padding: 1rem; text-align: center; font-size: 1.3rem; }
.btn_shadow { box-shadow: 0 0.1rem 0.2rem rgb(0 0 0 / 0%), 0 0.2rem 0.2rem rgb(0 0 0 / 20%); }
button.kakaoshare { background: #fae100; /*border: 0.1rem solid #fae100;*/ color:#000; font-weight:bold; }
button.restart { background: #383849; border: 0.1rem solid #383849; color:#fae100; font-weight:bold; }

/* 효과 */
.scale-up-ver-top {
	-webkit-animation: scale-up-ver-top 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: scale-up-ver-top 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

.scale-out-ver-top {
	-webkit-animation: scale-out-ver-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: scale-out-ver-top 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

.shadow-drop-2-center {
	-webkit-animation: shadow-drop-2-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: shadow-drop-2-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

.shake-horizontal {
	-webkit-animation: shake-horizontal 0.2s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
	        animation: shake-horizontal 0.2s cubic-bezier(0.455, 0.030, 0.515, 0.955) both;
}

/* ----------------------------------------------
 * Generated by Animista on 2023-5-11 12:11:41
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation scale-up-ver-top
 * ----------------------------------------
 */
@-webkit-keyframes scale-up-ver-top {
0% {
-webkit-transform: scaleY(0.4);
        transform: scaleY(0.4);
-webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
}
100% {
-webkit-transform: scaleY(1);
        transform: scaleY(1);
-webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
}
}
@keyframes scale-up-ver-top {
0% {
-webkit-transform: scaleY(0.4);
        transform: scaleY(0.4);
-webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
}
100% {
-webkit-transform: scaleY(1);
        transform: scaleY(1);
-webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
}
}


/* ----------------------------------------------
 * Generated by Animista on 2023-5-11 13:19:49
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation scale-out-ver-top
 * ----------------------------------------
 */
@-webkit-keyframes scale-out-ver-top {
0% {
-webkit-transform: scaleY(1);
        transform: scaleY(1);
-webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
opacity: 1;
}
100% {
-webkit-transform: scaleY(0);
        transform: scaleY(0);
-webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
opacity: 1;
}
}
@keyframes scale-out-ver-top {
0% {
-webkit-transform: scaleY(1);
        transform: scaleY(1);
-webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
opacity: 1;
}
100% {
-webkit-transform: scaleY(0);
        transform: scaleY(0);
-webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
opacity: 1;
}
}


/**
 * ----------------------------------------
 * animation shadow-drop-2-center
 * ----------------------------------------
 */
@-webkit-keyframes shadow-drop-2-center {
0% {
        -webkit-transform: translateZ(0);
                transform: translateZ(0);
        -webkit-box-shadow: 0 0 0 0 rgba(40,201,170, 1);
                box-shadow: 0 0 0 0 rgba(40,201,170, 1);
}
50% {
        -webkit-transform: translateZ(35px);
                transform: translateZ(35px);
        -webkit-box-shadow: 0 0 20px 0px rgba(40,201,170, 0.65);
                box-shadow: 0 0 20px 0px rgba(40,201,170, 0.65);
}
100% {
-webkit-transform: translateZ(0);
        transform: translateZ(0);
-webkit-box-shadow: 0 0 0 0 rgba(40,201,170, 1);
        box-shadow: 0 0 0 0 rgba(40,201,170, 1);
}
}
@keyframes shadow-drop-2-center {
0% {
        -webkit-transform: translateZ(0);
                transform: translateZ(0);
        -webkit-box-shadow: 0 0 0 0 rgba(40,201,170, 1);
                box-shadow: 0 0 0 0 rgba(40,201,170, 1);
}
50% {
        -webkit-transform: translateZ(35px);
                transform: translateZ(35px);
        -webkit-box-shadow: 0 0 20px 0px rgba(40,201,170, 0.65);
                box-shadow: 0 0 20px 0px rgba(40,201,170, 0.65);
}
100% {
-webkit-transform: translateZ(0);
        transform: translateZ(0);
-webkit-box-shadow: 0 0 0 0 rgba(40,201,170, 1);
        box-shadow: 0 0 0 0 rgba(40,201,170, 1);
}
}
/**
* ----------------------------------------
* animation shake-horizontal
* ----------------------------------------
*/
@-webkit-keyframes shake-horizontal {
0%,
100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
}
10%,
30%,
50%,
70% {
        -webkit-transform: translateX(-0.05rem);
                transform: translateX(-0.05rem);
}
20%,
40%,
60% {
        -webkit-transform: translateX(0.05rem);
                transform: translateX(0.05rem);
}
80% {
        -webkit-transform: translateX(0.1rem);
                transform: translateX(0.1rem);
}
90% {
        -webkit-transform: translateX(-0.1rem);
                transform: translateX(-0.1rem);
}
}
@keyframes shake-horizontal {
0%,
100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
}
10%,
30%,
50%,
70% {
        -webkit-transform: translateX(-0.05rem);
                transform: translateX(-0.05rem);
}
20%,
40%,
60% {
        -webkit-transform: translateX(0.05rem);
                transform: translateX(0.05rem);
}
80% {
        -webkit-transform: translateX(0.1rem);
                transform: translateX(0.1rem);
}
90% {
        -webkit-transform: translateX(-0.1rem);
                transform: translateX(-0.1rem);
}
}
