@charset "utf-8";

#mcontainer{margin-top:-78px}

#mcontainer i{font-style:normal}

#mcontainer .plain-text{}
#mcontainer .plain-text strong{display:block;overflow:hidden}
#mcontainer .plain-text strong:before{content:"";display:block;height:100%}
#mcontainer .plain-text p{font-size:15px;color:#fff}
#mcontainer .plain-text p span{display:inline-block;padding:0 3px;vertical-align:middle}


#mcontainer [id^="section"]{position:relative}
#mcontainer [id^="mcont"]{position:relative;height:100%;max-width:1200px;margin:0 auto}
#mcontainer [class^="mcont-article"]{color:#fff}


#section1{height:999px;background:#333 url(/images/cyber/main/mcont-1-background.jpg) no-repeat 50% 0}
#section2{height:999px;background:#333 url(/images/cyber/main/mcont-2-background.jpg) no-repeat 50% 0}
#section3{height:887px;background:#333 url(/images/cyber/main/mcont-3-background.jpg) no-repeat 50% 0}
#section4{height:965px;background:#333 url(/images/cyber/main/mcont-4-background.jpg) no-repeat 50% 0}


#section1{}
#section1 .plain-text{padding:225px 0 30px}
#section1 .plain-text strong{width:488px;height:161px;margin:0 auto;background:url(/images/cyber/main/mcont-1-plaintext.png) no-repeat}
#section1 .button{width:864px;margin:0 auto}
#section1 .button:after{content:"";display:block;clear:both}
#section1 .button a{position:relative;display:table;float:left;width:218px;height:218px;margin:0 35px}
#section1 .button .icon{position:absolute;top:10px;right:20px}
#section1 .button div{display:table-cell;width:100%;height:100%;padding-bottom:30px;line-height:1.3;vertical-align:middle;text-align:center;font-size:13px;color:#fff;background:url(/images/cyber/main/mcon-1-button-more.png) no-repeat 50% 160px}
#section1 .button div i{display:block;margin-bottom:10px;text-align:center;font-size:22px}

#section1 .button .button-1{background:url(/images/cyber/main/mcon-1-button-background-1.png) no-repeat}
#section1 .button .button-2{background:url(/images/cyber/main/mcon-1-button-background-2.png) no-repeat}
#section1 .button .button-3{background:url(/images/cyber/main/mcon-1-button-background-3.png) no-repeat}

#section1 .mouse_scroll{position:absolute;bottom:130px;left:0;right:0;text-align:center}
#section1 .mouse_scroll .mouse{display:inline-block}

#section1 .slide{position:absolute;bottom:0;left:0;right:0;height:auto;background:url(/images/cyber/main/mcont-1-notice-background.jpg) no-repeat 50% 0;background-size:cover}
#section1 .slide-width{position:relative;max-width:1200px;margin:38px auto}
#section1 .slide-width:after{content:"";display:block;clear:both}
#section1 .slide-width .title{float:left;width:145px;height:30px;line-height:30px;font-weight:700;font-size:16px;color:#fff;border-right:1px solid #575c54}
#section1 .slide-width .title:before{content:"";display:inline-block;height:100%;vertical-align:middle}
#section1 .slide-width .title img{margin-right:10px;vertical-align:middle}

#section1 .slide-width .grap{position:relative;height:30px;margin:0 100px 0 190px;overflow:hidden}
#section1 .slide-width .grap .obj{position:relative}
#section1 .slide-width .grap .obj .item{width:100%;height:30px;line-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
#section1 .slide-width .grap .obj .item a{display:block;overflow:hidden;max-width:55%;line-height:inherit;text-oveflow:ellipsis;white-space:nowrap;}

