@charset "UTF-8";
/* 24.11.22 tgkim */
.made_chart.renew { position: relative; !important; }

/* newkeep add CSS */
.m_sec02 { background:#F9FAFB; }
.m_sec02 .inner { padding:140px 0; align-items:center; flex-direction:column; }
.data_tab { display:flex; justify-content:space-between; width:100%; margin-top:100px; }
.data_tab > li { display:flex; align-items:center; flex-direction:column; width:calc((100% - 99px)/3); height:190px; padding-top:39px; border-radius:16px; box-sizing:border-box; background:#FFF; cursor:pointer; transition:all 0.3s; }
.data_tab > li.active { box-shadow:0 0 20px rgba(0,0,0,16%); transition:all 0.3s; }
.data_tab > li:hover { box-shadow:0 0 20px rgba(0,0,0,16%); transition:all 0.3s; }
.data_tab > li > img { margin-bottom:10px; }
.data_tab > li .bold_txt { margin-top:16px; font-size:30px; font-weight:700; color:#303030;letter-spacing:-0.03em; }
.m_sec02 .data_graph { display:none; width:100%; height:413px; margin-top:30px; padding:0 30px; box-sizing:border-box; border-radius:16px; background:#FFF; }
.m_sec02 .data_graph.active { display:block; text-align:center; }
.made_chart { display:flex; flex-direction:column; justify-content:flex-end; height:100%; }
.made_chart .line_graph { display:flex; justify-content:space-between; align-items:flex-end; width:calc(100% - 80px); height:330px; margin:0 auto; border-bottom:1px solid #9BA7B9; box-sizing:border-box; }
.made_chart .line_graph .x_line { width:40px; margin:0 auto; border-radius:5px 5px 0 0; position:relative; }
#cont01 .made_chart .line_graph .x_line:nth-child(-n+3) { background:rgba(67,139,255,0.3); }
#cont01 .made_chart .line_graph .x_line:nth-child(n+4):nth-child(-n+6) { background:rgba(67,139,255,0.4); }
#cont01 .made_chart .line_graph .x_line:nth-child(n+7):nth-child(-n+8) { background:rgba(67,139,255,0.5); }
#cont01 .made_chart .line_graph .x_line:nth-child(n+9):nth-child(-n+10) { background:rgba(67,139,255,0.8); }
#cont01 .made_chart .line_graph .x_line:nth-child(n+11):nth-child(-n+13) { background:rgba(67,139,255,1); }
#cont02 .made_chart .line_graph .x_line:nth-child(-n+3) { background:rgba(91,85,226,0.3); }
#cont02 .made_chart .line_graph .x_line:nth-child(n+4):nth-child(-n+6) { background:rgba(91,85,226,0.4); }
#cont02 .made_chart .line_graph .x_line:nth-child(n+7):nth-child(-n+8) { background:rgba(91,85,226,0.5); }
#cont02 .made_chart .line_graph .x_line:nth-child(n+9):nth-child(-n+10) { background:rgba(91,85,226,0.8); }
#cont02 .made_chart .line_graph .x_line:nth-child(n+11):nth-child(-n+13) { background:rgba(91,85,226,1); }
#cont03 .made_chart .line_graph .x_line:nth-child(-n+3) { background:rgba(69,168,164,0.3); }
#cont03 .made_chart .line_graph .x_line:nth-child(n+4):nth-child(-n+6) { background:rgba(69,168,164,0.4); }
#cont03 .made_chart .line_graph .x_line:nth-child(n+7):nth-child(-n+8) { background:rgba(69,168,164,0.5); }
#cont03 .made_chart .line_graph .x_line:nth-child(n+9):nth-child(-n+10) { background:rgba(69,168,164,0.8); }
#cont03 .made_chart .line_graph .x_line:nth-child(n+11):nth-child(-n+13) { background:rgba(69,168,164,1); }
#cont04 .made_chart .line_graph .x_line:nth-child(-n+3) { background:rgba(59,163,253,0.3); }
#cont04 .made_chart .line_graph .x_line:nth-child(n+4):nth-child(-n+6) { background:rgba(59,163,253,0.4); }
#cont04 .made_chart .line_graph .x_line:nth-child(n+7):nth-child(-n+8) { background:rgba(59,163,253,0.5); }
#cont04 .made_chart .line_graph .x_line:nth-child(n+9):nth-child(-n+10) { background:rgba(59,163,253,0.8); }
#cont04 .made_chart .line_graph .x_line:nth-child(n+11):nth-child(-n+13) { background:rgba(59,163,253,1); }

.made_chart .line_graph .x_line.on .hover_txt { display:block; }
.made_chart .line_graph .x_line .hover_txt { display:none; width:auto; height:auto; padding:8px 10px; box-sizing:border-box; border-radius:5px; background:#022D81; position:absolute; left:50%; top:-55px; z-index:10; transform:translateX(-50%); }
.made_chart .line_graph .x_line .hover_txt:after { display:block; width:27px; height:24px; background:url('../../img/chart_arrow.png'); clear:both; content:''; position:absolute; bottom:-10px; left:calc(50% - 13px); z-index:-1; }
.made_chart .line_graph .x_line .hover_txt .graph_txt02 { font-size:18px; font-weight:700; color:#FFF; letter-spacing:-0.03em; }
.made_chart .text_graph { display:flex; justify-content:space-between; align-items:center; width:calc(100% - 80px); height:50px; margin:0 auto; box-sizing:border-box; text-align:center; }
.made_chart .text_graph .rate_txt { width:40px; margin:0 auto; }

/* review section 01 - chart & graph */
.c_sec01 .inner { padding:140px 0; align-items:center; flex-direction:column; }
.acc_data_area { display:flex; justify-content:space-between; align-items:flex-start; width:100%; min-height:653px; margin-top:100px; padding:30px 30px 60px; box-sizing:border-box; border-radius:10px; background:#F1F9FF; position:relative; }
.acc_tab { display:flex; flex-wrap:wrap; width:169px; margin-top:26px; gap:30px 0; }
.acc_tab li { width:100%; /* margin-right:26px; */ padding-left:42px; box-sizing:border-box; font-size:24px; color:#9BA7B9; letter-spacing:-0.03em; transition:all 0.3s; cursor:pointer; position:relative; white-space:nowrap; }
.acc_tab li img { position:absolute; top:0; left:0; }
.acc_tab li img.off { opacity:1; transition:all 0.3s; }
.acc_tab li img.on { opacity:0; transition:all 0.3s; }
.acc_tab li:hover,
.acc_tab li.on { font-weight:500; color:#3BA3FD; transition:all 0.3s; }
.acc_tab li:hover img.off,
.acc_tab li.on img.off { opacity:0; transition:all 0.3s; }
.acc_tab li:hover img.on,
.acc_tab li.on img.on { opacity:1; transition:all 0.3s; }
.acc_tab li:last-child { margin-bottom:0; }
.acc_date { font-size:16px; color:#9BA7B9; letter-spacing:-0.03em; position:absolute; bottom:22px; right:30px; }
.acc_data_box { display:none; width:calc(100% - 219px); height:auto; border-radius:10px; box-sizing:border-box; background:#FFF; position:relative; text-align:center; }
.acc_data_box.on { display:block; }
.acc_data_box img { max-width:100%; object-fit:contain; }
.acc_txt_box { width:260px; }
.acc_txt01 { padding-top:20px; box-sizing:border-box; border-top:1px solid #DADEE3; font-size:16px; font-weight:500; color:#292929; letter-spacing:-0.03em; }
.acc_txt01:first-child { border-top:2px solid #3BA3FD; }
.acc_txt02 { margin-top:16px; font-size:20px; color:#505967; letter-spacing:-0.03em; }
.acc_txt02:nth-child(2) { margin-bottom:20px; }
.made_chart { position:absolute; left:0; right:0; bottom:40px; }
.made_chart .line_graph { display:flex; justify-content:space-between; align-items:flex-end; width:calc(100% - 80px); height:455px; margin:0 auto; border-bottom:1px solid #9BA7B9; box-sizing:border-box; }
.made_chart .line_graph .x_line { width:40px; margin:0 auto; border-radius:5px 5px 0 0; position:relative; }
.made_chart .line_graph .x_line:nth-child(-n+3) { background:rgba(67,139,255,0.3); }
.made_chart .line_graph .x_line:nth-child(n+4):nth-child(-n+6) { background:rgba(67,139,255,0.4); }
.made_chart .line_graph .x_line:nth-child(n+7):nth-child(-n+8) { background:rgba(67,139,255,0.5); }
.made_chart .line_graph .x_line:nth-child(n+9):nth-child(-n+10) { background:rgba(67,139,255,0.8); }
.made_chart .line_graph .x_line:nth-child(n+11):nth-child(-n+12) { background:rgba(67,139,255,1); }
.made_chart .text_graph { display:flex; justify-content:space-between; align-items:center; width:calc(100% - 80px); height:26px; margin:0 auto; box-sizing:border-box; text-align:center; }
.made_chart .text_graph .rate_txt { width:40px; margin:0 auto; }

/* review section 02 - review & star_rating */
.c_sec02 { padding:140px 0 120px; box-sizing:border-box; background:#F9FAFB; }
.flow_wrap { width:100%; min-height:200px; padding:100px 0 20px; position:relative; }
.flow_area { position:absolute; }
.flow_area ul { display:flex; justify-content:space-between; margin-bottom:16px; }
.flow_area ul li.review_card { flex-direction:column; justify-content:space-between; width:300px; height:199px; margin-right:20px; padding:30px; box-sizing:border-box; border-radius:10px; background:#FFF; box-shadow:0 0 20px rgba(0,0,0,10%); }
.review_card .review_txt01 { font-size:16px; color:#9BA7B9; letter-spacing:-0.01em; }
.review_card .review_txt02 { margin-top:12px; font-size:20px; color:#505967; letter-spacing:-0.01em; line-height:28px; word-break:keep-all; }
.review_card .review_txt02 span { font-weight:500; }
.review_card .star_rating { margin-top:12px; }
.review_card .star_rating .checked { color:#F5C949; }

.flow_area.original{ animation:60s linear 0s infinite normal forwards running rollingleft1; }
.flow_area.clone{ animation:60s linear 0s infinite normal none running rollingleft2; }
@keyframes rollingleft1 {
	0% {
		transform: translateX(0);
	}
	50% {
		transform: translateX(-100%);
	}
	50.01%{
		transform: translateX(100%);
	}
	100%{
		transform: translateX(0);
	}
}
@keyframes rollingleft2 {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-200%);
	}
}

/* review section 03 - play video */
.c_sec03 .inner { width:100%; height:1150px; padding:100px 140px; box-sizing:border-box; align-items:center; flex-direction:column; position:relative; }
.key_empty { font-size:44px; color:#292929; letter-spacing:-0.03em; position:absolute; top:271px; left:77px; }
.key_empty span { display:inline-block; letter-spacing:216px; font-size:60px; font-weight:500; }
.key_empty span:last-child { letter-spacing:0; }
.swiper_keywords { width:260px; height:300px; position:absolute; top:162px; left:197px; }
.swiper_keywords .swiper-slide { font-size:60px; font-weight:700; color:rgba(6,21,60,20%); letter-spacing:-0.03em; text-align:center; transition:all 0.3s; }
.swiper_keywords .swiper-slide-active { color:#3BA3FD; transition:all 0.3s; }
.swiper_video { width:610px; height:411px; position:absolute; top:100px; right:30px; }
.swiper_video .swiper-slide { width:100%; border-radius:10px; overflow:hidden; }
.swiper_video .swiper-slide .img_box { width:100%; height:100%; position:relative; z-index:10; background:linear-gradient(180deg, rgba(38,38,38,0.1) 0%, rgba(30,190,255,0.31) 33%, rgba(70,70,165,0.73) 100%); }
.swiper_video .swiper-slide > img { height:100%; position:absolute; left:0; top:0; z-index:0; }
.swiper_video .swiper-slide .img_box a { display:flex; justify-content:center; align-items:center; font-size:16px; color:#FFF; letter-spacing:-0.01em; text-decoration:underline; position:absolute; bottom:30px; right:30px; }
.swiper_video .swiper-slide .img_box a img { margin-left:12px; }
.swiper_partner { width:calc(100% - 60px); margin:0 auto; padding-bottom:40px; box-sizing:border-box; position:absolute; left:0; right:0; bottom:140px; }
.swiper_partner .swiper-slide { width:380px; }
.swiper_partner .img_box { border-radius:10px; overflow:hidden; }
.swiper_partner .img_box img { width:100%; }
.swiper_partner .partner_txt01 { margin-top:20px; font-size:16px; color:#9BA7B9; letter-spacing:-0.01em; }
.swiper_partner .partner_txt02 { margin-top:10px; font-size:30px; font-weight:500; color:#505967; letter-spacing:-0.01em; line-height:40px; }
.swiper_partner .partner_txt03 { margin-top:10px; font-size:20px; color:#505967; letter-spacing:-0.01em; line-height:28px; word-break:keep-all; }
.swiper_partner .swiper-pagination { bottom:0 !important; }
.swiper_partner .swiper-pagination-bullet-active { background:#022D81; }

.modal_background { opacity:0; position:fixed; top:0; left:0; width:100vw; height:100vh; transition:.3s; z-index: -1; background:#000; }
.modal_wrap { max-width:1280px; width:90%; height:auto; z-index:-1; opacity:0; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); background:transparent; overflow:hidden; }


@media all and (max-width: 1024px) {
	.common_ban { height:240px; }
	.common_ban .inner { justify-content:flex-start; padding:30px 5% 20px; box-sizing:border-box; }
	.ban01 { width:96px; bottom:20px; right:20px; z-index:0; }
	.c_ban_txt01 { margin-bottom:10px; font-size:25px; line-height:1.2; position:relative; z-index:2; }
	.c_ban_txt02 { font-size:16px; line-height:1.4; position:relative; z-index:2; word-break:keep-all; }
	.m_txt01 { margin-bottom:8px; font-size:22px; line-height:1.4; }
	.m_txt02 { font-size:15px; line-height:1.4; word-break:keep-all; }

	.c_sec01 .inner { padding:70px 5%; box-sizing:border-box; }
	.acc_data_area { display:block; min-height:auto; height:auto; margin-top:50px; padding:20px 15px 40px; }
	.acc_tab { flex-wrap:nowrap; justify-content:space-between; width:100%; height:30px; margin-top:0; overflow-x:scroll; overflow-y:hidden; gap:0 25px; }
	.acc_tab li { padding-left:24px; font-size:15px; white-space:nowrap; }
	.acc_tab li img { width:14px; }
	.acc_date { font-size:12px; bottom:15px; right:15px; }
	.acc_data_box { width:100%; margin-top:25px; padding:10px 5px; }
	.acc_txt_box { width:50%; }
	.acc_txt01 { padding-top:10px; font-size:13px; }
	.acc_txt02 { margin-top:8px; font-size:14px; }
	.made_chart { bottom:0; }
	.made_chart .line_graph { width:100%; height:225px; }
	.made_chart .line_graph .x_line { width:28px; }
	.made_chart .line_graph .x_line:nth-child(-n+3) { display:none; }
	.made_chart .line_graph .x_line:nth-child(n+4):nth-child(-n+6) { display:none; }
	.made_chart .text_graph { width:100%; }
	.made_chart .text_graph .rate_txt { font-size:12px; }
	.made_chart .text_graph .rate_txt:nth-child(-n+3) { display:none; }
	.made_chart .text_graph .rate_txt:nth-child(n+4):nth-child(-n+6) { display:none; }

	.c_sec02 { padding:70px 0 60px; }
	.flow_wrap { padding:50px 0 10px; }
	.flow_area ul li.review_card { width:208px; height:auto; margin-right:13px; padding:20px 15px; }
	.review_card .review_txt01 { font-size:13px; }
	.review_card .review_txt02 { margin-top:8px; font-size:15px; line-height:1.4; }

	.c_sec03 .inner { height:auto; padding:70px 5%; box-sizing:border-box; }
	.key_empty { display:flex; justify-content:center; align-items:center; width:100%; font-size:22px; top:120px; left:-15px; }
	.key_empty span { margin-right:35%; letter-spacing:0; }
	.key_empty span:last-child { margin-right:0; }
	.swiper_keywords { width:100%; height:150px; position:static; }
	.swiper_keywords .swiper-slide { font-size:30px; }
	.swiper_video { width:100%; height:225px; margin:30px auto 0; position:static; }
	.swiper_video .swiper-slide .img_box a { font-size:13px; bottom:10px; right:10px; }
	.swiper_video .swiper-slide .img_box a img { height:25px; margin-left:6px; }
	.swiper_partner { width:100%; margin:50px auto 0; position:static; }
	.swiper_partner .swiper-slide { width:70%; }
	.swiper_partner .swiper-pagination { display:none; }
	.swiper_partner .partner_txt01 { margin-top:10px; font-size:14px; }
	.swiper_partner .partner_txt02 { margin-top:10px; font-size:18px; line-height:1.4; }
	.swiper_partner .partner_txt03 { font-size:15px; line-height:1.4; }
}