@charset "utf-8";
/* CSS Document */
/*
color:red !important;/* Firefox、IE7支持
_color:red;  IE6支持
*color:red;  IE6、IE7支持
*+color:red; IE7支持/
color:red\9; IE6、IE7、IE8支持
color:red\0; IE8支持
@media screen and(-webkit-min-device-pixel-ratio:0){} chrome
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#99000000', EndColorStr='#99000000');
_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/templets/ftwcm/images/bg_index.body1.png');_background:none;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight*0.3));
behavior:url('');
pointer-events:none;//鼠标穿透
-webkit-animation:0.3s ease-in 1.1s 1 ui;
-webkit-animation-fill-mode:both;
*/


/*--默认--*/
html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, address, big, cite, code, del, em, font, img, ins, small, strong, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend ,em{ margin:0;padding:0;}
em{font-style:normal}
html{/*background:#000;*/ min-height: 100%;min-width: 1230px;}
body{-webkit-text-size-adjust:none;font-family:'微软雅黑';font-size:12px;max-width:1920px; margin: 0 auto;min-height: 100%;}
ol,ul,li{list-style:none outside none;padding:0;}
a{text-decoration:none;color:inherit;}
img{border:none;vertical-align:middle;}
table{border-collapse:collapse;}
tr,td,th{padding:0;margin:0;}
h1,h2,h3,h4,h5,h6{font-weight:normal;color:#474747;}
i,b,strong{font-style:normal;font-weight:normal;}
input,textarea,select{border:1px solid #CCC;font-family:'微软雅黑';outline:none;border:none;background:none;padding:0;}
a:focus{outline:none;}
body{background-color: #f0ecdb;}

/*--类--*/
.block{width:1230px;margin:0 auto; position:relative;height: 100%;/*border: 1px solid #00ff1e;box-sizing: border-box;*/}
.clearfix:after{content: ""; clear:both;display: block;}

@media screen and (max-width: 640px){
   
}

.header{height: 68px;background: #fff;position: relative;z-index: 9;}
.header .logo{width: 165px;height: 100%;display: block;/*position: absolute;left: 0;top: 0;*/ float: left;position: relative;
    z-index: 9}
	.header .logo:after{content:"";display:inline-block;width:0;height:100%;vertical-align:middle;}
.header .block{position: static;}
.header .main_nav{font-size: 18px;color: #333333;line-height:68px;/*overflow: hidden;margin-left: 150px;*/text-align:center;position: absolute;top: 0;left: 0;right: 0;}
.header .main_nav ul {/*overflow: hidden;*/     margin: 0}
.header .main_nav li {display:inline-block;}
.header .main_nav li:hover{background: url(../image/nav_icon1.png) no-repeat center bottom;}
.header .main_nav li.no_nav{background: none;}
.header .main_nav li:hover .nav_mask{display: block;}
.header .main_nav a{padding: 0 22px;color: #333333;padding-bottom: 10px; }
.header .main_nav a.now{border-bottom: 2px solid #86654A;}
.header .icon{top: 0;right: 0; height: 100%;float: right;position: relative;
    z-index: 9}
.header .icon span{display: inline-block;vertical-align: middle;font-size: 0;padding: 0 6px;height: 100%;position: relative;}
.header .icon span a{display: inline-block;background: url(../image/header-icon1.png) no-repeat 2px center;width: 25px; height: 100%;}
.header .icon .s2 a{background-position: right center;}
.header .icon .s3 {display: none;}
.header .nav_mask{position: absolute;top: 100%;left: 0;right: 0;background: url(../image/mask70.png) center;line-height: 50px;display: none;}
.header .nav_mask a{color: #fff;font-size: 14px;}
.header .nav_mask a:hover{color: #04396b;}
.header .icon span.s2 span{ position: absolute; top:100%; width:134px; height:134px; /*background:url(../image/ewm_bg.png) no-repeat center;*/ left:50%; margin-left:-67px; display: none; }
.header .icon span.s2:hover span{ display: block; }
.header .icon span.s2 img{display: block;width: 127px;height:127px;margin: 5px auto 0;}


/*底部*/
.bottom{height:260px; background:#3e3e3e;}
.bottom.block{position: relative;width: 1230px;}
.bot_l{font-size: 14px;color: #fff;position: absolute;left: 0px;top: 0px;border-right: 1px solid #353535;height: 220px;margin-top: 15px;
	width: 350px;
}
.bot_r{font-size: 14px;color: #fff;position: absolute;left: 853px;top: 0; padding-top: 30px; border-left: 1px solid #696969; height: 190px; padding-left:100px; margin-top: 15px; }
.bot_m{font-size: 14px;color: #fff;  height:190px; position: absolute; border-left: 1px solid #696969; left: 351px; margin-top: 15px; padding-left:120px; padding-top:30px;
padding-right:120px;top: 0px;}
.fnt-1,.fnt-2{float:left;}
.fnt-2{margin-left: 10px;}
.fnt-2 p{color:#cccccc;margin-top: 10px;}
.footer {height: 57px;line-height: 57px;background: #262626; text-align:center;}
.footer .block {position: relative;width: 1230px; text-align:center;}

.footer .p {font-size: 14px;color: #fff;padding-left: 330px;}


.useful{ margin-bottom: 86px;}
.useful .block {width: 1230px;}
.useful .list{ position: relative; overflow: hidden;text-align: center;}
.useful .list li{ text-align: center;width: 14.5%;display: inline-block;}
.useful .list li + li{ margin-left: 26px;}
.useful .list .ico{ display: block; width: 90px; height: 90px; margin: 0 auto 24px; border-radius: 50%; border: 1px solid #acabaa;}
.useful .list .ico > img{ display: block; width: 100%;
	-webkit-transition: transform 0.5s;
	-moz-transition: transform 0.5s;
	transition: transform 0.5s;
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	transform: rotateY(0deg);
}
.useful .list .h1 {font-size: 18px;color: #474747;padding-bottom: 7px;}
.useful .list .p {font-size: 14px;color: #474747;font-family: arial;text-transform: uppercase;}
.useful .list li:hover{ color: #8f6d51;}
.useful .list li:hover .ico{ border-color: #567894;}
.useful .list li:hover .ico > img{
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	transform: rotateY(180deg);
}


/*翻页*/

/*Pages*/
.Pages{ text-align:center; width:550px; height:30px; line-height:30px; margin:0 auto 10px; padding-top:0px;  clear:both;}
.Pages a{color: #acacac;font-size: 12px;font-weight: normal; background:#fff; width:30px; height:30px; line-height:30px;  border: 2px solid #e1e1e1;font-size: 18px;color: #858689;font-family: arial;border-radius: 50%;display: inline-block;margin: 0 2px; }
.Pages a:hover{background:#ababab; color:#FFF; }
.Pages a.a_first:hover{color: #fff;}
.p_page a.a_prev:hover{color: #fff;}
.p_page a.a_next:hover{color: #fff;}
.Pages span {  
    font-size: 12px;
    font-weight: normal;
    height: 30px;
    line-height: 30px;
    text-align: center;
    width: 30px;}

.Pages a.a_first{ font-size:12px; font-weight:normal;  color:#acacac; }
.p_page a.a_prev{ margin-right:6px; border:1px solid #eaeaea; font-size:12px; font-weight:normal;color:#acacac;  }
.p_page a.a_next{  margin-right:6px; border:1px solid #eaeaea; font-size:12px; font-weight:normal;  color:#acacac;  }
.Pages .p_page{ float:rigth;}
.Pages .p_page em{ font-style:normal; font-family:Arial;}
.Pages .p_page em a{width:30px; height:30px; line-height:30px; text-align:center; border:1px solid #eaeaea; font-size:14px;  font-size:12px; font-weight:normal;color:#acacac; }
.Pages .p_page em a:hover{background:#ababab; color:#FFF;}
.Pages .p_page em a.a_cur{ background:#ababab;color:#FFF;}

/*Pages*/





/*TOP*/
.gotop {position: fixed;bottom: 10%;right: 1%;display: none;cursor: pointer;}


@media screen and (max-width: 640px) {

.header_bg{ position: fixed; width:100%; height:100%; background: url(../image/jjl/mask_1.png) repeat 0 0; top:0; left:0; z-index:10; display: none; }

.header .main_nav {position: fixed;top: 0; right: -100%;bottom: 0; z-index: 999;margin-left: 0;width: 70%;-webkit-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;left: initial;}
.header .main_nav.show {right: 0;}
.header .main_nav ul {background: #fff;width: 100%;position: absolute;top: 0;right: 0;bottom: 0;overflow: hidden;}
.header .main_nav li {float: none;height: 0.8rem;line-height: 0.8rem;font-size: 0.28rem;border-bottom: 1px solid #99775a;display: block;text-align: left;}
.header .main_nav li:first-child {margin-top: 0.6rem;}
.header .main_nav li:hover{background: none;}
.header .main_nav li:hover .nav_mask{display: none;}
.header .nav_mask{position: static;}
    .header .main_nav li.now{height: auto;}
    .header .main_nav li.now .nav_mask{display: block;}
    .header .nav_mask a{display: block;margin: 0;padding: 0 0.2rem;line-height: 0.6rem;border-bottom: 1px solid #fff;}
    .header .nav_mask a:last-child{border: 0;}
.header .main_nav .close {position: absolute;top: 0.2rem;right: 0.2rem;background: url(../image/jjl/close1.png) no-repeat center;width: 0.4rem;height: 0.4rem;z-index: 1;background-size: cover;cursor: pointer;}
.header .icon .s3 {display: inline-block;width: 25px;line-height: 58px;vertical-align: middle;cursor: pointer;}
.header .icon .s3 img {width: 100%;height: auto;}
	
.footer {height: auto;line-height: inherit;padding: 20px 0; font-size:0.2rem; }
.footer .fot_nav {width: 100%;text-align: center;position: inherit; font-size:0.2rem; }
.footer .p {margin: 0;text-align: center;padding: 6px 0; font-size:0.2rem;  }
.footer .ftbj {position: inherit;text-align: center; font-size:0.2rem; }
.footer .fot_nav a{  font-size:0.2rem; }


.useful{ margin-bottom: 0.8rem;}
.useful .list li{width: 33.3%;margin:0 0 0 !important;overflow: hidden;float: left;height: 2.8rem;}
.useful .list .ico{ width: 1.23rem; height: 1.23rem; margin-bottom: 0.16rem; border: 2px solid #cce3f3;}
.useful .list .h1 {font-size: 0.28rem;}
.useful .list .p {font-size: 0.24rem;}
	
.jjl_page a {width: 0.5rem;height: 0.5rem;line-height: 0.5rem;margin: 0 0.02rem;font-size: 0.3rem;}
.jjl_page a img {width: 0.12rem;height: auto;}	
.jjl_page2 li {height: 0.7rem;line-height: 0.7rem;font-size: 0.24rem;margin: 0;}
.jjl_page2 li a {display: block;width: 100%;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
.gotop {width: 1.03rem;height: auto;}
.gotop img {width: 1.03rem;height: auto;}

html,body {width: 100%;}
.block {width: auto !important;margin: 0 0.2rem;}
.jjl_nav_wp {margin-bottom: 0.4rem;}
.jjl_nav_wp a {width: 1.67rem;height: 0.45rem;line-height: 0.45rem;font-size: 0.24rem;}



	.useful{ text-align: center !important; }
	.useful .list li{ float: none !important; margin:0 -3px !important; display: inline-block; vertical-align:top;}

}


/*效果*/
@media screen and (min-width: 1230px) {
.business1 .text {/*-webkit-transition: all 1.2s ease-in-out;transition: all 1.2s ease-in-out;opacity: 0;-webkit-transform: scale(0);transform: scale(0);*/}
.business1.anim .text {-webkit-transform: scale(1);transform: scale(1);opacity: 1;} 
.business2 {overflow: hidden;}	
.business2 .cont .div {-webkit-transform: scale(0.6) rotate(-3deg);opacity: 0;transform: scale(0.6) rotate(-3deg);opacity: 0;-webkit-transition: all 1s ease;transition: all 1s ease;}
.business2.anim .cont .div {-webkit-transform: scale(1) rotate(0deg);transform: scale(1) rotate(0deg);opacity: 1;}
.business2 .cont {-webkit-transform: translateY(200px);transform: translateY(200px);opacity: 0;-webkit-transition: all 0.8s ease-in-out;transition: all 0.8s ease-in-out;}
.business2.anim .cont {-webkit-transform: translateY(0);transform: translateY(0);opacity: 1;}
.business5 .cont .item .txt {left: 42% !important;-webkit-transition: all 1.2s ease-in-out;transition: all 1.2s ease-in-out;opacity: 0;}
.business5.anim .cont .item .txt  {left: 18% !important;opacity: 1;}
.business4 .cont .img1 {/*-webkit-transform: translateX(-200px) rotate(-45deg);transform: translateX(-200px) rotate(-45deg);opacity: 0;-webkit-transition: all 0.6s ease-in-out;transition: all 0.6s ease-in-out;*/}
.business4 .cont .img2 {/*-webkit-transform: translateY(-200px);transform: translateY(-200px);opacity: 0;-webkit-transition: all 0.5s ease-in-out 0.7s;transition: all 0.5s ease-in-out 0.7s;*/}
.business4 .cont .img3 {/*-webkit-transform: translateX(200px) rotate(90deg);transform: translateX(200px) rotate(90deg);opacity: 0;-webkit-transition: all 0.6s ease-in-out 2s;transition: all 0.6s ease-in-out 2s;*/}
.business4 .cont .img4 {/*opacity: 0;-webkit-transition: all 0.5s ease-in-out 1.3s;transition: all 0.5s ease-in-out 1.3s;*/}

.business4.anim .cont .img1 {-webkit-transform: translateX(0px) rotate(0deg);transform: translateX(0px) rotate(0deg);opacity: 1;} 
.business4.anim .cont .img2 {-webkit-transform: translateY(0px);transform: translateY(0px);opacity: 1;} 
.business4.anim .cont .img3 {-webkit-transform: translateX(0px) rotate(0deg);transform: translateX(0px) rotate(0deg);opacity: 1;} 
.business4.anim .cont .img4 {opacity: 1;}





}


.caselist{margin-top:40px; }
.caselist li{float:left; width:282px; height:118px; margin-right:10px; margin-left:10px; margin-bottom:30px; border:1px solid #cccccc;}
.yinglist li{width:237px; height:237px; float:left; margin-right:45px; background: url(../image/ying.png); border-radius:50%; margin-top:250px;}
.yinglist li p{width:150px; height:200px; margin:70px auto 0;  color:#ffffff; font-size:20px; line-height:30px;}
.yinglist {width:1100px; margin:0px auto;  height:237px;}
.txlist{margin-top:150px;}
.txlist li{width:275px; height:275px;  float:left;}
.txlist li p{text-align:center; color:#ffffff; font-size:20px; margin-top:50px; line-height:30px; margin-bottom:20px;}
.txlist li.txlist_01{ width:307px; height:275px; background:url(../image/ying.png);}
.txlist li.txlist_02{ width:307px; height:275px; background:url(../image/ying2.png);}
.plan_text{
	position: absolute;
	right: 0;
	top: 0;
	z-index: 999999;
	width: 500px;
	height: 843px;
	background: url(../image/ying.png);
}
.plan_title{font-size:24px; color:#ffffff; height:60px; line-height:60px; text-align:center; margin-top:10px;}
.plan_text p{width:450px; margin:0px auto; font-size:14px; line-height:24px; color:#ffffff; height:830px; overflow:hidden;}
.rh_title{font-size:24px; color:#333333;}
.rh_title2{font-size:24px; color:#333333; margin-top:30px;}


.banner_box {
    height: 100%;
    position: relative;
    overflow: hidden;
}

.banner_cot {
    height: 100%;
    position: relative;
    overflow: hidden;
}

.content {
    position: relative;
    width: 1200px;
    margin: 0 auto;
}

.banner_list {
    position: relative;
    height: 100%;
}

.page_box {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: -9999px;
}

.bg_box {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-position: center center;
    background-repeat: no-repeat;
}

    .bg_box img {
        position: absolute;
        top: 50%;
        left: 50%;
    }

.page_box .content {
    width: 1000px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -500px;
    z-index: 5;
    transform-origin: center center;
    -webkit-transform-origin: center center;
}

.page_box .main_box {
    position: relative;
    height: 100%;
    left: -9999px;
    top: 50%;
}

.banner_list .show {
    left: 0;
}

    .banner_list .show .main_box {
        left: 0;
    }

/*下方导航图标*/
.product_btns {
    position: absolute;
    width: 100%;
    bottom: 5px;
    z-index: 6;
    transition: bottom .3s;
    -webkit-transition: bottom .3s;
    z-index: 10;
}

    .product_btns.show {
        bottom: 100px;
    }

    .product_btns .content {
        width: 1000px;
        position: absolute;
        bottom: 0;
        left: 50%;
        margin-left: -500px;
    }

    .product_btns .btns_box {
        margin: auto;
    }

        .product_btns .btns_box a {
            display: inline-block;
            position: relative;
            background-size: auto;
        }

    .product_btns .icon_bg {
        background: url(../image/icon_big_1.png);
    }

    .product_btns .icon_show {
        background: url(../image/icon_big.png);
    }
/*big size*/
.big_view .product_btns .content {
    height: 82px;
}

.big_view .product_btns .btns_box {
    width: 500px;
    height: 84px;
}

    .big_view .product_btns .btns_box a {
        width: 90px;
        height: 72px;
        margin: 0 15px;
    }

/*mid size*/
.mid_view .product_btns .content {
    height: 58px;
}

.mid_view .product_btns .btns_box {
    height: 58px;
    width: 388px;
}

    .mid_view .product_btns .btns_box a {
        width: 70px;
        height: 56px;
        margin: 0 12px;
        background-size: 70px 56px;
    }
/*small size*/
.small_view .product_btns .content {
    height: 42px;
}

.small_view .product_btns .btns_box {
    height: 42px;
    width: 292px;
}

    .small_view .product_btns .btns_box a {
        width: 50px;
        height: 40px;
        margin: 0 10px;
        background-size: 50px 40px;
    }
/*分页样式*/
/*第一页 天空中的猫老师*/
.sky_xia {
    z-index: 10;
}

.sky_cot {
    position: absolute;
    bottom: 30%;
    right: 36%;
    width: 371px;
    height: 341px;
}

    .sky_cot img {
        width: 100%;
        height: 100%;
    }

.show .sky_anim1 {
    animation: sky_1 1s;
    -moz-animation: sky_1 1s;
    -webkit-animation: sky_1 1s;
    -o-animation: sky_1 1s;
}

.show .sky_anim2 {
    animation: sky_2 2s;
    -moz-animation: sky_2 2s;
    -webkit-animation: sky_2 2s;
    -o-animation: sky_2 2s;
}

@keyframes sky_1 {
    0% {
        opacity: 0;
        top: 60%;
    }

    100% {
        opacity: 1;
        top: 50%;
    }
}

@-moz-keyframes sky_1 {
    0% {
        opacity: 0;
        top: 60%;
    }

    100% {
        opacity: 1;
        top: 50%;
    }
}

@-webkit-keyframes sky_1 {
    0% {
        opacity: 0;
        top: 60%;
    }

    100% {
        opacity: 1;
        top: 50%;
    }
}

@-o-keyframes sky_1 {
    0% {
        opacity: 0;
        top: 60%;
    }

    100% {
        opacity: 1;
        top: 50%;
    }
}

@keyframes sky_2 {
    0% {
        opacity: 0;
        bottom: 0px;
        right: 0px;
    }

    50% {
        opacity: 1;
        bottom: 0px;
        right: 0px;
    }

    100% {
        bottom: 30%;
        right: 36%;
    }
}

@-moz-keyframes sky_2 {
    0% {
        opacity: 0;
        bottom: 0px;
        right: 0px;
    }

    50% {
        opacity: 1;
        bottom: 0px;
        right: 0px;
    }

    100% {
        bottom: 30%;
        right: 36%;
    }
}

@-webkit-keyframes sky_2 {
    0% {
        opacity: 0;
        bottom: 0px;
        right: 0px;
    }

    50% {
        opacity: 1;
        bottom: 0px;
        right: 0px;
    }

    100% {
        bottom: 30%;
        right: 36%;
    }
}

@-o-keyframes sky_2 {
    0% {
        opacity: 0;
        bottom: 0px;
        right: 0px;
    }

    50% {
        opacity: 1;
        bottom: 0px;
        right: 0px;
    }

    100% {
        bottom: 30%;
        right: 36%;
    }
}
/*3页  雪中的猫老师*/
.page_box .snow_cot {
    position: absolute;
    z-index: 12;
    bottom: 8%;
    left: 50%;
}

.snow_cot img {
    width: 100%;
    height: 100%;
}

.show .snow_anim { /* animation   加上show 函数则当前页面显示时出现动效*/
    animation: snow_1 0.5s;
    -moz-animation: snow_1 0.5s; /* Firefox */
    -webkit-animation: snow_1 0.5s; /* Safari and Chrome */
    -o-animation: snow_1 2s; /* Opera */
}

@keyframes snow_1 {
    0% {
        left: 1000px;
    }

    100% {
        left: 50%;
    }
}

@-moz-keyframes snow_1 {
    0% {
        left: 1000px;
    }

    100% {
        left: 50%;
    }
}

@-webkit-keyframes snow_1 {
    0% {
        left: 1000px;
    }

    100% {
        left: 50%;
    }
}

@-o-keyframes snow_1 {
    0% {
        left: 1000px;
    }

    100% {
        left: 50%;
    }
}
/*第二页 房间里的猫老师*/
.page_box .content .room_cot {
    position: absolute;
    bottom: 8%;
    left: 50%;
    margin-left: -200px;
    width: 668px;
    height: 585px;
}

.room_anim img {
    width: 100%;
    height: 100%;
    vertical-align: middle;
}

.show .room_anim {
    animation: room_1 1.5s ease-in-out;
    -moz-animation: room_1 1.5s ease-in-out;
    -webkit-animation: room_1 1.5s ease-in-out;
    -o-animation: room_1 1.5s ease-in-out;
}

@keyframes room_1 {
    0% {
        transform: rotate(720deg) scale(0);
        opacity: 0;
    }

    66% {
        transform: rotate(0deg) scale(0.5);
        opacity: 1;
    }

    100% {
        transform: rotate(0deg) scale(1);
    }
}

@-moz-keyframes room_1 {
    0% {
        transform: rotate(720deg) scale(0);
        opacity: 0;
    }

    66% {
        transform: rotate(0deg) scale(0.5);
        opacity: 1;
    }

    100% {
        transform: rotate(0deg) scale(1);
    }
}

@-webkit-keyframes room_1 {
    0% {
        transform: rotate(720deg) scale(0);
        opacity: 0;
    }

    66% {
        transform: rotate(0deg) scale(0.5);
        opacity: 1;
    }

    100% {
        transform: rotate(0deg) scale(1);
    }
}

@-o-keyframes room_1 {
    0% {
        transform: rotate(720deg) scale(0);
        opacity: 0;
    }

    66% {
        transform: rotate(0deg) scale(0.5);
        opacity: 1;
    }

    100% {
        transform: rotate(0deg) scale(1);
    }
}
/*第四页 房间中的猫老师*/
.page_box .content .forest_cot {
    position: absolute;
    bottom: 15%;
    /*right: 1.04%;*/
    width: 500px;
    height: 636px;
    left: 50%;
}

.forest_cot img {
    width: 100%;
    height: 100%;
}

.show .forest_anim {
    animation: forest_1 1s ease-in-out;
    -moz-animation: forest_1 1s ease-in-out;
    -webkit-animation: forest_1 1s ease-in-out;
    -o-animation: forest_1 1s ease-in-out;
    /*向下移动*/
    /*bottom: 9.5%;*/
}

@keyframes forest_1 {
    0% {
        transform: scale(0);
        opacity: 0;
        bottom: 60%;
    }

    50% {
        transform: scale(1);
        opacity: 1;
        bottom: 55%;
    }

    100% {
        bottom: 15%;
    }
}

@-moz-keyframes forest_1 {
    0% {
        transform: scale(0);
        opacity: 0;
        bottom: 60%;
    }

    50% {
        transform: scale(1);
        opacity: 1;
        bottom: 55%;
    }

    100% {
        bottom: 15%;
    }
}

@-o-keyframes forest_1 {
    0% {
        transform: scale(0);
        opacity: 0;
        bottom: 60%;
    }

    50% {
        transform: scale(1);
        opacity: 1;
        bottom: 55%;
    }

    100% {
        bottom: 15%;
    }
}

@-webkit-keyframes forest_1 {
    0% {
        transform: scale(0);
        opacity: 0;
        bottom: 60%;
    }

    50% {
        transform: scale(1);
        opacity: 1;
        bottom: 55%;
    }

    100% {
        bottom: 15%;
    }
}


.button01{width:300px; height:40px; border:1px solid #cccccc; text-align:center; display:block; margin:0px auto; line-height:40px; font-size:16px;}
a.button01:link{color:#333333;}
a.button01:visited{color:#333333;}
a.button01:hover{color:#50728e;}
a.button01:active{color:#50728e;}

.button02{width:300px; height:40px;  text-align:center; display:block; margin:0px auto; line-height:40px; font-size:16px;}
a.button02:link{color:#ffffff; border:1px solid #ffffff;}
a.button02:visited{color:#ffffff; border:1px solid #ffffff;}
a.button02:hover{color:#ffffff; background:#385063; border:1px solid #385063;}
a.button02:active{color:#ffffff;  background:#385063; border:1px solid #385063;}