/*@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
 *{font-family:'Malgun Gothic';} */
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
*{font-family:"Noto Sans KR",/*"Nanum Gothic",*/ sans-serif}
 

*:focus,*:focus{outline:none}
html,body{height:100%;min-width:1250px}
p{margin:0}
ul{padding-left:0}
li{list-style:none}
div ul li{display: inline; color:#7b7b7b;}
textarea{resize: none;text-align: left!important}
a,a:link,a:visited,a:hover{color:inherit;text-decoration:none}
.cursor{cursor:pointer}

.nav-tabs>li>a:hover{border-color:#eee !important}
.text-left{text-align:left!important}
.full-width{width:100%}
.harf-width{width:50%}
.inline-block{display: inline-block}
.fl{float:left}
.fr{float:right}
.bold{font-weight:bold !important}

/* header */
#header{
	position:fixed; 
	top:0; 
	z-index:999; 
	width:100%; 
	height:80px; 
	background-color:white; 
	background-image:none; 
	border-bottom:1px solid #E5E5E5; 
	
}
#header .header-wrap{position:relative; width:1100px; margin:0 auto; height:80px}
#header .header-menu{
	position:relative; 
	width:100%; 
	margin:0 auto; 
	height:60px; 
	border-bottom: 1px solid #E5E5E5;
	background-color: #ffffff;
	animation-name: change_menu_bak;
	animation-delay: 1.5s;
	-webkit-animation-delay: 1.5s;
	animation-duration: 2s;
	-webkit-animation-fill-mode: forwards;
}
#header .header-menu.ani-none{
	background-color: #484848;
	border-bottom: 1px solid #484848;
	color: #ffffff!important;
	animation: none;
}
#header .logo{position:absolute; top:20px; left:0px}
#header .gnb{position:absolute; right:0px; color:black}
#header .gnb>ul{display: block}
#header .gnb>ul>li{
	position:relative; 
	font-weight:500; 
	text-align:center; 
	float:left; 
	margin-left:40px; 
	height:80px; 
	line-height:80px; 
	color:#000;
}
#header .gnb>ul>li>img{display:none}
#header .gnb>ul>li.font-active>img{display:block; position:absolute; left:50%; margin-left:-5px; bottom:16px}
#header .menu{
	position:relative; 
	width:1100px; 
	margin:0 auto;
}
#header .menu ul>li{
	height:60px; 
	line-height:60px;
	animation-name: change_font;
	animation-delay: 2s;
	-webkit-animation-delay: 2s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: forwards;
}
#header .menu ul>li.font-active {
	color: #3bba41;
	animation-name: no_change_font;
	animation-delay: 2s;
	-webkit-animation-delay: 2s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: forwards;
}

#header .header-menu.ani-none .menu ul>li{
	color: #ffffff;
	animation: none;
}
	
@keyframes change_menu_bak{
	from {
		background-color: #ffffff;
	}

	to {
	    background-color: #484848;
	    border-bottom: 1px solid #484848;
	}
}

@keyframes change_font{
	from {
		color: #00000;
	}

	to {
	    color: #ffffff;
	}
}

