body,div,p,span,ul,li,h1,h2,h3,h4,h5,h6,ol,dl,dt,dd,img,a { padding: 0; margin: 0; list-style: none; border: 0; outline: none; } body { font-family: 'Microsoft Yahei', arial, sans-serif; color: #666; background-color: #fff; margin: 0 auto; min-width: 320px; max-width: 640px; font-size: 14px; line-height: 1.5em; } ul,li,ol { list-style-type: none; outline: none; } table { border-collapse: collapse; border-spacing: 0; } h2,h3,h4,h5,h6 { font-size: 14px; font-weight: normal; } input,textarea,select,button { list-style: none; border: 0; outline: none; padding: 0; margin: 0; list-style-type: none ; font-family: "microsoft yahei"; } em,b,i { font-style: normal; font-weight: normal; } /*苹果手机input默认样式清除*/ input[type="button"],input[type="submit"],input[type="reset"],input[type='text'] { -webkit-appearance: none; } a { outline-style: none; text-decoration: none; color: #666; -webkit-tap-highlight-color: transparent; } a:hover { text-decoration: none; } .clearfix { *zoom: 1; } .clearfix:after { content: ''; display: table; clear: both; } .center { text-align: center; } .flex { display: box; /* OLD - Android 4.4- */ display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Chrome */ display: flex; } .wrap { width: 95%; padding: 0 2.5%; } /*header*/ .header { width: 100%; background: #cc2952; } .header .logo { float: left; width: 50%; display: block; } .header .top_tel { float: right; width: 34%; display: block; } .header img { display: block; width: 100%; } .nav { width: 100%; height: 3em; background: #fa599c; margin: 5px 0; } .nav li { width: 20%; height: 2em; position: relative; float: left; } .nav li a { display: block; width: 100%; text-align: center; color: #fff; font-size:1.5em; line-height:2em; height:2em; } /*banner*/ .banner { position: relative; overflow: hidden; width: 100%; } .banner img { width: 100%; text-align: center; } .banner .bd { width: 100%; height: auto; } .banner .bd li { width: 100%; min-height: 100px; background: #ccc; } .banner .bd li a { display: block; width: 100%; } .banner .hd { width: 100%; height: 11px; position: absolute; z-index: 1; bottom: 5%; text-align: center; } .banner .hd ul { display: inline-block; height: 7px; padding: 3px 5px; background-color: rgba(255, 255, 255, 0.7); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; font-size: 0; vertical-align: top; } .banner .hd ul li { display: inline-block; width: 7px; height: 7px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; background: #8C8C8C; margin: 0 5px; vertical-align: top; overflow: hidden; } .banner .hd ul li.on { background: #cc2952; } .search { position: relative; margin: 3.3% auto; width: 93.75%; } .search input { vertical-align: top; outline: none; } .search input[type="text"] { width: 65%; padding-right: 10%; font-size: 1.2em; height: 2em; line-height: 1.6em; border: 1px solid #eaeaea; border-right: none; font-family: "Microsoft YaHei"; background: url("/mszlhmsyycom/images/index_new2/search.gif") 3% center no-repeat; background-size: contain; color: #666; text-indent: 2.2em; } .search input[type="submit"] { display: block; z-index: 2; position: absolute; right: 0px; top: 0px; width: 30%; font-size: 1.2em; height: 100%; line-height: 2em; color: #fff; background-color: #d1314d; border-radius: 100px; font-family: "Microsoft YaHei"; padding: 1px; } .search input[type="text"]::-webkit-input-placeholder { color: #666; } .search input[type="text"]::-moz-placeholder { color: #666; } .address { width: 96%; padding: 0 2% 2% 2%; font: 1.25em/1.5 "Microsoft Yahei"; color: #666666; position: relative; } .address i { font-size: 1.5em; color: #d1314d; } .address a { color: #666666; } .address:after { content: ''; width: 100%; height: 3px; background: url("/mszlhmsyycom/images/ms/address_bottom.png") repeat-x; position: absolute; bottom: 0; left: 0; } /*挂号*/ .guahao { width: 100%; } .guahao strong { display: block; font: 1.5em/2.3 "Microsoft Yahei"; background: #ebebeb; border-bottom: 2px #dedede solid; text-align: center; font-weight: bold; color: #333333; } .guahao .tips { text-align: center; line-height: 3; display: block; color: #D1314D; } .guahao img { width: 96%; margin: 0 2%; } .guahao .guahao_form { width: 96%; margin: 4% 2% 0 2%; } .guahao .guahao_form ul { margin: 2% 0; } .guahao .guahao_form ul li { width: 100%; height: auto; margin-bottom: 7px; font: 1.5em/2 "Microsoft Yahei"; } .guahao .guahao_form ul li i { font-size: 1em; color: #aeaeae; } .guahao .guahao_form ul li span { padding: 0 5px; display: block; position: relative; height: 30px; margin-left: 2%; padding-left: 2%; } .guahao .guahao_form ul li span:before { content: ''; width: 1px; background: #ededed; height: 30px; top: 15%; left: 0; display: block; position: absolute; } .guahao .guahao_form ul li input,.guahao .guahao_form ul li textarea { border-radius: 5px; border: 1px #ccc solid; flex: 1; -webkit-flex: 1; font: 1em/1 "Microsoft Yahei"; padding: 0 2%; } .guahao .guahao_form ul li textarea { padding: 2%; } .guahao .guahao_form ul li input[type="button"],.guahao .guahao_form ul li input[type="submit"] { display: inline-block; text-align: center; width: 35%; font: 1.1em/1.7 "Microsoft Yahei"; color: #fff; background: #d1314d; border-radius: 20px; margin: 10px 0 10px 15%; cursor: pointer; border: none; } .guahao .guahao_form ul li input[type="reset"] { display: inline-block; text-align: center; width: 35%; font: 1.1em/1.7 "Microsoft Yahei"; color: #fff; background: #999999; border-radius: 20px; margin: 10px auto; cursor: pointer; border: none; } /*foot*/ .footer { width: 96%; margin: 0 2%; } .footer .footnav { width: 100%; text-align: justify; display: inline-block; } .footer .footnav:after { content: ''; display: inline-block; width: 100%; } .footer .footnav li { width: 23.5%; border: 1px #ddd solid; text-align: center; display: inline-block; margin: 5px 0; } .footer .footnav li a { display: block; width: 100%; height: 100%; color: #666; font: 1.2em/2 "Microsoft Yahei"; } .footer .foot_contact { position: relative; } .footer .foot_contact img{width: 100%;} .footer .foot_contact ul { position: absolute; width: 65%; top: 5%; min-height: 50%; right: 0%; } .footer .foot_contact ul li { width: 87%; float: left; margin-bottom: 3%; position: relative; padding-left: 13%; color: #333333; } .footer .foot_contact ul li i { position: absolute; top: -5%; left: 0; font: 2em/1.8 "Microsoft Yahei"; } .footer .foot_contact ul li span { font: 1em/1 "Microsoft Yahei"; color: #666666; } .footer .foot_contact ul li b,.footer .foot_contact ul li a { font: 1.4em/1 "Microsoft Yahei"; color: #333333; font-weight: bold; } .footer .foot_contact ul li em { font: 1.1em/1 "Microsoft Yahei"; color: #333333; font-weight: bold; } .footer .foot_contact ul li:nth-child(2) i { top: -12%; } .footer .foot_contact ul li:nth-child(3) i { top: -9%; } .footer .foot_contact .foot_copy { text-align: center; font: 0.8em/1.6 "Microsoft Yahei"; color: #999; width: 100%; position: absolute; bottom: 2%; left: 0; } /*分页*/ .pages { width: 100%; margin: 0% auto 6% auto; text-align: center; } .pages a,.pages span{ display: inline-block; width: auto; padding:0 1.5%; font: 1em/2 "Microsoft Yahei"; color: #d1314d; border: 1px #d1314d solid; margin:0 0.5%%; } .pages .current { background: #d1314d; color: #ffffff; } @media screen and (min-width: 640px) { body { font-size: 18px; } .search input[type="text"] { background-size: 30px; } .footer .foot_contact ul li { padding-left: 12%; width: 88%; } .footer .foot_contact ul li i { width: 12%; } .footer .foot_contact .foot_copy { bottom: 6%; font-size: 1em; } } @media screen and (min-width: 540px) and (max-width: 639px) { body { font-size: 18px; } .search { font-size: 13px; } } @media screen and (min-width: 376px) and (max-width: 414px) { body { font-size: 11px; } .search { font-size: 13px; } .footer { padding-bottom: 3%; } } @media screen and (min-width: 321px) and (max-width: 375px) { body { font-size: 10px; } .search { font-size: 13px; } .footer { padding-bottom: 3%; } } @media screen and (max-width: 320px) { body { font-size: 9px; } .footer { padding-bottom: 5%; } .footer .foot_contact ul li { margin-bottom: 1%; } .footer .foot_contact .foot_copy { bottom: 2%; font-size: 10px; line-height: 1.3; } .footer .footnav li { width: 22%; } }