#section1 .slide-width .control{position:absolute;top:0;right:0}
#section1 .slide-width .control button,#section1 .slide-width .control a{float:left;width:27px;height:26px;overflow:hidden;background:url(/images/cyber/main/mcon-1-slide-control.png) no-repeat}
#section1 .slide-width .control button:before,#section1 .slide-width .control a:before{content:"";display:block;height:100%}
#section1 .slide-width .control button{margin-left:2px}
#section1 .slide-width .control button[data-type="prev"]{background-position:0 0}
#section1 .slide-width .control button[data-type="next"]{background-position:-29px 0}
#section1 .slide-width .control a{margin-left:3px;background-position:-60px 0}



#section2{}
#section2 .plain-text{padding:165px 0 0}
#section2 .plain-text strong{width:276px;height:86px;margin-bottom:20px;background:url(/images/cyber/main/mcont-2-plaintext.png) no-repeat}
#section2 .plain-text p span{background:url(/images/cyber/main/mcont-2-plaintext-filter.png)}

#section2 .mcont-article-1{padding:100px 0 0}
#section2 .mcont-article-1 i{display:block;margin-bottom:5px;font-family:"Nanum Myeongjo";font-size:32px}
#section2 .mcont-article-1 i span{color:#292775}
#section2 .mcont-article-1 p{width:580px;margin-bottom:15px;line-height:1.3;font-size:18px}
#section2 .mcont-article-1 a{display:inline-block;padding:10px 40px;font-size:16px;border-radius:25px;border:2px solid #fff;color:#fff}

#section2 .mcont-article-2{position:absolute;top:270px;right:0}
#section2 .mcont-article-2 .grap{display:table-cell;width:292px;height:292px;vertical-align:middle;text-align:center;border-radius:100%;background:url(/images/cyber/main/mcont-2-article-filter.png)}
#section2 .mcont-article-2 strong{display:inline-block;font-weight:normal;font-size:18px}
#section2 .mcont-article-2 strong:after{content:"";display:block;width:90%;margin:10px auto 0;border-bottom:1px solid #535729}
#section2 .mcont-article-2 strong img{display:block;margin:0 auto 7px}
#section2 .mcont-article-2 .count{padding-top:15px;line-height:1;font-weight:700;font-size:20px}
#section2 .mcont-article-2 .count i{font-family:"Nanum Myeongjo";font-size:55px}

#section2 .mcont-article-3{position:relative;padding-top:50px;margin-top:100px;background:url(/images/cyber/main/mcont-line-white.png) repeat-x}
#section2 .mcont-article-3 strong{float:left;margin-top:7px;line-height:1;font-family:"Nanum Myeongjo";font-size:18px}
#section2 .mcont-article-3 strong i{display:block;line-height:1;font-size:80px}
#section2 .mcont-article-3 strong i span{line-height:1.4;font-size:70px}

#section2 .mcont-article-3 .control{position:absolute;top:105px;left:0;right:0;width:750px;height:38px;margin-left:20%;background:url(/images/cyber/main/mcont-2-article-3-control-bg.png) repeat-x 0 50%}
#section2 .mcont-article-3 .control button{position:absolute;width:38px;height:38px;overflow:hidden;background:url(/images/cyber/main/mcont-2-article-3-control.png) no-repeat}
#section2 .mcont-article-3 .control button:before{content:"";display:block;height:100%}
#section2 .mcont-article-3 .control button[data-type="prev"]{left:0;background-position:0 0}
#section2 .mcont-article-3 .control button[data-type="next"]{right:0;background-position:-51px 0}

#section2 .mcont-article-3 .grap{position:relative;width:620px;height:138px;margin-left:25.6%;overflow:hidden}
#section2 .mcont-article-3 .grap .obj{position:relative;width:10000px}
#section2 .mcont-article-3 .grap .obj .item{display:table;float:left;width:138px;height:138px;margin-right:22px;border-radius:100%;background:#fff}
#section2 .mcont-article-3 .grap .obj .item .bene{display:table-cell;width:100%;height:100%;line-height:1.3;vertical-align:middle;letter-spacing:-1px;text-align:center;font-size:16px;color:#000}
#section2 .mcont-article-3 .grap .obj .item .bene div{margin-bottom:7px;font-weight:700;font-size:15px}

