@charset "utf-8";
/* CSS Document */
.top_banner{background:url(https://pdfimages.wondershare.com/style2016/images/bg_repeat4.png) repeat 0 0;padding-top:60px;}
.top_banner .title{ font-size:48px;color:#5a5b64; line-height:1.2em; font-weight:800; text-align:center;padding-bottom:50px;}
.top_banner .pic{float:left;width:55%;}
.top_banner .text{float:right;width:40%; text-align:center;margin-top:30px;}
.top_banner .text h2{font-size:28px;color:#2c3db0; line-height:1.2em; font-weight:600;}
.top_banner .text .play{ font-size:18px;margin-top:30px;}
.top_banner .text .play i{ font-size:24px; vertical-align:middle;}
.top_banner .text .play a{color:#5a5b64;}
.top_banner .text .play a:hover{color:#435bfd; text-decoration:none;}
.top_banner .text .btn{margin-top:30px;}
.top_banner .text .txt{ font-size:14px;margin-top:15px;}
@media (max-width: 979px) {
	.top_banner{padding:60px 0;}
	.top_banner .pic{float:none;width:auto; text-align:center;}
	.top_banner .text{float:none;width:auto;}
}
@media (max-width: 479px) {
	.top_banner .title{ font-size:36px;}
}

.column {font-size:36px; line-height:1.2em; font-weight:bold; padding:0 20% 30px 20%; text-align:center;}
@media (max-width: 979px) {
	.column {padding:0 0 30px 0;}
}
@media (max-width: 767px) {
	.column {font-size:26px;}
}

.infoBox1{padding:90px 0 35px;}
.infoBox1 ul {padding:20px 0;}
.infoBox1 ul:after{display:block; content:""; clear:both;}
.infoBox1 ul li {float:left; width:31.3%; padding:10px 0 10px 3%;}
.infoBox1 ul li:first-child {padding-left:0;}
.infoBox1 ul li a {display:block; position:relative; z-index:1; background:#000; border:solid 5px #fff;box-shadow:0 0 15px #333;box-shadow:0 0 15px rgba(53,49,50,.3);}
.infoBox1 ul li a:hover img {opacity:0.8;}
.infoBox1 ul li p {padding:20px 0 0 0; font-size:18px;}
.infoBox1 .btn {text-align:center; padding:20px 0 0 0;}
@media (max-width: 767px) {
	.infoBox1 ul li {float:none; width:auto; padding:0 0 40px 0;}
	.infoBox1 .btn {padding:0;}
}

.infoBox2{background:url(https://pdfimages.wondershare.com/style2016/images/bg_repeat2.png) repeat 0 0;padding:90px 0;}
.infoBox2 h3{color:#fff;}
.infoBox2 .picbox {padding:20px 0;}
.infoBox2 .picbox .item {float:left; background:#fff;width:27.7%; margin:0 2.8%;box-shadow:0 0 15px #333;box-shadow:0 0 15px rgba(53,49,50,.3);}
.infoBox2 .picbox .item .pic{padding:5px;}
.infoBox2 .picbox .item .pic a:hover{opacity:0.8;}
.infoBox2 .picbox .item .info{padding:15px 10px;}
.infoBox2 .picbox .item .info .icon{float:left;}
.infoBox2 .picbox .item .info .text{padding-left:64px;}
.infoBox2 .picbox .item .info .text h4{font-size:18px; line-height:1.2em; font-weight:bold;}
.infoBox2 .picbox .item .info .text p{margin-top:10px; font-size:14px; line-height:1.4em; min-height:80px;}
@media (max-width: 767px) {
	.infoBox2 .picbox .item{float:none;width:315px;margin:0 auto;margin-top:30px;}
	.infoBox2 .picbox .item:first-child{margin-top:0;}
}
@media (max-width: 320px) {
	.infoBox2 .picbox .item{width:auto;}
}


/* 新增列表 */
.paragraphs-item-collapsible-list {
    padding: 45px 0;
    border-top: 1px solid #ddd
}

.paragraphs-item-collapsible-list h3 {
    margin-top: 0
}

.paragraphs-item-collapsible-list h2{
    color: #1b49a0;
    font-weight: 500;
    font-size: 1.75rem;
}
 
@media screen and (max-width: 62.4375em) {
    .paragraphs-item-collapsible-list h3 {
        font-size:1.25rem
    }
}

.list-item {
    text-align: left
}

.collapsible-item {
    text-align: left;
    border-bottom: .0625rem solid #ccc
}

.collapsible-item label {
    display: block;
    padding: 32px 0 4px;
    width: 100%;
    height: auto;
    min-height: 34px;
    line-height: 20px;
    color: #333;
    font-size: .9375rem;
    cursor: pointer;
    font-weight: normal
}

.collapsible-item label:hover {
    color: #2c6ee1
}

@media screen and (max-width: 62.4375em) {
    .collapsible-item label:hover {
        color:#333
    }
}

.collapsible-item label:hover::after {
    color: #2c6ee1
}

.collapsible-item label::after {
    display: inline-block;
    position: relative;
    content: "";
    right: .3125rem;
    float: right;
    margin-left: .5rem;
    margin-right: -20px;
    width: .5rem;
    height: .5rem;
    transform: rotate(45deg);
    border-right: .125rem solid #333;
    border-bottom: .125rem solid #333
}

.collapsible-item .collapsible {
    display: block;
    padding: 0;
    margin: 0;
    width: 95%;
    font-size: .875rem
}

.collapsible-item input[name='panel'] {
    display: none
}

.collapsible-item input[name='panel']~label {
    width: 95%
}

@media screen and (max-width: 62.4375em) {
    .collapsible-item input[name='panel']~label {
        height:auto;
        min-height: 3.25rem;
        line-height: 1.375rem;
        padding-bottom: 0
    }
}

.collapsible-item input[name='panel']~.collapsible {
    -webkit-transition: height 1s ease;
    -o-transition: height 1s ease;
    transition: height 1s ease;
    overflow: hidden;
    height: 0
}

@media screen and (max-width: 62.4375em) {
    .collapsible-item input[name='panel']~.collapsible {
        height:0
    }
}

.collapsible-item input[name='panel']:checked~.collapsible {
    overflow: auto;
    height: auto;
    padding: 0 0 20px;
}

@media screen and (max-width: 62.4375em) {
    .collapsible-item input[name='panel']:checked~.collapsible {
        height:auto;
        padding: .25rem 0 1.375rem
    }
}

.collapsible-item input[name='panel']:checked~label {
    line-height: 1.375rem;
    font-weight: bold
}

.collapsible-item input[name='panel']:checked~label:hover {
    color: #333
}

.collapsible-item input[name='panel']:checked~label::after {
    margin-top: .5rem;
    transform: rotate(225deg)
}

.touch .collapsible-item label:hover {
    color: #333
}