/*===========================================
Homepage
===========================================*/

/*-------------------------------------------
first
-------------------------------------------*/
#first{
    background:url(../images/bg-img.png?v=201612) #7dc221 50% 50%;
    min-height:480px;    /*! 324px*/
    position:relative;
}
    .picMask{
        position:absolute; left:0; right:0; bottom:0; z-index:3;
        height:87px;
        background:url(../images/bg-img-mask.png?v=201612) 50% 0;
        background-size:1920px 87px;
    }
    .picOpacity{
        position:absolute; left:0; right:0; top:0; bottom:0; z-index:2;
        background:url(../images/bg-img-opacity.png?v=201612) 50% 0 no-repeat;
        background-size:1000px 480px;    /*! 1000px 324px*/
    }

    .flashBanner{
            position:relative; z-index:10;
        }
        .flashBanner .BigPic{
            display:block; 
            width:1000px; 
            height:480px;    /*! 324px*/
            overflow:hidden; 
            position:relative;
        }
            .flashBanner .bigImg{
                height:480px;
            }
            .flashBanner p{
                margin:0;
                width:100%;
                position:absolute; bottom:0px; z-index:2; 
                padding:0 50px 70px;
                text-align:center;
                color:#fff;    
                font-size:16px;
            }
        .flashBanner .pics{
            height:80px; line-height:80px;
            width:100%; 
            text-align:center;
            position:absolute; bottom:-30px !important; left:0; right:0; z-index:100;
        }
        .flashBanner .pics span{
            position:relative;
            display:inline-block;
            vertical-align:top;
            width:80px; height:80px; 
            border-radius:50%;
            border:3px solid #fff;
            margin:0 10px;
            cursor:pointer;
            transition:.3s;
        }
        .flashBanner .pics span:nth-child(1), .flashBanner .pics span:nth-child(10) {top:-16px;}
        .flashBanner .pics span:nth-child(2), .flashBanner .pics span:nth-child(9) {top:-7px;}
        .flashBanner .pics span:nth-child(3), .flashBanner .pics span:nth-child(8) {top:4px;}
        .flashBanner .pics span:nth-child(4), .flashBanner .pics span:nth-child(7) {top:8px;}
        .flashBanner .pics span:nth-child(5), .flashBanner .pics span:nth-child(6){top:12px;}
        .flashBanner .pics span:nth-child(1){animation-delay:.3s;}
        .flashBanner .pics span:nth-child(2){animation-delay:.4s;}
        .flashBanner .pics span:nth-child(3){animation-delay:.5s;}
        .flashBanner .pics span:nth-child(4){animation-delay:.6s;}
        .flashBanner .pics span:nth-child(5){animation-delay:.7s;}
        .flashBanner .pics span:nth-child(6){animation-delay:.8s;}
        .flashBanner .pics span:nth-child(7){animation-delay:.9s;}
        .flashBanner .pics span:nth-child(8){animation-delay:1s;}
        .flashBanner .pics span:nth-child(9){animation-delay:1.1s;}
        .flashBanner .pics span:nth-child(10){animation-delay:1.2s;}
        .flashBanner .pics span:nth-child(11){animation-delay:1.3s;}
        .flashBanner .pics img{
            display:block;
            width:100px;
            border-radius:50%;
            position:relative;
            cursor:pointer; 
        }
            /* show */
            .flashBanner .pics span.show img{
                opacity:.5;
                margin:-5px 0 0 -5px;
            }
            .flashBanner .pics span.show{
                border-color:#00adff;
                background-color:#333;
                overflow:hidden;
            }
/*-------------------------------------------
Common
-------------------------------------------*/
.homeTitle{
    margin:0;
    font-size:30px;
}
.btnMore{
    position:absolute; right:0; top:-16px;
    font-size:13px; line-height:16px;
    color:#00adff;
}
/*-------------------------------------------
second
-------------------------------------------*/
#second{
    min-height:220px;
    padding:100px 0 50px;
}
    #news{
        float:left;
        width:460px;
        min-height:220px;
        background-color:#f6f6f6;
        position:relative;
        padding:35px 0 0 22px;
    }
        #news .homeTitle{
            background:url(../images/home-title-news.png?v=201612) no-repeat;
            background-size:119px 23px;
            width:119px; height:23px;
            text-indent:-99999em;
            position:absolute; top:-14px; left:5px;
        }
        @media 
        all and (min--moz-device-pixel-ratio: 1.5),
        all and (-o-min-device-pixel-ratio: 3/2),
        all and (-webkit-min-device-pixel-ratio: 1.5),
        all and (min-device-pixel-ratio: 1.5),
        all and (min-resolution: 1.5dppx) {
            #news .homeTitle{
                background-image:url(../images/home-title-news@2x.png?v=201612);
            }
        }
            #news .newsList{
                margin:0; padding:0; list-style:none;
                position:relative;
            }
            #news .newsList:before{
                content:"";
                font-size:0;
                background:url(../images/news-mask.png?v=201612) repeat-y;
                position:absolute; right:0; top:0;
                width:49px; height:100%;
            }
                #news .newsList li{
                    margin-bottom:12px;
                }
                    #news .newsList li time{
                        width:65px;
                        color:#00adff;
                        font-size:12px;
                        float:left;
                    }
                    #news .newsList li a{
                        display:inline-block;
                        width:350px; height:18px;
                        overflow:hidden;
                        color:#000;
                    }
                    #news .newsList li a:hover{
                        color:#00adff;
                    }
    #files{
        float:right;
        width:460px;
        min-height:220px;
        background-color:#f6f6f6;
        position:relative;
        padding:35px 22px 0;
    }
        #files .homeTitle{
            background:url(../images/home-title-files.png?v=201612) no-repeat;
            background-size:119px 23px;
            width:119px; height:23px;
            text-indent:-99999em;
            position:absolute; top:-14px; left:5px;
        }
        @media 
        all and (min--moz-device-pixel-ratio: 1.5),
        all and (-o-min-device-pixel-ratio: 3/2),
        all and (-webkit-min-device-pixel-ratio: 1.5),
        all and (min-device-pixel-ratio: 1.5),
        all and (min-resolution: 1.5dppx) {
            #files .homeTitle{
                background-image:url(../images/home-title-files@2x.png?v=201612);
            }
        }
            #files .filesList{
                margin:0; padding:0; list-style:none;
                position:relative;
            }
            #files .filesList:before{
                content:"";
                font-size:0;
                background:url(../images/news-mask.png?v=201612) repeat-y;
                position:absolute; right:0; top:0;
                width:49px; height:100%;
            }
                #files .filesList li{
                    margin-bottom:12px;
                }
                    #files .filesList li a{
                        display:inline-block;
                        height:18px;
                        overflow:hidden;
                        color:#000;
                        background:url(../images/icon-download.png?v=201612) no-repeat 0 50%;
                        padding-left:32px;
                    }
                    #files .filesList li a:hover{
                        color:#00adff;
                    }
