@charset "utf-8";
/*GLOBAL*/
#wrap{overflow-x: inherit;min-width : 1200px;}
.inner{ position: relative; max-width: 1200px;  width: 100%; margin: 0 auto; box-sizing: border-box; }
body{ opacity : 0;}
br{display : none}
br.br_a{ display : block;}
br.br_p{ display: block;}
br.br_m{ display: none;}
#wrap .pc{ display : block;}
#wrap .mo{ display : none;}
/*FONT SET*/
.ft_title{font-family: "Montserrat"; font-weight : 800;font-size : 120px;color : #ffffff;overflow: hidden;}
.ft_sub_title{ font-family: "Montserrat"; font-weight : 500;font-size : 24px; color: #ffffff;}
.ft_main_body{font-family: "Nanum Barun Gothic"; font-size: 17px; font-weight: 400; color : #ababab; line-height: 30px;}
.type_2 .ft_title{font-family: "Montserrat"; font-weight : 800;font-size : 80px;color : #ffffff;overflow: hidden;}
.type_2  .ft_main_body{font-family: "Nanum Barun Gothic"; font-size: 17px; font-weight: 400; color : #ababab; line-height: 30px;}
.ft_main_gnb{font-family: "Montserrat";font-size: 14px;color : #ffffff;}

.content .title{font-family: "Montserrat"; font-weight : 800;font-size : 60px; color: #222222; text-align: center;}
.content .body_txt{font-family: "Nanum Barun Gothic"; font-size: 17px; font-weight: 300; color : #222222; line-height: 30px;  text-align: center; }
.content .item_title{font-family: "Montserrat";font-weight:700;font-size : 15px;color: #222222;text-align: center;}
.content .item_text{font-family: "Nanum Barun Gothic"; font-size: 15px; font-weight: 300; color : #222222;  text-align: center;}
.content .charging_title{font-family: "Nanum Barun Gothic";font-size: 22px;font-weight: 700;color : #222222;}
.content .charging_list .title{ font-family: "Montserrat"; font-size: 16px; font-weight: 700; color : #222222;  text-align: center;}
.content .charging_list span{ font-family: "Nanum Barun Gothic"; font-size: 15px; font-weight: 300; color : #777777;  text-align: center;}
.content .banner_title{ font-family: "Nanum Barun Gothic";font-size: 25px;font-weight: 700;color : #222222; text-align: center;}
.content .banner_text{ font-family: "Nanum Barun Gothic";font-size: 19px;font-weight: 400;color : #222222; text-align: center;}

.content .publisher_title{ font-family: "Montserrat";font-size: 30px;font-weight: 800;color : #222222; text-align: center;}
.content .publisher_title.skyblue{ color: #00a1e9; }
.content .publisher_title.green{ color: #23ac39}
.content .publisher_text{ font-family: "Nanum Barun Gothic"; font-size: 15px; font-weight: 300;line-height: 23px; color : #777777;  text-align: center;}

/* motion wrap*/
.section h2, .section p, .section .title, .section h4{overflow: hidden;}
h3 span, h2 span, h4 span, p span{ display : block;}

/* HEADER*/
#header {position : fixed;top : 0;left : 0;width : 100%;z-index: 999;min-width: 1200px;height: 80px;background: rgba(255,255,255, 0);transition: .3s top ease-in-out;}
#header.color{ background: rgba(31,31,31, .85);}
#header.active{ top : -100px;}
.logo{display : block;position : absolute;top : 30px;left : 40px;font-size : 0;width: 220px;height: 35px;background : url(../images/logo.png) no-repeat;}
.logo a{     display: block; position: relative; width: 100%; height: 100%;}
.gnb{float : right;position: relative;top: 30px;right: 320px;}
.gnb .item{float : left;margin-left : 28px;position: relative;cursor: pointer;}
.gnb .item a{display : block;width : 100%;height: 100%;}
.gnb .item a:after{ content: ""; position : absolute; top : 120%; left : 0; width : 100%; height: 1px; background: #ffffff;
	transform: scaleX(0); transition : .3s all ease-in-out;
}
.gnb .item a:hover:after, .gnb .item a.active:after{
	transform: scaleX(1);
}

#header .login_box{float: right;position: absolute;top: 30px;right: 20px;}
#header .login_box a{display: inline-block;margin-left: 10px; transition: .3s ease; background-color: rgba(0,0,0,0);
	font-family: "Nanum Barun Gothic";font-size: 12px;font-weight: 700;color : #999999;text-align: center;padding: 5px 10px;border: 1px solid #999;box-sizing: border-box;}
#header .login_box a:hover{ background: rgba(255,255,255,1); color: #20ab49; font-weight: 700; }

.visual{ min-width : 1200px; height: 1093px; z-index: 10; }
.visual .visual_box{ position : absolute; width : 100%; }
.visual .visual_box li{ position : absolute; top : 0; width : 100%; margin : 0 auto; opacity : 0;}
.visual .visual_box li:first-child{
	background: url(../images/pc/visual_1.jpg) no-repeat;background-size: cover;height: 1093px;min-width: 1200px;background-position: 50% 50%;}
.visual .text_box{padding-top: 240px;}
.visual .text_box .sub_title{ margin-top : 35px; background: linear-gradient(to right,#20ab49, #1d93d1 20%, #e6332a 34%);
	-webkit-background-clip: text; -webkit-text-fill-color: transparent; }

.visual .visual_box .vs2{
	opacity:  0;
	background: url(../images/pc/visual_2.jpg) no-repeat;background-size: cover;height: 1093px;min-width: 1200px;background-position: 50% 50%;
}

.visual .text_box.type_1 .sub_title{background: url(../images/pc/ad-tech.png) no-repeat;width: 330px;height: 23px;}
.visual .text_box.type_2{text-align: center; padding-top : 600px;}
.visual .ta_box{
	position : absolute;
	margin-top : 190px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	 display: flex;
	width : 375px;
	height : 353px;
	/*align-items: center;*/
}
.visual .ta_box .ta{ width : 100%; position : absolute; display: block; }

.visual .text_box .main_body{ margin-top : 20px;}

.visual .circle_box{ margin-top :30px;}
.visual .circle_box p{ width : 150px; height : 150px; font-family: "Montserrat";font-weight:700;font-size : 17px;color: #ffffff;text-align: center;border-radius: 50%;
display: inline-block; box-sizing: border-box; padding : 65px 0; margin-left : -25px; }
.visual .circle_box p:nth-child(1){ margin-left : 0px; background: rgba(0,161,233,.5)}
.visual .circle_box p:nth-child(2){ background: rgba(233,50,40,.5)}
.visual .circle_box p:nth-child(3){ background: rgba(24,171,31,.5)}
.introduce .title{ margin-top : 150px;}
.introduce .body_txt{ margin-top : 35px;}
.introduce .item_box{ margin-top : 70px; padding-bottom: 15px; }
.introduce li{ float: left; margin-left : 78px;}
.introduce li .item{width:800px;height:681px;margin-left:120px;border-radius: 100px;-webkit-box-shadow: 21px 36px 64px -13px rgba(0,0,0,0.1);-moz-box-shadow: 21px 36px 64px -13px rgba(0,0,0,0.1);box-shadow: 21px 34px 54px -12px rgba(0,0,0,0.08);/* -webkit-box-shadow: 21px 28px 34px 1px rgba(0,0,0,0.14); */-moz-box-shadow: 21px 28px 34px 1px rgba(0,0,0,0.14);/* box-shadow: 21px 28px 34px 1px rgba(0,0,0,0.14); */}
.introduce li .text_box{ margin-top : 25px;}
.introduce li .text_box .item_text{margin-top : 10px;}
.introduce .item_1 .item{ background: url(../images/introduce_box_1.jpg) no-repeat; }
.introduce .item_2 .item{ background: url(../images/introduce.png) no-repeat; background-size: 800px 681px;}
.introduce .item_3 .item{ background: url(../images/introduce_box_3.jpg) no-repeat; }

.introduce .charging_box{position : relative;margin-top : 50px;margin-left: 90px;}
.introduce .charging_box h4:after{ position : absolute; top: 2px; left: -24px; content : ""; background: url(../images/chargin_icon.jpg) no-repeat;
	width : 18px; height : 18px; }
.introduce .charging_list{margin-top : 35px;padding-bottom: 140px;}
.introduce .charging_list li:first-child{margin-left: 58px;}
.introduce .charging_list li{float : left;margin-left: 34px;width: 250px;}
.introduce .charging_list p{padding: 38px;border: 1px dashed;width: 75px;border-radius: 50%;box-sizing: border-box;margin: 0 auto;text-align: center; background-repeat: no-repeat;}
.introduce .charging_list p.type_1{background-image: url(../images/ico/ico_introduce_1.png);background-position: center center; }
.introduce .charging_list p.type_2{background-image: url(../images/ico/ico_introduce_2.png);background-position: center center; }
.introduce .charging_list p.type_3{background-image: url(../images/ico/ico_introduce_3.png);background-position: center center;}
.introduce .charging_list p.type_4{background-image: url(../images/ico/ico_introduce_4.png);background-position: center center;}
.introduce .charging_list p.type_5{background-image: url(../images/ico/ico_introduce_5.png);background-position: center center;}
.introduce .charging_list p.type_6{background-image: url(../images/ico/ico_introduce_6.png);background-position: center center;}

.introduce .charging_list>.title{text-align: center;display: block;margin-top: 10px;}
.introduce .charging_list span{ text-align: center;display: block; margin-top: 10px;}

.parallax_box{
	background: url(../images/pc/introduce_back_bg_1.jpg) no-repeat;
	background-attachment: fixed;
	background-size: cover;
	color: #fff;
	width: 100%;
	height: 350px;
	display: flex;
	/* justify-content: center; */
	align-items: center;
}

.function{ background: #f7f7f7;}
.function .title{ padding-top : 150px;}
.function .body_txt{ margin-top : 35px;}
.function .target_box{position : relative;margin-top : 80px;padding-bottom: 90px; border-bottom: 1px solid #e7e7e7;}
.function .target_box>li{ width : 50%; float: left; box-sizing: border-box;}
.function .target_box>li::after { content: ""; clear: both; display: table; }
.function .target_box>li .item{width : 290px;height : 240px;border-radius: 75px;background: #000000;float: left;background-size: cover;}
.function .target_box>li .item.type_1{background: url(../images/pc/function_1.png) no-repeat;}
.function .target_box>li .item.type_2{background: url(../images/pc/function_2.png) no-repeat;}
.function .target_box>li .item.type_3{background: url(../images/pc/function_3.png) no-repeat;}
.function .target_box>li .item.type_4{background: url(../images/pc/function_4.png) no-repeat;}
.function .target_box>li .item.type_5{background: url(../images/pc/function_5.png) no-repeat;}
.function .target_box>li .item.type_6{background: url(../images/pc/function_6.png) no-repeat;}

.function .target_box>li .text_box{float: left;margin-top: 50px;margin-left: 30px;}
.function .target_box>li .text_box p{font-family: "Nanum Barun Gothic"; font-size: 15px; font-weight: 300; line-height: 22px; color : #222222;  }
.function .target_box>li .text_box ul{margin-top :20px;margin-left: 15px;}
.function .target_box>li .text_box li:first-child{ margin-top : 0;}
.function .target_box>li .text_box li:after{ content : ""; background : url(../images/dot_icon.png)no-repeat;
	width : 4px; height : 4px; position : absolute; top: 6px; left: -14px; font-size: 1px; color: #00a1e9; }
.function .target_box>li .text_box li{font-family: "Nanum Barun Gothic";font-size: 15px;font-weight: 700;color : #222222;position: relative;margin-top: 13px;}
.function .target_box>li .gap{ margin-bottom: 40px;}

.partners .title{margin-top: 150px;}
.partners .body_txt{ margin-top : 35px;}
.partners .item_box{position : relative;width : 1010px;margin : 0 auto;margin-top : 65px;padding-bottom: 20px;}
.partners .item_box.last{ padding-bottom: 90px;}
.partners .item_box h4{ text-align: center; font-family: "Nanum Barun Gothic"; font-size: 22px; font-weight: 700; line-height: 22px;
	color : #222222; overflow: inherit; padding: 15px 30px; border: 1px solid #222222; background: #fff;
	display: table; margin-left: auto; margin-right: auto; border-radius: 25px; position: relative; }
.partners .item_box:before{content: "";position : absolute;top: 26px;height : 1px;width: 100%;background: #222222;}

.partners .item_box li{float : left;box-sizing: content-box;width: 16%; height : 67px;margin-bottom: 25px;}

.advertiser{/* margin-top: 150px; */background: #f0f0f0;position: relative;/* top: 0; */}
.advertiser .title{position: relative;padding-top: 150px;}
.advertiser .body_txt{ margin-top : 35px;}
.advertiser .banner_pc{ margin-top : 75px; }
.advertiser .banner_pc ul{display: table;width: 90%;margin-left: 5%; margin-top :25px; padding-bottom: 90px; border-bottom: 1px solid #dadada;}
.advertiser .banner_pc ul li{display: table-cell;position: relative;width: 30%;margin-left: auto;margin-right: auto;}
.advertiser .banner_pc ul li p{ padding-bottom: 10px;}
.advertiser .banner_pc ul li img{display: block; margin-left: auto; margin-right: auto;}
.advertiser .banner_mobile{ margin-top : 90px;}
.advertiser .banner_mobile ul{display: table;width: 90%;margin-left: 5%; margin-top :25px; padding-bottom: 90px; border-bottom: 1px solid #dadada;}
.advertiser .banner_mobile ul li{display: table-cell;position: relative;width: 30%;margin-left: auto;margin-right: auto;}
.advertiser .banner_mobile ul li p{ padding-bottom: 10px;}
.advertiser .banner_mobile ul li img{display: block; margin-left: auto; margin-right: auto;}

.advertiser .banner_play{ margin-top : 90px;}
.advertiser .banner_play ul{display: table;width: 90%;margin-left: 5%;margin-top :25px;padding-bottom: 90px;}
.advertiser .banner_play ul li{display: table-cell;position: relative;width: 45%;margin-left: auto;margin-right: auto;}
.advertiser .banner_play ul li p{ padding-bottom: 10px;}
.advertiser .banner_play ul li>img{display: block; margin-left: auto; margin-right: auto;}

.publisher .title{position: relative;padding-top: 150px;}
.publisher .body_txt{ margin-top : 35px;}
/*.publisher .item_box{margin-top: 75px;padding-bottom: 90px;border-bottom: 1px solid #dadada;}*/
.publisher .item_box{margin-top: 75px;padding-bottom: 250px;border-bottom: 1px solid #dadada;}
.publisher .item_box h4{ margin-top : 32px;}
.publisher .item_box p{ margin-top : 20px;}
.publisher .item_box li{float : left;border : 1px solid #dfdfdf;border-radius : 75px;width: 543px;height : 335px; margin-left : 40px;}
.publisher .item_box .item_1{background: url(../images/publisher_bg_3.jpg) no-repeat;background-position-x: 20;}
.publisher .item_box .item_2{background: url(../images/publisher_bg_4.jpg) no-repeat; background-position-y: 0;}
.publisher .item_box li:first-child{/* margin-right: 0; */}

.strength{/* margin-top: 150px; */background: #f0f0f0;position: relative;/* top: 0; */}
.strength .title{position: relative;padding-top: 150px;}
.strength .body_txt{ margin-top : 35px;}
.strength .item_box{margin-top: 25px;padding-bottom: 90px;border-bottom: 1px solid #dadada;}
.strength .item_box h4{ margin-top : 32px;}
.strength .item_box p{ margin-top : 20px;}
.strength .item_box li{float : left;border : 1px solid #dfdfdf;border-radius : 75px;width: 543px;height : 335px; margin-left : 40px;}
.strength .item_box .item_1{background: url(../images/publisher_bg_3.jpg) no-repeat;background-position-x: 20;}
.strength .item_box .item_2{background: url(../images/publisher_bg_4.jpg) no-repeat; background-position-y: 0;}
.strength .item_box li:first-child{/* margin-right: 0; */}
.strength .video{width:1200px; height:675px;}

.contact{background: url(../images/contact_bg.jpg) no-repeat;background-size: cover;background-position: 50% 50%;}
.contact .title{position: relative;padding-top: 150px;}
.contact .body_txt{ margin-top : 35px;}
.contact .form_box{position: relative;margin-top : 55px;padding: 0 345px 150px 355px;}
.contact .form_box input, .contact .form_box textarea{ padding: 21px; box-sizing: border-box; border: 1px solid #5e5e5e;border-radius: 5px;
font-size :15px; color: #777777; font-family: "Nanum Barun Gothic"; font-weight: 300;
}
.contact .form_box .name{ width : 48%; float: left;}
.contact .form_box .phone{ width : 48%;float: right}
.contact .form_box .email{ width : 100%; margin-top : 20px; }
.contact .form_box .contactArea{ width : 100%;  margin-top : 20px; overflow: hidden;}
.contact .check{ position : relative; display: inline-block; margin-top: 20px; margin-left: 15px;
	font-size :14px; color: #222222; font-family: "Nanum Barun Gothic"; font-weight: 700;
}
.contact .inputCheck{position: absolute;left: -999px;/* font-size: 0; */visibility: hidden;/* width: 0; *//* height: 0; *//* top: 0; */}
.contact label{position: relative;padding-left: 30px;margin-top: 1px;display: block;background: #fff;padding: 10px 10px 10px 40px; border: 1px solid #5e5e5e; border-radius: 5px;}
.inputCheck:checked + label:before { background-position: 100% 0; }
.inputCheck + label:before { content: ""; position: absolute; left: 10px; top: 50%; margin-top: -9px; display: block;
	width: 17px; height: 17px; background: url(../images/input_check.png) no-repeat; background-size: auto 100%;
}

.form_box .summit{ display: block; font-size :19px; background : #00a1e9; border-radius: 5px; margin : 0 auto; margin-top : 25px;
	box-sizing : border-box; padding : 20px 77px;color: #ffffff; font-family: "Nanum Barun Gothic"; font-weight: 700;}

/* FOOTER LOADMAP OURTEAM*/
#footer {background-color: #222222;}
#footer .inner {position:relative;min-width:320px;max-width:1200px;margin:0 auto;padding: 50px 0 53px;box-sizing:border-box;}
#footer .footerLogo {position: relative;top: 0x;left:0;height: 28px;padding-bottom: 15px;}
#footer span, #footer address { font-size:13px; font-family: "Nanum Barun Gothic"; font-weight: 300; color: #7a7a7a;}
#footer .companyInfo {text-align: left;}
#footer .companyInfo > * {line-height:20px;color:#7a7a7a;display: inline-block;}
#footer .companyInfo .company{ font-weight: 700; display: block;}
#footer .companyInfo span{ display: block;}
#footer .companyInfo .txt span + span { position:relative; padding:0 0 0 17px; display: block; }
/*#footer .companyInfo .txt span + span:before { content:'|'; position:absolute; top:50%; left:6px; width:2px; height:12px; margin:-7px 0 0; background-color:#9ca1af; }*/
#footer .copyright {margin:16px 0 0;text-align: left;color:#545454; font-family: "Montserrat";font-weight:400;font-size : 11px;}
#footer .pr_box{position: relative;float: right;margin-top: -70px;}
#footer .pr_box ul{ float: left;}
#footer .pr_box li{float: left;width: 20px;padding: 5px;margin-left: 5px;box-sizing: content-box;}
#footer .download{float: left;width: 180px;margin-left: 30px;}
.section > .inner {max-width:1200px;min-width: 1200px;margin:0 auto;box-sizing:border-box;/* width: 360px; */}

.mouse {
	width: 40px;
	height: 60px;
	border-radius: 20px;
	border: 2px solid #fbfdff;
	box-sizing: border-box;
	text-align: center;
	display: inline-block;
	position: relative;
	margin-top: 980px;
}
.mouse:before, .mouse:after {
	content: "";
	display: block;
	position: absolute;
	box-sizing: border-box;
}

/* Fifth */
.m-4:before, .m-4:after {
	box-sizing: border-box;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	top: 5px;
	left: calc(50% - 3px);
	background: #999;
	opacity: 0.15;
	-webkit-animation: m-4-ball 1s ease-in-out infinite;
	animation: m-4-ball 2s ease-in-out infinite;
}
.m-4:after {
	box-sizing: border-box;
	-webkit-animation-delay: 1s;
	animation-delay: 1s;
}

@keyframes m-4-ball {
	50% {
		opacity: 1;
	}
	47.5%, 52.5% {
		-webkit-transform: translateY(10px);
		transform: translateY(10px);
	}
	100% {
		-webkit-transform: translateY(20px);
		transform: translateY(20px);
	}
}

.map_box{ position : relative; width : 100%; }
#map{
	position : relative;
	width : 100%;
	height : 350px;
	min-width : 1200px;
}