@charset "UTF-8";

.section_cover{display: flex; width: 100%; max-width: 1720px; margin:0 auto; padding: 0 10px;}
.notice_btn{display:flex; width: 18px !important; height: 18px !important; background: url(/resources/images/fnc_images/main/plus.png) no-repeat center;}
.notice_btn:hover{ background: url(/resources/images/fnc_images/main/plus_on.png) no-repeat center;}
.main_title{margin-bottom:40px; text-align:center;}
.main_title h3{color: #000; font-size: 40px; line-height: 46px; position: relative; font-family: 'GmarketB', sans-serif !important; font-weight:bold; margin-bottom:15px; position:relative;}
.main_title h3 span{font-family: 'GmarketB', sans-serif !important; font-weight:bold; color:#F54A50;}
.main_title p{color:#000; font-size:18px; line-height:20px;}
p{word-break: keep-all;}


/*section01*/
#section01{height:600px; background: url(/resources/images/fnc_images/cyber/main/sec01_bg.jpg) #F5F5F5 no-repeat center;display: flex; justify-content: flex-end; background-size:cover;}
#section01 .section_cover{align-items: center; justify-content: center; max-width:1600px; margin:0;}
#section01 .section_cover>.img_box{width:600px; display: flex; align-items: flex-end; height:600px; margin-right:200px;}
#section01 .txt_box{width:calc(100% - 700px);}
#section01 .sign_box{margin-bottom:80px;}
#section01 h2{font-size:61px; line-height:70px; font-family:'GmarketM', sans-serif !important;}
#section01 h2 span{font-weight:500; color:#0E1A68;}
#section01 h2 span:last-child{font-weight:bold; margin-left:15px;}
#section01 h2:nth-child(1) span:last-child{background: linear-gradient(180deg, #FE5896, #F19578); color: transparent; -webkit-background-clip: text;}
#section01 h2:nth-child(2) span:last-child{background: linear-gradient(180deg, #7247D1, #5686E5); color: transparent; -webkit-background-clip: text;}
#section01 .txt_box>p{margin-top:15px; font-size:20px; line-height:29px; color:#000; margin-bottom:55px;}
#section01 .txt_box ul{display:flex; width:540px;}
#section01 .txt_box li{width:25%;}
#section01 .txt_box li a{display:flex; flex-direction: column; align-items: center; position:relative;}
#section01 .txt_box li a .img_box{width: 120px; height: 120px; display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 50%; margin-bottom:20px; box-shadow: 0px 0px 15px #00000029;}
#section01 .txt_box li a:hover{top:-10px;}
#section01 .txt_box li a p{font-size:16px; line-height:24px; color:#000;}

/*section02*/
#section02 .section_cover{padding:80px 10px; flex-direction: column; align-items: center; justify-content: center;}
#section02 .main_content{width:100%;}
#section02 ul{display:flex;}
#section02 ul li{width:25%; margin-right:38px;}
#section02 ul li a{display:flex; flex-direction: column; border:1px solid #D4D4D4; background:#fff; border-radius:10px; overflow:hidden; text-align:center;}
#section02 ul li a:hover{box-shadow: 15px 15px 20px #00000029;}

#section02 ul li a .img_box img{width:100%;}
#section02 ul li a h4{font-size:16px; line-height:23px; margin-bottom:10px; padding-top:25px; color:#000; height:48px; overflow:hidden;}
#section02 ul li a p{margin-bottom:25px; font-size:14px; color:#707070; line-height:19px;}

/*section03*/
#section03{background:#F8F6FC;}
#section03 .section_cover{padding:80px 10px; flex-direction: column; align-items: center; justify-content: center;}
#section03 ul{display:flex; width:100%;}
#section03 ul li{width:33.3%;}
#section03 ul li:nth-child(2){margin:0 38px;}
#section03 ul li a{display:flex; padding:50px; flex-direction: column; align-items: flex-start; position:relative; border:1px solid #D4D4D4; background:#fff; border-radius:10px; position:relative;}
#section03 ul li a h4{font-family: 'GmarketB', sans-serif !important; font-weight:bold; font-size:25px; line-height:29px; margin-bottom:15px; color:#000; position:relaitve; z-index:5;}
#section03 ul li a p{display:flex; width:120px; height:40px; border-radius:60px; background:#0E1A68; color:#fff; font-size:14px; line-height:19px; align-items: center; justify-content: space-around;}
#section03 ul li a>img{position: absolute; right: 50px; top: 30px; height: 126px; }


@media(max-width:1700px){
	#section01{justify-content: center;}
}	
@media(max-width:1600px){
	#section01 .section_cover>.img_box{margin-right:0;}
	#section01 .txt_box{width: calc(100% - 600px);}
}	
@media(max-width:1240px){
	#section01 .txt_box{width: calc(100% - 450px);}
	#section01 .section_cover>.img_box{width:450px;}
	#section01 .section_cover>.img_box>img{height:400px;}
	#section03 ul li a{padding:25px;}
	#section03 ul li a>img{top: 30px; height: 80px;}
}
@media(min-width:1101px){
	#section02 ul li a div{height:200px; overflow:hidden;}
}
@media(max-width:1100px){
	#section01{height:500px; position:relative; margin-bottom: 200px;}
	#section01 .section_cover{position: relative; align-items: flex-start; padding-top: 20px;}
	#section01 .txt_box{width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 1;}
	#section01 .section_cover>.img_box{position: absolute; right: 10px; width: auto; bottom: 0;}
	#section01 .section_cover>.img_box>img{height:340px;}
	#section01 .sign_box{margin-bottom:40px;}
	#section01 h2{font-size: 50px; line-height: 55px;}
	#section01 .txt_box>p{font-size: 17px; line-height: 24px; text-align:center;}
	#section01 .txt_box ul{position: absolute;; bottom: -205px; padding:0px; width:100%;  border-bottom: 1px solid #D4D4D4;}
	#section01 .txt_box ul li{padding: 20px 0px; border-right: 1px solid #D4D4D4;}
	#section01 .txt_box ul li:last-child{border-right:0px;}
	
	#section03 ul{flex-direction: column; background:#F8F6FC;}
	#section03 ul li{width: 100%; margin: 0 !important; margin-bottom: 20px !important;}
	#section03 ul li a{padding: 40px;}
	#section03 ul li a>img{right: 40px; top: 30px; height: 100px;}
	
}	
	
@media(max-width:950px){
	.main_title h3{font-size: 23px; line-height: 26px;}
	.main_title p{font-size:16px;}
	#section02 ul{flex-wrap: wrap; padding:0 10px;}
	#section02 ul li{width:calc(50% - 10px); margin-right:10px; margin-bottom:20px;}
	#section02 ul li:nth-child(2n){margin-right:0px; margin-left:10px;}
	#section03 .section_cover{padding: 40px 10px 20px;}
}
	
@media(max-width:650px){
	#section01{height:400px; margin-bottom: 110px;}
	#section01 h2{font-size: 29px; line-height: 40px; font-weight: bold;}
	#section01 .txt_box>p{letter-spacing: -1px; font-size: 1rem;}
	#section01 .section_cover>.img_box{flex-direction: row-reverse;}
	#section01 .section_cover>.img_box>img{height: 215px; margin-left: 14px;}
	#section01 .sign_box{margin-bottom: 10px;}
	#section01 .sign_box img{height:31px;}
	#section01 .txt_box ul{bottom:-110px; width:100%;}
	#section01 .txt_box ul li{padding:10px 0px;}
	#section01 .txt_box li a .img_box{width:60px; height:60px; margin-bottom:5px; }
	#section01 .txt_box li a .img_box img{width:30px;}
	#section01 .txt_box li a p{font-size:0.8rem;}
	#section02 .section_cover{padding: 40px 10px 20px;}
	#section02 ul li{width:100%; margin:0px !important; margin-bottom:20px !important;}
	#section02 ul li:nth-child(n + 3){display:none;}
	
}
	
	
	