@charset "utf-8";
/*------------------------------------------------
--css  medical.css 远程医疗 放入官网
--by   市场部 Web Designer&Front end Engineer  Sivan
--date 2020-07-17  

-------------------------------------------------*/
@charset "utf-8";
/*--------------------------------------------------------------------------------------------------------------------

--css     grid.min.css是响应式24栅格框架系统，集成了【flex布局】与【Boostrap布局】方式，适用于主流浏览器，IE9及以上的浏览器
--by      市场部 Sivan 2016-11-18  
--update  v.2019-08-13（升级为24栅格）
--24栅格，基本的栅格，去除了不常用偏移
--注意,使用双单位px rem需要了解机制：100px=1rem
--文件大小 15 Kb 左右

--24栅格等分，适用于分组较多，比较12栅格更能精确；
--主流分辨率：1920px、1440px、1366px（优先考虑），当前以1440px为内容宽度.con(container) 基准；

---栅格基本数据--------------------------------------


--设计最终是为了前端实现，因此从前端推导栅格参数更为科学。

--PC端为例，1440px等分成24个栅格
--每个栅格1/24 = 60px
--原子单位(步进单位)：8px 栅格系统的原子单位；

--1栏宽：36px 
--1槽宽（Gutter width）：24px （相邻两栏的距离,可以等分一个栏的左右每边12px，也可以只在一边24px，前端实现翻译为内边距padding）

--1列宽（Column） = 1栏宽+1槽宽（Guitter）：36+24 = 60px  (1列宽=1栏宽+1槽宽)
--1列宽占24列的百分比=1/24（共24列，占1列）= 4.166667%  （对应的前端代码是是：.c_md_1  { width: 4.166667% }）

--列宽（Col-x）步进单位：60px； 
--col-1  0.04166667   60px ；
--col-2  0.125        120px ；
--内容宽度（Container)=1440px = 60px * 24 
--内容宽度（Container）= 24列 * 60px = 36px栏宽 * 24 + 24px槽宽*24 = 1440px 

--典型HTML结构--------------------------------------

<div calss="con">
<div class="row">
<div class="c_xs_24 c_sm_12 c_md_10 c_lg_6">c_lg_6</div>
<div class="c_xs_24 c_sm_12 c_md_14 c_lg_18">c_lg_18</div>
</div>
</div>

说明：.con(container) 控制内容宽度。PC端为1440px,.row带有最有负边距，用于抵消子内部div的内边距
注意：c_xs24控制移动端，c_md_12控制992一下的屏幕，可以理解为平板，c_lg_12控制PC端，上下对应的数字之和需要等于24，
如 c_lg_6  c_lg_18，意为左右分栏前占6份（PC端下换算等于1440 * 0.6 = 360 px），后面占18份，PC端下换算等于1440 * 0.75 = 1080 px）


c_xs_x：超小屏幕（手机，小于 768px），con宽度自动

c_sm_x：小屏幕，（平板，大于等于 768px），con宽度750px

c_md_x：中等屏幕（桌面显示器，大于等于 992px）），con宽度970px

c_md_x：大屏幕（大桌面显示器，大于等于 1200px），con宽度1170px

--字体层级--------------------------------------

--h1:48 px
--h2:36 px
--h3:30 px
--h4:24 px
--h4:24 px
--h5:18 px 
--h6:16 px
--p:14 px
--p:12 px

(与PS字体大小层级一致)

---------------------------------------------------------------------------------------------------------------------*/

/*-重定义浏览器默认样式-*/

div, dl, dt, dd, ul, ol, li, form, input, table, tbody, tr, th, td, em, input, img,p,span,i {
margin: 0;
padding: 0;
border: 0
}

body {
padding: 0;
border: none;      
font: 14px/1.5 Tahoma,Helvetica Neue,Helvetica,Arial,Microsoft Yahei,sans-serif;         
color: #111920;
margin: 0 auto;
/* -webkit-tap-highlight-color:rgba(0,0,0,0); */
}


.mask{
overflow:hidden;
}
.mask:after{
content: "";
width: 100%;
height: 100%;
margin: auto;
position: absolute;
z-index: 1;
top:0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.9);
-webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
transition: all 0.6s;
}

a {	
	color: #111920;
	text-decoration: none 
}
.dark a {	
	color: #d9dadb;
	text-decoration: none 
}
a:active, a:focus {
outline: 0;
text-decoration: none
}
a:active, a:focus {
outline: 0
}
a:hover {
text-decoration: none
}

a,input,button{ outline:none; }
::-moz-focus-inner{border:0px;}

input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none;}
input,textarea { -webkit-appearance: none; border: 0;}
button, input, select, textarea { -webkit-appearance: none; border: 0;font-family: inherit; font-size: inherit; line-height: inherit;overflow: auto }

ul, ol, li {
list-style: none
}
em, i {
font-style: normal
}
ul, ol {
list-style: none
}

.clearfix::after, .clearfix::before, .container-fluid::after, .container-fluid::before, .container::after, .container::before, .modal-footer::after, .modal-footer::before, .modal-header::after, .modal-header::before, .row::after, .row::before {
content: " ";
display: table;

}

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

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box }
:after, :before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box }


