﻿
.top1div {
   width:100%;
   height:725px;
   color:white;
}

.top1img {
    position: absolute;
    top: 220px;
    left: 45%; 
    width:30%;
}

.top2img {
    position: absolute;
    top: 220px;
    left: 80%;
    width: 20%;
}

.top4img {
    position: absolute;
    top: 570px;
    left: 10%;
}

.toptitle {
    position: absolute;
    top: 120px;
    left: 10%;
    width: 600px;
}
 
.topdiv1 {
    position: absolute;
    top: 120px; 
    font-size: 67px;
    font-weight: 600;
}

.topdiv2 {
    position: absolute;
    top: 210px;
    font-size: 67px;
}

.topdiv3 {
    position: absolute;
    top: 300px; 
    font-size: 30px;
    font-weight: lighter;
    color: #b6e2ea
}

.topdiv4 {
    position: absolute;
    top: 340px;
    font-size: 30px;
    font-weight: lighter;
    color: #b6e2ea
}

.top2div { 
    width:100%;
    height: 800px;  
    text-align:center;
}

.top2title1 {
    font-size: 40px;
    margin-top:30px;
}

.top2title2 {
    font-size: 18px;
    margin-top: 20px;
}

.top2-1img { 
    margin-top:50px;
}
.top2-2img {
    position: relative;
    top: -200px;
    left: 100px;
}

.top3div {
    width: 100%;
    height: 790px;
    text-align: center;
    margin-top: 170px; 
}

.top3title1 {
    margin-top: 150px;
    font-size: 40px;
}

.top3title2 { 
    font-size: 18px;
    margin-top: 10px;
}

.top3-1img {
   position:absolute;
   top:1720px;
   height:1000px;
   left:0px;
   z-index:-99;
   width:100%;
}

.top3btnlistimg {
    background: url(../images/top3btnbgimg.png) no-repeat;
    background-size: 90%;
    background-size: cover;
}
    .top3btnlistimg img {
       margin-top:40px;
    }
 
.top3btntitle {
    margin-top: 30px;
    font-size: 20px;
    color: white;
}
.top3listdiv {
    width: 100%;
    height: 770px;
}

.top3imglistdiv {
    position: absolute;
}

.top3-1div {
    position: inherit;
    left: 0px;
    top: 150px;
    width: 306px;
    height: 266px;
}

.top3-2div {
    position: inherit;
    left: 240px;
    top: 0px;
    width: 306px;
    height: 266px;
}

.top3-3div {
    position: inherit;
    left: 240px;
    top: 300px;
    width: 306px;
    height: 266px;
}

.top3-4div {
    position: inherit;
    left: 480px;
    top: 150px;
    width: 306px;
    height: 266px;
}

.top3-5div {
    position: inherit;
    left: 720px;
    top: 0px;
    width: 306px;
    height: 266px;
}

.top3-6div {
    position: inherit;
    left: 720px;
    top: 300px;
    width: 306px;
    height: 266px;
}

.top3-7div {
    position: inherit;
    left: 960px;
    top: 150px;
    width: 306px;
    height: 266px;
}



.showdetail {
   margin-top:-120px;
   display:none;
}

.showtitle {
    color: #02a9c9;
    font-size: 23px;
}

.showcontent {
    margin-top: 20px;
    width: 200px;
    height: 300px;
    margin-left: 50px;
    font-size: 18px;
    color: #8d8d8d;
}

.top4div {
    background: url(../images/top4bgimg.png) no-repeat;
    width:100%;
    height:1000px;
    z-index:99;
    text-align:center;
}

.top4title1 {
   padding-top:130px;
   letter-spacing:3px;
   font-size:40px;
   color:white;
}

.top4title2 {
    padding-top: 20px;
    font-size: 18px;
    color: #ebeceb;
}

.top4btnlistiv {
   width:100%;
   height:100px;
   padding-top:50px;
}

.top4btn1 {
    background-color: transparent;
    border-style: none;
    width: 170px;
    height: 50px;
    border: 1px dashed white;
    border-radius: 20px;
    color: white;
    outline: none;
    margin-left: 30px;
    font-size:20px;
}

    .top4btn1:hover {
        border: 0px;
        background: linear-gradient(90deg, #01a9c9 0%, #0cbbc2 50%, #16cdba 90%);
    }

    .top4btn1 :active {
        border: 0px;
        background: linear-gradient(90deg, #01a9c9 0%, #0cbbc2 50%, #16cdba 90%);
    }

.top4btn1Selected {
    border: 0px;
    background: linear-gradient(90deg, #01a9c9 0%, #0cbbc2 50%, #16cdba 90%);
   
}

.top4ImgListdiv { 
    text-align: center;
    height: 500px;
   margin-left:130px;
   display:none;
}
.top4ImgListdivSelected {
    display: inherit;
}
.top4ImgdivSelected {
    background: linear-gradient(90deg, #01a9c9 0%, #0cbbc2 50%, #16cdba 90%);
    color: white !important;
}

.top4Imgdiv  {
    margin-left: 40px;
    float: left;
    width: 20%;
    height: 100%;
    color:black;
    background-color:white;
}

.top4imgcontentdiv {
    height: 320px;
    width: 370px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
}
.top4imgcontent {
     
}


.imgdetailtitle {
   
   font-size:22px;
}

.imgdetailbtn {
    background-color: black;
    color: white;
    border-radius: 30px;
    outline: none;
	display:block;
	font-size:12px;
    margin:50px auto;
    padding:3px 8px 3px 8px; 
}

.top5div {
    background: url(../images/top5bgimg.png) no-repeat;
    width: 100%;
    height: 700px;
    z-index: 99;
    text-align: center;
    margin-top:-60px;
}

.top5title1 {
    padding-top: 130px;
    letter-spacing: 3px;
    font-size: 40px; 
}
.top5title2 {
    padding-top: 20px;
    font-size: 18px;
    color: #000000;
}

.top5imglist {
   width:80%;
   height:100px;
   margin:0 auto;
   margin-top:40px; 
   text-align:center;
}

.top5imgdiv {
   float:left;
   width:10%;
   margin-left:10px;
}

.top6div {
    background: url(../images/top6bgimg.png) no-repeat;
    width: 100%;
    height: 850px;
    z-index: 99;
    text-align: center;
    margin-top: -60px;
}
.top7div {
    background: url(../images/top7bgimg.png)  no-repeat;
    width: 100%;
    height: 720px;
    z-index: 99;
    text-align: center;
    margin-top: -60px;
    color:white;
}

.top7title1 {
    padding-top:  150px;
    letter-spacing: 3px;
    font-size: 40px;
}

.top7title2 {
    padding-top: 20px;
    font-size: 18px; 
}
.top7centerdiv {
    width: 80%; 
    margin: 0 auto;
    margin-top: 60px;
    height:100px;
}
.top7imglist {
    float: left; 
}

.top7imgdivlist {
    float: left;
    text-align: left; 
    width:26%;
    margin-left:80px;
}

.top7imglistTile1 {
    font-size: 25px;
    text-align: left;
    margin-left: 120px;
    margin-top:10px;
}

.top7imglistTile2 {
    font-size: 16px;
    text-align: left;
    margin-left: 120px;
    margin-top:10px;
}

.top8div {
    background: url(images/top6bgimg.png) no-repeat;
    width: 100%;
    height: 900px;
    z-index: 99;
    text-align: center;
    margin-top: -60px;
}

.top8imglist1 {
    text-align: center;
    margin: 0 auto;
    margin-top: 30px;
}