#section2 .mcont-article-3 .more{display:table;position:absolute;top:50px;right:0;width:138px;height:138px;border-radius:100%;background:#292775}
#section2 .mcont-article-3 .more a{display:table-cell;width:100%;height:100%;vertical-align:middle;text-align:center;font-size:18px;color:#fff}
#section2 .mcont-article-3 .more a:after{content:"";display:block;width:27px;height:10px;margin:10px auto 0;background:url(/images/cyber/main/mcont-2-article-3-more.png) no-repeat}



#section3{}
#section3 .plain-text{padding-top:180px}
#section3 .plain-text strong{float:right;width:299px;height:85px;margin-bottom:20px;background:url(/images/cyber/main/mcont-3-plaintext.png) no-repeat}
#section3 .plain-text p{clear:both;text-align:right}
#section3 .plain-text p span{background:url(/images/cyber/main/mcont-3-plaintext-filter.png)}

#section3 .mcont-article-1{padding:120px 0 0;text-align:right}
#section3 .mcont-article-1 i{display:block;margin-bottom:30px;font-family:"Nanum Myeongjo";font-size:32px}
#section3 .mcont-article-1 i span{color:#0061db}
#section3 .mcont-article-1 p{margin-bottom:15px;line-height:1.3;font-size:18px}
#section3 .mcont-article-1 a{display:inline-block;padding:10px 40px;font-size:16px;border-radius:25px;border:2px solid #fff;color:#fff}

#section3 .mcont-article-2{position:absolute;top:405px;left:220px}
#section3 .mcont-article-2 .grap{display:table-cell;width:292px;height:292px;vertical-align:middle;text-align:center;border-radius:100%;background:url(/images/cyber/main/mcont-3-article-filter.png)}
#section3 .mcont-article-2 strong{display:inline-block;font-weight:normal;font-size:18px}
#section3 .mcont-article-2 strong:after{content:"";display:block;width:90%;margin:10px auto 0;border-bottom:1px solid #3e5169}
#section3 .mcont-article-2 strong img{display:block;margin:0 auto 7px}
#section3 .mcont-article-2 .count{padding-top:15px;line-height:1;font-weight:700;font-size:20px}
#section3 .mcont-article-2 .count i{font-family:"Nanum Myeongjo";font-size:55px}



#section4{}
#section4 .plain-text{padding:170px 0 0;overflow:hidden}
#section4 .plain-text strong{float:left;width:451px;height:113px;background:url(/images/cyber/main/mcont-4-plaintext.png) no-repeat}
#section4 .plain-text p{padding:80px 0 0 470px;color:#4a525a}
#section4 .plain-text p span{background:#f2f6ff}

#section4 .grap{margin-top:80px}
#section4 .grap .obj{}
#section4 .grap .obj:after{content:"";display:block;clear:both}
#section4 .grap .obj .item{position:relative;float:left;width:25%;padding-top:17.4%;overflow:hidden;border:2px solid transparent}
#section4 .grap .obj .item .inner{position:absolute;top:0;left:0;right:0}
#section4 .grap .obj .item .inner>img{width:100%;max-width:none;height:245px;}
#section4 .grap .obj .item .inner .share button img{width:auto}

#section4 .mask{position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;background:url(/images/cyber/main/mcont-4-mask-filter.png)}
#section4 .mask:before{content:"";display:inline-block;height:100%;vertical-align:middle}
#section4 .mask a,#section4 .mask .button-share{display:inline-block;width:57px;height:58px;margin:0 2px;vertical-align:middle;overflow:hidden;background:url(/images/cyber/main/mcont-4-mask-button.png) no-repeat}
#section4 .mask .button-share{background-position:-63px 0}
#section4 .mask a:before,#section4 .mask .button-share:before{content:"";display:block;height:100%}
#section4 .mask .share{display:none;position:absolute;top:0;left:0;width:100%;height:100%;text-align:center}
#section4 .mask .share:before{content:"";display:inline-block;height:100%;vertical-align:middle}
#section4 .mask .share button{width:57px;height:58px;padding:0;margin:0 2px;vertical-align:middle;background:transparent}
#section4 .mask .share button.exit{position:absolute;top:50%;left:50%;width:26px;height:26px;margin:-45px 0 0 60px}

