@charset "UTF-8";
* { margin: 0; padding: 0; box-sizing: border-box; }

body { -webkit-font-smoothing: antialiased; background-color: #f8f8f8; font: 12px/1.5 "Microsoft YaHei", Simsun, Arial, Helvetica, sans-serif; color: #666; }

em, i { font-style: normal; }

li { list-style: none; }

img { border: 0; vertical-align: middle; }

button { cursor: pointer; }

a { color: #262626; text-decoration: none; cursor: pointer; }

input, textarea, select, button { font-family: "Microsoft YaHei", Simsun, Arial, Helvetica, sans-serif; }

.clear { clear: both; width: 100%; height: 0px; overflow: hidden; }

.clearb { clear: both; display: block; margin: 0; padding: 0; height: 10px; }

.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }

.fl { float: left; }

.fr { float: right; }

input[type='number'] { -moz-appearance: textfield; }

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

input::-webkit-input-placeholder { color: #acacac; }

input:-moz-placeholder { color: #acacac; }

input::-moz-placeholder { color: #acacac; }

input:-ms-input-placeholder { color: #acacac; }

::-webkit-scrollbar { width: 12px; height: 12px; }

::-webkit-scrollbar-button { display: none; }

::-webkit-scrollbar-track, ::-webkit-scrollbar-track-piece { background: #fff; }

::-webkit-scrollbar-thumb, ::-webkit-scrollbar-thumb:horizontal { -webkit-border-radius: 10px; background: #ccc; }

::-webkit-scrollbar-thumb:hover { background: #999; }

::-webkit-scrollbar-thumb:active { background: #666; }

.hide { display: none !important; }

@font-face { font-family: 'iconfont'; src: url("../fonts/iconfont.eot");
  /* IE9*/
src: url("../fonts/iconfont.eot?#iefix") format("embedded-opentype"), url("../fonts/iconfont.woff") format("woff"), url("../fonts/iconfont.ttf") format("truetype"), url("../fonts/iconfont.svg#iconfont") format("svg");
  /* iOS 4.1- */ }
/*!--字体代替iconfont--*/
[class*=icon-], [class^=icon-] { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-text-stroke-width: 0.2px; }

.icon-job:before { content: "\e622"; }

.icon-home:before { content: "\e644"; }

.icon-gg:before { content: "\e659"; }

.icon-popclose:before { content: "\e711"; }

.icon-arrow-r:before { content: "\e678"; }

.icon-share:before { content: "\e60a"; }

.icon-data:before { content: "\e65e"; }

.g-mask { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); z-index: 10; }

body { width: 100%; background: #f87d53 url(../../images/must/head-bg.png) no-repeat top left; background-size: 100% auto; }

.m-head { padding: .5rem; }
.m-head a { display: inline-block; text-align: center; height: 2rem; width: 2rem; line-height: 2rem; background: #e66c26; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; -khtml-border-radius: 50%; border-radius: 50%; }
.m-head a i { font-size: 1.5rem; color: #fff; }
.m-head span { display: inline-block; height: 1.5rem; line-height: 1.5rem; float: right; color: #fff; }
.m-head span i { font-size: 1.5rem; }

.head-title { padding: 0 0 1.5rem 0; }
.head-title h1 { text-align: center; color: #fff; font-size: 1.7rem; line-height: 1.8rem; }

.content { padding: 0 1rem 1rem; }

.m-box { background: #fff; -moz-border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -o-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -khtml-border-radius: 0.5rem; border-radius: 0.5rem; padding: 1rem; overflow: hidden; }
.m-box .title { line-height: 2rem; padding-bottom: .5rem; text-align: center; }
.m-box .title span { position: relative; display: inline-block; padding: 0 1.5rem; font-size: .9rem; font-weight: 600; color: #f14f50; background: url(../../images/must/title-bg.png) no-repeat right center; background-size: cover; }
.m-box .title span:before { position: absolute; left: .75rem; top: 50%; content: ''; display: inline-block; width: 5px; height: 5px; margin-top: -2.5px; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; -khtml-border-radius: 50%; border-radius: 50%; background: #f14f50; }
.m-box .m-introduce { padding-top: .75rem; font-size: .6rem; }
.m-box .m-introduce p { text-align: center; font-size: .6rem; line-height: 1.25rem; color: #881916; }
.m-box .m-introduce p i { color: #f14f50; padding: 0 .25rem; }
.m-box ~ .m-box { margin-top: 1rem; }

.box-btn { padding-top: .75rem; }
.box-btn a { display: block; width: 80%; height: 2rem; line-height: 2rem; margin: 0 auto; text-align: center; color: #fff; font-size: .9rem; -moz-border-radius: 1rem; -webkit-border-radius: 1rem; -o-border-radius: 1rem; -ms-border-radius: 1rem; -khtml-border-radius: 1rem; border-radius: 1rem; background: -webkit-linear-gradient(left, #f14f50, #fd981d); /* Safari 5.1 - 6.0 */ background: -o-linear-gradient(right, #f14f50, #fd981d); /* Opera 11.1 - 12.0 */ background: -moz-linear-gradient(right, #f14f50, #fd981d); /* Firefox 3.6 - 15 */ background: linear-gradient(to right, #f14f50, #fd981d); /* 标准*/ }
.box-btn a em { padding-right: 1rem; position: relative; }
.box-btn a em:after { position: absolute; right: 0; content: "\e678"; font-family: "iconfont" !important; font-size: .8rem; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-text-stroke-width: 0.2px; }

.box-download { text-align: center; padding-top: 1rem; }
.box-download a { display: inline-block; color: #f14f50; font-size: .7rem; }

.m-dynamic { background: #fff; -moz-border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -o-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -khtml-border-radius: 0.5rem; border-radius: 0.5rem; }
.m-dynamic ul li { padding: .25rem 0; }
.m-dynamic ul li a { position: relative; line-height: 1.5rem; display: block; font-size: .8rem; padding: 0 3rem 0 .75rem; color: #881916; }
.m-dynamic ul li a i { width: 3rem; position: absolute; right: 0; top: 0; height: 1.5rem; line-height: 1.5rem; text-align: center; font-size: .7rem; border: 1px solid #f14f50; background: #f14f50; color: #fff; border-radius: 1rem; }
.m-dynamic ul li a i:hover { background: #f57e7f; }
.m-dynamic ul li a i:focus { outline: none !important; }
.m-dynamic ul li a:before { position: absolute; left: 0; top: 50%; content: ''; width: 5px; height: 5px; margin-top: -2.5px; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; -khtml-border-radius: 50%; border-radius: 50%; background: #f14f50; }

.m-guide ul li { height: 5.5rem; }
.m-guide ul li a { display: block; }
.m-guide ul li .guide-img { float: left; width: 6rem; height: 5.5rem; padding: .5rem 0; }
.m-guide ul li .guide-img img { display: block; width: 100%; height: 100%; }
.m-guide ul li .guide-info { position: relative; height: 5.5rem; padding: .5rem 0; margin-left: 6.5rem; border-bottom: 1px solid #efefef; }
.m-guide ul li .guide-info h2 { font-size: .8rem; font-weight: 400; line-height: 1rem; color: #881916; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.m-guide ul li .guide-info p { font-size: .7rem; color: #881916; }
.m-guide ul li .guide-info span { position: absolute; width: 100%; bottom: .5rem; height: 1.25rem; line-height: 1.25rem; display: block; }
.m-guide ul li .guide-info span time { font-size: .6rem; color: #c9a7a6; line-height: 1.25rem; }
.m-guide ul li .guide-info span i { float: right; height: 1.25rem; padding: 0 .5rem; border: 1px solid #f14f50; background: #f14f50; color: #fff; border-radius: 1rem; }
.m-guide ul li .guide-info span i:hover { background: #f57e7f; }
.m-guide ul li .guide-info span i:focus { outline: none !important; }

.answer-info .answer-list { margin-right: 5rem; height: 4.5rem; overflow: hidden; }
.answer-info .answer-list ul li { height: 1.5rem; line-height: 1.5rem; }
.answer-info .answer-list ul li a { position: relative; padding-left: .75rem; font-size: .8rem; color: #881916; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.answer-info .answer-list ul li a:before { position: absolute; left: 0; top: 50%; content: ''; width: 5px; height: 5px; margin-top: -2.5px; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; -khtml-border-radius: 50%; border-radius: 50%; background: #f14f50; }
.answer-info .answer-list .animate { -webkit-transition: all .3s ease-out; }
.answer-info .answer-btn { width: 5rem; height: 4.5rem; float: right; }
.answer-info .answer-btn a { position: relative; top: 1.5rem; display: block; height: 1.5rem; line-height: 1.5rem; font-size: .6rem; text-align: center; border: 1px solid #f14f50; background: #f14f50; color: #fff; border-radius: 1rem; }
.answer-info .answer-btn a:hover { background: #f57e7f; }
.answer-info .answer-btn a:focus { outline: none !important; }

.strategy-item { position: relative; width: 100%; border-radius: 0 3rem 0 3rem; }
.strategy-item ~ .strategy-item { margin-top: 1rem; }
.strategy-item.bc-strategy { margin-top: .25rem; }
.strategy-item a { display: block; }
.strategy-item a img { width: 100%; height: auto; }

.pop-reserve-code { position: absolute; width: 80%; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }
.pop-reserve-code .pop-close { position: absolute; left: 50%; bottom: -2rem; width: 1.25rem; height: 1.25rem; line-height: 1.25rem; color: #fff; margin-left: -.65rem; }
.pop-reserve-code .pop-close i { font-size: 1.25rem; }
.pop-reserve-code .reserve-code-info { -moz-border-radius: 0.5rem; -webkit-border-radius: 0.5rem; -o-border-radius: 0.5rem; -ms-border-radius: 0.5rem; -khtml-border-radius: 0.5rem; border-radius: 0.5rem; background: #fff; }
.pop-reserve-code .reserve-code-info .title { position: relative; padding: 1rem 0 .5rem 0; text-align: center; background: #f87d53; border-radius: .5rem .5rem 0 0; }
.pop-reserve-code .reserve-code-info .title span { display: block; font-size: .9rem; color: #fff; line-height: 1.5rem; padding-bottom: .5rem; }
.pop-reserve-code .reserve-code-info .title p { text-align: center; font-size: .7rem; color: #fff; line-height: 1.5rem; margin: 0; }
.pop-reserve-code .reserve-code-info .title p em { display: inline-block; }
.pop-reserve-code .reserve-code-info .title p em i { float: left; font-size: .9rem; margin-right: .25rem; }
.pop-reserve-code .reserve-code-info .title:after { position: absolute; left: 50%; bottom: -.7rem; margin-left: -.4rem; display: inline-block; content: ""; width: 0px; height: 0px; border: .4rem solid transparent; border-top: .4rem solid #f87d53; }
.pop-reserve-code .code-img { padding: 1rem 0; }
.pop-reserve-code .code-img span { display: block; width: 6rem; height: 6rem; margin: 0 auto; padding: .2rem; border: 1px solid #f0f0f0; }
.pop-reserve-code .code-img span img { display: block; width: 100%; height: 100%; }

.share-mask { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.share-mask span { display: inline-block; position: absolute; width: 60%; right: .5rem; top: 1rem; }
.share-mask span img { width: 100%; height: auto; }

#video-info { object-fit: cover; object-position: center center; }

.fixednav { position: fixed; bottom: 0; left: 0; right: 0; height: 2.5rem; background: rgba(0, 0, 0, 0.5); }
.fixednav ul li { width: 33.3%; float: left; text-align: center; position: relative; }
.fixednav ul li ~ li:before { position: absolute; left: 0; top: 50%; margin-top: -.5rem; display: inline-block; content: ''; width: 1px; height: 1rem; background: #ccc; }
.fixednav ul li a { display: inline-block; height: 2.5rem; line-height: 2.5rem; color: #fff; font-size: .8rem; }
.fixednav ul li a i { font-size: 1rem; float: left; margin-right: .5rem; }