@charset "utf-8";
/* CSS Document */
.column{ font-size:36px; line-height:1.2em;padding-bottom:20px; text-align:center;}
.top_banner_title{ background-position:center center; background-repeat:no-repeat;padding:80px 0; text-align:center;color:#fff; background-size: cover;}
.top_banner_title .desc{ font-size:18px; line-height:1.4em;padding:0 10%; font-weight:300;}

.page_main{padding:80px 0; padding-top:30px;}
.pb0{padding-bottom:0;}
.page_main h2{padding:0 15%; font-size:30px; line-height: 1.2em; margin-bottom:20px; text-align:center;}
.page_main h3 {padding:0 15%; font-size:24px; line-height: 1.2em; margin-bottom:20px; text-align:center;}
.page_main .info {padding-bottom: 20px;}
.page_main .desc{ font-size:18px; line-height:1.4em; text-align:center;padding:0 10%;}
.page_main .note{ text-align:center; font-size:12px;padding:0 15%;margin-top:15px; font-style:italic;}
@media (max-width: 979px) {
	.page_main h2,
	.page_main h3,
	.page_main .desc,
	.page_main .note {padding: 0;}
}
@media (max-width: 767px) {
	.page_main h2 {font-size:24px;}
	.page_main h3 {font-size:18px;}
}

.infoList{margin-top:20px;}
.infoList .item{margin-top:50px;float:left;width:47%;margin-left:6%;}
.infoList .item:first-child,
.infoList .item:nth-of-type(2n+1){margin-left:0;}
.infoList .item .num{float:left;width:40px; text-align:right; font-size:36px; line-height:1em; position:relative;padding-top:5px;}
.infoList .item .num:before{display:block; content:"";position:absolute;width:30px;height:30px; background-color:#03367c; opacity:0.3; border-radius:30px;top:0;}
.infoList .item .text{padding-left:60px;}
.infoList .item .text h3{ font-size:18px; line-height:1.4em;border-bottom:1px solid #03367c;font-weight:600; text-align: left; padding: 0 0 10px 0;}
.infoList .item .text p{ font-size:16px; line-height:1.4em;margin-top:10px;}
@media (max-width: 767px) {
	.infoList .item {float: none;width: auto;margin-left: 0;}
}

.infopic{margin:50px 0;}
.infopic + .infopic {margin-top: 0;}
.infopic.mt0{margin-top:0;}
.infopic.mb0{margin-bottom:0;}
.infopic .frpic{float:right;width:60%; text-align:center;}
.infopic .flpic{float:left;width:60%; text-align:center;}
.infopic .fltext{margin-right: 64%;}
.infopic .frtext{margin-left: 64%;}
.infopic_sm .flpic,
.infopic_sm .frpic {width:47%;}
.infopic_sm .fltext{margin-right: 50%;}
.infopic_sm .frtext{margin-left: 50%;}
.infopic .mt80{margin-top:80px;}
.infopic .pt80{padding-top:80px;}
.infopic h3 { font-size:24px; font-weight:600; line-height:1.2em;padding:0 0 20px 0; text-align: left;}
.infopic h4 {font-size:18px; font-weight:600; line-height:1.2em;padding:25px 0 10px 0; text-align: left;}
.infopic > h3,
.infopic > h4,
.infopic .info > h3,
.infopic .info > h4 {text-align: center;}
.infopic p{ font-size:16px; line-height:1.6em;margin-top:10px;}
.infopic p strong{color:#03367c;}
@media (max-width: 767px) {
	.infopic .flpic,
	.infopic .frpic {float: none;width: auto; padding:20px 0;}
	.infopic .fltext,
	.infopic .frtext {margin-left: 0; margin-right: 0; padding: 20px 0;}
	.infopic h3 {font-size: 20px;}
}

.site-fl{margin-top:20px;}
.site-fl li{float:left;width:20%;line-height:18px;height:18px;padding:6px 0;}
.site-fl li img{width:16px;height:16px;margin-right:5px;}
@media (max-width: 767px) {
	.site-fl li{width:33.3%;}
}
@media (max-width: 479px) {
	.site-fl li{width:50%;}
}

.home_banner_title{background-position:center center; background-repeat:no-repeat;padding:70px 0; text-align:center;color:#fff; background-size: cover;}
.home_banner_title h1{ font-size:44px;padding-bottom:0;}

.taglist{margin-top:40px;}
.taglist .item{float:left;width:20%;margin:0 0.5%; position:relative; min-height:180px;margin-left:-6px;}
.taglist .item .bg{background-color:#4a99f3;color:#fff; border-radius:10px;object-fit: contain; width:140px; height:140px;transform:rotate(45deg);-ms-transform:rotate(45deg); 	/* IE 9 */-moz-transform:rotate(45deg); 	/* Firefox */-webkit-transform:rotate(45deg); /* Safari 和 Chrome */-o-transform:rotate(45deg); 	/* Opera */ position:absolute;box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);top:30px;left:30px;}
.taglist .item .bg.color1{ background-color:#ff7a89;}
.taglist .item .bg.color2{ background-color:#2ab9fd;}
.taglist .item .bg.color3{ background-color:#06f1d9;}
.taglist .item .bg.color4{ background-color:#784ef5;}
.taglist .item .text{font-size:16px;color:#fff; position:absolute;width:140px; z-index:1; text-align:center;left:30px;margin-top:72px;}
@media (max-width: 979px) {
	
}
@media (max-width: 767px) {
	.taglist .item{width:33%;}
}
@media (max-width: 567px) {
	.taglist .item{width:50%;}
}

.reviewbox{ background-color:#fff; border-radius:10px; background-repeat:no-repeat; background-position:10px 15px;padding:35px 6%;box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.12);margin-top:50px;}
.reviewbox p{ font-size:24px; line-height:1.4em;color:#777;}
.reviewbox .name{ text-align:right; font-size:18px;margin-top:15px;color:#777}
.reviewbox .name a{color:#03367c;}

.article_info {font-size: 16px; line-height: 1.6em; padding:60px 0;}
.article_info a {text-decoration: underline;}
.article_info h1 {font-size: 36px; line-height: 1.4em;}
.article_info h2 {font-size: 30px; line-height: 1.4em;}
.article_info h3 {font-size: 24px; line-height: 1.4em; font-weight: bold;}
.article_info h4 {font-size: 18px; line-height: 1.4em; font-weight: bold;}
.article_info h5 {font-size: 16px; line-height: 1.4em; font-weight: bold;}
.article_info h1,
.article_info h2,
.article_info h3,
.article_info h4,
.article_info h5 {color:#03367c;}
.article_info h1,
.article_info h2,
.article_info h3,
.article_info h4,
.article_info h5,
.article_info .pic,
.article_info p,
.article_info ul,
.article_info ol,
.article_info dl {padding:0 0 20px 0; margin: 0;}
.article_info .box {padding: 30px 0 10px 0; margin: 0;}
.article_info .box_border {border:solid 1px #ccc; padding: 30px 30px 10px 30px;}
.article_info .box_border.dotted {border:dotted 1px #979797;}
.article_info .box_border.color_light {color: #999;}
.article_info ul li {list-style: disc;margin-left:20px;}

/* 2018-4-18 new style */
.btndown_win,
.btndown_mac{display:inline-block; vertical-align:middle; padding:6px 15px; border:solid 2px #ff6500; border-radius:100px; background:#ff6500; color:#fff !important; font-size:18px; line-height:32px; font-weight:600; text-decoration:none !important;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s; text-align:center;}
.btndown_win:before,
.btndown_mac:before{display:inline-block;font-family:'Spysiz'; color:#fff;font-size:26px; line-height:32px; font-weight:normal; vertical-align:middle; padding:0 0 0 15px; float:right;}
.btndown_win:before{content: "\e916";}
.btndown_mac:before{content: "\e909";color:#242b33 !important;}
.btndown_win:hover{ background:#d95600;border:solid 2px #d95600;}
.btndown_mac{ border:2px solid #242b33; background:#fff;color:#242b33 !important;}
.btndown_mac:hover{background:#242b33;border:solid 2px #242b33; color:#fff !important;}
.btndown_mac:hover:before{color:#fff !important;}

.infobox{padding:60px 0;}
.infobox .pic{float:left;width:53%;}
.infobox .pic img{box-shadow: 0 2px 40px 0 rgba(0, 0, 0, 0.2);}
.infobox .text{float:right;width:42%;}
.infobox .text h2{ font-size:28px; line-height:1.3em; font-weight:600;}
.infobox .text .desc{ font-size:18px;padding:15px 0; line-height:1.6em;}
.infobox .text ul{margin-top:20px;}
.infobox .text li{padding:5px 0; font-size:16px;}
.infobox .text li i{display:inline-block;margin-right:8px;}
.infobox .text .link{margin-top:10px;font-size:16px;color:#ff6500;}
.infobox .text .link a{color:#ff6500;}
.infobox .text .btn a{margin:0 8px;}
@media (max-width: 900px) {
	.infobox .pic{float:none;width:auto; text-align:center;}
	.infobox .text{float:none;width:auto;margin-top:30px;}
}
.embed-responsive {position: relative;display: block;width: 100%;padding: 0;overflow: hidden;box-sizing: border-box;}
.embed-responsive {-webkit-box-shadow: 0 2px 40px 0 rgba(0,0,0,.2);box-shadow: 0 2px 40px 0 rgba(0,0,0,.2);background-color: rgba(0,0,0,.1);}
.embed-responsive video{width:100%;height:100%;}