/*-------------------------------------------
third
-------------------------------------------*/
#third{
    background-color:#ececec;
    min-height:260px;
    padding:50px 0;
}
    #third .homeTitle{
        background:url(../images/home-title-events.png?v=201612) no-repeat;
        background-size:119px 23px;
        width:119px; height:23px;
        position:absolute; left:50%; margin-left:-60px; top:-64px;
        text-indent:-99999em;
    }
    @media 
    all and (min--moz-device-pixel-ratio: 1.5),
    all and (-o-min-device-pixel-ratio: 3/2),
    all and (-webkit-min-device-pixel-ratio: 1.5),
    all and (min-device-pixel-ratio: 1.5),
    all and (min-resolution: 1.5dppx) {
        #third .homeTitle{
            background-image:url(../images/home-title-events@2x.png?v=201612);
        }
    }
    #calendar{
        float:left;
        width:240px;
        min-height:270px;
        background-color:#7dc221;
        color:#fff;
        font-size:12px;
        padding:15px 0;
    }
        #calendar .currentDate{
            text-align:center;            
        }
            #calendar .currentDate .month, #calendar .currentDate .year{
                font-size:18px; line-height:60px;
                vertical-align:15px;
                margin:10px;
            }
            #calendar .currentDate .day{
                font-size:60px; line-height:60px;
            }
            #calendar table{
                border-spacing:0px;
            }
                #calendar table td{
                    text-align:center;
                    width:14%;
                }
        #calendar .calWeek{
            background-color:#6ab00c;
            padding:8px 10px;
            margin-top:5px;
        }
            #calendar .calWeek table td{
                font-weight:700;
            }
        #calendar .calDay{
            padding:5px 10px;
        }
            #calendar .calDay table td{
                color:#b6d78b;
                line-height:24px;
                vertical-align:middle;
            }
                #calendar .calDay .today{
                    background-color:#6ab00c;
                }
                #calendar .calDay a{
                    display:block;
                    line-height:24px; font-weight:700;
                    color:#fff;
                }
                #calendar .calDay a:hover{
                    background-color:#00adff;
                    color:#fff;
                }
    #events{
        float:right;
        width:720px;
        min-height:270px;
        padding:0 50px;
    }
        #events .eventsList{
            
        }
            #events .eventsList .item{
                position:relative;
                padding-top:20px;
            }
                #events .eventsList .item .info{
                    background-color:#fff;
                    min-height:250px;
                    padding:40px 15px 20px;
                }
                    #events .eventsList .item time{
                        color:#00adff;
                        font-size:30px; line-height:30px;
                        text-align:center;
                        position:absolute; top:4px; left:0; right:0;
                    }
                        #events .eventsList .item time .year{
                            display:block;
                            font-size:14px; line-height:1;
                            color:#999;
                        }
                    #events .eventsList .item .title{
                        line-height:1.4;
                    }
                        #events .eventsList .item .title a{
                            color:#000;
                        }
                        #events .eventsList .item .title a:hover{
                            color:#00adff;
                        }
                    #events .eventsList .item .venue{
                        color:#999;
                        font-size:13px; line-height:16px;
                        background:url(../images/icon-venue.png?v=201612) no-repeat;
                        padding-left:18px;
                        margin-top:15px;
                    }
            #events .owl-nav{
                
            }
                #events .owl-nav .owl-prev, #events .owl-nav .owl-next{
                    width:20px; height:37px;
                    background-repeat:no-repeat;
                    text-indent:-99999em;
                    position:absolute; top:110px;
                    cursor:pointer;
                }
                #events .owl-nav .owl-prev{
                    background-image:url(../images/home-event-arrow-prev.png?v=201612);
                    left:-40px;
                }
                #events .owl-nav .owl-next{
                    background-image:url(../images/home-event-arrow-next.png?v=201612);
                    right:-40px;
                }
    #third .btnMore{
        top:-66px;
    }