@charset "gb2312";
/* CSS Document */
@import url("base.css");
@media screen and (max-width:640px){*{ font-size:18px;}}
@media screen and (max-width:590px){*{ font-size:17px;}}
@media screen and (max-width:500px){*{ font-size:16px;}}
@media screen and (max-width:414px){*{ font-size:15px;}}
@media screen and (max-width:375px){*{ font-size:14px;}}
@media screen and (max-width:325px){*{ font-size:12px;}}


.warpBox{ max-width: 750px; margin: 0 auto}
.service *,.doctor *,.guahao *,.list_art *,.art_art *{ box-sizing: border-box}
.warpBox img{ width: 100%;}
.warpBox i,.warpBox em{ font-style:normal}


header{ background: #000; height: 30px; padding:15px 10px; overflow: hidden; position: relative}
header .titem,header .tzx{ position: absolute;}
header .titem{ width: 7%; height: 100%; overflow: hidden; background: url(/img/tmenu.png) no-repeat; background-size: 100%; left:20px; top:20px;}
header .tzx{ width: 8.5%; height: 100%; background: url(/img/tzx.png) no-repeat; background-size: 100%; right: 20px; top: 18px;}
header .logo{ display: block; width: 50%; margin: 0 auto}

header .titem,.titemMain{ transition: ease all 0.8s;}
header .titem.add{ background: url(/img/titemclose.png) no-repeat; background-size: 100%; top: 16px;}
.titemMain{ height: 0; padding: 0 20px; overflow: hidden; position: absolute; background: rgba(45,53,66,0.95); top:58px; left: 0; z-index: 3}
.titemMain.add{ height:280px; padding: 20px 20px 30px; overflow: hidden;}
.titemMain h3{ color: #fff; padding: 0 0 15px; font-size: 1.2em}
.titemMain p{ display: block; border-top: 1px solid #656e7b; border-left: 1px solid #656e7b; border-right: 1px solid #656e7b; overflow: hidden;}
.titemMain p a{display: block; height: 35px; line-height: 35px; width: 33.333%; overflow: hidden; box-sizing: border-box; float: left; color: #9098a0; text-align: center; border-bottom: 1px solid #656e7b; border-right: 1px solid #656e7b; font-size: 0.9em}
.titemMain p a:nth-child(3n){ border-right: none}

.banner{ width: 100%;position: relative; z-index: 2; overflow: hidden;}
.banner .swiper-slide{ width: 100%;}
.banner .swiper-slide img{ display: block;}
.banner .bannerBtn{ position: absolute; left: 0; bottom: 0px; margin-bottom: 10px; z-index: 2; width: 100%;  height: 3px; text-align: center}
.banner .bannerBtn span{ width:10%; height: 3px; background: #fff; margin:0 2px; display:inline-block; border-radius: 0}
.banner .bannerBtn span.swiper-pagination-bullet-active { background: #c2996d}

nav{ text-align: center; overflow: hidden; padding:10px 15px; background: #fff; box-shadow: 0 2px 5px #ccc; position: relative; z-index: 2}
nav a{ width: 23%; padding: 0 1.3%; display:block; float: left; margin: 0; color: #666; font-size: 1.2em;}
nav a:nth-of-type(4){ width: 23%; padding: 0; color: #ff8040;}
nav a i{color: #ccc;}


.item{ background:#f6f6f8; padding: 20px 5px 10px; overflow: hidden; position: relative}
.item .swiper-slide{ width: 100%; overflow: hidden;}
.item .swiper-slide a{ display: block; width: 18%; margin:3px 3.5%; font-size: 0.9em; color: #666; text-align: center; float: left;}
.item .swiper-slide a i{ display: block; width: 100%; margin-bottom: 5px; border-radius:23px;}
.item .swiper-slide.ic1 a:nth-child(1) i{ background-color: #ee4b47;}
.item .swiper-slide.ic1 a:nth-child(2) i{ background-color: #27a9f4;}
.item .swiper-slide.ic1 a:nth-child(3) i{ background-color: #ff8040;}
.item .swiper-slide.ic1 a:nth-child(4) i{ background-color: #6440ff;}
.item .swiper-slide.ic1 a:nth-child(5) i{ background-color: #3cc24c;}
.item .swiper-slide.ic1 a:nth-child(6) i{ background-color: #ffcb40;}
.item .swiper-slide.ic1 a:nth-child(7) i{ background-color: #498bfc;}
.item .swiper-slide.ic1 a:nth-child(8) i{ background-color: #f54e91;}
.item .swiper-slide.ic2 a:nth-child(1) i{ background-color: #2aa9f2;}
.item .swiper-slide.ic2 a:nth-child(2) i{ background-color: #ff8040;}
.item .swiper-slide.ic2 a:nth-child(3) i{ background-color: #6440ff;}
.item .swiper-slide.ic2 a:nth-child(4) i{ background-color: #3cc24c;}
.item .swiper-slide.ic2 a:nth-child(5) i{ background-color: #ffcb40;}
.item .swiper-slide.ic2 a:nth-child(6) i{ background-color: #498bfc;}
.item .swiper-slide.ic2 a:nth-child(7) i{ background-color: #f54e91;}
.item .swiper-slide.ic2 a:nth-child(8) i{ background-color: #ee4b47;}
.itemBtn{ text-align: center}
.itemBtn span{ width:6%; height: 3px; background: #ccc; margin:0 4px; display:inline-block; text-indent: -999px; overflow: hidden; border-radius: 0; opacity: 1}
.itemBtn span.swiper-pagination-bullet-active{ background: #c2996d}

.news{ background: #fff; border-bottom: 8px solid #f6f6f8; line-height: 25px; padding:8px 15px; overflow: hidden; }
.news .ncL{ width: 22.5%; height: 25px; float: left; background: #c2996d url(/img/newsico.png) no-repeat 5%; font-size: 14px; background-size: 18%; padding-left:5.5%; margin-right: 2.5%; box-sizing: border-box; color: #fff; border-radius: 5px}
.news .newsCon{ overflow: hidden; width:75%; height: 25px; float: left}
.news .newsCon i{display: inline-block; width: 30px; height: 11px; margin-left: 3px; background: url(/img/newshot.png) no-repeat; background-size: 100%;}
.news .newsCon li{ width: 100%; height: 25px; overflow: hidden;}

.tit{ text-align: center; width: 65%; margin: 30px auto}

.service{ padding: 0 15px}
.serviceCon{}
.serviceCon .sCtit{ overflow: hidden; text-align: center; width: 100%;}
.serviceCon .sCtit li{ width: 48%; height: 40px; line-height: 40px; font-weight: bold; border:1px solid #ccc; border-bottom: none; display: inline-block; float: left; font-size: 1.2em}
.serviceCon .sCtit li.on{ background: #c2996d; color: #fff; border-color: #c2996d}
.serviceCon .sCtit li:nth-child(2){ margin: 0 5%}
.serviceCon .sCtit li:last-child{ float:right; margin: 0}
.serviceCon .sCmain{ border-top: 1px solid #ccc; padding: 20px 0}
.serviceCon .sCmain p{ text-align: center}
.serviceCon .sCmain span{display: block; text-align: center; overflow: hidden; padding: 20px 10px}
.serviceCon .sCmain span img{ width: 48%; display:block; float: left; margin:0 1%; border-radius: 10px;}
.serviceCon .sCmain em{ display: block; overflow: hidden; padding: 0 10px}
.serviceCon .sCmain em a{display:block; float: left; width: 48%; height: 35px; line-height: 35px; text-align: center; color: #fff; margin: 0 1%; padding:0 1%; border-radius: 10px;}
.serviceCon .sCmain em a:nth-of-type(1){ padding-left: 20px;  background: #ee6e6f url(../img/serico.png) no-repeat 22%; background-size: 20px;}
.serviceCon .sCmain em a:nth-of-type(2){ padding-left: 20px;  background: #7bc151 url(../img/serico.png) no-repeat 22%; background-size: 20px;}

.doctor{ padding: 0 15px 10px}
.doctorCon{}
.doctorCon .dCtop{}
.doctorCon .dCtop li{ overflow: hidden;}
.doctorCon .dCtop li .dCtL{ float: left; width: 43%;}
.doctorCon .dCtop li .dCtL img{ width: 110%;}
.doctorCon .dCtop li .dCtR{ width: 57%; float: right}
.doctorCon .dCtop li .dCtR .dCtit{ padding-bottom: 10px}
.doctorCon .dCtop li .dCtR .dCtit b{ padding-right: 5px; font-size: 1.4em;}
.doctorCon .dCtop li:nth-of-type(3) .dCtR .dCtit b{ font-size:1.2em; line-height: 13px;}
.doctorCon .dCtop li .dCtR p{ padding-bottom: 10px;}
.doctorCon .dCtop li .dCtR p i{display: block; background: url(../img/ysico.jpg) no-repeat left; padding-left: 20px; background-size: 15px;}
.doctorCon .dCtop li .dCtR span{display: block; padding-bottom: 20px}
.doctorCon .dCtop li .dCtR span b{ display: inline-block; color: #ee6e6f; border: 1px solid #ee6e6f; padding: 2px}
.doctorCon .dCtop li .dCtR>em{ display: block; width: 80%;height: 35px; line-height: 35px; margin: 10px auto 0; text-align: center; color: #fff; padding-left: 20px;  background: #ee6e6f url(../img/serico.png) no-repeat 20%; background-size: 20px; border-radius: 10px; font-size: 1.1em}
.doctorCon .dCbottom{ padding-top: 15px; width:100%; margin: 0 auto}
.doctorCon .dCbottom ul{ overflow: hidden;}
.doctorCon .dCbottom li{ width: 20vw; height: 20vw; margin:0 1.6%; border-radius: 50%; border: 1px solid #ccc; overflow: hidden; background: #ededed; float: left}
.doctorCon .dCbottom li img{ width:150%; margin-left: -22%; margin-top: 5%; display: block;}
.doctorCon .dCbottom li:nth-child(2) img{ margin-left: -11%}
.doctorCon .dCbottom li:nth-child(3) img{ margin-left: -30%}
.doctorCon .dCbottom li.on{ background: #c2996d; border-color: #c2996d}
.doctorCon .dCpn{}

/*列表页*/
.la_tit{ height:40px; line-height:40px; padding:0 2%; font-size:1.3em; color: #000; border-bottom: 1px solid #eee;}
.positon{ height:30px; line-height:30px; overflow:hidden; font-size:1.1em; padding:0 2%}
.list_art{ border-top:10px solid #F6F6F6;border-bottom:10px solid #F6F6F6;  padding:10px 2% 0}
.list_art>ul{ padding:10px 2% 0}
.list_art>ul>li{ padding-bottom:10px; margin-bottom: 15px; border-bottom: 1px solid #f4f4f4; overflow:hidden; line-height:31.5px;}
.list_art>ul>li a{ display:block; height:31.5px; font-size:1.15em;text-overflow:ellipsis; white-space:nowrap; overflow:hidden; color: #333;}
.list_art>ul>li .list_pic{ width:100px; height:63px; background:#eee; overflow:hidden; float:right; margin-left:5px; display: box; display: -webkit-box; display: -moz-box;-webkit-box-pack:center; -moz-box-pack:center; -webkit-box-align:center; -moz-box-align:center;}
.list_art>ul>li .list_pic img{ max-height:63px;}
.list_art time,.list_art i{ font-style:normal; color:#999; font-size:0.9em; padding-right:5px}


.page_np{ padding:10px 0; margin-top:5px; text-align: center; font-size: 1em}
.page_np li{ display:inline-block; padding:0 4px; height: 30px; line-height: 30px; border-radius: 5px; background:#E6E6E6; border:1px solid #E6E6E6; margin:0 1px}
.page_np li.thisclass{ background:#c2996d; color:#fff}
.page_np li select{ margin:-2px 0 0 -4px}

.art_jstit{ height:40px; line-height:40px; font-weight: bold; padding:0 15px; font-size:1.3em; color: #000; border-bottom: 1px solid #eee;}
.art_jscon{ overflow: hidden; padding: 10px 15px;border-bottom:10px solid #F6F6F6;}
.art_jscon .ajCon{ width: 62%; height: 104px; overflow: hidden; float: left}
.art_jscon p{ width: 36%; float: right}
.art_jscon p i{display: block; height: 49px; line-height: 49px; color: #fff; margin-bottom: 6px; text-align: center; font-size: 1.1em; padding-left: 22%}
.art_jscon p i:nth-of-type(1){ background: #7bc151 url(../img/serico.png) no-repeat 22%; background-size: 20px}
.art_jscon p i:nth-of-type(2){ background: #ee6e6f url(../img/serico.png) no-repeat 22%; background-size: 20px}

/*文章页*/
.art_btn{ overflow:hidden; padding:10px 2%; border-top:10px solid #F6F6F6;}
.art_btn a{ display:block; width:19%; float:left; text-align:center; margin:0 3%; font-size:1em}
.art_btn a p{ border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; -webkit-border-radius:50%; margin-bottom:3px}
.art_btn a p img{ width:100%}
.art_btn p.ab1{ background:#ff2c55}
.art_btn p.ab2{ background:#00b4ff}
.art_btn p.ab3{ background:#ff9501}
.art_btn p.ab4{ background:#4cda64}
.art_btn a:nth-of-type(1){ position:relative}
.art_btn a:nth-of-type(1) span{ display:block; width:20px; height:20px; line-height:20px; background:#f00; font-weight:bold; text-align:center; color:#fff; position:absolute; top:-6px; right:-6px; border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; -webkit-border-radius:50%;-webkit-animation: twinkling 1s infinite ease-in-out;-moz-animation: twinkling 1s infinite ease-in-out;-ms-animation: twinkling 1s infinite ease-in-out;-o-animation: twinkling 1s infinite ease-in-out;}

.art_art{ padding:10px 4% 20px; border-top:10px solid #f4f4f4; border-bottom:10px solid #f4f4f4}
.art_art h1{ text-align:center; font-size:1.3em; color:#333}
.art_art>em{ text-align:center; display:block; font-style:normal; font-size:1em; padding:10px 0; border-bottom:1px solid #ccc}
.art_art .aa_info{ padding:10px 0 20px; font-size:14px; line-height:28px}
.aa_info img{ max-width:90%; margin: 0 auto; border-radius: 10px}

.art_pre,.art_next{ border:1px dashed #ccc; font-size:1.1em; line-height:30px; height: 30px; overflow: hidden; padding:0 10px; font-weight:bold; color: #c2996d;}
.art_next{ border-top-width:0}
.art_pre a,.art_next a{ color: #333;}

.art_xgwzcon{ padding:10px 15px; border-bottom:10px solid #f4f4f4; overflow:hidden}
.art_xgwzcon li{ padding-bottom: 10px; border-bottom: 1px dotted #ccc; margin-bottom:10px}
.art_xgwzcon li b{display: block; height: 30px; line-height: 30px; overflow: hidden; margin-bottom: 5px; background: url(../img/twico1.png) no-repeat left; background-size: 30px; padding-left: 38px}
.art_xgwzcon li b a{ font-size: 1.1em; color: #333;}
.art_xgwzcon li p{display: block; height: 40px; left: 15px; color: #666; background: url(../img/twico2.png) no-repeat left; background-size: 30px; padding-left: 38px}
.art_xgwzcon li p a{ color: #ee6e6f;}

/*挂号*/
.guahao{ padding:30px 0}
.guahao h2{ padding-bottom: 10px; margin-bottom: 30px; border-bottom: 1px solid #ccc; color: #ef0000; text-align: center; position: relative; font-size: 1em}
.guahao h2 i{ display: block; font-size:1.8em; color: #000;}
.guahao h2 b{display: block; width: 20%; height: 2px; background: #c2996d; position: absolute; bottom: -1px; left: 40%;}
.guahaoCon{ padding: 0 15px}
.guahaoCon p{ overflow: hidden; margin-bottom: 10px; line-height: 35px; }
.guahaoCon b{ display: block; width: 6%; text-align: center; float: left; margin-right: 10px}
.guahaoCon b img{ width: auto; height: 20px; display: block; margin: 8px auto 0}
.guahaoCon i{ color: #ef0000; padding-left: 3px}
.guahaoCon .gCtext{ width: 88%; height: 35px; line-height: 35px; float: left; background: #f0f0f0; border: 1px solid #ccc; padding: 0 10px; border-radius: 5px; color: #666; font-size: 1.2em}
.guahaoCon .gCtext2{ width: 88%; height: 105px; line-height: 35px; float: left; background: #f0f0f0; border: 1px solid #ccc; padding: 0 10px; border-radius: 5px; color: #666; font-size: 1.2em}
.guahaoCon span{ overflow: hidden; display: block; padding-left: 8%; padding-top: 10px}
.guahaoCon span a,.guahaoCon span .btn01{ width: 47%; height: 35px; line-height: 35px; font-size: 1.2em; text-align: center; border-radius: 10px; display: inline-block; margin-right: 2%; color: #fff;}
.guahaoCon span .btn01{ background: #ee6e6f; border: none}
.guahaoCon span a{ background: #c2996d}
.guahaoCon em{display: block; padding-top: 20px; text-align: center}
.guahaoCon em i{ color: #ef0000;}
input,input[type="button"],input[type="submit"],input[type="reset"],textarea,select{ -webkit-appearance: none;}

/*底部*/
footer{ text-align: center; border-top: 10px solid #eee; padding: 10px 0 60px; color: #999;}
footer span a{color: #999;}
footer b{ font-size: 1.5em; display: block;color: #666;}
footer em{ font-size: 1.2em; font-style: normal; color: #999; display: block; padding-bottom: 10px; margin:0 10% 10px; border-bottom: 1px solid #dedede;}
footer p{ padding-bottom:10px}
footer p i,footer p a{ width: 26%; display: inline-block; margin: 10px 1%; padding: 8px 0; color: #fff; border-radius: 5px; font-size: 1.1em; font-style: normal}
footer i:nth-child(1){background:#c2996d;}
footer i:nth-child(2){background:#ee6e6f;}
footer p a{background:#666;}



/*顶部弹窗*/
.ios10{width: 95.625%; position: fixed; top: -5px; transform:translateY(-100%); left:0; right: 0; margin: auto ;background: rgba(255,255,255,0.9); border-radius:10px;overflow: hidden; transition: all ease 0.5s; box-shadow:0 0 8px #666; z-index: 999}
.ios10 img{width: 100%;}
.ios10 *{font-style: normal;}
.ios10 .ios_top{ padding: 2%; font-size: 1.2em;}
.ios10 .ios_top i{display:inline-block;width: 5.7%; margin-right: 3px}
.ios10 .ios_top em{float: right;color: #5b6164;}
.ios10 .ios_bot{ padding: 2% 3%; font-size: 1.2em; background: rgba(255,255,255,0.6); color: #333;}
.ios10.on{ top: 2px; transform:translateY(0);}

/*底部导航*/
.foot_nav{ width: 100%; height: 50px; position: fixed; left: 0; bottom: 0; z-index: 9999;}
.foot_nav>p{ width: 25%; height: 50px; padding: 11px 4% 10px 0; text-align: right; float: left; font-size: 1.1em; font-weight: bold; line-height: 16px; position: relative; box-sizing: border-box; color: #fff; background-repeat: no-repeat; background-position: 15%; background-size: auto 32px; opacity: 0; box-shadow: 0 -2px 3px #dadada; animation:qin ease 0.5s forwards; transform: translateX(400%); -webkit-animation:qin ease 0.5s forwards; -webkit-transform: translateX(400%);}
.foot_nav>p>i{ display: block; width: 6px; height: 6px; border-radius: 50%; position: absolute; left: -3px; top: 50%; margin-top: -3px}
.foot_nav>p:nth-child(1){ background-image:url(http://4g.ybs120.com/images/fn_1.jpg); background-color:#8fc83b; animation-delay: 1s; -webkit-animation-delay: 1s}
.foot_nav>p:nth-child(2){ background-image:url(http://4g.ybs120.com/images/fn_2.jpg); background-color:#f8931f; animation-delay: 1.2s; -webkit-animation-delay: 1.2s}
.foot_nav>p:nth-child(3){ background-image:url(http://4g.ybs120.com/images/fn_3.jpg); background-color:#00b4ff; animation-delay: 1.4s; -webkit-animation-delay: 1.4s}
.foot_nav>p:nth-child(4){ background-image:url(http://4g.ybs120.com/images/fn_4.jpg); background-color:#ff59f9; animation-delay: 1.6s; -webkit-animation-delay: 1.6s}
.foot_nav>p:nth-child(1)>i{ border:3px solid #8fc83b}
.foot_nav>p:nth-child(2)>i{ border:3px solid #f8931f}
.foot_nav>p:nth-child(3)>i{ border:3px solid #00b4ff}
.foot_nav>p:nth-child(4)>i{ border:3px solid #ff59f9}

@keyframes qin{
	0%{ transform: translateX(100%); opacity: 0}
	100%{ transform: translateX(0px); opacity: 1}
}
@-webkit-keyframes qin{
	0%{ -webkit-transform: translateX(100%); opacity: 0}
	100%{ -webkit-transform: translateX(0px); opacity: 1}
}