@charset="utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700&display=swap');

body {
	background: #fff;
	margin:0; padding:0; 
}
* {
	font-family: 'Noto Sans KR', sans-serif;
	margin:0; padding:0; font-size:11.2pt; color:#000; line-height:20px; font-weight:400;
}

a {text-decoration:none}

.document-width {width:1360px;margin:0 auto; border-left:1px solid #ccc; border-right:1px solid #ccc;}


#top_bg {
    position:relative;
    width:100%;
	height:738px;
    background-image:url('/beta/assets/imgs/bg_top_pc.jpg');
	background-repeat:no-repeat;
    background-size:100%;
	background-attachment: fixed;
	overflow:hidden;
}
#top_bg .is-block {position:absolute;background:#000;opacity:0.5;width:100%;height:738px;top:0;left:0;z-index:10}
#top_bg .is-content {position:absolute;width:100%;height:708px;top:0;left:0;z-index:20}
#top_bg .is-content .top_logo {padding:16px 0 0 100px; list-style-type:none;overflow:hidden;}
#top_bg .is-content .top_logo li {float:left;color:#fff;font-size:15px;margin-right:31px;}
#top_bg .is-content .top_logo img {width:100%}
#top_bg .is-content .top_logo span {color:#fff;font-size:15px;padding:0 2px 2px 2px;cursor:pointer}
#top_bg .is-content .top_logo span.on {border-bottom:2px solid #ffea61;}
#top_bg .is-content .top_logo span.wallet {background:#ffea61;color:#000;padding:0 5px}
#top_bg .is-content .top_logo a {color:#fff;font-size:9pt;}
#top_bg .is-content .top_desc {margin-top:200px;margin-left:150px;}
#top_bg .is-content .top_desc .row-1 {color:#fff;font-size:32px;font-weight:500}
#top_bg .is-content .top_desc .row-2 {color:#fff;font-size:54px;font-weight:700;margin-top:30px}
#top_bg .is-content .top_desc .row-3 {color:#fff;font-size:24px;width:400px;font-weight:300;margin-top:50px;line-height:30px}
#top_bg .is-content .top_link {margin-top:80px;margin-left:140px;margin-right:34px;}
#top_bg .is-content .top_link ul {width:100%;overflow:hidden;margin-top:20px;list-style-type:none}
#top_bg .is-content .top_link li {
	float:left;
	width:190px;
    height:40px;
	margin-right:15px;
	color:#000;
	font-size:10pt;
	text-align:center;
	font-weight:400;
	line-height:41px;
	border-radius:2px;
}
#top_bg .is-content .top_link .yellow {background:#ffea61;}
#top_bg .is-content .top_link .yellow {}
#top_bg .is-content .top_link .yellow .play_img {
    font-size:16pt;
    padding-left:47px;
    background-image:url('/beta/assets/imgs/download_playstore.png');
    background-position:19px 10px;
    background-repeat:no-repeat;
    background-size:10%;
}
#top_bg .is-content .top_link .yellow .get_it_on {color:#000;font-size:7pt;text-align:left;font-weight:400;padding-top:3px}
#top_bg .is-content .top_link .yellow .google_play {color:#000;font-size:12pt;font-weight:600;text-align:left;margin-top:-8px}

#top_bg .is-content .top_link .paper {background:#fff;}
#top_bg .is-content .top_link .paper span {
    font-size:13pt;
    margin-left:10px;
    padding-left:20px;
    background-image:url('/beta/assets/imgs/download_paper_pc.png');
    background-position:0 8px;
    background-repeat:no-repeat;
    background-size:100%;
}


#cashback_program {position:relative;width:100%}
#cashback_program ul {width:100%;list-style-type:none;overflow:hidden}
#cashback_program li {float:left;height:620px;overflow:hidden;}
#cashback_program li.first {width:22%;background:#f7f7f7}
#cashback_program li.second {width:17%;background:#ffea61}
#cashback_program li.back {width:61%;
    background-image:url('/beta/assets/imgs/ctc_screen_pc.jpg');
    background-position:0 center;
    background-repeat:no-repeat;
    background-size:110%;
}

#cashback_program .contents {position:absolute;top:80px;left:120px;width:27%;}
#cashback_program .title {font-size:40px;line-height:48px;font-weight:600}
#cashback_program .sub-title {font-size:35px;line-height:48px;font-weight:600}
#cashback_program .desc {font-size:26px;margin-top:30px;line-height:1.33}

