sr-iHealthwx/html/zxwz/css/topic-cw.css

@charset "utf-8";
html { font-size: 12px; overflow: hidden; height: 100%;}
body { background-color: #cc1f3b; font-size: 1rem; overflow: hidden; height: 100%;}
.c-cc1f3b { color: #cc1f3b;}
.section { position: relative;}
.section0 .top { background: url("../images/cw/0-1.png") no-repeat 0 0; background-size:  100% 100%; padding-top: 80%; width: 100%; position: absolute; top: 0;}
.section0 .bottom { position: absolute; bottom: 0; width: 100%; background: url("../images/cw/0-3.png") no-repeat 0 0; background-size: 100% 100%; padding-top: 100%;}
.section0 .bottom .stomach { background: url("../images/cw/0-2.png") no-repeat 0 0;background-size: 100% 100%; width: 35%; padding-top: 41%; margin: -13rem auto 0;}
.section1 { background: #cc1f3b url("../images/cw/1-bg.png") no-repeat 0 0; background-size: 100% auto; padding-top: 177.5%; font-size: 12px; color: #fff;}
.section1 .top { background: url("../images/cw/1-stomach.png") no-repeat 0 0; background-size:100% auto; width: 72%; padding-top: 91.44%; position: absolute; top: 6px; left:  50%; margin-left: -41.8%;}
.section1 .top  p { width: 60%; position: absolute; left: 50%; margin-left: -22%; top: 41%;}
.section1 .bottom { background: url("../images/cw/1-intestinal.png") no-repeat 0 0;background-size: 100% 100%; width: 92.8%; padding-top: 61.56%; position: absolute;bottom: 15%; right: 0;}
.section1 .bottom > div { position: absolute; top: 0; width: 100%; height: 100%;}
.section1 .bottom .list-dis { position: relative; padding-top: 100%;}
.section1 .bottom .list-dis em { font-weight: bold; }
.section1 .bottom .list-dis li { width: 7em; position: absolute; height: 3em;}
.section1 .bottom .list-dis li:first-child{ top: 2em;right: 2em;}
.section1 .bottom .list-dis li:nth-child(2) { bottom: 20%; left: 0;}
.section1 .bottom .list-dis li:nth-child(3) { bottom: 20%; left: 33%;}
.section1 .bottom .list-dis li:nth-child(4) { bottom: 20%; right: 2em;}
.section2  { padding-top: 3rem;}
.section2 .top { font-size: 1.25rem; color: #fff; background: url("../images/cw/2-top.png") no-repeat 0 0; background-size: 100% auto; width: 100%; padding-top: 13%; line-height: 3.2rem; position: relative;}
.section2 .top span { position: absolute; top: 0; text-align: center; right: 0;left: 0;}
.section2 .content .list-content li { background:url("../images/cw/2-bg.png") no-repeat 0 0; background-size: 100% auto; width: 93%; margin: 0 0 .5rem 1.5rem; color: #510000;padding-top: 36%; position: relative; top: 0;}
.section2 .content .list-content li > div { position: absolute; display:box; display: -webkit-box; -webkit-box-align: center; box-align: center; top: 0; height: 100%;}
.section2 .content .list-content:first-child { margin-top: .5rem;}
.section2 .content .list-content li p .title { font-weight: bold;}
.section2 .content .list-content li .icon { width:3.17rem; height: 3.17rem; background-size: 12.5rem 3rem; -webkit-box-flex:0; box-flex: 0; margin: 0 .5rem 0 -1.585rem;}
.section2 .content .list-content li .content { -webkit-box-flex:1; box-flex:1; margin-right: 1rem;}
.icon-01 { background: url("../images/cw/2-icon.png") no-repeat 0 0;}
.icon-02 { background: url("../images/cw/2-icon.png") no-repeat -3.13rem 0;}
.icon-03 { background: url("../images/cw/2-icon.png") no-repeat -6.2rem 0;}
.icon-04 { background: url("../images/cw/2-icon.png") no-repeat -9.4rem 0;}
.section3 { margin-top: 1rem;}
.section3 .top { background: url("../images/cw/3-top.png") no-repeat 0 0; background-size: 100% auto; padding-top: 74%; position: relative;}
.section3 .top .news { width: 80%; color: #630018; height: 14rem; left: 0; right: 0;margin: auto; position: absolute; top: 32.5%;}
.section3 .top .news .info { border-bottom: 1px dashed #660014; padding-bottom: .5rem;}
.section3 .top .news .detail { padding-top: .5rem;}
.section3 .content .list-doc { width: 92.34%; margin: 1.5rem auto 0;}
.section3 .content .list-doc li { background: url("../images/cw/3_ban01.png") no-repeat 0 0; background-size: 100% auto; padding-top: 90%; margin-top: -1.3rem; position:relative;}
.section3 .content .list-doc li:last-child { background: url("../images/cw/3_ban02.png") no-repeat 0 0; background-size: 100% auto; padding-top: 80%;}
.section3 .content .list-doc li > div { margin-right:10%; margin-left: 12%; position:absolute; top: 0;}
.section3 .content .list-doc .detail { display: box; display: -webkit-box; box-align:center; -webkit-box-align: center; padding-top: 2rem;}
.section3 .content .list-doc .avator { -webkit-box-flex: 0; box-flex: 0; margin-right: .5rem;}
.section3 .content .list-doc .avator img { width: 5rem; height: 5rem; border-radius: 50%;}
.section3 .content .list-doc .info { -webkit-box-flex: 1; box-flex: 1; color: #909090;}
.section3 .content .list-doc .des { color: #909090; margin-top: 5%; display: box; display: -webkit-box; box-align: center; -webkit-box-align: center; height:6rem; background-color: #f3f3f3; padding:0 1rem; position: relative;}
.section3 .content .list-doc .des:before { position: absolute; content: ""; top: -4px;left:14px; color: #5b5b5b; width: 8px; height: 8px; background: #f3f3f3; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.section3 .content .list-doc .btn { background:url("../images/cw/4-btn.png") no-repeat 0 0; background-size: 100%; width: 80.5%; padding-top: 20%; position: relative; margin:  6% auto;}
.section3 .content .list-doc .btn p { position: absolute; top: 0;right: 0;left: 0;bottom: 0;}
.section3 .content .list-doc .warn { margin-top: 7%; text-align: center;}
.section3 .content .list-doc .warn span { font-style: italic;}
.list_link { width: 90%; padding-top: 13%; margin: 6% auto; position: relative;}
.list_link ul {position: absolute; top: 0; width: 100%; height: 100%;}
.list_link li { width: 46%; text-indent: -9999px; height: 100%;}
.list_link li a { display: block; height: 100%; width: 100%;}
.list_link .doc { background: url("../images/cw/4_1.png") no-repeat 0 0; background-size: 100% auto;}
.list_link .drug { background: url("../images/cw/4_2.png") no-repeat 0 0; background-size: 100% auto;}
footer { margin-bottom: 3rem;}
footer .banner { margin-top: 1rem; width:96%; background: url("../images/cw/4_ban.png") no-repeat 0 0; background-size: 100% auto; padding-top: 42%; box-sizing: border-box; position: relative;}
footer .banner div { position: absolute; top: 0; padding: 1.5rem 2rem 0 5rem;}
footer .banner p { text-indent: 2rem; margin-top: .5rem;}
footer .warn { background: url("../images/cw/4_warn.jpg") no-repeat 0 0; background-size: 100% auto; width: 88%; padding-top: 32%; margin: 0 auto;}
footer .weixin { width: 20.5%; margin: 0 auto;}
@media screen and ( min-width : 375px) {
    html { font-size: 14px;}
}

/*推荐医师*/
.rec-doc { background: url("../images/cw/rec_01.png") no-repeat 0 0; background-size:320px 81px; font-size: 12px; padding-bottom: 50px; width: 320px;}
.rec-doc .list-doc { padding-top: 55px;}
.rec-doc .list-doc li { background: url("../images/cw/rec_03.png") no-repeat 0 0; background-size: 100% 100%; width: 297px; height: 491px; margin: 0 auto -11px;}
.rec-doc .list-doc li:last-child { background: url("../images/cw/rec_02.png") no-repeat 0 0;height: 460px; background-size: 100% 100%;}
.rec-doc .list-doc li .info,.rec-doc .list-doc li .content { width: 240px; margin: 0 auto;}
.rec-doc .list-doc li .info { display: box; display: -webkit-box; box-align: center; -webkit-box-align: center; padding-top: 15px;}
.rec-doc .list-doc li .info > div { box-flex: 1; -webkit-box-flex:  1;}
.rec-doc .list-doc li .info .avator img {width: 58px; height: 58px; border-radius: 50%; }
.rec-doc .list-doc li .content { background: #f3f3f3; height: 355px; position: relative;padding: 15px; box-sizing: border-box; margin-top: 8px;}
.rec-doc .list-doc li .content:before { position: absolute; content: ""; top: -4px; left: 14px; color: #5b5b5b; width: 8px; height: 8px; background: #f3f3f3; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.wrap { -webkit-transform-origin: 0 0; transform-origin: 0 0;}
/*结束活动*/
.main { background: url("../images/cw/end-bg.jpg") no-repeat center 100%; background-size: auto 100%; width: 100%; height: 100%;}
.end-content { width: 320px; height: 504px; position: relative; transform-origin: 0 0;-webkit-transform-origin: 0 0;}
.end-content i { font-style: italic;}
.end-content strong { font-weight: normal;}
.end-content .end-top{ background: url("../images/cw/end-t.png") no-repeat 0 0; background-size: 100% 100%; width: 192px; height: 124px; left: 10px; top: 20px; position: absolute;}
.end-content .end-doc { background: url("../images/cw/end-doc.png") no-repeat 0 0; background-size: 100% 100%; width: 304px; height: 295px; position: absolute; bottom: 110px; margin-left: -152px; left: 50%;}
.end-content .end-bottom { position: absolute; bottom: 10px; text-align: center; margin: auto;left: 0; right: 0; color: #fff; font-size: 16px;}