﻿#topBN{
    position:relative;
}
    #topBN img.bg{}
    #topBN img.text{
        position:absolute;
        left:60%;
        top:36.5%;
    }
#experienceBGr{    
    background:url('../images/doctor/experience_BGr.png') 50% 0 repeat-y;
}
    #experience{
        min-height:1245px;
        background:url('../images/doctor/experience_BG.png') 50% 0 no-repeat;
        padding:90px 50% 0 6%;
    }
        #experience .group{
            margin-top:45px;
        }
        #experience .group:first-child{
            margin-top:0;
        }
            #experience .group h3.title{
                font-size:25px;
                font-weight:600;
                margin:0 0 15px;
            }
                #experience .group h3.title span{}
                #experience .group h3.title span.en{
                    font-size:18px;
                    font-family:Corbel;
                }
            #experience .group p.text{
                line-height:30px;
                margin:0;
            }
            #experience .group ul.list{
                margin:0;
                padding:0;
                list-style:none;
            }
                #experience .group ul.list li{
                    margin-top:10px;
                }
                #experience .group ul.list li:first-child{
                    margin-top:0;
                }
                    #experience .group ul.list li span.neme{}
#drPeople{
    background:url('../images/doctor/drPeople_drBG.png') 50% 0 no-repeat;
    padding-top:10px;
    height:1019px;
    position:relative;
    padding:90px 0 0 53%;
}
    /*#drPeople .drPic{
        position:absolute;left:0;bottom:0;
    }
        #drPeople .drPic image{
            height:auto;
        }*/
    #drPeople .content{
        padding-right:8%;
    }
        #drPeople .content h3.title{
            margin:0 0 15px;
            text-align:center;
        }
        #drPeople .content p.text{
            line-height:30px;
            margin:40px 0 0;
        }
        #drPeople .content div.signature{
            text-align:right;
            margin-top:30px;
        }        
    #drPeople .mobileShow{
        display:none;
    }
#chronology{
    background:#fff;
    padding:90px 70px;
    background:url('../images/doctor/chronology_BG.png') 50% bottom no-repeat;
}
    #chronology h3.title{
        font-size:25px;
        font-weight:600;
    }
        #chronology h3.title span.en{
            display:inline-block;
            margin-left:10px;
        }
    #chronology .swiper-container{
            /*padding:0 50px;*/
    }
        #chronology .swiper-container .swiper-wrapper{
        }
            #chronology .swiper-container .swiper-wrapper .swiper-slide{
                /*padding:25px;*/
                /*min-height:382px;*/
            }
                #chronology .swiper-container .swiper-wrapper .swiper-slide table{}
                    #chronology .swiper-container .swiper-wrapper .swiper-slide table tr{}
                        #chronology .swiper-container .swiper-wrapper .swiper-slide table tr td{
                            display:inline-block;
                            padding:25px;
                            border:2px solid #fff;
                            vertical-align:top;
                            background:#f2f2f2;
                        }
                        #chronology .swiper-container .swiper-wrapper .swiper-slide table tr td.w1{width:100%}
                        #chronology .swiper-container .swiper-wrapper .swiper-slide table tr td.w2{width:50%}
                        #chronology .swiper-container .swiper-wrapper .swiper-slide table tr td.w3{width:33.33%}
                        #chronology .swiper-container .swiper-wrapper .swiper-slide table tr td.w4{width:25%}
                            #chronology .swiper-container .swiper-wrapper .swiper-slide table tr td h4.year{
                                margin:0 0 15px;
                                font-size:28px;
                                font-family:Calibri;
                                font-weight:500;
                            }
                            #chronology .swiper-container .swiper-wrapper .swiper-slide table tr td div.content{
                                margin:0;
                                padding:0;
                                list-style:none;
                                font-size:18px;
                                color:#000;
                            }
                                #chronology .swiper-container .swiper-wrapper .swiper-slide table tr td div.content p{
                                    margin:10px 0 0;
                                }
                                #chronology .swiper-container .swiper-wrapper .swiper-slide table tr td div.content p:first-child{
                                    margin-top:0;
                                }
        #chronology .swiper-button-next,
        #chronology .swiper-button-prev{
            top:54%;
        }
        #chronology .swiper-button-next{
            right:-30px;
            background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23575777'%2F%3E%3C%2Fsvg%3E");
        }
        #chronology .swiper-button-prev{
            left:-30px;
            background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23575777'%2F%3E%3C%2Fsvg%3E");
        }