#section4 .more{position:absolute;top:230px;right:0;width:210px;padding:10px 0;text-align:center;font-size:16px;border-radius:25px;border:2px solid #86888d;color:#000}


/*aniamte*/
#section4 .mask{
	opacity:0;
	transition:opacity 150ms ease-out;
	-webkit-transition:opacity 150ms ease-out;
}

#section4 .mask a,
#section4 .mask .button-share{
	position:relative;left:-20px;opacity:0;
	transition:left 300ms ease-out,opacity 300ms ease-out;
	-webkit-transition:left 300ms ease-out,opacity 300ms ease-out;
}

#section4 .mask a{
	transition-delay:200ms;
	-webkit-transition-delay:200ms;
}

#section4 .mask .button-share{
	transition-delay:300ms;
	-webkit-transition-delay:300ms;
}



#section4 .ov .mask{opacity:1}

#section4 .ov .mask a,
#section4 .ov .mask .button-share{left:0;opacity:1}




@media(min-width:0px){

	#mcontainer [id^="section"]{background-size:auto 100%}
	#mcontainer [id^="mcont"]{margin:0 10px}


	#mcontainer .plain-text{padding-top:70px}
	#mcontainer .plain-text strong{float:none;width:auto;height:55px;background-position:50% 0;background-size:auto 100%}
	#mcontainer .plain-text p{text-align:center;line-height:1.3}
	#mcontainer .plain-text p span{display:inline;padding:0;line-height:1;background:none}

	#mcontainer .mcont-article-1{max-width:480px;padding-top:40px;margin:0 auto;text-align:center}
	#mcontainer .mcont-article-1 i{margin-bottom:20px;line-height:1.3;text-align:left;font-size:24px}
	#mcontainer .mcont-article-1 i span{line-height:1;font-family:"Nanum Myeongjo";}
	#mcontainer .mcont-article-1 p{width:auto;margin-bottom:20px;text-align:left;font-size:16px}
	#mcontainer .mcont-article-1 p br{display:none}

	#mcontainer .mcont-article-2{position:static;display:table;table-layout:fixed;width:100%;max-width:480px;margin:0 auto;margin-top:40px}
	#mcontainer .mcont-article-2 .grap{display:table-cell;width:auto;height:auto;padding:20px 0;border-radius:0}

	#mcontainer .mcont-article-3{padding-top:30px;max-width:320px;margin:0 auto;margin-top:50px;text-align:center}
	#mcontainer .mcont-article-3 strong{float:none;display:block;margin-bottom:20px}
	#mcontainer .mcont-article-3 strong i{display:inline-block;font-size:40px;font-family:"Nanum Myeongjo";}
	#mcontainer .mcont-article-3 strong i span{font-size:35px;font-family:"Nanum Myeongjo";}

	#mcontainer .mcont-article-3 .control{top:160px;width:187px;margin-left:0;z-index:10}
	#mcontainer .mcont-article-3 .grap{width:138px;margin-left:24px}

	#mcontainer .mcont-article-3 .more{top:130px;width:100px;height:100px}
	#mcontainer .mcont-article-3 .more a{font-size:16px}



	#section1{background-image:url(/images/cyber/main/mcont-1-background-320.jpg)}
	#section2{background-image:url(/images/cyber/main/mcont-2-background-320.jpg)}
	#section3{background-image:url(/images/cyber/main/mcont-3-background-320.jpg)}




	#section1 .plain-text{padding-top:150px}

	#section1 .button{width:300px}
	#section1 .button a{width:110px;height:110px;margin:0 -7px}

	#section1 .button div{padding-bottom:0;background-position:50% 75px}
	#section1 .button div i{margin-bottom:0;font-size:18px}
	#section1 .button div span{display:none}

	#section1 .button .icon{top:15px;left:0;right:0;text-align:center}
	#section1 .button .icon img{max-width:20%}

	#section1 .button .button-1,
	#section1 .button .button-2,
	#section1 .button .button-3{background-size:100% auto}

	#section1 .button .button-1{margin-left:0}
	#section1 .button .button-1 .icon img{max-width:15%}



	#section1{height:585px}
	#section1 .plain-text strong{height:75px}

	#section1 .mouse_scroll{display:none}

	#section1 .slide{padding:0 10px}
	#section1 .slide .title{width:auto;font-size:0;border-right-width:0}

	#section1 .slide-width{max-width:480px;margin:20px auto}
	#section1 .slide-width .grap{margin:0 0 0 40px}

	#section1 .slide-width .control{top:0;right:0;text-align:center}
	#section1 .slide-width .control button,#section1 .slide-width .control a{float:none;display:inline-block;vertical-align:middle}


	#section4 .plain-text strong{margin-bottom:20px}
	#section4 .plain-text p{padding:0}

	#section4 .grap{position:relative;width:100%;max-width:480px;margin:0 auto;margin-top:40px;overflow:hidden}
	#section4 .grap .obj{position:relative;width:1000%}
	#section4 .grap .obj .item{width:10%;padding-top:7%;padding:0;height:289px;border-width:0}

	#section4 .control{z-index:1;position:absolute;top:50%;width:100%}
	#section4 .control button{position:absolute;top:-33px;width:38px;height:66px;overflow:hidden;background:url(/images/cyber/main/mcont-4-article-control.png) no-repeat}
	#section4 .control button:before{content:"";display:block;height:100%}
	#section4 .control button[data-type="prev"]{left:0;background-position:0 0}
	#section4 .control button[data-type="next"]{right:0;background-position:100% 0}


	#section4 .more{display:block;position:static;margin:25px auto 0}


	#section2,#section3,#section4{height:auto;padding-bottom:50px}


}