#what_cybertronchain .contents {margin:130px 180px;padding:50px 0 50px 0}
#what_cybertronchain .title {font-size:64px;font-weight:600;text-align:center;}
#what_cybertronchain .cate2 {font-size:30px;font-weight:600;margin-top:110px}
#what_cybertronchain .cate2 span {font-size:24px;color:#8c8585;font-weight:300;margin-left:12px}
#what_cybertronchain .movie { margin-top:30px;padding:20px 30px; height:200px;}
#what_cybertronchain .desc {font-size:21px;font-weight:300;line-height:32px;padding:20px 0}
#what_cybertronchain .movie2 { margin-top:40px;padding:20px 0;}
#what_cybertronchain .movie2 ul {list-style-type:none;overflow:hidden;height:340px}
#what_cybertronchain .movie2 li {float:left; height:340px; font-size:20px;}


#why_ctc {
	position:relative;
	height:764px;
    background-image:url('/beta/assets/imgs/bg_why.jpg');
    background-position:300px 0;
    background-repeat:no-repeat;
    background-size:80%;
}
#why_ctc .contents {margin:0 16px;padding:155px 0 40px 730px}
#why_ctc .title {font-size:64px;font-weight:600}
#why_ctc .desc {font-size:22pt;margin-top:50px}
#why_ctc .button {margin-top:74px;}
#why_ctc .button ul {
    width:100%;
    margin-top:15px;
    overflow:hidden;
    list-style-type:none;
}
#why_ctc .button li {float:left;font-size:28pt;padding:13px 14px 9px 8px;height:60px;line-height:79px;font-weight:500;text-align:left}
#why_ctc .button li img {width:60px}
#why_ctc .button li:nth-child(1) {width:60px;text-align:center;margin-right:23px;background:#fffbe0;border-radius:60px;}
#why_ctc .button li:nth-child(2) {line-height:52px}

#why_ctc .why_puzzle {position:absolute;top:240px;left:150px;width:500px}
#why_ctc .why_puzzle img {width:100%}


#ctc_roadmap {background:#f7f7f7}
#ctc_roadmap .contents {margin:0 16px;padding:60px 0 20px 0}
#ctc_roadmap .cate {font-size:9.5pt;font-weight:200;color:#8c8585}
#ctc_roadmap .title {margin-left:120px;font-size:55px;font-weight:600;margin-top:36px;line-height:64px}
#ctc_roadmap .desc {font-size:11pt;margin-top:12px}
#ctc_roadmap .history {margin:50px 120px}
#ctc_roadmap .history > .year {width:80px;padding:8px 10px;font-size:28px;background:#ffea61;color:#000000;text-align:center;font-weight:700}
#ctc_roadmap .history table.list {width:100%;margin-top:22px;border-collapse:collapse;}
#ctc_roadmap .history tr {padding-top:20px;}
#ctc_roadmap .history td {padding:0;margin:0;}
#ctc_roadmap .history td.data3 {padding:18px 35px 0 5px;font-size:23px;font-weight:400; line-height:36px}
#ctc_roadmap .history td.data2 {width:49%}
#ctc_roadmap .history td.data2 .box {padding:18px 12px 22px 15px;background:#fff;margin-bottom:16px;margin-right:40px}
#ctc_roadmap .history td.data2 .box h1 {font-size:23px;font-weight:600}
#ctc_roadmap .history td.data2 .box h2 {font-size:20px;font-weight:600;margin-top:16px}
#ctc_roadmap .history td.data2 .box ul {margin-top:20px;margin-left:22px}
#ctc_roadmap .history td.data2 .box li {font-size:19px;line-height:22px;margin-top:5px}
#ctc_roadmap .history td.dot {position:relative;width:40px;border-left:2px solid #e7e7e7}
#ctc_roadmap .history td.dot img.circle {position:absolute;top:-6px;left:-8px;width:14px}
#ctc_roadmap .history td.dot img.arrow {position:absolute;top:0;right:0;width:30px}
#ctc_roadmap .history td.dot img.arrow_right {position:absolute;top:0;left:-42px;width:30px}
#ctc_roadmap .history td.dot img.circle_end {position:absolute;bottom:0px;left:-6px;width:10px}
#ctc_roadmap .history td.dot div.year {
	position:absolute;
	top:-40px;left:-55px;
	width:70px;
	padding:12px 19px;
	background:#ffea61;
	font-size:23px;
	font-weight:600;text-align:center}
