@charset "UTF-8";
html,body{ height: 100%;  overflow: hidden;}
*{ margin: 0; padding: 0; color: #333333; font-family: "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei",Arial,sans-serif;
	transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
}
table{border-collapse:collapse;border-spacing:0;}
ol,ul{list-style:none; overflow: hidden;}
li{ float: left;}
img{ display: inline-block; border:0;}
a{ display: inline-block; color: inherit; text-decoration: none; outline: none; cursor: pointer;}
i{ display: inline-block; font-style: normal;}
input,button,textarea{ border: none; background: transparent; vertical-align:middle; outline: none;}
button{ cursor: pointer;}
button:hover{ opacity: 0.8;}
button:active{ opacity: 1;}

i.icon_20{ width: 20px; height: 20px; background-image: url(../images/icon_20.png);}
i.icon_40{ width: 40px; height: 40px; background-image: url(../images/icon_40.png);}
i.icon_60{ width: 60px; height: 60px; background-image: url(../images/icon_60.png);}
i.icon_80{ width: 80px; height: 80px; background-image: url(../images/icon_80.png);}
i.icon_100{ width: 100px; height: 100px; background-image: url(../images/icon_100.png);}

h1{ height: 60px; line-height: 60px; font-size: 24px;}
object{display: none; width: 0; height: 0;}