@media(min-width:768px){

	#mcontainer [id^="mcont"]{max-width:728px;margin:0 auto}

	#mcontainer .plain-text{padding-top:140px;margin:0 auto}
	#mcontainer .plain-text strong{height:80px;background-position:0 0}
	#mcontainer .plain-text p{text-align:left}
	#mcontainer .plain-text p span{display:inline-block;padding:0 3px;line-height:1.6;background:url(/images/cyber/main/mcont-2-plaintext-filter.png)}

	#mcontainer .mcont-article-1{max-width:none;padding-top:80px;text-align:left}
	#mcontainer .mcont-article-2{max-width:none;text-align:right}
	#mcontainer .mcont-article-3{max-width:none}

	#mcontainer .mcont-article-1 i,#mcontainer .mcont-article-1 p{width:365px}
	#mcontainer .mcont-article-1 i{font-size:32px}
	#mcontainer .mcont-article-1 p{font-size:18px}

	#mcontainer .mcont-article-2{position:absolute;width:auto;max-width:none;}
	#mcontainer .mcont-article-2 .grap{width:292px;height:292px;padding:0;border-radius:100%}

	#mcontainer .mcont-article-3{padding-top:70px}
	#mcontainer .mcont-article-3 strong{float:left;width:125px;text-align:left}
	#mcontainer .mcont-article-3 strong i{display:block;font-size:67px;font-family:"Nanum Myeongjo";}
	#mcontainer .mcont-article-3 strong i span{font-size:60px}

	#mcontainer .mcont-article-3 .control{top:120px;width:400px;margin-left:170px}
	#mcontainer .mcont-article-3 .grap{width:298px;margin-left:220px}
	#mcontainer .mcont-article-3 .more{top:80px;width:130px;height:130px}



	#section1{background-image:url(/images/cyber/main/mcont-1-background-768.jpg)}
	#section2{background-image:url(/images/cyber/main/mcont-2-background-768.jpg)}
	#section3{background-image:url(/images/cyber/main/mcont-3-background-768.jpg)}





	#section1{height:820px}

	#section1 .plain-text{padding-top:190px}
	#section1 .plain-text strong{height:125px;background-position:50% 0}

	#section1 .button{width:588px}
	#section1 .button a{width:176px;height:176px;margin:0 0 0 30px}
	#section1 .button div{padding-bottom:30px;background-position:50% 130px}
	#section1 .button div i{font-size:22px;margin-bottom:10px}
	#section1 .button div span{display:block}

	#section1 .button .icon{top:10px;left:auto;right:0}
	#section1 .button .icon img{max-width:80%}

	#section1 .button .button-1 .icon img{max-width:75%}

	#section1 .mouse_scroll{display:block}


	#section1 .slide{padding:0 20px}
	#section1 .slide-width{max-width:728px;margin:18px auto}
	#section1 .slide-width .control{left:auto;top:0}
	#section1 .slide-width .control button,
	#section1 .slide-width .control a{float:left}



	#section3{overflow:hidden}
	#section3 .plain-text strong{background-position: 100% 0}
	#section3 .plain-text p{text-align:right}
	#section3 .plain-text p span{background:url(/images/cyber/main/mcont-3-plaintext-filter.png)}

	#section3 .mcont-article-1{text-align:right}
	#section3 .mcont-article-1 i,
	#section3 .mcont-article-1 p{width:auto;text-align:right}
	#section3 .mcont-article-1 p br{display:block}

	#section3 .mcont-article-2{position:static;float:right;margin-top:70px}

	#section4 .plain-text p span{background:#f2f6ff}

	#section4 .grap{max-width:none}
	#section4 .grap .obj{width:auto}
	#section4 .grap .obj .item{width:50%;padding-top:34.8%;border-width:2px}
	#section4 .grap .obj .item+.item+.item+.item+.item{display:none}


	#section4 .control{display:none}

	#section4 .more{position:absolute;top:210px;margin:0}



	#section2, #section3, #section4{padding-bottom:100px}







	#section1 .slide-width .grap .obj .item a{max-width:85%;}






}