#ctc_roadmap .history td.data {}
#ctc_roadmap .history td.data .box {padding:18px 12px 22px 15px;background:#fff;margin-bottom:16px;}
#ctc_roadmap .history td.data .box h1 {font-size:23px;font-weight:600}
#ctc_roadmap .history td.data .box h2 {font-size:20px;font-weight:600;margin-top:16px}
#ctc_roadmap .history td.data .box ul {margin-top:20px;margin-left:22px}
#ctc_roadmap .history td.data .box li {font-size:19px;line-height:22px;margin-top:5px}

#team .contents {margin:40px 16px;padding:80px 0 46px 0;text-align:center}
#team .title {font-size:80px;font-weight:600}
#team .desc {font-size:28px;margin-top:67px;line-height:36px;}

#team .team2 {padding:90px 100px;}
#team .team2 ul {width:100%;margin-top:30px;list-style-type:none;overflow:hidden}
#team .team2 li {float:left; width:21%; margin:0 2%;text-align:center}
#team .team2 li div {text-align:center;line-height:13px}
#team .team2 li div.name {font-size:24px;padding-top:24px;}
#team .team2 li div.position {font-size:30px;font-weight:600;margin:22px 0;}
#team .team2 li div.name2 {font-size:18px;padding-top:24px;}
#team .team2 li div.position2 {font-size:22px;font-weight:600;padding:19px 0;}
#team .team2 li img {width:84%}

#team .team3 {padding:10px 100px;}
#team .team3 ul {width:100%;margin-top:30px;list-style-type:none;overflow:hidden}
#team .team3 li {float:left; width:25%; text-align:center}
#team .team3 li img {width:66%}
#team .team3 li div {text-align:left;line-height:13px}
#team .team3 li div.title {font-size:40px;padding-top:19px;font-weight:500}
#team .team3 li div.desc {font-size:24px;font-weight:300;line-height:32px}
#team .team3 li div.name {text-align:center;font-size:18px;padding-top:24px}
#team .team3 li div.position {text-align:center;font-size:22px;font-weight:600;padding:18px 0;}

#contactus {
    width:100%;
	height:600px;
	margin-top:100px;
    background-image:url('/beta/assets/imgs/bg_contact.jpg');
    background-size:100%;
}
#contactus .contents {margin:0;padding:46px 520px 30px 130px}
#contactus .title {font-size:70px;font-weight:600}
#contactus .desc {font-size:29px;margin-top:56px;line-height:40px;}
#contactus .email {background:#111;text-align:center; line-height:50px;margin-top:70px;color:#fafafa;}
#contactus .email a {color:#fafafa;}
#contactus .social { height:90px;padding:30px 520px 30px 130px }
#contactus .social ul {width:75%;margin:14px auto;list-style-type:none}
#contactus .social ul li {float:left;width:25%}
#contactus .social ul li img {width:80%}

#footer {background:#111;padding:60px 10px 45px 10px; line-height:13px;text-align:center}
#footer * {color:#eee;font-size:17px;line-height:26px;font-weight:300}


#floating_menu {position:fixed; left:560px; top:553px; margin-left:50%; width:120px; z-index:50}
#floating_menu div {font-weight:300;font-size:15px}
#floating_menu .go_top {background:#000;color:#fff;height:32px;line-height:27px;text-align:center;}
#floating_menu .social {background:#ffea61;padding:16px 0;text-align:left;}
#floating_menu .social div {height:30px; line-height:30px; padding-left:33px; font-weight:normal;}
#floating_menu .social .go_kakao {
    background-image:url('/beta/assets/imgs/social_kakao.png');
    background-position:7px 6px;
	background-repeat:no-repeat;
    background-size:13%;
	overflow:hidden;
}
#floating_menu .social .go_band {
    background-image:url('/beta/assets/imgs/social_band.png');
    background-position:7px 6px;
	background-repeat:no-repeat;
    background-size:13%;
	overflow:hidden;
}
#floating_menu .social .go_telegram {
    background-image:url('/beta/assets/imgs/social_telegram.png');
    background-position:7px 6px;
	background-repeat:no-repeat;
    background-size:13%;
	overflow:hidden;
}
#floating_menu .social .go_twitter {
    background-image:url('/beta/assets/imgs/social_twitter.png');
    background-position:7px 6px;
	background-repeat:no-repeat;
    background-size:13%;
	overflow:hidden;
}