
.cimg{
width: 100%;
height: 510px;
background-color: #3c8ddc;
background-image: url("../img/topimg_l.jpg");
background-position: center 75%;
background-repeat: no-repeat;
background-size: cover;
overflow:hidden;
position:relative;
}

.ai1{
position:absolute;
top:0;
right:2500px;
width:400px;
height:520px;
background-color: #3c8ddc;
background-image: url("../img/slimg_1.jpg");
background-position: right top;
opacity:0;
-webkit-animation:mva 20s linear infinite;
animation:mva 20s linear infinite;
}
.ai2{
position:absolute;
top:0;
right:2500px;
width:400px;
height:520px;
background-color: #3c8ddc;
background-image: url("../img/slimg_2.jpg");
background-position: right top;
opacity:0;
-webkit-animation:mva 20s linear 5s infinite;
animation:mva 20s linear 5s infinite;
}



.ai3{
position:absolute;
top:0;
right:2500px;
width:400px;
height:520px;
background-color: #3c8ddc;
background-image: url("../img/slimg_3.jpg");
background-position: right top;
opacity:0;
-webkit-animation:mva 20s linear 10s infinite;
animation:mva 20s linear 10s infinite;
}
.ai4{
position:absolute;
top:0;
right:2500px;
width:400px;
height:520px;
background-color: #3c8ddc;
background-image: url("../img/slimg_4.jpg");
background-position: right top;
opacity:0;
-webkit-animation:mva 20s linear 15s infinite;
animation:mva 20s linear 15s infinite;
}

.ai1:before{
display:block;
content:"";
position:absolute;
top:0;
right:400px;
width:400px;
height:520px;
background-color: #3c8ddc;
background-image: url("../img/slimg_1.jpg");
}
.ai2:before{
display:block;
content:"";
position:absolute;
top:0;
right:400px;
width:400px;
height:520px;
background-color: #3c8ddc;
background-image: url("../img/slimg_2.jpg");
}
.ai3:before{
display:block;
content:"";
position:absolute;
top:0;
right:400px;
width:400px;
height:520px;
background-color: #3c8ddc;
background-image: url("../img/slimg_3.jpg");
}
.ai4:before{
display:block;
content:"";
position:absolute;
top:0;
right:400px;
width:400px;
height:520px;
background-color: #3c8ddc;
background-image: url("../img/slimg_4.jpg");
}


@-webkit-keyframes mva{
0%{left:2500px;opacity:0;}
7%{opacity:1;}
15%{left:50%;opacity:1;}
25%{left:50%;opacity:1;}
60%{left:-2500px;opacity:1;}
100%{left:-2500px;opacity:0;}
}
@keyframes mva{
0%{left:2500px;opacity:0;}
7%{opacity:1;}
15%{left:50%;opacity:1;}
25%{left:50%;opacity:1;}
60%{left:-2500px;opacity:1;}
100%{left:-2500px;opacity:0;}
}





header > h1{
font-size:180%;
width:960px;
margin: 0 auto;
padding: 15px 10px 13px;
box-sizing:border-box;
text-shadow:1px 1px 2px rgba(100,100,100,0.5);
}

.nvpd > ul > li {
display: inline-block;
width: auto;
background:#01a3c6;
}

.nvpd > ul li > a{
display: inline-block;
width:135px;
height:40px;
line-height:35px;
padding:5px;
text-align: center;
text-decoration: none;
font-size:15pt;
color:#FFF;
background:#01a3aa;
-webkit-transition:all 0.3s linear;
transition:all 0.3s linear;
position:relative;
}

.nvpd > ul li > span{
display: inline-block;
width:135px;
height:40px;
line-height:35px;
padding:5px;
text-align: center;
text-decoration: none;
font-size:15pt;
color:rgba(50,50,50,1);
background:#01a3aa;
position:relative;
}
.nvpd > ul li > span:before{
display:inline-block;
background-color:rgba(50,50,50,0.2);
width:135px;
height:40px;
position:absolute;
top:0px;
left:0px;
content:"";
}

.nvpd > ul li > a:before{
display:inline-block;
background-color:rgba(255,255,255,0.3);
width:0px;
height:40px;
position:absolute;
top:0px;
left:0px;
content:"";
-webkit-transform-origin:left center;
transform-origin:left center;
-webkit-transition:all 0.3s linear;
transition:all 0.3s linear;
}
.nvpd > ul li > a:hover:before{
width:135px;
}

article{
border: 1px solid #FFF;
width: 960px;
height: auto;
margin: 0 auto;
padding: 50px 0 0;
}

section{
padding: 0 0 40px;
}

.ctbx{
padding:10px 10px 0;
}
.ctbx p{
line-height:1.5;
margin:0 0 15px;
padding:0;
}

section > h2{
margin: 0 0 10px 0;
border-bottom: 3px solid #bbb;
color: #666;
font-size: 120%;
font-weight: bold;
}

.wnew > dt{
display:block;
margin:0 0 5px;
}
.wnew > dd{
display:block;
margin:0 0 15px 10px;
}

/* top bk block */

.top_bk{
border:2px solid #FFF;
text-align:center;
margin:15px 0 0;
}

.bkk{
display:inline-block;
width:400px;
background:rgba(255,255,255,0);
color:#FFF;
border:2px solid #DDD;
margin:0 0 10px;
border-radius: 10px;
font-size:150%;
padding:100px 30px;
box-sizing:border-box;
-webkit-transition:all 0.3s linear;
transition:all 0.3s linear;
text-shadow:
1px 0px rgba(0,0,0,1),
-1px 0px rgba(0,0,0,1),
0px 1px rgba(0,0,0,1),
0px -1px rgba(0,0,0,1),
0px 2px 4px rgba(0,0,0,1);
letter-spacing:2px;
line-height:120%;
overflow:hidden;
}

a:hover > .bkk{
background-color: #01a3c6;
color:#ffc60c;
box-shadow:inset 0px 300px rgba(255,255,255,0.7);
}

.bkk_bg_1{
background-image: url("../img/tbb_st.jpg");
}
.bkk_bg_2{
background-image: url("../img/tbb_ss.jpg");
}
.bkk_bg_3{
background-image: url("../img/tbb_pt.jpg");
}
.bkk_bg_4{
background-image: url("../img/tbb_ot.jpg");
}


footer{
width: 100%;
background-color: #01a3c6;
color: #fff;
text-align: center;
padding: 5px 0;
position: relative;
bottom: 0;
}