@media(min-width:1024px){

	#mcontainer [id^="section"]{background-size:cover}

	#mcontainer [id^="mcont"]{max-width:1000px;margin:0 auto}

	#mcontainer .plain-text{padding:165px 0 0}
	#mcontainer .mcont-article-1{padding-top:100px}
	#mcontainer .mcont-article-1 i,#mcontainer .mcont-article-1 p{width:580px}
	#mcontainer .mcont-article-1 i{margin-bottom:5px;font-size:32px}
	#mcontainer .mcont-article-1 p{margin-bottom:15px;font-size:18px}


	#mcontainer .mcont-article-2{position:absolute;margin:0}




	#mcontainer .mcont-article-3{margin:100px 0 0;padding-top:50px}
	#mcontainer .mcont-article-3 strong{width:auto}



	#section2,#section3,#section4{padding-bottom:0}



	#section1{height:999px}
	#section1 .plain-text{padding:225px 0 30px}
	#section1 .plain-text strong{height:161px}
	#section1 .button{width:864px;}
	#section1 .button a,#section1 .button .button-1{width:218px;height:218px;margin:0 35px}
	#section1 .button .icon img,#section1 .button .button-1 .icon img{max-width:100%}
	#section1 .button .icon{right:20px;top:10px}
	#section1 .button div{background-position:50% 160px}

	#section1 .slide-width{max-width:1200px}
	#section1 .slide-width .title{width:145px;font-size:16px;border-right-width:1px}
	#section1 .slide-width .grap{margin:0 100px 0 190px}
	#section2 .mcont-article-3 .more{top:50px;width:138px;height:138px}




	#section2{height:999px}
	#section2 .plain-text strong{height:86px}
	#section2 .mcont-article-2{top:270px}
	#section2 .mcont-article-3 .control{z-index:0;top:105px;width:570px;margin-left:20%}
	#section2 .mcont-article-3 .grap{width:458px;margin-left:25.6%}



	#section3{height:887px}
	#section3 .plain-text strong{height:85px}
	#section3 .plain-text{padding-top:180px}
	#section3 .mcont-article-1{padding-top:120px}
	#section3 .mcont-article-1 i,#section3 .mcont-article-1 p{width:auto}
	#section3 .mcont-article-1 i{margin-bottom:30px}



	#section3 .mcont-article-2{left:0;top:385px}





	#section4{height:965px}
	#section4 .plain-text{padding-top:170px}
	#section4 .plain-text strong{float:left;width:451px;height:113px}
	#section4 .plain-text p{padding:80px 0 0 470px}
	#section4 .more{top:230px;}


	#section4 .grap{margin-top:80px}
	#section4 .grap .obj .item{width:25%;padding-top:17.4%}
	#section4 .grap .obj .item+.item+.item+.item+.item{display:block}






}





