@charset "utf-8";
*{box-sizing: border-box;}
body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin:0;padding:0;}
/* body,button,input,select,textarea{font:14px "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;} */
body,button,input,select,textarea{font:16px microsoft jhenghei, Verdana, Geneva,helvetica neue,helvetica,arial,pingfang sc,hiragino sans gb,stheiti,microsoft yahei,SimSun,sans-serif;}
body{color:#333; background: #f9f9f9; overflow-x: hidden; }
h1,h2,h3,h4,h5,h6{font-size:100%;}
address,cite,dfn,em,var,i{font-style:normal;}
code,kbd,pre,samp{font-family:courier new,courier,monospace;}
small{font-size:10px;}
ul,ol{list-style:none;}
a{text-decoration:none; color:#333; }
a:hover{text-decoration:none; color:#3c8dbc;}
sup{vertical-align:text-top;}
sub{vertical-align:text-bottom;}
abbr[title]{border-bottom:1px dotted;cursor:help;}
legend{color:#000;}
fieldset, img { border:0;}
a img{vertical-align:text-bottom;}
:focus {outline:0;}
textarea{overflow:auto;vertical-align:top;resize:vertical;}
button,input,select,textarea{font-size:100%;}
button,input,select{vertical-align:middle;}
button{cursor:pointer;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}
/*Common Style
--------------------------------*/
/*text align*/

.tc{ text-align:center;}
.tr{ text-align:right;}
.tl{ text-align:left;}
.tj{ text-align:justify;}
/*float and clear*/
.fl{float:left;display:inline;}
.fr{float:right;display:inline;}
/*clear*/
.nor{font-weight: normal;}
.clearfix:after{ content: ''; display: block;  clear: both; visibility: hidden; line-height: 0;height: 0; font-size:0; }
.clearfix {zoom:1;}
.ellipsis {display: block;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.capital{text-transform:uppercase;}
.hidden{overflow:hidden;}
.position{position:relative;}
.container{padding-right:15px; padding-left:15px;margin-right: auto;margin-left: auto; max-width: 80%; min-width: 1200px;}
.min_width{min-width: 1200px;}
.white{color: #fff;}
.blue{color: #3b86ed;}

.icon {
   vertical-align: -0.15em;
   fill: currentColor;
   overflow: hidden;
}


header{position: absolute; left: 0; right: 0; top: 40px; margin: 0 auto; width: 100%;}
header,header a,header a:hover{color: #fff;}
header .icon{width:150px; height:45px;}
header h1{font-size: 30px; position: relative; padding: 0 0 0 10px; margin: 3px 0 0 10px; font-weight: 500;}
header h1::before{content: ''; display: inline-block; width: 3px; height: 28px; background: rgba(255,255,255,.5); position: absolute; left: 0; top: 8px; }
header .fr a{padding: 0 5px; display:inline-block;}
header .fr a:hover{color: #fff;}


.banner{height: 918px; background: url(../images/banner1.jpg) center no-repeat; padding: 200px 0 0 0; background-size: cover; background-attachment: fixed;}
.banner .container{display: flex; justify-content: space-between; align-items: center;}
.banner section{width: 50%; color: #fff; font-size: 26px; line-height: 1.8; text-align: justify;}
.banner section h1{font-size: 45px; padding: 0 0 15px; }

.main_container_img{align-self: flex-start; max-width: 40%; flex-basis: 40%; position: relative; z-index: 10;}
.main_container_img img{max-width: 100%;}


.main_container{display: flex; justify-content: space-between; align-items: center; height: 660px;}
.main_container section{font-size: 35px; width: 50%; position: relative; z-index: 2; }
.main_container section p{margin:20px 0 0 0; line-height: 1.5;}
.main_container section p::before{content:''; width: 20px; height: 20px; display: inline-block; border-radius: 50%; background: #3b86ed; vertical-align: middle; margin: -7px 15px 0 0;}
.main_container section.white p::before{background: #fff;}
.main_bg01{background: url(../images/bg01.jpg) center no-repeat; background-size: cover; background-attachment: fixed; }
.main_bg02{background: url(../images/bg02.jpg) center no-repeat; background-size: cover; background-attachment: fixed;}
.main_bg01 img,.main_bg02 img{margin-top:50px;}
.main_bg02 section{padding: 40px 0 0 0;}

footer{background: #3b86ed; color: #fff; padding: 50px 0;  position: relative; z-index: -1;}

@media screen and (max-width: 1600px){
    .main_container{height: 580px;}
    .main_bg01 img,.main_bg02 img{margin-top:20px;}
    .main_bg01 .main_container_img,.main_bg02 .main_container_img{max-width: 32%; flex-basis: 32%;}
    .banner section{font-size: 25px;}
}

@media screen and (max-width: 1440px){
    .main_container{height: 550px;}
    .main_container section{font-size: 28px;}
}

@media screen and (max-width: 1366px){
    .main_container section{font-size: 26px;}
}