/*the common*/
body { min-width:320px; line-height:1.33;}
img { width:auto; height:auto}

[class^="ico-"]{ display:inline-block; overflow:hidden; vertical-align:middle; background:url(//ue.17173cdn.com/a/hs/zt/2015/ks01/m/img/b1.png) no-repeat}
.ico-prev{ background-size:900%; width:10px; height: 17px; background-position:0 -175px; margin: 0.5rem 0.25rem 0.75rem 0}
.ico-next{ background-size:900%; width:10px; height: 17px; background-position:0 -195px; margin: 0.5rem 0 0.75rem 0.25rem}
.ico-over{ background-size:300%; width:30px; height: 23px; background-position:0 -150px; margin: 0.375rem 0 0.5625rem 0}
.ico-correct{ background-size:200%; width:45px; height: 30px;  background-position:0 -35px;}
.ico-error{ background-size:200%; width:45px; height: 35px; background-position:0 -110px;}

.wrap{ position: absolute; left: 0; top:0; width: 100%; -webkit-background-size:cover; background-size:cover; background-repeat: no-repeat; background-position: center center; padding:0;  background-image: url(//images.17173cdn.com/2015/hs/2015/09/01/bg1.jpg);}

.top-box{ background:rgba(85,18,0,.7)}
.top-box .con{ display: block; color: #fff; font-size: 0.75rem; line-height:2.08; text-align: center;}
.top-box-ex2 .list-top{ overflow: hidden;}
.top-box-ex2 .list-top li{ width: 50%; float:left}
.top-box-ex2 .list-top li:first-child .con{ position: relative;}
.top-box-ex2 .list-top li:first-child .con:after{ content:'|'; display:inline-block; position: absolute; right: 0; top:0;}

.pop-tip{ width: 100%; height: 100%; position: fixed; left:0; top:0; background: rgba(0,0,0,.8); z-index: 100; display: none}
.pop-tip .share-tip{ position: absolute; top:0.9375rem; right:1.25rem; width: 75.16%}
.pop-tip .share-tip img{ width: 100%}

@-webkit-keyframes rotate{
from{-webkit-transform:rotate(0deg); transform:rotate(0deg)}
to{-webkit-transform:rotate(360deg); transform:rotate(360deg)}
}
.pn-loading{ position: absolute; left: 0; top:58%; width: 100%}
.wrap-loading{ background-image: url(//images.17173cdn.com/2015/hs/2015/09/01/bg2.jpg);}
.pn-loading .tit{ text-align: center; color: #883d1f; font-size: 1.3125rem; margin-bottom: 1.3rem}
.pn-loading .loading-box{ text-align: center;}
.pn-loading .loading-box .pic-box{ width: 4.375rem; margin: 0 auto; animation: 2s linear 0s normal none infinite rotate; -webkit-animation:2s linear 0s normal none infinite rotate;}
.pn-loading .loading-box .pic-box img{ width: 100%;}
.pn-loading .loading-box .txt{ color:#bb9c78; font-size: 0.875rem}

.pn-home{ padding:3.43rem 0 2.06rem 0; text-align: center; color: #9d754b; font-size: 0.875rem}
.pn-home .tit{ color: #bb9c78; font-size:1.9375rem}
.pn-home .jion{ color: #7b4c37; font-size: 1.125rem; margin-top: 0.625rem}
.pn-home .jion .num{ color: #b63913; font-weight: bold}
.pn-home .btn-begin{ display: inline-block; background: #b63913; text-align: center; color: #fff; width:56.25%; line-height: 2.26; border-bottom:1px solid #c8441b; position: relative; border-top-right-radius: 0.1875rem; border-top-left-radius:0.1875rem; margin-top: 4.18rem}
.pn-home .btn-begin:before{ content:' '; display:inline-block; border-top: 5px solid #a43310; position: absolute; bottom: -6px; left: 0; width: 100%; border-bottom-left-radius:0.1875rem; border-bottom-right-radius:0.1875rem;}
.pn-home .subject{ margin-top: 0.75rem;} 
.pn-home .info{ text-align: left; line-height: 1.43; padding: 0 6.25%; margin-top: 1.125rem; text-indent: 2em}
.pn-home .logo{ width: 5.625rem; display: block; margin: 0 auto; margin-top: 1.6875rem}
.pn-home .logo img{ width: 100%}
.pn-home .link-wx{ color: #fff; font-size: 0.875rem; text-align: center; width: 78%; margin: 0 auto; background:#c3a786; line-height: 2.28; border-radius: 1rem; display: block; margin-top: 0.9375rem}

.mod-final{ padding: 0 3.125%; color: #7e5438; margin-bottom: 4.6rem}
.mod-final .tit-box{ display: table; width: 100%; table-layout: fixed; margin: 0.625rem 0 }
.mod-final .box-c1{ display: table-cell; vertical-align: middle; width:2.5rem;}
.mod-final .box-c2{ display: table-cell; vertical-align: middle; padding-left: 0.4375rem;}
.mod-final .tit-box .num{ position: relative; font-size: 1.56rem; color: #fff; text-align: center; font-weight: bold; z-index: 5; height: 2.375rem; line-height:1.52;}
.mod-final .tit-box .num-bg{ position: absolute; width: 100%; height: 100%!important; left: 0; top:0; z-index: -1}
.mod-final .tit-box .tit{ font-size: 1rem; line-height: 1.1875;}
.mod-final .question-img-box{ padding: 0 6.6%}
.mod-final .question-img-box img{ width: 100%}
.list-question{ overflow: hidden;}
.list-question li{ float: left; width: 48.3%; margin-right:3.4%; position: relative; margin-bottom: 0.625rem; outline: none}
.list-question li:nth-child(2n){ margin-right: 0}
.list-question .pic-box img{ width: 100%}
.list-question .detail-box{ display: table; width: 100%; table-layout: fixed; background: #fff;  padding: 0 0.9rem; overflow: hidden;}
.list-question .detail-c1{ display: table-cell; vertical-align: middle; width:1.4375rem;}
.list-question .detail-c2{ display: table-cell; vertical-align: middle;}
.list-question .num{ font-size: 1.4375rem; line-height:1.74}
.list-question .tit{ font-size:0.8125rem; max-height: 2.66em; overflow: hidden;}
.list-question .cover{ position: absolute; width: 100%; height: 100%; display: none;}
.list-question .cover1{ border-top:4px solid #b63913; height: 4px; top:0; left: 0}
.list-question .cover2{ border-left:4px solid #b63913; width: 4px; top:0; left: 0}
.list-question .cover3{ border-top:4px solid #b63913; height: 4px; left: 0; bottom: 0}
.list-question .cover4{ border-left:4px solid #b63913; width: 4px; right: 0; bottom: 0}
.list-question .clicked .cover{ display: block;}
.list-question2{ padding: 0 6.6%; margin-top: 0.8125rem}
.list-question2 li{ padding: 0 1.9%; background: #fff; border-radius:0.1875rem; margin-bottom:0.3125rem}
.list-question2 .item{ display: table; width: 100%}
.list-question2 .c1{ display: table-cell; vertical-align: middle; width: 1.5625rem}
.list-question2 .c2{ display: table-cell; vertical-align: middle;}
.list-question2 .num{ font-size: 1.4375rem; line-height: 1.74}
.list-question2 .tit{ font-size: 0.875rem}
.list-question2 .clicked{ background: #b63913; color: #fff}
.list-question3{ overflow: hidden; padding: 0 6.6%; margin-top: 2.5rem}
.list-question3 li{ float:left; width:38.5%; margin:0 5.75%; text-align: center; background: #fff; border-radius: 0.3125rem; display: table}
.list-question3 .item{ display: table-cell; vertical-align: middle; height: 5rem}
.list-question3 .clicked{ background: #b63913}
.list-question3 .clicked .ico-correct{ background-position:0 0}
.list-question3 .clicked .ico-error{ background-position:0 -70px}
.control-bar{ position: fixed; width: 100%; bottom: 0; left:0; z-index: 100; overflow: hidden; padding:0.625rem 3.125%; background: rgba(85,18,0,.5);}
.control-bar .btn{ color: #fff; font-size: 0.9375rem; line-height: 2.7; background: #b63913; text-align: center; display: block; width: 26.6%; float: left; margin-left: 0.4%; border-radius: 0.1875rem}
.control-bar .btn:first-child{ margin: 0}
.control-bar .btn-over{ width:46%; background: #d08244}

.pn-result{ padding-bottom: 0.625rem}
.pn-result .result-box{ text-align: center; margin-top: 1.25rem}
.pn-result .result-box .tit{ font-size: 1.4375rem; color: #7e5438; margin-bottom: 0.625rem}
.pn-result .result-box .result{ background:#d4c3a9; border: 2px solid #ba9277; width: 59.37%; margin: 0 auto; color: #ba9b77; text-align: center; font-size: 5rem; line-height:1.08; border-radius: 0.8125rem}
.pn-result .info{ color: #9d754b; font-size: 0.875rem; line-height:1.43; padding: 0 3.125%; margin-top: 0.75rem}
.pn-result .btn{ display: block; width: 78.13%; margin: 0 auto; color: #fff; text-align: center; background: #b63913; font-size: 1.25rem; border-radius: 0.1875rem; line-height:2;  margin-top: 0.625rem}
.pn-result .btn-restar{ background: #d08244}
.pn-result .link{ display: block; padding: 0 3.125%; margin-top: 1.5625rem}
.pn-result .link img{ width: 100%}

/*the iPhone 4*/
@media only screen and (min-device-width: 320px) and (max-device-height: 480px){
	.pn-loading{ top:auto; bottom: 6.4%;}
	.pn-home{ padding: 1.5rem 0 1rem 0}
	.pn-home .btn-begin{ margin-top: 2.18rem}
	.pn-result .result-box .tit{ margin-bottom: 0.25rem}
	.pn-result .result-box{ margin-top: 0.25rem}
	.pn-result .info{ margin-top: 0.25rem}
	.pn-result .btn{ margin-top: 0.35rem}
	.pn-result .link{ margin-top: 0.35rem; padding: 0 5%}
}

/*iPhone 5 and iPhone 5s*/
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) {
	

}  

/*iPhone 6 and iPhone 6+*/
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) {

}

@media only screen and (min-device-width : 414px) and (max-device-width : 736px) {

}