@media(min-width:1200px){


	#mcontainer [id^="mcont"]{max-width:1200px}


	#section1{background-image:url(/images/cyber/main/mcont-1-background.jpg)}
	#section2{background-image:url(/images/cyber/main/mcont-2-background.jpg)}
	#section3{background-image:url(/images/cyber/main/mcont-3-background.jpg)}




	#section2 .mcont-article-3 .control{width:750px}
	#section2 .mcont-article-3 .grap{width:620px}


	#section3 .mcont-article-2{left:220px;top:405px}



}


@keyframes intro{
	0%{opacity:0;transform:translateY(60px);}
	100%{opacity:1;transform:translateY(0);}
}

@keyframes finger{
	0%{opacity:1;}
	100%{opacity:0;transform:translateY(30px);}
}
#section1 .mouse_scroll{position: absolute;bottom:140px;left:50%;margin-left:-14px;width:28px;-webkit-animation:intro 1s;animation: intro 1s}
.mouse{width:34px;height:56px;border-radius:30px;border:2px solid #fff;}
.scroll{display:block;width:6px;height:6px;margin:6px auto;border-radius:5px;background:#fff;-webkit-animation:finger 1s infinite;animation:finger 1s infinite;}

.arrows{margin:0 0 0 2px;margin-top:-10px;width:28px;}
.m_scroll_arrows
{
	display: block;
	width: 5px;
	height: 5px;
	-ms-transform: rotate(45deg); /* IE 9 */
	-webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
	transform: rotate(45deg);

	border-right: 2px solid white;
	border-bottom:2px solid white;
	margin: 0 auto;

	width: 16px;
	height:16px;
}


.unu
{
	margin-top: 1px;
}

.unu, .doi, .trei
{
	-webkit-animation: mouse-scroll 1s infinite;
	-moz-animation: mouse-scroll 1s infinite;
}

.unu
{
	-webkit-animation-delay: .1s;
	-moz-animation-delay: .1s;
	-webkit-animation-direction: alternate;
}

.doi
{
	-webkit-animation-delay: .2s;
	-moz-animation-delay: .2s;
	-webkit-animation-direction: alternate;
	margin-top: -6px;
}

.trei
{
	-webkit-animation-delay: .3s;
	-moz-animation-delay: .3s;
	-webkit-animation-direction: alternate;
	margin-top: -6px;
}

@-webkit-keyframes mouse-scroll {

	0%   { opacity: 0;}
	50%  { opacity: .5;}
	100% { opacity: 1;}
}
@-moz-keyframes mouse-scroll {

	0%   { opacity: 0; }
	50%  { opacity: .5; }
	100% { opacity: 1; }
}
@-o-keyframes mouse-scroll {

	0%   { opacity: 0; }
	50%  { opacity: .5; }
	100% { opacity: 1; }
}
@keyframes mouse-scroll {

	0%   { opacity: 0; }
	50%  { opacity: .5; }
	100% { opacity: 1; }
}