/*nav*/
.utcis_nav{ position: fixed; top: 0; left: -150px; width: 150px; height: 100%; background-color: #FFFFFF; background-color: rgba(0,0,0,0.1);}
.utcis_nav.show{ left: 0;}
.utcis_nav dl{ height: 100%; overflow: auto; text-align: center;}
.utcis_nav dt{ height: 60px; line-height: 60px; font-size: 24px; color: #FFFFFF;}
.utcis_nav dd{ position: relative; padding: 10px 0; cursor: pointer;}
.utcis_nav dd i{}
.utcis_nav dd span{ line-height: 30px; color: #FFFFFF;}
.utcis_nav dd:hover{ background: #30B5C1;}
.utcis_nav dd:hover span{ color: #FFFFFF;}
.utcis_nav dd.active{ background: #30B5C1;}
.utcis_nav dd.active span{ color: #FFFFFF;}
/*.utcis_nav dd.active::after{ content: ''; position: absolute; top: 50%; left: -20px; width: 0; height: 0; margin-top: -20px; border: 20px solid #30B5C1; border-left: none; border-top-color: transparent; border-bottom-color: transparent;}*/
.utcis_point{ position: fixed; top: 0; left: 20px; bottom: 0; width: 50px; margin: auto;}
.utcis_point dd{ position: relative; padding: 10px 0; padding-left: 10px; cursor: pointer;}
.utcis_point a{display: block; width: 11px; height: 11px; margin: 0px; border: 1px solid #FFFFFF; background-color: #666666; border-radius: 50%;}
.utcis_point a.active{ border-color: #FFFFFF; background-color: #FFFFFF;}


/*page*/
.utcis_page{ background-position: center; background-repeat: no-repeat; background-size: cover;}
.utcis_title{ padding: 20px 40px 0 40px; text-align: center;}
.utcis_title .title1{ line-height: 50px; font-size: 24px;}
.utcis_title .title2{ line-height: 30px;}
.utcis_next{ position: absolute; left: 50%; bottom: 20px; width: 100px; height: 40px; margin-left: -50px; font-size: 24px; background: #FFFFFF; background-color: rgba(255,255,255,0.5); border-radius: 2px; opacity: 0.8; cursor: pointer;}
.utcis_next.anime{
	animation: utcisnext 3s linear infinite;
}
@keyframes utcisnext
{
0%{ opacity: 1;}
20%{ opacity: 1;}
100%{ opacity: 0.2;}
}
.utcis_next:hover{ opacity: 0.8;}

/*����ƽ̨*/
.utcis_page.page1{ overflow: auto;}
.utcis_page.page1 .floatbox{}
.utcis_page.page1 .float{ width: 700px; margin: 0 auto; overflow: hidden;}
.utcis_page.page1 .float a{ display: block; float: left; width: 290px; height: 190px; margin: 30px;}
.utcis_page.page1 .float a:hover{ opacity: 0.8;}
.utcis_page.page1 .float img{ border-radius: 10px;}
.utcis_page.page1 .float .part{
	float: left;
	width: 290px;
	height: 190px;
	margin: 30px;
	background-color: #FFFFFF;
	border-radius: 10px;
}
.utcis_page.page1 .float .part .img{
	display: block;
	height: 80px;
	margin: 0 auto;
	margin-top: 20px;
}
.utcis_page.page1 .float .part .text{
	margin: 10px 0;
	text-align: center;
}
.utcis_page.page1 .float .part .btn{
	display: block;
	width: 120px;
	height: 30px;
	margin: 0 auto;
	color: #FFFFFF;
	background-color: #E64E4E;
	border-radius: 4px;
}
.utcis_page.page1 .mbfloatbox{ display: none;}
.utcis_page.page1 .mbfloatbox dd{
	width: 250px;
	max-width: 90%;
	margin: 0 auto;
	margin-bottom: 40px;
	background-color: #FFFFFF;
	border-radius: 10px;
}
.utcis_page.page1 .mbfloatbox img{
	display: block;
	width: 100%;
	border-radius: 10px;
}
.utcis_page.page1 .mbfloatbox button{
	width: calc(100% - 20px);
	margin: 10px;
	padding: 10px 0;
	color: #30B5C1;
	border: 2px solid #30B5C1;
	border-radius: 30px;
}
.utcis_page.page1 .mbfloatbox input{
	width: 0;
	height: 0;
}
.utcis_page.page1 .mbfloatbox .part{
	padding-top: 20px;
}
.utcis_page.page1 .mbfloatbox .part .img{
	display: block;
	width: 80px;
	height: 80px;
	margin: 0 auto;
	margin-top: 20px;
}
.utcis_page.page1 .mbfloatbox .part .text{
	margin: 10px 0;
	text-align: center;
}
@media screen and (max-width: 600px) {
.utcis_page.page1 .floatbox{ display: none;}
.utcis_page.page1 .mbfloatbox{ display: block;}
}

/*�б�ɼ�*/
.utcis_page.page2 .floatbox{
	transition: none;
	-moz-transition: none;
	-webkit-transition: none;
	-o-transition: none;
}
.utcis_page.page2 .float{ width: 1050px; margin: 0 auto; margin-top: 60px; overflow: hidden;}
.utcis_page.page2 .con{}
.utcis_page.page2 .text1{ font-size: 36px; color: #FFFFFF;}
.utcis_page.page2 .text2{ color: #FFFFFF;}
.utcis_page.page2 .enter{ width: 200px; height: 50px; margin-top: 50px; font-size: 18px; color: #FFFFFF; background-color: #30B5C1; border-radius: 2px;}

/*������Ͷ��*/
.utcis_page.page3 .floatbox{}
.utcis_page.page3 .float{ width: 1050px; margin: 0 auto; margin-top: 120px; overflow: hidden;}
.utcis_page.page3 .float>div{ float: left; width: 50%; text-align: center;}
.utcis_page.page3 .border{ width: 350px; height: 200px; margin: 0 auto; font-size: 18px; color: #FFFFFF; border: 2px solid #FFFFFF;}
.utcis_page.page3 i.icon_80{ margin: 30px 0 10px 0;}
.utcis_page.page3 .enter{ width: 200px; height: 50px; margin: 0 auto; margin-top: 30px; font-size: 18px; color: #FFFFFF; background-color: #30B5C1; border-radius: 2px;}

/*֪ʶ��*/
.utcis_page.page4 .floatbox{ text-align: center;}
.utcis_page.page4 .text{ margin-top: 100px; font-size: 36px; color: #FFFFFF; text-align: center;}
.utcis_page.page4 .enter button{ width: 250px; height: 60px; margin-top: 90px; font-size: 24px; color: #FFFFFF; background-color: #30B5C1; border-radius: 4px;}

/*��ǩ*/
.utcis_page.page5 .floatbox{}
.utcis_page.page5 .float>div{ float: left; width: 50%;}
.utcis_page.page5 .left img{ margin-top: 140px; margin-left: 160px;}
.utcis_page.page5 .right img{ margin-top: 100px;}
.utcis_page.page5 .enter{ width: 200px; height: 50px; margin-top: 80px; margin-left: 160px; font-size: 18px; color: #FFFFFF; background-color: #30B5C1; border-radius: 2px;}

/*��ҵչʾ*/
.utcis_page.page6 .floatbox{ height: calc(100% - 100px - 150px);}
.utcis_page.page6 .float{ height: 100%; margin: 0 150px; background: red; margin-top: 30px; overflow: hidden;}
.utcis_page.page6 .float>div{ float: left; width: 25%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; text-align: center;}
.utcis_page.page6 .float .bg{ height: 100%; background-color: rgba(0,0,0,0.5);}
.utcis_page.page6 .float>div:hover .bg{ background-color: rgba(0,0,0,0.2);}
.utcis_page.page6 .float img{ width: 100px; height: 100px; margin-top: 80px; background-color: #FFFFFF; border-radius: 50%; box-shadow: 0 0 0 20px rgba(255,255,255,0.3);}
.utcis_page.page6 .float span{ display: block; width: 80%; margin: 40px auto 40px auto; color: #FFFFFF;}
.utcis_page.page6 .float button{ width: 120px; height: 40px; color: #FFFFFF; background-color: #30B5C1; border-radius: 2px;}
.utcis_page.page6 .enter{ display: block; width: 200px; height: 50px; margin: 0 auto; margin-top: 30px; font-size: 18px; color: #FFFFFF; background-color: #30B5C1; border-radius: 2px;}

/*��ͼ*/
.utcis_page.page7{ position: relative; height: 100%; background-color: #373A44;}
.utcis_page.page7 .bg{ height: 100%; opacity: 0.5;}
.utcis_page.page7 .bg1{ position: absolute; top: -100%; left: -50%; right: -50%; bottom: 20%; margin: auto; background-color: rgba(255,255,255,0.05);
	transform: rotate(135deg);
}
.utcis_page.page7 .bg2{ position: absolute; top: -100%; left: -50%; right: -50%; bottom: 120%; margin: auto; background-color: rgba(255,255,255,0.05);
	transform: rotate(135deg);
}
.utcis_page.page7 .title{ position: absolute; top: 0; bottom: 0; left: 80px; width: 32%; height: 460px; margin: auto; background-color: rgba(0,0,0,0);}
.utcis_page.page7 .title .hint1{ font-size: 18px; color: #FFFFFF;}
.utcis_page.page7 .title .hint2{ line-height: 80px; font-size: 48px; color: #3399FF;}
.utcis_page.page7 .title .user{ width: 120px; height: 40px; margin-top: 20px; color: #FFFFFF; background-color: #3399FF; border-radius: 4px;}
.utcis_page.page7 .title .more{ width: 120px; height: 40px; margin-top: 20px; margin-left: 10px; color: #FFFFFF; border: 1px solid #30B5C1; background-color: #30B5C1; border-radius: 4px;}
.utcis_page.page7 .title a{ line-height: 30px; font-size: 14px; color: #FFFFFF;}
.utcis_page.page7 .con{ position: absolute; top: 0; right: 0; width: 60%; height: 100%;}
.utcis_page.page7 .con *{ cursor: auto;}
.utcis_page.page7 .title .icon{ float: left; width: 48px; height: 48px; line-height: 24px; margin-top: 20px; margin-right: 20px; padding: 16px; font-size: 18px; color: #FFFFFF; border: 2px solid #FFFFFF; text-align: center; border-radius: 50%; cursor: default;}
.utcis_page.page7 .title .icon:hover{ color: #3399FF; border-color: #3399FF; transform: scale(1.1);}
/*
.utcis_page.page7 .title .icon_40{ position: absolute; width: 40px; height: 40px; padding: 20px; color: #FFFFFF; border: 2px solid #FFFFFF; border-radius: 4px; text-shadow: none;}
.utcis_page.page7 .title .icon1{ top: 20px; right: 0px;}
.utcis_page.page7 .title .icon2{ top: 20px; right: 100px;}
.utcis_page.page7 .title .icon3{ top: 120px; right: 0px;}
.utcis_page.page7 .title .icon4{ top: 120px; right: 100px;}
.utcis_page.page7 .title .icon_40::after{ content: '?'; position: absolute; right: -10px; bottom: -10px; line-height: normal; font-size: 24px; color: #00E284;}
*/
/*foot*/
.utcis_foot{ padding-top: 50px; background-color: #505050;}
.utcis_foot.pos{ position: absolute; left: 0; bottom: 0; width: 100%;}
.utcis_foot .foot{ width: 1050px; margin: 0 auto;}
.utcis_foot .foot li{ width: 33.3%; margin-top: 30px; text-align: center;}
.utcis_foot .foot li i.icon_60{ float: left; margin-right: 10px;}
.utcis_foot .foot li span{ line-height: 30px; color: #FFFFFF;}
.utcis_foot .foot li>div{ display: inline-block; text-align: left;}
.utcis_foot .foot li a{ color: #FFFFFF;}
.utcis_foot .foot li a:hover{ text-decoration: underline;}
.utcis_foot .company{ height: 30px; line-height: 30px; margin-top: 30px; font-size: 14px; color: #999; text-align: center;}

@media(max-width: 360px){
	html,body{ height: auto;  overflow: visible;}
	.utcis_nav{ display: none;}
	
	.jy_screenbox .jy_page{ height: auto;}
	.utcis_next{ display: none;}
	.utcis_title .title1{ height: auto;}
	.utcis_title .title2{ height: auto;}
	
	.utcis_page.page1 .float{ width: 100%;}
	
	.utcis_page.page5 .float>div{ float: none; width: 100%;}
	.utcis_page.page5 .left img{ display: block; width: 80%; margin: 30px auto;}
	.utcis_page.page5 .left a{ display: block;}
	.utcis_page.page5 .enter{ display: block; margin: 30px auto;}
	.utcis_page.page5 .right img{ display: block; width: 80%; margin: 30px auto;}
	
	.utcis_page.page4 .text{ width: 60%; margin: 30px auto; text-align: center;}
	.utcis_page.page4 .enter button{ margin: 30px auto;}

	.utcis_foot.pos{ position: relative;}
	.utcis_foot .foot{ width: 100%;}
	.utcis_foot .foot li{ width: 100%;}
	.utcis_foot .foot li>div{ display: block; margin-left: 20px;}
}
@media(max-width: 360px){
	html,body{ height: 100%;}
	
	.utcis_title{ padding: 0px 20px;}
	.utcis_title .title1{ height: 30px; line-height: 30px; font-size: 18px;}
	.utcis_title .title2{ height: auto; line-height: normal; font-size: 14px;}
	
	/*����ƽ̨*/
	.utcis_page.page1 .float{ float: left; width: 50%; margin-top: 20px;}
	.utcis_page.page1 .float a{ width: 96%; height: auto; margin: 10px 2%;}
	.utcis_page.page1 .float img{ display: block; width: 100%;}
	
	/*��ͼ*/
	.utcis_page.page7 .title{ position: absolute; top: 50%; left: 10px; right: 10px; width: auto; height: 50%; margin: auto; background-color: rgba(0,0,0,0);}
	.utcis_page.page7 .title .user{ display: none;}
	.utcis_page.page7 .title .more{ display: none;}
	.utcis_page.page7 .con{ position: absolute; left: 0; width: auto; height: 50%;}
	
	/*��ǩ*/
	.utcis_page.page5 .floatbox{ height: 100%;}
	.utcis_page.page5 .float{ height: 100%;}
	.utcis_page.page5 .float>div{ float: none; width: 100%; height: 50%; overflow: hidden;}
	.utcis_page.page5 .left img{ width: 60%; margin: 40px auto;}
	.utcis_page.page5 .right img{ width: 80%; margin-top: 10%;}
	.utcis_page.page5 .enter{ margin-top: 80px; margin-left: 160px; margin: 0 auto;}

	.utcis_point{ display: none;}
}