@media screen and (max-width:1804px){
    #experience{
        padding:80px 47% 70px 6%
    }
}
@media screen and (max-width:1654px){
    #experience{
        padding:80px 46% 70px 6%
    }
}
@media screen and (max-width:1516px){
    #experienceBGr{    
        background-position-x:30%;
    }
    #experience{
        background-position-x:30%;
        padding:80px 42% 70px 6%
    }
}
@media screen and (max-width:1400px){
    #experienceBGr{    
        background-position-x:28%;
    }
    #experience{
        background-position-x:28%;
        padding:70px 36% 60px 6%
    }
}
@media screen and (max-width:1390px){
    #drPeople{
        padding-top:60px;
    }
    #drPeople .content p.text{
        margin-top:30px;
    }
}
@media screen and (max-width:1280px){
    #drPeople{
        background:url('../images/doctor/drPeople_BG.png') 50% 0 no-repeat;
        position:relative;
        padding-left:0;
    }
    #drPeople::before{
        content:"";
        display:block;
        width:48%;
        background:url('../images/doctor/drPeople_dr.png') 0 bottom no-repeat;;
        position:absolute;right:0;top:0;bottom:0;
        background-size:contain;
    }
        #drPeople .content{
            padding:0 6%;
        }
            #drPeople .content p.text{
                margin-top:40px;
            }
            #drPeople .content p.text.t2{
                padding-right:40%;
            }
            #drPeople .content p.text.t3,
            #drPeople .content div.signature{
                padding-right:50%;
            }
}
@media screen and (max-width:1240px){
    #experienceBGr{    
        background-position-x:30%;
    }
    #experience{
        background-position-x:30%;
    }
}
@media screen and (max-width:1324px){
    #topBN img.text{
        width:400px;
    }
}
@media screen and (max-width:1125px){
    #experienceBGr{    
        background-position-x:35%;
    }
    #experience{
        background-position-x:35%;
    }
}
@media screen and (max-width:1080px){

}
@media screen and (max-width:1060px){
    #experienceBGr{    
        background-position-x:38%;
    }
    #experience{
        background-position-x:38%;
    }
}
@media screen and (max-width:950px){
    #experienceBGr{    
        background:#fff;
    }
    #experience{
        background:url('../images/doctor/experience_BG_M.png') 50% bottom no-repeat;
        background-size:contain;
        padding:70px 8% 60px;
    }
    #drPeople{
        height:auto;
        background:url('../images/doctor/drPeople_BG_M.png') 50% 0 no-repeat;
    }
    #drPeople::before{
        display:none;
    }
        #drPeople .content p.text.t2,
        #drPeople .content p.text.t3,
        #drPeople .content div.signature{
            padding-right:0;
        }
    #drPeople .mobileShow{
        display:block;
        margin-top:40px;
    }
    /*#drPeople::before{
        width:100%;
        background-size:auto;
    }
        #drPeople .content{
            padding:0 6%;
        }
            #drPeople .content p.text{
                margin-top:40px;
            }
            #drPeople .content p.text.t2,
            #drPeople .content p.text.t3,
            #drPeople .content div.signature{
                padding-right:50%;
            }*/
}
@media screen and (max-width:1035px){
    #topBN img.text{
        width:340px;
    }
}
@media screen and (max-width:910px){
    #topBN img.text{
        width:300px;
        left:58%;
    }
}
@media screen and (max-width:768px) {/*iPad*/
    #experience .group h3.title,
    #experience .group p.text,
    #experience .group ul.list li,
    #drPeople .content p.text,
    #chronology .swiper-container .swiper-wrapper .swiper-slide table tr td div.content p{
        padding-left:5px;
    }
}
@media screen and (max-width:760px){
    #topBN img.text{
        width:36%;
        left:58%;
    }
}
@media screen and (max-width:640px){
    #experience{
        background-size:auto;
        padding:50px 8% 50px;
    }
    #chronology{        
        padding:50px 8% 50px;
    }
}
@media screen and (max-width:420px){
    #experience{
        padding:60px 6% 60px;
    }
    #chronology .swiper-container .swiper-wrapper .swiper-slide{
        padding:0 20px;
    }
        .swiper-button-next,
        .swiper-button-prev{
            width:48px;
        }
}