body{font-size: 17px;color: #333;font-family: Tahoma;}
.detail{width:1080px; margin:0 auto;}
img{max-width: 100%;}
a{ text-decoration:none;}
a:hover{text-decoration: underline;}
li{ list-style:none;}
/*----------------*/
.main01 {background: url('../images/userguide-how/bg.jpg') center center no-repeat;  height: 305px;}
.main01 h1 {font-size: 45px;text-align: center;line-height: 50px;padding: 35px 0 275px 0;}
/*----------------*/
.main02 {padding: 35px 0 55px 0;}
.main02 .left-content {width: 730px;float: left;}
.main02 .left-content .crumb {font-size: 15px; color: #333;}
.main02 .left-content h1 {font-size: 31px;line-height: 35px;padding: 50px 0 30px 0;text-align: center;}
.main02 .left-content .software-list {text-align: center;font-size: 17px;margin-bottom: 30px;}
.main02 .left-content .software-list li {display: inline-block;text-decoration: underline;}
.main02 .left-content .software-list li:nth-child(1) {margin-right: 40px;}
.main02 .left-content .software-list li a {color: #333;}
.main02 .left-content .software-list li a:hover {text-decoration: none;color: #25abfe;}
.main02 .left-content .software-list li img {display: inline-block;vertical-align: middle;margin-right: 4px;}
.main02 .left-content>p {font-size: 17px;color: #666;line-height: 27px;margin-bottom: 20px;}

.main02 .left-content .go-to-list {font-size: 17px;padding-bottom: 14px;}
.main02 .left-content .go-to-list div {margin-bottom: 15px;font-weight: 550;}
.main02 .left-content .go-to-list ul li {display: inline-block;vertical-align: top;width: 230px;font-weight: 550;margin-bottom: 28px; }
.main02 .left-content .go-to-list ul li a {color: #1b96ff;text-decoration: underline;}
.main02 .left-content .go-to-list ul li a:hover {color: #FF3300;text-decoration: none;}

.main02 .left-content .download-step div {font-size: 19px;margin-bottom: 13px;font-weight: 550;}
.to-download { display: block; width: 288px; padding-left: 20px; height: 72px;color: #fff;margin: 20px 0 10px 0;  float: left;
	background:#78c443 url('../images/userguide-how/button-win-icon.png') 244px center no-repeat; overflow: hidden; border-radius:  5px; 
	-webkit-border-radius:  5px; -moz-border-radius:  5px; -ms-border-radius:  5px; -o-border-radius:  5px; }
.to-download:hover {text-decoration: none;color: #fff;}
.to-download b  {display: block;font-size: 25px;margin: 14px 0 4px 0;font-weight: 550;}
.to-download span {display: block;font-size: 15px;}

.to-download-mac { display: block; width: 288px; padding-left: 20px; height: 72px;color: #fff;margin: 20px 0 10px 0;  float: left;
	background:#78c443 url('../images/userguide-how/macioc.png') 244px center no-repeat; overflow: hidden; border-radius:  5px; 
	-webkit-border-radius:  5px; -moz-border-radius:  5px; -ms-border-radius:  5px; -o-border-radius:  5px; }
.to-download-mac:hover {text-decoration: none;color: #fff;}
.to-download-mac b  {display: block;font-size: 25px;margin: 14px 0 4px 0;font-weight: 550;}
.to-download-mac span {display: block;font-size: 15px;}

.to-buy { display: block; width: 288px; padding-left: 20px; height: 72px;color: #fff; margin: 20px 0 10px 60px;  float: left;
	background:#ff9c00 url('../../img/buycion.png') 224px center no-repeat; overflow: hidden; border-radius:  5px; 
	-webkit-border-radius:  5px; -moz-border-radius:  5px; -ms-border-radius:  5px; -o-border-radius:  5px; }
.to-buy:hover {text-decoration: none;color: #fff;}
.to-buy b  {display: block;font-size: 25px;margin: 14px 0 4px 0;font-weight: 550;}
.to-buy span {display: block;font-size: 15px;}

.main02 .left-content .download-step p a {font-size:15px;color: #25abfe;}
.main02 .left-content .btn a{float:none;margin: 0;display: inline-block;}
.main02 .left-content .main-intro {padding-top: 46px;}
.main02 .left-content .main-intro h2 {font-size: 19px;font-weight:550;padding: 14px 0 14px 14px;border-left: 5px solid #cccccc;background-color: #ececec;margin-bottom: 26px;}
.main02 .left-content .main-intro p {color: #666666;margin-bottom: 20px;line-height: 30px;}
.main02 .left-content .main-intro p b {color: #333;}
.main02 .left-content .main-intro>ul {padding:12px 0 22px 0;}
.main02 .left-content .main-intro>ul>li {position: relative;padding-left: 16px;font-size: 17px;color: #666;line-height: 25px;margin-bottom: 12px;}
.main02 .left-content .main-intro>ul>li::before {content: ""; width: 6px; height: 6px; background-color: #25abfe;position: absolute; top: 11px; left: 0; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%;}
.main02 .left-content .main-intro>img {margin-bottom: 22px;width: 100%;max-width: auto;}
.main02 .left-content .main-intro .tips-info {background-color: #fcfcfc;border: 1px dashed #d6d6d6;padding: 20px 20px 1px 60px;position: relative;}
.main02 .left-content .main-intro .tips-info::before {content: "";width: 34px;height: 34px;background-color: #f2f2f2;border: 1px dashed #d6d6d6;position: absolute;top: -1px;left: -1px; }
.main02 .left-content .main-intro .tips-info::after {content: "";border-top: 17px solid #fff;border-left: 17px solid #fff;border-right: 17px solid transparent;border-bottom: 17px solid transparent;position: absolute;top: -1px;left: -1px;}
.main02 .left-content .main-intro .tips-info p {font-size: 17px;margin-bottom: 15px;}
.main02 .left-content .main-intro .tips-info p img {display: inline-block;vertical-align: middle;margin-right: 5px;}
.main02 .left-content .main-intro .tips-info li {position: relative;padding-left: 18px;font-size: 17px;color: #666;line-height: 27px;margin-bottom: 16px; }
.main02 .left-content .main-intro .tips-info li::before { content: ""; width: 6px; height: 6px; background-color: #25abfe;position: absolute; top: 11px; 
left: 0; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.main02 .left-content .main-intro .tips-info li b {font-weight:550;}
.main02 .left-content .main-intro .warning-info {margin-bottom: 25px;background-color: #fff8f6;border-top: 4px solid #ffe6e2;padding: 14px 18px 10px;}
.main02 .left-content .main-intro .warning-info p {font-size: 17px;margin-bottom: 14px;}
.main02 .left-content .main-intro .warning-info p img {display: inline-block;vertical-align: middle;margin-right: 5px;}
.main02 .left-content .main-intro .warning-info li {position: relative;padding-left: 15px;font-size: 17px;color: #666;line-height: 25px;margin-bottom: 8px; }
.main02 .left-content .main-intro .warning-info li::before { content: ""; width: 6px; height: 6px; background-color: #fe9f88;position: absolute; top: 10px; left: 0; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.main02 .left-content .main-intro .compare-box{margin:20px 0;}
.main02 .left-content .main-intro .compare-box table{border-collapse:collapse; border:1px solid #ededed; color:#666; font-size:14px;}
.main02 .left-content .main-intro .compare-box table td{border:1px solid #ededed; padding:10px;}
.main02 .left-content .main-intro .compare-box table td.tac-bg{text-align:center; background-color:#fff8f6;}

.main02 .right-content {width:270px;float: right;margin-top: 200px;}
.main02 .fixed-style {position: fixed;top: 20px;float: none;margin-top: 0;margin-left: 810px;}
.main02 .right-content p {font-size: 19px;}
.main02 .right-content .video-handle {position: relative;overflow: hidden;margin: 22px 0 30px 0;}
.main02 .right-content .video-handle img {display: block;width: 100%;}
.main02 .right-content .video-handle div {width: 100%;height: 100%;background-color: rgba(0,0,0,0.3);position: absolute;top: 0;left: 0;cursor: pointer;}
.main02 .right-content .video-handle div:hover {background-color: rgba(0,0,0,0.2);}
.main02 .right-content .video-handle div span { width: 58px; height: 58px; border: 1px solid #Fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); border-radius:  50%; -webkit-border-radius:  50%; -moz-border-radius:  50%; -ms-border-radius:  50%; -o-border-radius:  50%; }
.main02 .right-content .video-handle div span::after {content: "";border-top: 13px solid transparent;border-bottom: 13px solid transparent;border-left: 23px solid #fff;position: absolute;top: 17px;left: 22px;}
.main02 .right-content .more-list { padding: 26px 14px 8px 22px; background-color: #f9f9f9; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; margin-bottom: 28px;}
.main02 .right-content .more-list p {margin-bottom: 6px;}
.main02 .right-content .more-list li {padding: 16px 0;border-bottom: 1px solid #ececec;font-size: 17px;}
.main02 .right-content .more-list li a {color: #333;display: block;}
.main02 .right-content .more-list li a:hover {color: #333;text-decoration: none;background-color: #eaeaea;}
.main02 .right-content .more-list li:last-child {border-bottom: none;}
.main02 .right-content .more-list li div {display: inline-block;vertical-align: middle;width: 50px;}
.main02 .right-content .other-info {padding: 21px 5px 15px;background-color: #f9f9f9; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; margin-bottom: 28px;}
.main02 .right-content .other-info img {display: block;margin: 0 auto;}
.main02 .right-content .other-info p {text-align: center;margin-top: 10px;}
.main02 .right-content .other-info p a {color: #333;}
.main02 .right-content .other-info p a:hover{text-decoration: none;color: #25abfe;}
/*----------------*/
.popup-container {position: fixed;top: 0;left: 0;z-index: 100;width: 100%;height: 100%;background-color: rgba(0,0,0,0.3);display: none;}
.popup-content { width: 769px; background: #fff; position: absolute; top: 50%; left: 50%;padding:  14px 18px 35px;transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
.popup-content .to-download {margin-top: 18px;}
.popup-content iframe {width: 100%;height: 425px;}
.popup-content .cancel {position: absolute;top: -60px;right: -60px;cursor: pointer;}

.to-top{position:fixed; right:50px; bottom:100px; cursor:pointer; display:none;}
/*----------------*/
@media (max-width: 979px) {
    .detail {width: 95%;}
    .main02 .left-content {width: 100%;float: none;}
	.main02 .right-content {width: 100%;float: none;margin-top:60px;}
	.main02 .fixed-style {position: static;top: 0;margin-left: 0;margin-top:60px;}
    .popup-content {width: 90%;height: auto;}
}

@media (max-width: 767px) {
	
}

@media (max-width: 479px) {
	.popup-content iframe {height: 250px;}
}