/*-基础样式样式-*/
figure { margin: 0 }
table { background-color: transparent }
caption { padding-top: 8px; padding-bottom: 8px; color: #777; text-align: left }
table { width: 100%; max-width: 100%; border-spacing: 0;
border-collapse: collapse; }
td,th { padding: 0;}
img { vertical-align: middle; }
.img_r { display: block; max-width: 100%; height: auto;color: transparent; }
.center_b {display: block; margin-left: auto;margin-right: auto;}
.img_radius{ border-radius: 6px }
.img_thumbnail { padding: 4px; line-height: 1.42857143; background-color: #fff; border: 1px solid #ddd; border-radius: 4px; -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; display: inline-block; max-width: 100%; height: auto }
.img_circle { border-radius: 50% }
hr { margin-top: 20px; margin-bottom: 20px; border: 0; border-top: 1px solid #eee }

.sr_only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); border: 0 }
.s_only_focusable:active, .sr_only_focusable:focus { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto }
[role=button] { cursor: pointer }
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {font-family: inherit; font-weight: 700; line-height: 1.1; color: inherit ;margin:0;padding:0;}
.h1, h1 { font-size: 48px }
.h2, h2 { font-size: 36px }
.h3, h3 { font-size: 30px }
.h4, h4 { font-size: 24px }
.h5, h5 { font-size: 18px }
.h6, h6 { font-size: 16px }
p { font-size: 14px;  }
p .small{ font-size: 14px;  }
.small, small { font-size: 12px }
.mark, mark { padding: .2rem; background-color: #fcf8e3 }

.text_l { text-align: left }
.text_r { text-align: right }
.text_c { text-align: center}
.text_j { text-align: justify }
.text_n { white-space: nowrap }
.text_l { text-transform: lowercase }
.text_u { text-transform: uppercase }


a.text_primary:hover { color: #286090 }
.text_success { color: #3c763d }
a.text_success:hover { color: #2b542c }
.text_info { color: #31708f }
a.text_info:hover { color: #245269 }
.text_warning { color: #8a6d3b }
a.text_warning:hover { color: #66512c }
.text_danger { color: #a94442 }
a.text_danger:hover { color: #843534 }
.bg_primary { color: #fff; background-color: #337ab7 }
a.bg_primary:hover { background-color: #286090 }
.bg_success { background-color: #dff0d8 }
a.bg_success:hover { background-color: #c1e2b3 }
.bg_info { background-color: #d9edf7 }
a.bg_info:hover { background-color: #afd9ee }
.bg_warning { background-color: #fcf8e3 }
a.bg_warning:hover { background-color: #f7ecb5 }
.bg_danger { background-color: #f2dede }
a.bg_danger:hover { background-color: #e4b9b9 }
.page_header { padding-bottom: 9px; margin: 40px 0 20px; border-bottom: 1px solid #eee }

.p_0{
    padding: 0 !important;
}

.pt_0 {
    padding-top: 0 !important;
}

.pt_8 {
    padding-top: 0.08rem !important;
}

.pt_16 {
    padding-top: 0.16rem !important;
}

.pt_24 {
    padding-top: 0.24rem !important;
}

.pt_32 {
    padding-top: 0.32rem !important;
}

.pt_40 {
    padding-top: 0.4rem !important;
}

.pt_56 {
    padding-top: 0.56rem !important;
}
.pt_64 {
    padding-top: 0.64rem !important;
}
.pt_72 {
    padding-top: 0.72rem !important;
}
.pt_88{
    padding-top: 0.88rem !important;
}

.pt_96{
    padding-top: 0.96rem !important;
}
.pt_104{
    padding-top: 1.04rem !important;
}
.pt_112{
    padding-top: 1.12rem !important;
}
.pt_120{
    padding-top: 1.2rem !important;
}
.pt_160{
    padding-top: 1.6rem !important;
}
.pt_240{
    padding-top: 2.4rem !important;
}
.pt_320{
    padding-top: 3.2rem !important;
}


.pb_0 {
    padding-bottom: 0 !important;
}

.pb_8 {
    padding-bottom: 0.08rem !important;
}

.pb_16 {
    padding-bottom: 0.16rem !important;
}

.pb_24 {
    padding-bottom: 0.24rem !important;
}

.pb_32 {
    padding-bottom: 0.32rem !important;
}

.pb_40 {
    padding-bottom: 0.4rem !important;
}

.pb_56 {
    padding-bottom: 0.56rem !important;
}
.pb_64 {
    padding-bottom: 0.64rem !important;
}
.pb_72 {
    padding-bottom: 0.72rem !important;
}
.pb_88{
    padding-bottom: 0.88rem !important;
}

.pb_96{
    padding-bottom: 0.96rem !important;
}
.pb_104{
    padding-bottom: 1.04rem !important;
}
.pb_112{
    padding-bottom: 1.12rem !important;
}
.pb_120{
    padding-bottom: 1.2rem !important;
}
.pb_160{
    padding-bottom: 1.6rem !important;
}
.pb_240{
    padding-bottom: 2.4rem !important;
}
.pb_320{
    padding-bottom: 3.2rem !important;
}


.m_0{
    margin: 0 !important;
}
.mt_0 {
    margin-top: 0 !important;
}

.mt_8 {
    margin-top: 0.08rem !important;
}

.mt_16 {
    margin-top: 0.16rem !important;
}

.mt_24{
    margin-top: 0.24rem !important;
}

.mt_32 {
    margin-top: 0.32rem !important;
}

.mt_40{
    margin-top: 0.4rem !important;
}

.mt_56 {
    margin-top: 0.56rem !important;
}
.mt_64 {
    margin-top: 0.64rem !important;
}
.mt_72 {
    margin-top: 0.72rem !important;
}
.mt_88{
    margin-top: 0.88rem !important;
}
.mt_96{
    margin-top: 0.96rem !important;
}
.mt_104{
    margin-top: 1.04rem !important;
}
.mt_112{
    margin-top: 1.12rem !important;
}
.mt_120{
    margin-top: 1.2rem !important;
}
.mt_160{
    margin-top: 1.6rem !important;
}
.mt_240{
    margin-top: 2.4rem !important;
}
.mt_320{
    margin-top: 3.2rem !important;
}


.mb_0 {
    margin-bottom: 0 !important;
}

.mb_8 {
    margin-bottom: 0.08rem !important;
}

.mb_16 {
    margin-bottom: 0.16rem !important;
}

.mb_24{
    margin-bottom: 0.24rem !important;
}

.mb_32 {
    margin-bottom: 0.32rem !important;
}

.mb_40{
    margin-bottom: 0.4rem !important;
}

.mb_56 {
    margin-bottom: 0.56rem !important;
}
.mb_64 {
    margin-bottom: 0.64rem !important;
}
.mb_72 {
    margin-bottom: 0.72rem !important;
}
.mb_88{
    margin-bottom: 0.88rem !important;
}
.mb_88{
    margin-bottom: 0.88rem !important;
}
.mb_96{
    margin-bottom: 0.96rem !important;
}
.mb_104{
    margin-bottom: 1.04rem !important;
}
.mb_112{
    margin-bottom: 1.12rem !important;
}
.mb_120{
    margin-bottom: 1.2rem !important;
}
.mb_160{
    margin-bottom: 1.6rem !important;
}
.mb_240{
    margin-bottom: 2.4rem !important;
}
.mb_320{
    margin-bottom: 3.2rem !important;
}


/*--新官网栅格css--*/

.con{ margin-right: auto; margin-left: auto; 
	padding-left: 16px; 
	padding-right: 16px;
	padding-left: 0.16rem;
	padding-right: 0.16rem }

/*内容宽度*/
/*加快开发效率做的取舍的取舍，移动端端内容宽度统一设置为100%*/



@media (max-width:992px) {
.con { width:100% }
}

@media (min-width:992px) {
.con { width: 970px }
}

@media (min-width:1200px) {
.con { width: 1200px }
}

@media (min-width:1366px) {
.con { width: 1300px }
}


@media (min-width:1400px) {
.con { width: 1400px }
}

@media (min-width:1600px) {
.con { width: 1440px }
}


@media (min-width:1920px) {
.con { width:1440px; }
}


.con_f { margin-right: auto; margin-left: auto;
	padding-left: 16px; 
	padding-right: 16px;
	padding-left: 0.16rem; 
	padding-right: 0.16rem}

.row { 
    /*! display: flex; */
    /*! flex-wrap: wrap; */
	margin-left: -16px;
	margin-right: -16px;
	margin-left: -0.16rem; 
	margin-right: -0.16rem;	
}
.align_s_c{
    -webkit-align-self: center;
     -moz-align-self: center;
    align-self: center;
    }
.pull_l {
    float: left !important;
}
.pull_r {
    float: right !important;
}
.text_c {
    text-align: center;
}

.pull-left {
    float: left !important;
}
.pull-right {
    float: right !important;
}
.text-center {
    text-align: center;
}
.c_lg_1,
.c_lg_10,
.c_lg_11, 
.c_lg_12,
.c_lg_2, 
.c_lg_3, 
.c_lg_4, 
.c_lg_5, 
.c_lg_6, 
.c_lg_7, 
.c_lg_8, 
.c_lg_9,
.c_lg_10,
.c_lg_11,
.c_lg_12,
.c_lg_13,
.c_lg_14,
.c_lg_15,
.c_lg_16,
.c_lg_17,
.c_lg_18,
.c_lg_19,
.c_lg_20,
.c_lg_21,
.c_lg_22,
.c_lg_23,
.c_lg_24,

.c_md_1, 
.c_md_10, 
.c_md_11, 
.c_md_12, 
.c_md_2,
.c_md_3,
.c_md_4, 
.c_md_5,
.c_md_6,
.c_md_7,
.c_md_8, 
.c_md_9,
.c_sm_1, 
.c_sm_10, 
.c_sm_11,
.c_sm_12, 
.c_sm_13, 
.c_sm_14, 
.c_sm_15, 
.c_sm_16, 
.c_sm_17, 
.c_sm_18, 
.c_sm_19, 
.c_sm_19, 
.c_sm_20, 
.c_sm_21, 
.c_sm_22, 
.c_sm_23, 
.c_sm_24, 


.c_sm_2, 
.c_sm_3, 
.c_sm_4, 
.c_sm_5,
.c_sm_6, 
.c_sm_7, 
.c_sm_8, 
.c_sm_9, 
.c_xs_1, 
.c_xs_10,
.c_xs_11,
.c_xs_12,
.c_xs_2, 
.c_xs_3, 
.c_xs_4, 
.c_xs_5, 
.c_xs_6, 
.c_xs_7, 
.c_xs_8, 
.c_xs_9,
.c_xs_10,
.c_xs_11,
.c_xs_12,
.c_xs_13,
.c_xs_14,
.c_xs_15,
.c_xs_16,
.c_xs_17,
.c_xs_18,
.c_xs_19,
.c_xs_20,
.c_xs_21,
.c_xs_22,
.c_xs_23,
.c_xs_24
{ 
position: relative;  
float: left;
min-height: 1px; 
padding-left: 16px; 
padding-right: 16px;
padding-left: 0.16rem; 
padding-right: 0.16rem;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}

.c_xs_24 { 
	flex: 0 0 100%;
	width: 100%;
}
.c_xs_23 { 
	flex: 0 0 95.833333%;
	width: 95.833333%;
}
.c_xs_22 { 
	flex:0 0 91.666667%;
	width: 91.666667%;
}
.c_xs_21 {
	flex:0 0 87.5%; 
	width: 87.5%; 
}
.c_xs_20 { 
	flex:0 0 83.333333%;
	width: 83.333333% 
}
.c_xs_19 { 
	flex:0 0 79.166667%; 
	width: 79.166667%; 
}
.c_xs_18 { 
	flex: 75%; 
	width: 75%;
}
.c_xs_17 { 
	flex:0 0 70.833333%;
	width: 70.833333%;
}
.c_xs_16 { 
	flex: 66.6666667%;
	width: 66.6666667%; 
}
.c_xs_15 { 
	flex: 62.4%; 
	width: 62.4%; 
}
.c_xs_14 { 
	flex: 58.333333%; 
	width: 58.333333%; 
}
.c_xs_13 {
	flex:0 0 54.166667%;
	width: 54.166667%;
}
.c_xs_12 { 
	flex:0 0 50%; 
	width: 50%; 
}
.c_xs_11 { 
	flex:0 0 45.833333%;
	width: 45.833333%;
}
.c_xs_10 { 
	flex:0 0 41.66667%;
	width: 41.66667%;
}
.c_xs_9  { 
	flex:0   37.5%;
	width: 37.5%; 
}
.c_xs_8  {
	flex:0 0 33.333333%;
	width: 33.333333%;
} 
.c_xs_7  { 
	flex:0 0 29.1666666%;
	width: 29.1666666%; 
} 
.c_xs_6  { 
	flex:0 0 25%; 
	width: 25%; 
}
.c_xs_5  { 
	flex:0 0 20.8333333%; 
	width: 20.8333333%; 
} 
.c_xs_4  { 
	flex:0 0 16.6666666%;
	width: 16.6666666%;
}
.c_xs_3  { 
	flex:0 0 12.5%; 
	width: 12.5%; 
} 
.c_xs_2  {
	flex:0 0 8.33333333%;
	width: 8.33333333%;
}
.c_xs_1  {
	flex:0 0 4.166667%;
	width: 4.166667%;
}

@media (min-width:768px) {
.c_sm_24 { 
	flex: 0 0 100%;
	width: 100%;
}
.c_sm_23 { 
	flex: 0 0 95.833333%;
	width: 95.833333%;
}
.c_sm_22 { 
	flex:0 0 91.666667%;
	width: 91.666667%;
}
.c_sm_21 {
	flex:0 0 87.5%; 
	width: 87.5%; 
}
.c_sm_20 { 
	flex:0 0 83.333333%;
	width: 83.333333% 
}
.c_sm_19 { 
	flex:0 0 79.166667%; 
	width: 79.166667%; 
}
.c_sm_18 { 
	flex: 75%; 
	width: 75%;
}
.c_sm_17 { 
	flex:0 0 70.833333%;
	width: 70.833333%;
}
.c_sm_16 { 
	flex: 66.6666667%;
	width: 66.6666667%; 
}
.c_sm_15 { 
	flex: 62.4%; 
	width: 62.4%; 
}
.c_sm_14 { 
	flex: 58.333333%; 
	width: 58.333333%; 
}
.c_sm_13 {
	flex:0 0 54.166667%;
	width: 54.166667%;
}
.c_sm_12 { 
	flex:0 0 50%; 
	width: 50%; 
}
.c_sm_11 { 
	flex:0 0 45.833333%;
	width: 45.833333%;
}
.c_sm_10 { 
	flex:0 0 41.66667%;
	width: 41.66667%;
}
.c_sm_9  { 
	flex:0   37.5%;
	width: 37.5%; 
}
.c_sm_8  {
	flex:0 0 33.333333%;
	width: 33.333333%;
} 
.c_sm_7  { 
	flex:0 0 29.1666666%;
	width: 29.1666666%; 
} 
.c_sm_6  { 
	flex:0 0 25%; 
	width: 25%; 
}
.c_sm_5  { 
	flex:0 0 20.8333333%; 
	width: 20.8333333%; 
} 
.c_sm_4  { 
	flex:0 0 16.6666666%;
	width: 16.6666666%;
}
.c_sm_3  { 
	flex:0 0 12.5%;
	width: 12.5%; 
} 
.c_sm_2  {
	flex:0 0 8.33333333%;
	width: 8.33333333%;
}
.c_sm_1  {
	flex:0 0 4.166667%;
	width: 4.166667%;
}


}

@media (min-width:992px) {
.c_md_24 { 
	flex: 0 0 100%;
	width: 100%;
}
.c_md_23 { 
	flex: 0 0 95.833333%;
	width: 95.833333%;
}
.c_md_22 { 
	flex:0 0 91.666667%;
	width: 91.666667%;
}
.c_md_21 {
	flex:0 0 87.5%; 
	width: 87.5%; 
}
.c_md_20 { 
	flex:0 0 83.333333%;
	width: 83.333333% 
}
.c_md_19 { 
	flex:0 0 79.166667%; 
	width: 79.166667%; 
}
.c_md_18 { 
	flex: 75%; 
	width: 75%;
}
.c_md_17 { 
	flex:0 0 70.833333%;
	width: 70.833333%;
}
.c_md_16 { 
	flex: 66.6666667%;
	width: 66.6666667%; 
}
.c_md_15 { 
	flex: 62.4%; 
	width: 62.4%; 
}
.c_md_14 { 
	flex: 58.333333%; 
	width: 58.333333%; 
}
.c_md_13 {
	flex:0 0 54.166667%;
	width: 54.166667%;
}
.c_md_12 { 
	flex:0 0 50%; 
	width: 50%; 
}
.c_md_11 { 
	flex:0 0 45.833333%;
	width: 45.833333%;
}
.c_md_10 { 
	flex:0 0 41.66667%;
	width: 41.66667%;
}
.c_md_9  { 
	flex:0   37.5%;
	width: 37.5%; 
}
.c_md_8  {
	flex:0 0 33.333333%;
	width: 33.333333%;
} 
.c_md_7  { 
	flex:0 0 29.1666666%;
	width: 29.1666666%; 
} 
.c_md_6  { 
	flex:0 0 25%; 
	width: 25%; 
}
.c_md_5  { 
	flex:0 0 20.8333333%; 
	width: 20.8333333%; 
} 
.c_md_4  { 
	flex:0 0 16.6666666%;
	width: 16.6666666%;
}
.c_md_3  { 
	flex:0 0 12.5%;
	width: 12.5%; 
} 
.c_md_2  {
	flex:0 0 8.33333333%;
	width: 8.33333333%;
}
.c_md_1  {
	flex:0 0 4.166667%;
	width: 4.166667%;
}

}

@media (min-width:1600px) {
.c_lg_24 { 
	flex: 0 0 100%;
	width: 100%;
}
.c_lg_23 { 
	flex: 0 0 95.833333%;
	width: 95.833333%;
}
.c_lg_22 { 
	flex:0 0 91.666667%;
	width: 91.666667%;
}
.c_lg_21 {
	flex:0 0 87.5%; 
	width: 87.5%; 
}
.c_lg_20 { 
	flex:0 0 83.333333%;
	width: 83.333333% 
}
.c_lg_19 { 
	flex:0 0 79.166667%; 
	width: 79.166667%; 
}
.c_lg_18 { 
	flex: 75%; 
	width: 75%;
}
.c_lg_17 { 
	flex:0 0 70.833333%;
	width: 70.833333%;
}
.c_lg_16 { 
	flex: 66.6666667%;
	width: 66.6666667%; 
}
.c_lg_15 { 
	flex: 62.4%; 
	width: 62.4%; 
}
.c_lg_14 { 
	flex: 58.333333%; 
	width: 58.333333%; 
}
.c_lg_13 {
	flex:0 0 54.166667%;
	width: 54.166667%;
}
.c_lg_12 { 
	flex:0 0 50%; 
	width: 50%; 
}
.c_lg_11 { 
	flex:0 0 45.833333%;
	width: 45.833333%;
}
.c_lg_10 { 
	flex:0 0 41.66667%;
	width: 41.66667%;
}
.c_lg_9  { 
	flex:0   37.5%;
	width: 37.5%; 
}
.c_lg_8  {
	flex:0 0 33.333333%;
	width: 33.333333%;
} 
.c_lg_7  { 
	flex:0 0 29.1666666%;
	width: 29.1666666%; 
} 
.c_lg_6  { 
	flex:0 0 25%; 
	width: 25%; 
}
.c_lg_5  { 
	flex:0 0 20.8333333%; 
	width: 20.8333333%; 
} 
.c_lg_4  { 
	flex:0 0 16.6%;
	width: 16.6666666%;
}
.c_lg_3  { 
	flex:0 0 12.5%;
	width: 12.5%; 
} 
.c_lg_2  {
	flex:0 0 8.33333333%;
	width: 8.33333333%;
}
.c_lg_1  {
	flex:0 0 4.166667%;
	width: 4.166667%;
}

}


@charset "utf-8";
/*------------------------------------------------
--css  medical.css 远程医疗
--by   市场部 Web Designer&Front end Engineer  Sivan
--date 2020-06-15  

--需要提前载入24栅格系统 grid.min.css
--主流分辨率：1920px、1440px、1366px（优先考虑PC端）
--PC端内容宽度：1440px，前端JS转换100px=rem、
--看到写两个单位px rem不要慌，继续阅读本段直至理解

--当前样式使用css2 css3,基本适配PC、移动端，浏览器兼容至IE8以上（IE8部分一定错乱）
-------------------------------------------------*/
.medical_banner::before {
  content: "";
  margin: auto;
  position: absolute;
  z-index: 1;
  left: 2.6rem;
  bottom: -0.38rem;
  pointer-events: none;

  width:1.36rem;
  height:0.38rem;
  background: url(../images/medical/banner_bottom.png) no-repeat center center;
  background-size: cover;
}
@media(max-width:1200px) {
  .medical_banner::before {
    left: 0;
    right:0;
    z-index: 0;
    bottom: -0.38rem;
  } 
}
.medical_banner::after {
  content: "";
  margin: auto;
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;

  background-size: auto;
  background-size: contain;
  width: 100%;
  height: 720px;
  height: 4.2rem;
  max-width: 19.20rem;
  max-height: 7.2rem;
  overflow: hidden;
}
.medical_banner {

  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  width: 100%;
  height: 7.2rem;
  max-width: 25.6rem;

  color: #FFF;

}
.medical_banner_w {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  text-align: center;

  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  width: 100%;
  height: 7.2rem;
  max-width: 25.6rem;

  overflow: hidden;
  border-radius: 0 0 2.4rem 2.4rem;
}


@media(max-width:1200px) {
  .medical_banner_w {
    overflow: hidden;
    border-radius: 0;
  }
}

/*medical_banne_bg*/
.medical_banner_bg {
  width: 100%;
  height: 100%;
  content: "";
  margin: auto;
  position: absolute;
  z-index: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(../images/medical/banner_bg.png) no-repeat center center;
  background-size: cover;
  background-color: #e5e4e4;
  border-radius: 0 0 2.4rem 2.4rem;
}

@media(max-width:1200px) {
  .medical_banner_bg {
    overflow: hidden;
    border-radius: 0;
  }
}
.medical_banner_bg:after {
  width: 100%;
  height: 100%;
  content: "";
  margin: auto;
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  bottom: 0;
}
/*medical_banner_bg*/
.medical_banner_bg {
  width: 100%;
  height: 100%;
  margin: auto;
  position: absolute;
  z-index: 0;
  left: 0;
  right: 0;
  bottom: 0;

}
.medical_banner_bg:after {
  width: 100%;
  height: 100%;
  content: "";
  margin: auto;
  position: absolute;
  z-index: -2;
  left: 0;
  right: 0;
  bottom: 0;
}
.medical_banner .banner_text h3 {
  font-weight:bold;
  margin:0 18px;
  padding:8px 16px;
  display: inline-block;

  color:#ebf7fe;
  background-color:#1594d3;
  background-image: -moz-linear-gradient( 0deg, rgb(0,140,208) 0%, rgb(51,163,217) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(0,140,208) 0%, rgb(51,163,217) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(0,140,208) 0%, rgb(51,163,217) 100%);
  box-shadow: 0px 10px 20px 0px rgba(12, 142, 209, 0.2);
  border-radius: 88px;

}
.medical_banner .text_img_w {
  /*! padding: 0 0.24rem; */
}
.medical_banner .banner_text {
  color: #16222f;
  text-align: left;
  padding:0.88rem 0;
}
.medical_banner .banner_text h1 {
  font-size: 68px;
  font-size: 0.68rem;
  margin: 8px auto 32px auto;
  color: #FFF;
}

.medical_banner .banner_text ul {
  padding:0 18px;
  font-size: 18px;
  font-size: 0.18rem; 
  max-width:750px;
  max-width:7.5rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;  
}

.medical_banner .banner_text ul li{
  display: block;
  line-height: 2.6;
  width:50%;
  max-width: 50%; 

  font-size:16px;
  padding-left: 40px;
  overflow: hidden; 
  background: url(../images/medical/icon_tick.png) no-repeat 0 center;
}

@media(max-width:1200px) {
  .medical_banner .banner_text ul li{
    font-size:16px;
    line-height: 1.6;
    background-size: auto;
  }
}

.medical_banner .banner_text .smart{
  padding:0.64rem 18px 0 18px;
}




.medical_banner .banner_text p {
  width: 70%;
  font-size: 0.24rem;
  text-transform: uppercase;
  line-height: 2;
  color: #FFF;
  line-height: 1.4;
  margin: 0.16rem 0 0.4rem 0;
}
.medical_banner .banner_text .banner_btn {
  font-size: 18px;
  font-size: 0.18rem;
  margin: 0px;
}
.medical_banner .banner_text .btn_w {
  width: 64px;
  height: 64px;
  -webkit-transition: 0.8s ease all;
  -moz-transition: 0.8s ease all;
  transition: 0.8s ease all;
  -webki-transform: scale(1);
  -moz-transform: scale(1);
  transform: scale(1);
}
/*banner 默认文字动画*/

/*常用的向上动画和BTN*/
/*文字动画*/
.banner_text .a_w {
  opacity: 0;
  -webkit-transform: translate3d(0, 0.6rem 0);
  transform: translate3d(0, 0.6rem, 0);
  -webkit-transition: all 1.2s ease;
  transition: all 1.2s ease
}
.banner_text .a_1 {
  -webkit-transition-delay: .1s;
  transition-delay: .1s
}
.banner_text .a_2 {
  -webkit-transition-delay: .2s;
  transition-delay: .2s
}
.banner_text .a_3 {
  -webkit-transition-delay: .3s;
  transition-delay: .3s
}
.banner_text .a_4 {
  -webkit-transition-delay: .4s;
  transition-delay: .4s
}
.banner_text .a_5 {
  -webkit-transition-delay: .5s;
  transition-delay: .5s
}
.banner_text .a_6 {
  -webkit-transition-delay: .6s;
  transition-delay: .6s
}
.banner_text .a_7 {
  -webkit-transition-delay: .7s;
  transition-delay: .7s
}
.banner_text .a_8 {
  -webkit-transition-delay: .8s;
  transition-delay: .8s
}
/*动画触发*/
/*.banner_text.active .a_w {opacity: 1;transform: translate3d(0, 0, 0);}*/

/*动画触发-移植Banner*/
.medical_banner .active .a_w {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/*楼层公用*/
#main {
  position: relative;
  z-index: 2;
}
.medical_w{
    background: url(../images/medical/body_bg_right.png) no-repeat right 0;
    background: url(../images/medical/body_bg_left.png) no-repeat left 0;
}
/*楼层公用*/
.medical_s {
  position: relative;
  z-index: 1;
  min-height: 10rem;


  padding:0.64rem 0 0.64rem 0;
  margin: 0 auto;

  z-index: 1;

  min-height: 5rem;
  font-size: 18px;
  line-height: 2;

  overflow: hidden;
}

.medical_s .medical_tt {
  text-align: center;
  margin: 0 auto 0.64rem auto;
}
.medical_s2 .medical_tt {
  text-align: center;
  margin: 0 auto 0rem auto;
}
.medical_s .medical_tt h3{
  display: inline-block;
  position: relative;
  font-size: 0.56rem;
  font-weight:bold;
  margin:0 auto 0.24rem auto;	
}

.medical_s .medical_tt h3::after{
  content: "";
  margin: auto;
  position: absolute;
  z-index: 1;
  right: -0.40rem;
  top: -0.08rem;

  width:0.50rem;
  height:0.48rem;


  background: url(../images/medical/icon_tt_b.png) no-repeat center center;
  background-size: contain;
}

.medical_s .medical_tt p{
  font-size:0.24rem;	
  line-height: 2;
  margin-top:0.1rem;
}

.medical_s .flex_w {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.medical_s p{
  font-size: 18px;
}
.medical_s .text_n{
  font-family: "sivan", Helvetica, arial, sans-serif;
  color:#cfd2d8;
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content:start;
  margin-top: 0.08rem;
  white-space: normal;
}

.medical_s .text_n_l{
  display: block;
  width:0.88rem;
  height:0.88rem;
  line-height: 0.88rem;
  font-size:48px;
  font-size:0.48rem;
  font-weight:700;
  text-align: center;
  border:0.04rem solid #cfd2d8;
  border-radius: 0.16rem;

  margin-right: 0.16rem;
}
.medical_s .text_n_r{
  display: block;
  text-align: left;
  margin-right: 0.16rem;
}
.medical_s .text_n_r i{
  display: block;
  font-size:18px;
  font-size:0.18rem;
  line-height: 1;
  font-weight:500;
  text-transform: uppercase;
}
.medical_s .text_n_r font{
  display: block;
  font-size:24px;
  font-size:0.24rem;
  line-height: 1;
  font-weight:500;
}

@media(max-width:1200px) {
  .medical_s .text_n {
    width:100%;
    max-width: 5rem;
    margin:0 auto;

    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
  } 
}

.medical_s .text_h1{
  font-size: .48rem;
  line-height: 1.2;
  margin-top: 0.32rem;
  margin-bottom: 0.24rem;
}
.medical_s2 .text_h1{
  font-size: .30rem;
  font-weight: bold;
  line-height: 1.2;
  margin-top: 0.32rem;
  margin-bottom: 0.32rem;
}
.medical_s .text_p {
  font-size: 18px;
  margin: 0 0 0.24rem 0;
  line-height: 1.8;
  max-width: 8.2rem;
}

.medical_s .text_i {
  display: block;
  margin:0.4rem 0;
  width:0.6rem;
  height:0.6rem;
}
.medical_s_a .text_i {
  background: url(../images/medical/text_i_a.png) no-repeat center center;
  background-size: contain;
}
.medical_s_b .text_i {
  background: url(../images/medical/text_i_b.png) no-repeat center center;
  background-size: contain;
}
@media(max-width:1200px) {
  .medical_s .text_i {
    display: none;
  } 
}

.medical_img {
  position: relative;
  z-index: 1;
}
.medical_next {
  width:0.6rem;
  height:0.6rem;
  margin: auto;
  position: absolute;
  z-index:1;
  left:0.64rem;
  bottom: 0.32rem;

 
  background-size: contain;
}

.medical_s .medical_img img{
  border-radius: 0.24rem;
}



/*s1*/
.medical_s1 {
  margin:0.88rem  0 0rem 0;
  background-size: auto;
  background-size: cover;
}


.medical_s1 .detailed_more {
  margin-top: 0.88rem;
}

.medical_s1 .detailed_more .text_w{
  margin-top: 0.4rem;
}
.detailed_more .text_w h4{
  display: inline-block;
  font-weight:bold;
  margin-bottom: 0.16rem;
  box-shadow: inset 0 -.064rem rgba(174,218,247,0.88);
}
.detailed_more .text_w p{
  font-size:18px;
  /*! font-weight:300; */
}
.detailed_more .left_top,.detailed_more .left_bottom{
  text-align: right;
}
.detailed_more .right_top,.detailed_more .right_bottom{
  text-align: left;
}


/*S5*/
.medical_s5{

}
.medical_s5 .slides_list{
  margin-bottom: 0.88rem;
}
.scene_text{
margin-bottom: 0.88rem;
}
.scene_text h2{
  display: flex;
  flex-wrap: wrap;
  align-items: center;

  margin-bottom: 0.16rem;  

}

.scene_text h2 em{
  display: inline-block;
  color:#008cd0;
  font-size:24px;
  font-family: "sivan", Helvetica, arial, sans-serif;

  border:2px solid #008cd0;
  padding:8px;
  margin-right: 8px;
  border-radius: 8px;
}



.scene_text .introduce_w {
  margin-bottom: 0.4rem; 
}
.scene_text .introduce_w p{
  font-size: 18px;
}
.scene_text .feature_w {

}
.scene_text .feature_w h6{
  margin-bottom: 0.16rem; 
  font-size: 18px;
  font-weight:bold;
}
.scene_text .feature_w li{
  font-size: 16px;
}


/*切换按钮*/

@media(min-width:1200px) {

  .slides_w{
    min-height:4rem; 
  }
  .slides_w .slick-arrow{
    position: absolute;
    z-index: 1;
    left:0;
    width:44px;
    height:44px;
    margin-top:0.88rem;
    background: url(../images/medical/btn_next.png) no-repeat center center;
    background-size: contain;
  }
  .slides_w .slick-prev{
    position: absolute;
    z-index: 1;
    left:0;
    background: url(../images/medical/btn_prev.png) no-repeat center center;
    background-size: contain;
  }

  .slides_w .slick-next{
    position: absolute;
    z-index: 1;
    left:64px;
  }
}

@media(max-width:1200px) {
  .slick-prev {
    left: -0.2rem;
    background: url(../images/banner_btn_prev_d.png) no-repeat center center;
    background-size: contain;
  }
  .slick-next {
    right: -0.20rem;
    background: url(../images/banner_btn_next_d.png) no-repeat center center;
    background-size: contain;
  }
}


/*S6*/
.medical_s6{
}

.medical_s6 .case_list_w .list_w{
  position: relative; 
  z-index: 1;
  margin:0 auto 0.32rem auto;
} 

 .medical_s6 .img_w {
    height: auto;
    display: block;
    margin: 0 auto !important;
  }

.case_list_w .text_b{
  margin:0.64rem auto;
  position: absolute;
  z-index: 1;
  left:0;
  right:0;
  top:0;
  bottom:0;
  text-align: center;
  color:#FFF;
} 
.case_list_w .text_b img, .case_list_w .text_b p {
    -webkit-transition: all .8s ease;
    -moz-transition: all .8s ease;
    transition: all .8s ease;
    -webkit-transform: translate3d(0, 0, 0) translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0) translate3d(0, 0, 0);
}
.case_list_w .text_b:hover img {
    transition: transform 0.35s, color 0.35s;
    -webkit-transform: translate3d(0, 4px, 0);
    transform: translate3d(0, 4px, 0);
}
.case_list_w .text_b:hover p {
    transition: transform 0.35s, color 0.35s;
    -webkit-transform: translate3d(0, -2px, 0);
    transform: translate3d(0, -2px, 0);
}
@media(max-width:1200px){
  .case_list_w .text_b{
     margin:0.24rem auto;
  }
}
.case_list_w .text_b img{
width:0.98rem;  
}
@media(max-width:1200px){
.case_list_w .text_b img{
width:0.64rem;  
}
}
.case_list_w .text_b p{
margin:0.16rem auto; 
line-height: 1.4;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;  
}
@media(max-width:1200px){
  .case_list_w .text_b p{
     font-size:14px;
     padding:0 0.24rem;
  }
}
/*************************************
每一屏移动端通用处理
**************************************/

.medical_s .pull_l .cp_text, .medical_s .pull_r .cp_text {
  height: 800px;
  display: table-cell;
  vertical-align: middle
}
.medical_s .pull_l .cp_img, .medical_s .pull_r .cp_img {
  height: 800px;
  display: table-cell;
  vertical-align: middle
}
.medical_s_a .pull_l, .medical_s_b .pull_r {
  display: table;
}

@media(max-width:1200px) {
  .medical_s .pull_l .cp_text, .medical_s .pull_r .cp_text {
    height: auto;
    text-align: center
  }
  .medical_s .pull_l .cp_img, .medical_s .pull_r .cp_img {
    height: auto
  }
}
.medical_s .pull_c .cp_text {
  max-width: 620px;
  margin: 60px auto 60px auto;
  line-height: 32px;
  font-size: 18px
}
.medical_s .pull_c .cp_text {
  max-width: 900px
}
.medical_s_a {
  text-align: left;
}
.medical_s_a .pull_r {
  text-align: left;
}
.medical_s_a .pull_r .img_w img{
  margin-left:  0.5rem
}

@media(max-width:1366px) {
  .medical_s_a .pull_r .img_w img{
    margin-left: 0.5rem;
  }
}

@media(max-width:1200px) {
  .medical_s_a .pull_l .img_w  img{
    width: 100%;
    text-align: center;
    margin: 0 auto
  }
  .medical_s_a .pull_r .img_w img{
    max-width: 100%;
    text-align: center;
    margin: 0 auto
  }
}

.medical_s_b .pull_l {
  text-align: left;
}
.medical_s_b .pull_r .img_w img{
  margin-right: -100px
}

@media(max-width:1600px) {
  .medical_s .text_w p br {
    display: none
  }
}
@media(max-width:1366px) {
  .medical_s_b .pull_r .img_w img{
    margin-right: -100px
  }
}


@media(max-width:1200px) {
  .medical_s_a .pull_l .img_w img{
    width: 100%;
    text-align: center
  }
  .medical_s_a .pull_l .img_w img{
    margin:0 auto !important;
  }
  .medical_s_a .pull_l {
    width: 100%;
    text-align: center;
    margin: 0 auto!important;
  }
}

@media(max-width:1200px) {
  .medical_s_a .pull_r .img_w img{
    width: 100%;
    text-align: center
  }
  .medical_s_a .pull_r .img_w img{
    margin:0 auto !important;
  }
  .medical_s_a .pull_r {
    width: 100%;
    text-align: center;
    margin: 0 auto!important;
  }
}


@media(max-width:1200px) {
  .medical_s_b .pull_l .img_w img{
    width: 100%;
    text-align: center
  }
  .medical_s_b .pull_l .img_w img{
    margin:0 auto !important;
  }
  .medical_s_b .pull_l {
    width: 100%;
    text-align: center;
    margin: 0 auto!important;
  }
}

@media(max-width:1200px) {
  .medical_s_b .pull_r .img_w img{
    width: 100%;
    text-align: center
  }
  .medical_s_b .pull_r .img_w img{
    margin:0 auto !important;
  }
  .medical_s_b .pull_r {
    width: 100%;
    text-align: center;
    margin: 0 auto!important;
  }
}


@media(max-width:768px) {
  .medical_s {
    padding: 1rem 0;
    min-height: auto
  }
  .medical_s_a .pull_l, .medical_s_b .pull_r {
    width: 100% !important;
    margin: 0 auto!important;
    display: block !important;
    float: none !important;
  }
  .medical_s .text_w {
    height: auto;
    display: block;
    max-width: 7.2rem;
    margin: 0.5rem auto 0.5rem auto;
    text-align: center;
  }
  .medical_s .slides_w .text_w {
    height: auto;
    display: block;
    max-width: 7.2rem;
    margin: 0.5rem auto 0.5rem auto;
    text-align: left;
  }
  .medical_s .text_w .num_w {
    width: 1rem;
    height: 1rem;
    background-size: contain
  }
  .medical_s .text_w h1_w {
    margin: .4rem auto .4rem auto;
    font-size: .5rem;
    line-height: 1.3
  }
  .medical_s .text_w em {

  }
  .medical_s .text_w .p_w {
    max-width: none;
    margin: .4rem auto .6rem auto;
    font-size: .3rem;
    line-height: 1.8;
  }
  .medical_s .text_w p br {
    display: none;
  }
  .medical_s .img_w {
    height: auto;
    display: block;
    margin: .5rem auto
  }
  .medical_s_a .pull_r, .medical_s_b .pull_l {
    height: auto;
    width: 100%;
  }
}

@media(max-width:480px) {
  .medical_s {
    min-height: auto;
    padding: 0.24rem 0 0.88rem 0;
  }
  .medical_s_a .pull_l, .medical_s_b .pull_r {
    margin: 0 auto!important;
    display: block
  }
  .medical_s .pull_l .text_w, .medical_s .pull_r .text_w, .medical_s .pull_c .text_w {
    height: auto;
    display: block;
    max-width: 6.2rem;
    margin: 0.64rem auto 0.32rem auto;
    font-size: .18rem;
    line-height: 1.5
  }
  .medical_s .text_w h1.h1_w {
    margin: .5rem auto;
    font-size: .50rem
  }
  .medical_s .text_w em {

  }
  .medical_s .text_w p.p_w {
    margin: .5rem auto .5rem auto;
    font-size: .28rem;
    line-height: 1.8
  }



  .medical_s .pull_l .img_w, .medical_s .pull_r .img_w, .medical_s .pull_c .img_w  {
    height: auto;
    display: block;
    margin: .5rem auto;
    bottom: 0
  }
  .medical_s .pull_r, .medical_s .pull_l {
    height: auto;
  }
}

/**动画**/
.medical_s .text_n, .medical_s .text_h1,.medical_s  .text_p,.medical_s .text_i,.medical_s .medical_img {
  opacity: 1;
  -webkit-transform: translate(0, 0.32rem);
  -moz-transform: translate(0, 0.32rem);
  transform: translate(0, 0.32rem);
  -webkit-transition: all 2s ease;
  -moz-transition: all 2s ease;
  transition: all 2s ease;
}
.medical_s .text_h1 {
  -webkit-transition-delay: 0.1s;
  -moz-transition-delay: 0.1s;
  transition-delay: .1s
}
.medical_s .text_p {
  -webkit-transition-delay: 0.12s;
  -moz-transition-delay: 0.12s;
  transition-delay: 0.12s
}
.medical_s .list_w {
  -webkit-transition-delay: 0.14s;
  -moz-transition-delay: 0.14s;
  transition-delay: 0.14s
}
.medical_s .medical_info {
  -webkit-transition-delay: 0.16s;
  -moz-transition-delay: 0.16s;
  transition-delay: 0.16s
}

.medical_s .num_w {
  -webkit-transition-delay: 0.18s;
  -moz-transition-delay: 0.18s;
  transition-delay: 0.18s
}

.medical_s .medical_img {
  -webkit-transition-delay: 0.2s;
  -moz-transition-delay: 0.2s;
  transition-delay: 0.2s
}

.medical_s .company_bottom:nth-child(1) {
  -webkit-transition-delay: 0.2s;
  -moz-transition-delay: 0.2s;
  transition-delay: .2s
}
.medical_s .company_bottom:nth-child(2) {
  -webkit-transition-delay: 0.22s;
  -moz-transition-delay: 0.22s;
  transition-delay: .22s
}
.company_l .company_bottom:nth-child(3) {
  -webkit-transition-delay: 0.24s;
  -moz-transition-delay: 0.24s;
  transition-delay: .24s
}

/*.active 触发动画 */
.medical_s .active .text_n, .medical_s .active  .text_h1,.medical_s .active  .text_p,.medical_s .active .text_i,.medical_s .medical_img.active  {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  transform: translate(0, 0);
}