﻿@charset "utf-8";
/* CSS Document */

/*yx_rotaion*/
.yx-rotaion{margin:0 auto;position: relative; overflow: hidden; width:100%;}

.yx-rotaion .rotaion_list img {
	-moz-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	height:430px;
	width:auto;
	object-fit:cover;

	}
	
.yx-rotaion .rotaion_list a {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	height: 100%;
	display: block;	
	-moz-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	}
.yx-rotaion .rotaion_list a:hover {
	
	-moz-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	transform:scale(1.05);
	}
	
.yx-rotaion .rotaion_list li{
	width: 572px;
	height: 100%
	}

.rotaion_list_hd{
	height:510px;
	}
.rotaion_list_hd li{
	width: 370px;
	height: 100%
	}
.rotaion_list_hd img{
    height:510px;
	width:auto;
	object-fit:cover;
	object-position:top;
	}
.rotaion_list_hd a{
    height:510px;
	display:inline-block;
	}
	
.yx-rotaion .rotaion_list img:hover {
	-moz-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	transform:scale(1.05);
	}
.yx-rotaion-btn,.yx-rotaion-title,.yx-rotation-focus,.yx-rotation-t,.yx-rotaion-btn{position:absolute}
.yx-rotation-title{
	position:absolute;
	width:100%;
	height:40px;
	line-height:40px;
	background:#000;
	filter:alpha(opacity=40);-moz-opacity:0.4;-khtml-opacity:0.4;opacity:0.4;
	left:0;
	bottom:0;
	z-index:1}
.yx-rotation-t{color:#fff;font-size:16px;font-family:microsoft yahei;z-index:2;bottom:0;left:10px;line-height:40px}
.yx-rotation-t:hover{
	font-weight:bold;
    color:#fff;
	}
.yx-rotation-focus span,.yx-rotaion-btn span{background:url(../images/ico.png) no-repeat;display:block;}
.yx-rotation-focus{height:40px;line-height:40px;right:20px;bottom:0;z-index:2}
.yx-rotation-focus span{width:12px;height:12px;line-height:12px;float:left;margin-left:5px;position:relative;top:14px;cursor:pointer;background-position:-24px -126px;text-indent:-9999px}
.yx-rotaion-btn{width:100%;height:41px;top:50%;margin-top:-20px;}
.yx-rotaion-btn span{width:41px;height:41px;cursor:pointer;filter:alpha(opacity=30);-moz-opacity:0.3;-khtml-opacity:0.3;opacity:0.3;position:relative}
.yx-rotaion-btn span::before{display:none}
.yx-rotation-focus span::before{display:none}

.yx-rotaion-btn .left_btn{background-position:-2px -2px;float:left;left:10px}
.yx-rotaion-btn .right_btn{background-position:-2px -49px;float:right;right:10px}
.yx-rotaion-btn span.hover{filter:alpha(opacity=80);-moz-opacity:0.8;-khtml-opacity:0.8;opacity:0.8}
.yx-rotation-focus span.hover{background-position:-10px -126px}
.rotaion_list{width:0;height:430px;overflow:hidden;}

@media screen and (max-width: 990px){
.yx-rotaion{
	margin:0 auto;
	position: relative; 
	overflow: hidden; 
	width:100%; 
	height: 60vw;
	}
.yx-rotaion .rotaion_list li{
	width: 100vw;
	height: 100%
	}
	}