@keyframes no_change_font{
	from {
		color: #3bba41;
	}

	to {
	    color: #3bba41;
	}
}
#header div.gnb ul li:hover{color:#3bba41;}
.gnbsolution{width:118px; height:104px; background:#fff; position:absolute; z-index:999; top:63px; left:-30px; border:1px solid #dedede; border-radius:6px; display:none;}
li.btnsolution:hover .gnbsolution{display:block; color:#7b7b7b;}
.btnsolution{width:55px; text-align:left !important}
.gnbsolution > div{font-size:13px; height:34px; width:100%; }
.gnbsolution > div:after{border-bottom:1px solid #dedede;}
.gnbsolution > div:last-child:after{border-bottom:0 !important;}
.gnbsolution > div:after, .gnbsolution:after{content:""; display:block; clear:both;}
.gnbsolution > div > a{color:#7b7b7b; display:block; height:34px; line-height:34px; text-align:center;}
.gnbsolution > div > a:hover{color:#3bba41;}


/* footer */
.top_footer { position:relative; width:100%; height:250px; background:#383b40; color:#959595; }
.top_footer h2 { font-size:15px; font-weight:bold; letter-spacing:0.8px; margin-top:0 !important;}
.top_footer .about { float:left; width:380px; padding-right:25px;}
.top_footer .about p { font-size:13px; line-height:18px; margin-top:20px; }

.top_footer .business { float:left; padding:0 60px; width:305px; height:180px; border-right:1px solid #555; }
.top_footer .business ul { margin-top:30px; padding-left:0 }
.top_footer .business ul li { width:80px; height:140px; margin-left:24px; float:left; }
.top_footer .business ul li.payat { margin-left:0; }
.top_footer .business ul li div { width:100%; height:100px; background-position:50%;}
.top_footer .business ul li.payat div { background:url('/appimages/web/footer/footmenu_payat_off.png') no-repeat center; }
.top_footer .business ul li.payat:hover div { background:url('/appimages/web/footer/footmenu_payat_on.png') no-repeat center; }
.top_footer .business ul li.payat:hover p { color:#3bba41; }
.top_footer .business ul li.game div { background:url('/appimages/web/footer/footmenu_service_off.png') no-repeat center; }
.top_footer .business ul li.game:hover div { background:url('/appimages/web/footer/footmenu_service_on.png') no-repeat center; }
.top_footer .business ul li.game:hover p { color:#3bba41; }
.top_footer .business ul li.sw div { background:url('/appimages/web/footer/footmenu_software_off.png') no-repeat center; }
.top_footer .business ul li.sw:hover div { background:url('/appimages/web/footer/footmenu_software_on.png') no-repeat center; }
.top_footer .business ul li.sw:hover p { color:#3bba41; }
.top_footer .business ul li p { text-align:center; font-size:11px; line-height:20px; }
.top_footer .business ul li p.title { font-size:18px; color:#fff; font-family: "Noto sans KR";}
.top_footer .smenu {float:left; padding-left:60px;}
.top_footer .smenu div { height:50px; margin-bottom:20px; padding-left:60px; }
.top_footer .smenu div h2 { font-size:14px; margin-top:0 !important; margin-bottom:11px; }
.top_footer .smenu div a { margin-right:5px; }
.top_footer .smenu div a:hover{color:#3bba41;}
.top_footer .smenu div.s1 { background:url('/appimages/web/footer/footmenu_icon_recruit.png') no-repeat 0 0; }
.top_footer .smenu div.s2 { background:url('/appimages/web/footer/footmenu_icon_service.png') no-repeat 0 0; }
.top_footer .smenu div.s3 { background:url('/appimages/web/footer/footmenu_icon_sns.png') no-repeat 0 0; }
/*.smenu a:hover{color:#3bba41;}*/
.footertop{width:1100px; margin:0 auto; padding-top:34px; height:218px;}



#footer { width:100%; height:140px; margin:0 auto; background:#2f3135; }
#footer p { color:#a9a9a9; font-family: "noto sans KR"; padding-top:25px; text-align:center; line-height:25px; font-weight:300;}
#footer p.copyright { font-size:11px; padding-top:15px; color:#878787; }

/* company */
.business-wrap{background-color:white; text-align:center}
.business-wrap .rep{width:100%; display:inline-block; /*margin-top:35px;*/}
.business-wrap .rep>div{display:inline-block; width:33%}
.business-wrap .rep p{font-weight:bold; font-size:20px; margin:25px 0px 19px 0px; color:#343235;}
.business-wrap .rep .explan{color:#343235; margin:0 auto; font-size:13px; line-height:1.8; text-align:center;}
.title-wrap{margin-bottom:30px}
.title-wrap .text{color:#2b2b2b; font-size:15px; line-height:1.8; border-bottom:1px solid #dedede; padding-bottom:25px; margin:25px 0px 50px 0px; font-weight:300}
.word-wrap{width:100%; margin-top:25px; margin-bottom:90px}
.word-wrap > div > div{color:#1b1b1b;}
.greenhover:hover{color:#41b74b;}

/* service */
.service-title{height:110px; border-bottom:1px solid #dedede}
.service-title .title-wrap{float:left; margin-top:15px}
.service-content .logo{float:left; width:150px}
.service-content .content{position:relative; float:right; width:calc(100% - 153px)}
.service-content .content .service .title{font-size:36px; letter-spacing:3px}
.service-content .content .service .info{font-size:16px; color:#7b7b7b; margin:10px 0px 20px 0px}
.service-content .content .service .text{font-size:16px; color:#1b1b1b; margin-bottom:40px; line-height:1.7}
.service-content .content .feature{display:inline-table; width:29%; margin-top:45px; margin-right:4.8%;}
.service-content .content .feature.fr{margin-right:0;}
.service-content .content .feature.center{text-align:center; display:inline-grid}
.service-content .content .feature.center div{text-align:left;}
.service-content .content .feature .title{font-size:16px; display:block; width:100%; font-weight:500; margin-bottom:10px !important; color:#343235;}
.service-content .content .feature .text{font-size:14px; color:#343235; display:block; width:100%; line-height:1.6; font-weight:300; word-break:keep-all;}

.carousel-mobile{position:relative; height:473px; margin-bottom:30px}
.carousel-mobile .image {position:absolute}
.carousel-mobile .image.right{right:0px}
.carousel-mobile .img-mobile{position:absolute; left:50%; margin-left:-127px; top:45px; z-index:99}
.carousel-mobile .carousel{position:absolute !important; width:100%; height:475px;}
.carousel-mobile .carousel-inner{width:210px; margin:auto; top:107px; z-index:100}
.carousel-mobile .carousel-right{left:inherit; right:0px}
.carousel-mobile .carousel-control{opacity:1}
.carousel-mobile .carousel-control:hover{opacity:0.4}
.carousel-mobile .carousel-left img,.carousel-mobile .carousel-right img{position:relative; top:210px}
.carousel-mobile .carousel-indicators {right:0px; bottom:-50px; margin-left:-30%; z-index:100}
.carousel-mobile .carousel-indicators li{ width: 8px; height: 8px; border: 0; margin: 0 2px; background-color: #e6e6e6; }
.carousel-mobile .carousel-indicators .active{ background-color: #363dcd; }
.carousel-mobile .hide-left{position:absolute; width:50px; top:30px; left:275px; height:700px; z-index:80}
.carousel-mobile .hide-right{position:absolute; width:50px; top:30px; left:625px; height:700px; z-index:80}


.carousel-mobile.p2p{background-image:url(/appimages/web/service/p2p/bg.jpg)}
.carousel-mobile.p2p .carousel-indicators .active{background-color: #4783fc}
.carousel-mobile.property{background-image:url(/appimages/web/service/property/bg.jpg)}
.carousel-mobile.property .carousel-indicators .active{background-color: #ee261c}
.carousel-mobile.asmr{background-image:url(/appimages/web/service/asmr/bg.jpg)}
.carousel-mobile.asmr .carousel-indicators .active{background-color: #de3232}
.carousel-mobile.kids{background-image:url(/appimages/web/service/kids/bg.jpg)}
.carousel-mobile.kids .carousel-indicators .active{background-color: #f85262}
.carousel-mobile.payat{background-image:url(/appimages/web/service/payat/bg.jpg)}
.carousel-mobile.payat .carousel-indicators .active{background-color: #43a2d8}
.carousel-mobile.payat2{background-image:url(/appimages/web/service/payat2/bg.jpg)}
.carousel-mobile.payat2 .carousel-indicators .active{background-color: #886743}
.carousel-mobile.bill{background-image:url(/appimages/web/service/bill/bg.jpg)}
.carousel-mobile.bill .carousel-indicators .active{background-color: #2847ce}
.carousel-mobile.shop{background-image:url(/appimages/web/service/1min/bg.jpg)}
.carousel-mobile.shop .carousel-indicators .active{background-color: #f72e3e}
.carousel-mobile.code{background-image:url(/appimages/web/service/code/bg.jpg)}
.carousel-mobile.code .carousel-indicators .active{background-color: #029268}
.carousel-mobile.payment{background-image:url(/appimages/web/service/payment/bg.jpg)}
.carousel-mobile.payment .carousel-indicators .active{background-color: #43a2d8}
.carousel-mobile.mango{background-image:url(/appimages/web/service/mango/bg.jpg)}
.carousel-mobile.mango .carousel-indicators .active{background-color: #0c61d6}
.carousel-mobile.livesem{background-image:url(/appimages/web/service/livesem/bg.jpg)}
.carousel-mobile.livesem .carousel-indicators .active{background-color: #fc3a60}



.division-line{margin:0px 10px}

/* request */
ul.dev-step{text-align:left; padding-left:18px}
ul.dev-step li{display:inline-block; vertical-align:top; height:150px; text-align:center; width:200px; margin-top:20px;}
ul.dev-system{margin-top:30px}
ul.dev-system li{display:block; border-bottom:1px solid #dedede; padding:8px 0px; margin-top:0;}
ul.dev-design{padding-left:50px; margin-top:55px; text-align:left}
ul.dev-design li{display:inline-block; width:33%; height:320px; vertical-align:top}
ul.dev-design li .title{}
ul.dev-design li .text{margin-top:20px; color:white; line-height:1.9; font-weight:300;}

.major-wrap{width:50%; height:150px; }
.major-wrap .img{width:120px;height:120px;float:left}
.major-wrap .content{display:table; padding:10px 0px 0px 30px}
.major-wrap .content .title{color:#343235; font-weight:500; font-size:16px}
.major-wrap .content .info{color:#7b7b7b; margin:3px 0px 10px}
.major-wrap .content .text{color:#343235; line-height:1.7; font-weight:300;}
.major .word-wrap{margin-bottom:0px}
.major .fs-text{margin-top:0}
.explan-text{font-size:14px!important; margin:0px 0px 60px;}
div.title-wrap > div.fr{color:#9b9b9b;}
div.title-wrap > div.fr > span{margin:0 15px; font-size:8px;}

.grid-wrap{display:inline-block; width:352px; height:390px; border:1px solid #dedede; margin:0px 17px 20px 0;}

.grid-wrap img{width:100%}
.grid-wrap .content{padding:20px 0px 0px 20px}
.grid-wrap > div.content > div.fs-subtitle{width:320px; height:25px; overflow:hidden;}
.grid-wrap > div.content > div.info{width:320px; height:20px; overflow:hidden;}
.list-wrap{display:inline-block; border-bottom:1px solid #dedede; padding:30px 0px; width:1100px;}
.list-wrap img{float:left}
.list-wrap .content{display:table;padding-left:50px}
.list-wrap .content .info{color:#a1a1a1; font-size:15px; margin-top:3px; font-weight:300}
.list-wrap .content .text{color:#a1a1a1; font-size:14px; color:#a1a1a1; font-weight:300; margin-top:10px; line-height:1.5}
.info{color:#7b7b7b; font-weight:300;}
.fs-text > span{color:#2b2b2b;}
div#grid > a:nth-child(3n) > .grid-wrap{margin-right:0 !important;}
div#grid > a:nth-child(3n) > .grid-wrap:after{display:block; clear:both; content:""}


.btn-portfolio{width:60px; height:60px; background-repeat:no-repeat; background-position:50% 50%; background-color:white; border:1px solid #dedede}
.btn-portfolio.prev{background-image: url(/appimages/web/btn_portfolio_prev_off.png); border-right:0px}
.btn-portfolio.prev:hover{background-image: url(/appimages/web/btn_portfolio_prev_on.png); background-color: #31b44a; border:1px solid #31b44a;}
.btn-portfolio.next{background-image: url(/appimages/web/btn_portfolio_next_off.png)}
.btn-portfolio.next:hover{background-image: url(/appimages/web/btn_portfolio_next_on.png); background-color: #31b44a; border:1px solid #31b44a;}
.btn-close{width:60px; height:60px; border:0; border-radius:100%; background-color:#dedede; background-image:url(/appimages/web/btn_close.png); background-position:50% 50%; background-repeat:no-repeat}
.btn-close:hover{width:60px; height:60px; border:0; border-radius:100%; background-color:#31b44a; background-image:url(/appimages/web/btn_close.png); background-position:50% 50%; background-repeat:no-repeat}
.detail-view-img{ text-align: left; }
.detail-view-img img{ width: 490px; margin:0px 0px 50px 46px}
.detail-view-img img:first-child{margin-left:0}
.detail-view-img.list_3 img { width: 320px; }

.process{width:100%; height:760px; background-size:contain; margin-top:70px; background-position:0px 80px; background-repeat:no-repeat; background-image:url(/appimages/web/process/process_map.png)}
.process li{display:inline-block; width:24%; height:270px; text-align:center; vertical-align:top}
.process .title{margin-top:45px; font-size:16px; font-weight:600; margin-bottom:10px; color:#2b2b2b;}
.process .text{color:#2b2b2b; line-height:1.6; font-weight:400;}
ul.dev-process{margin-top:50px; text-align:left;}
ul.dev-process:after{display:block; content:""; clear:both;}
ul.dev-process > li{display:inline-block; width:48%; float:left; vertical-align:top; color:#fff; }
ul.dev-process > li:last-child{margin-left:4%;}
ul.dev-process > li > div.text{margin-top:20px; line-height:1.6; font-weight:300; word-break:keep-all;}
div.box-process{background:url(/appimages/web/process/process_box.png); width:1100px; height:120px; margin-top:24px;}
div.box-process > div{color:#fff; padding:36px 50px;}
div.box-process > div > img{float: left; margin-right:20px;}
div.box-process > div > span{float: left; line-height:1.6; font-weight:300;}


.history{display:table; width:100%; margin-bottom:65px}
.history div{display:inline-block}
.history .year{position:absolute}
.history ul{width:100%; float:left}
.history li{width:100%; font-size:15px; color:#2b2b2b; display:block; margin-bottom:15px; font-weight:400;}
.history li .no{margin:0px 50px 0px 167px; width:15px}
.history li .platform{float:right; color:#7b7b7b;}
li.ft-green > .platform{color:#41b74b;}
.history li:hover div{color:#41b74b;}


.request{width:100%; margin-bottom:50px}
.request th{border:1px solid #dedede; background-color:#f1f1f1; height:54px; text-align:center}
.request td{border:1px solid #dedede; padding:0px 20px}
.request td input{border:0}
table.request > tbody > tr > td > select{background:url(/appimages/web/arrow_drop_off.png) no-repeat 95% 50%; -webkit-appearance:none; -moz-appearance:none; appearance:none; width:100%; border:0;}
select::-ms-expand{display: none;}

hr.title-line{width:80px; margin:30px auto; border-top:1px solid #4b4b4b}

/* recruit */
.team-wrap{padding-bottom:0px !important}
.team-wrap .content-wrap{width:auto}
.team-wrap .title-wrap{width:1100px; margin:0 auto}
.team-wrap .word-wrap{text-align:center}
.team-wrap .fs-subtitle{font-weight:bold}
ul.person_list li{display:inline-block; text-align:center; color:#4b4b4b; margin:20px 50px 0px 0px}
ul.person_list li:last-child{margin-right:0}
ul.person_list li .img_person{display:block; margin-bottom:10px}
ul.person_list li .position{font-size:16px}
ul.person_list li .line{margin:-5px 4px 0px}
ul.person_list li .name{font-size:13px}
.team-wrap > .content-wrap > .word-wrap > .fs-subtitle{color:#2b2b2b; font-weight:500; font-size:20px;}
.team-wrap > .content-wrap > .word-wrap > .fs-text{color:#1b1b1b; margin-top:5px; }
.team-wrap > .content-wrap > .word-wrap > ul.person_list > li > span.name{font-size:16px;}

.welfare{width:100%}
.welfare td{padding:25px; height:160px; vertical-align:top; border:1px solid #dedede}
.welfare .image{float:left; width:20%}
.welfare .info{float:left; width:80%}
.welfare .info .title{font-size:18px; font-weight:500; color:#1b1b1b;}
.welfare .info .text{font-size:14px; margin-top:5px; color:#7b7b7b; line-height:1.8}

ul.competent{text-align:center}
ul.competent li>div{display:inline-table; text-align:center}
ul.competent li>div .title{color:#343235; font-size:20px; font-weight:bold; margin-top:30px}
ul.competent li>div .subtitle{color:#343235; font-size:16px}
ul.competent li>div .text{color:#343235; font-size:14px; margin-top:5px}
ul.competent li .plus{width:110px}
.recruit-type{width:100%}
.recruit-type th{text-align:center; border-top:2px solid #dedede; background-color:#f1f1f1; height:50px}
.recruit-type td{height:145px; font-size:14px; text-align:center; border-top:1px solid #dedede; border-right:1px solid #dedede; border-bottom:2px solid #dedede; line-height:1.7}
.recruit-type td:last-child{border-right:none}
.recruit-step tr{border-bottom:2px solid white}
.recruit-step th{text-align:center; background-color:#41b74b; height:110px}
.recruit-step td{padding-left:45px; background-color:#f1f1f1}
.recruit-step td p{color:#2b2b2b; font-weight:500; margin-bottom:5px}
.recruit-step td span{color:#a1a1a1; line-height:1.4; font-weight:300;}
.recruitment-wrap .fs-title{margin-bottom:25px; width:100%; text-align:center}


.recruit-list{color:white; margin-top:25px; width:100%}
.recruit-list th{text-align:center; padding:10px 0px; border-top:2px solid white; border-bottom:1px solid white; font-size:14px}
.recruit-list td{text-align:center; padding:7px 0px; border-bottom:1px solid white; font-weight:300; font-size:14px }
.recruit-list .no{text-align:center}
.recruit-list .notice{padding-left:50px}
.recruit-list .button button{border:0; padding:0 20px; font-weight:300; background-color:#41b74b; border-radius:3px; line-height:29px;}

/* contact */
.contact-info{ width:100%; padding:50px 0 0px; text-align:center}
.contact-info>div{display:inline-table; width: 33%; text-align:left; color: #343235}
.contact-info p{font-weight:500; font-size:18px; margin-bottom:10px; color:#343235;}
.contact-info span{line-height:1.8; color:#343235; font-weight:300;}
.contact-info .title{letter-spacing:2px; float:left; width:55px; display:inline-block}
.contact-info .text{display:block}

/* slider */
#business-slider{position:relative; height:200px; list-style:none; margin:0; padding:0}
#business-slider li{position:absolute; height:100px; left:0; top:0; width:100%}
#business-slider img{margin:auto}

/* tab */
.nav-tabs{border-bottom:none}
ul.twonav > li > a{width:200px;}
.nav-tabs>li>a{width:140px; height:60px; line-height:40px; font-size:15px; text-align:center; border-radius:0px; border:1px solid #cdcdcd; color:#9b9b9b}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover{background-color:#31b44a; color:white; border:0;}
.tab-content{margin-top:50px; margin-bottom:100px;}
.tab-content>.active{display:inline-block}
.portfolio-tabs{border-bottom:none}
.portfolio-tabs li{display:inline-block; cursor:pointer;}
.portfolio-tabs>li>a{width:60px; height:60px}
.portfolio-tabs .grid{background-image:url(/appimages/web/btn_portfolio_thumbnail_off.png)}
.portfolio-tabs .active .grid{background-image:url(/appimages/web/btn_portfolio_thumbnail_on.png)}
.portfolio-tabs .list{background-image:url(/appimages/web/btn_portfolio_list_off.png)}
.portfolio-tabs .active .list{background-image:url(/appimages/web/btn_portfolio_list_on.png)}
.payat2:after{display:block; content:""; clear:both;}
.payat2:last-child{margin-top:50px; border-top:1px solid #dedede; padding-top:50px;}

/*portfolio paginate*/
div.inner div.paginate{ position:relative; margin:0 auto; padding-top:50px; height:34px; text-align:center;}
div.inner div.paginate span{ display:inline-block; margin:0 3px; vertical-align:top; cursor:pointer;}
div.inner div.paginate span.btn_prev{ cursor:pointer; background:url(/appimages/web/icon_page_prev_off.png) no-repeat 11px; width:34px; height:34px; text-indent:-999em; cursor:pointer; margin:0; border:1px solid #eaeaea;}
div.inner div.paginate span.btn_prev:hover{background:url(/appimages/web/icon_page_prev_on.png) no-repeat 11px; border-color:#31b44a;}
div.inner div.paginate span.btn_prev.disabled:hover{background:url(/appimages/web/icon_page_prev_off.png) no-repeat 11px; width:34px; height:34px; text-indent:-999em; cursor:pointer; margin:0; border:1px solid #eaeaea;}
div.inner div.paginate span.btn_next{ cursor:pointer; background:url(/appimages/web/icon_page_next_off.png) no-repeat 12px; width:34px; height:34px; text-indent:-999em; cursor:pointer; margin:0; border:1px solid #eaeaea;}
div.inner div.paginate span.btn_next:hover{background:url(/appimages/web/icon_page_next_on.png) no-repeat 12px; border-color:#31b44a;}
div.inner div.paginate span.btn_next.disabled:hover{background:url(/appimages/web/icon_page_next_off.png) no-repeat 12px; width:34px; height:34px; text-indent:-999em; cursor:pointer; margin:0; border:1px solid #eaeaea;}
div.inner div.paginate span a:first-child{margin-left:0px}
div.inner div.paginate span a{color:#1b1b1b; border:1px solid #eaeaea; display:inline-block; margin-left:8px; width:34px; height:34px; line-height:34px; font-size:8px;}
div.inner div.paginate span a.on{background:#31b44a; color:#fff; border-color:#31b44a;}


/* wrap */
.content-yield{padding-top:140px}
.content-yield.no-menu{padding-top:80px}
.banner-wrap{height:350px; position: relative;}
.banner-wrap .banner{height:100%}
.banner-wrap .title{position:absolute; top:140px; left:50%; transform: translate(-50%, 0%); -webkit-transform: translate(-50%, 0%)}
.container-wrap{width:100%; padding:80px 0px 100px;}
.content-wrap{width:1100px; margin:0 auto;}
/*.content-wrap:nth-child(2) > .title-wrap, .content-wrap:nth-child(5) > .title-wrap{margin-bottom:60px;}*/

/* font */
.fs-title{font-size:40px; color: #2b2b2b;  font-weight:400;}
.fs-subtitle{font-size:18px; font-weight:300}
.fs-text{font-size:15px; color:#4b4b4b; margin-top:10px; line-height:1.9; font-weight:300; word-break:keep-all;}
.ft-green{color:#41b74b !important; font-weight:400;}
.ft-white{color:white !important}

.ft-p2p{color:#4783fc!important}
.ft-property{color:#ee261c!important}
.ft-asmr{color:#de3232!important}
.ft-kids{color:#f85262!important}
.ft-mango{color:#0c61d6!important}
.ft-livesem{color:#fc3a60!important}

/* active */
.font-active {color:#3bba41 !important}
.button-active {color: white; background-color: #3bba41}

/*bootstrap*/
.glyphicon_left{ background:url(/appimages/web/btn_img_prev_off.png); width:30px; height:58px; top:45%; left:50px; position:absolute;}
.glyphicon_right{ background:url(/appimages/web/btn_img_next_off.png); width:30px; height:58px; top:45%; right:50px; position:absolute;}


.none{ display: none; }



/*app.php*/
div.hybrid{padding:100px 0;}


/* header.php */
div.header{background-color:#fff; width:100%; height:80px; position:fixed; top:0; z-index:999; border-bottom:1px solid #ededed;}
div.nav{
	height:80px; 
	width:1100px;
	position:relative; 
	margin:0 auto;
}
div.nav ul.gnb{
	float:right;
	position:relative;
}
div.nav ul.gnb li{
	float:left; 
	text-align:center; 
	line-height:80px; 
	position:relative;
	margin-left:50px;
}
div.nav ul.gnb li a{
	color:#000000;
	font-size:15px; 
	display:block;
	font-weight:500;
}
div.nav ul.gnb li a:hover{color:#31b44a;}
.navlogo{font-weight: 600; font-size:15px; color:#000 !important; line-height:80px; margin-left:5px; }
.navlogo2{font-weight: 600; font-size:22px; color:#000 !important; line-height:80px; margin-left:10px; }


/* content.php */
.top{
	background:URL(/appimages/web/app/main_bg.png);
	width:100%;
	height:700px;
	position: relative;
}
.top > div.topdiv{
	width:1100px;
	margin:0 auto;
}
.top > div > img{
	margin-top:50px;
	margin-left:40px;
}
.top div div.fl{
	color:#fff;
	margin-top:190px;
	margin-left:40px;
}
.top div div.fl strong{
	font-size:50px;
	font-weight:400;
	line-height:70px;
	letter-spacing:-0.25px;
}
.top div div.fl p{
	font-size:18px;
	margin-top:29px;
	font-weight:300;
}
.top div div.fl a{
	color:#fff;
	font-size:18px;
	margin-top:80px;
	padding:18px 66px;
	border:2px solid #fff;
	display:inline-block;
	font-weight:400;
}
#service{
	width:1100px;
	margin:0 auto;
}
.fs-text2{
	font-size:16px;
	color:#000;
	margin-top:10px;
	font-weight:400;
	line-height:1.7;
}

.imgcenter{
	margin-left:60px;
	margin-right:33px;
}
#solution{
	width:100%;
	height:538px;
	background:url(/appimages/web/app/solution_bg.png);
	padding-top:100px;
}
.hysolution{
	width:1100px;
	margin:0 auto;
	height:401px;
	overflow:hidden;
}
.hysolution > div{
	width:346px;
	height:401px;
	background:#fff;
	float:left;
	margin-right:30px;
}
.hysolution > div{
	width:-moz
}
.hysolution > div:last-child{
	margin-right:0 !important;
}
.hysolution div strong{
	font-size:20px;
	font-weight:500;
	margin-top:26px;
	margin-bottom:12px;
	text-align:center;
	display:block;
	color:#000;
}
.hysolution div p{
	font-size:15px;
	font-weight:300;
	text-align:left;
	margin:0 30px;
	line-height:1.5;
	color:#000;
	letter-spacing:-0.5px;
}
p.font14{
	font-size:14px !important;
}

#feature{
	width:100%;
	background:#f1f1f1;
	height:797px;
	padding-top:182px;
}
#feature > ul{
	width:1100px;
	margin:0 auto;
}
#feature ul li{
	float:left;
	width:310px;
	text-align:left;
	margin-right:85px;
	letter-spacing:-0.5px;
}
#feature ul li.last{
	margin-right:0 !important;
}
#feature ul li img{
	display:block;
}
#feature ul li strong{
	margin:8px 0 12px 0;
	display:block;
	font-size:18px;
	font-weight:500;
	color:#000;
}
#feature ul li p{
	font-size:14px;
	font-weight:300;
	line-height:22px;
	color:#000;
}
#feature ul:after, div.basic > div:after{
	content:"";
	display:block;
	clear:both;
}
#feature ul:last-child{
	margin-top:52px
}

div.basic{
	padding:100px 0;
}
div.basic > div{
	width:1100px;
	margin:0 auto;
}
div.basic > div > div{
	float:left;
	width:550px;
	padding:56px 40px;
	text-align:left;
}
div.basic > div > div > strong{
	display:block;
	font-size:20px;
	font-weight:500;
	margin-bottom:20px;
}
div.basic > div > div > p{
	line-height:20px;
}
div.push{
	padding:46px 40px !important;
}

#hyproduct{
	background-color:#ebebeb;
	padding:100px 0;
}
#hyproduct > div{
	width:1100px;
	margin:0 auto;
}
#hyproduct > div:after{
	content:"";
	display:block;
	clear:both;
}
#hyproduct div.hybox{
	background:#fff;
	float:left;
	width:525px;
	height:494px;
	border-radius:12px;
	position:relative;
}
#hyproduct div.hybox:first-child{
	margin-right:50px;
}
#hyproduct div.hybox strong{
	font-size:24px;
	font-weight:600;
	margin:40px 0 2px 0;
	display:block;
	color:#000;
}
#hyproduct div.hybox p{
	font-size:15px;
	font-weight:400;
	color:#000;
}
#hyproduct div.hybox div img{
	margin:32px 0 44px 0;
}
#hyproduct div.hybox div{
	font-size:20px;
	line-height:24px;
	font-weight:400;
	color:#000;
}
#hyproduct div.hybox div span{
	color:#31b44a;
	display:inline-block;
	margin:12px 0 8px 0;
}
.hyimg{
	vertical-align:middle;
	margin:0 5px 4px 0;
}
#hyproduct div.hybox div.hybottom{
	display:block;
	height:80px;
	color:#fff;
	border-bottom-right-radius:12px;
	border-bottom-left-radius:12px;
	background:#4364b6;
	font-weight:500;
	line-height:80px;
	width:100%;
	position:absolute;
	bottom:0;
}
#hyproduct  div.last_text{
	font-size:14px;
}
#hyproduct  div.last_text img{
	vertical-align:middle;
	margin-right:10px;
}

#question{
	width:100%;
	height:930px;
	padding:100px 0;
	background:URL(/appimages/web/app/question_bg.png);
	position:relative;
}
#question p{
	color:#fff;
	font-size:16px;
	line-height:30px;
	font-weight:300;
}
#question p i{
	color:#f6d107;
	border-bottom:1px solid #f6d107;
}
#question > div{
	width:1100px;
	margin:0 auto;
	position:relative;
}
#question table.request{
	width:100%; 
	border-spacing:0;
	margin:30px 0 40px 0;
}
#question .request tr{
	border-bottom:1px solid #626060; 
	float:left;
	width:100%;
}
#question .request th{
	background-color:#f1f1f1; 
	height:54px; 
	text-align:center; 
	font-size:14px;
	width:17%;
	float:left;
	line-height:54px;
	border:0;
}
#question .request td{
	background-color:#fff;
	width:83%;
	height:54px;
	float:left;
	text-align:left;
	line-height:54px;
	border:0;
}
#question .request td input.left{
	height:52px;
}
#question .request td.hyselect{
	width:201px;
	height:54px;
	background:#ababab;
	border-left:1px solid #626060;
}
#question .request td.hyselect select{
	background:url(/appimages/web/app/arrow_drop.png) no-repeat 95% 50%;
}
#question .request td span{
	margin:0 17px 0 10px;
	float:left;
}
#question a.btn2, #hyproduct a.btn2{
	height:60px;
	background:#31b44a;
	display:inline-block;
	line-height:60px;
	color:#fff;
	font-size:18px;
	font-weight:500;
}
#question a.btn2{
	width:200px;
}
#hyproduct a.btn2{
	width:300px;
	margin-top:40px;
}
#question div a.btntop{
	position:absolute;
	right:-110px;
	bottom:-45px;
}
select#mail_host > option{
	color:#000;
}
hr.title-line2{
	margin:40px auto;
	width:80px;
	border-top:1px solid #4b4b4b;
}

.custom-radio input[type=radio]:checked + .txt{background-image:url('/appimages/web/app/hyselect_on.png');}
.custom-radio .txt{background-image:url('/appimages/web/app/hyselect_off.png'); background-repeat:no-repeat; background-position:left center; padding-left:20px;}
.custom-radio input[type=radio]{display:none;}


/*agency*/
.topagency{
	background:URL(/appimages/web/agency/main_bg.png); 
	width:100%; 
	height:700px;
}
.topagency b{
	font-size:50px; 
	font-weight:400; 
	color:#fff;
	padding-top:185px; 
	display:block;
}
.topagency p{
	font-size:17px; 
	font-weight:300; 
	color:#fff; 
	padding:15px 0 70px 0; 
	display:block;
}
.topagency a{
	font-size:16px; 
	font-weight:300; 
	color:#fff; 
	display:inline-block; 
	border:2px solid #fff;
	text-align:center;
	margin-right:20px;
	padding:0 40px;
	height:60px;
	line-height:56px;
}
div.topagency a img{
	margin-right:10px;
}
.topagency a:last-child{
	border-color:#3eef60;
	color:#3eef60;
	margin-right:0;
}
#agency{
	height:595px;
}
#agency ul{
	width:1100px; 
	margin:0 auto;
}
#agency ul li{
	float:left; 
	margin-right:2px;
}
#agency ul li div{
	width:155px; 
	height:155px; 
	background:#2bace2; 
	display:inline-block;
	padding-top:48px;
}
#agency ul li p{
	font-size:16px; 
	color:#6b6b6b; 
	padding-top:19px; 
	font-weight:400;
}
#solution1{
	background:URL(/appimages/web/agency/agency_bg.png); 
	width:100%;
	height:538px;
}
.hybrid dl{
	width:1100px; 
	margin:0 auto;
}
.hybrid dl:after{
	display:block; 
	clear:both; 
	content:"";
}
.hybrid dl dt{
	width:16%; 
	height:60px; 
	float:left; 
	display:block; 
	background:#31b44a; 
	color:#fff; 
	line-height:60px; 
	font-size:16px; 
	font-weight:400;
	border-bottom:1px solid #cdcdcd;
}
.hybrid dl dd{
	width:84%; 
	height:60px; 
	line-height:60px; 
	display:block; 
	float:left; 
	text-align:left; 
	color:#343026; 
	font-size:14px; 
	padding-left:20px; 
	border-bottom:1px solid #cdcdcd;
}
.hybrid dl dt:first-child{
	border-top:1px solid #cdcdcd;
}
.hybrid dl dd:nth-child(2){
	border-top:1px solid #cdcdcd;
}
#case{
	background:URL(/appimages/web/agency/introduction_bg.png); 
	width:100%; 
	height:710px;
}
#case > div{
	width:1100px; 
	margin:0 auto; 
	position:relative;
}
#case div div.fl{
	color:#fff; 
	text-align:left; 
	margin-left:50px; 
	width:561px;
	margin-top:40px;
}
#case div div.fl strong{
	color:#31b44a; 
	font-size:20px; 
	font-weight:500; 
	padding-bottom:15px; 
	display:block; 
	border-bottom:1px solid #57514c;
}
#case div div.fl p{
	line-height:45px; 
	font-size:15px; 
	border-bottom:1px solid #57514c; 
	font-weight:300;
}
#case div div.fl b{
	font-size:14px; 
	font-weight:300; 
	color:#b1afad; 
	line-height:49px;
}
#agproduct{
	background:#ebebeb; 
	width:100%; 
	height:775px;
}
#agproduct > div{
	width:1100px; 
	margin:0 auto;
}
.agbox{
	width:525px; 
	height:382px; 
	background:#fff; 
	border-radius:12px; 
	float:left;
}
.agbox:first-child{
	margin-right:50px; 
	border-top:5px solid #31b44a;
}
.agbox:nth-child(2){
	border-top:5px solid #2bace2;
}
.agbox > strong{
	margin-top:42px; 
	font-size:24px; 
	display:block;
}
.agbox > p{
	font-size:15px; 
	font-weight:300; 
	color:#000;
}
.agbox ul{
	width:465px; 
	margin:0 auto;
	margin-top:35px;
}
.agbox ul li{
	border-bottom:1px solid #cdcdcd; 
	line-height:48px; 
	display:inline-block; 
	width:100%; 
	text-align:left; 
	color:#343026; 
	font-weight:400;
}
.agbox ul li:first-child{
	border-top:1px solid #cdcdcd;
}
.agbox ul li span{
	width:128px; 
	background:#31b44a; 
	display:inline-block; 
	color:#fff; 
	margin-right:20px; 
	float:left; 
	text-align:center;
}
.agbox ul li b{
	color:red; 
	font-weight:400;
}
.agbox ul li img{
	margin:0 5px;
}
.agbox ul li span.blue{
	background:#2bace2;
}
#agproduct > div:after{
	display:block; 
	clear:both; 
	content:"";
}
div.last_text{
	font-size:14px; 
	padding-top:42px; 
	display:block; 
	color:#000;
}
div.last_text > img{
	margin-right:10px;
}