.banner { 
	position: relative; 
	overflow: auto; 
}
.banner li { 
	list-style: none; 
}

.dots{
	position: absolute;
	bottom:5px;
	width:100%;
	text-align: center;
}

.dots li{
	cursor: pointer;
	width:20px;
	height:20px;
	line-height: 20px;
	text-align: center;
	display: inline-block;
	color: #fff;
	border:#fff 1px solid;
	margin:5px;
	opacity: 0.75;
}

.dots li:hover{
	opacity: 1;
}
.dots li.active{
	background: #fff;
	color: #000;
}


#leftArrow{
	display: block;
}

#rightArrow{
	display: block;
}

#insideTitle{
	width:240px;
}

#frame{
	display: none !important;
}


@media screen and (min-width: 1200px) {

	#goback{
		position: absolute;
		background: #f3f5f5;
		color: #868686;
		padding: 5px 10px;
		bottom: -5px;
		right: -5px;
	}

	#wrapper{
		width:1150px;
		margin: 25px auto;
	}

	/*.wrapperHeight{
		height:593px;
	}*/

	#inside{
		position: relative;
		width:1100px;
		padding: 25px;
		background: #fff;
		overflow: hidden;
	}


	.insidePhoto{
		float: left;
		position: relative;
		float: left;
		width:810px;
		height:505px;
		margin-right:10px;
	}

	.banner div {
		width:810px; 
		height:505px;
		float: left; 
	}

	.insidePhoto img{
		width:810px;
	}

	#leftArrow{
		position: absolute;
		top:147px;
		left:10px;
		cursor: pointer;
	}

	#rightArrow{
		position: absolute;
		top:147px;
		left:510px;
		cursor: pointer;
	}

	#insideText{
		position: relative;
		float: left;
		width:1080px;
		margin-left:20px;
		color:#727776;
		padding: 35px 0;
	}

	#insideLeft{
		float: left;
		width:25%;
		height: 215px;
		margin-right: 10px;
		border-right:#727776 1px solid;
	}

	#title{
		width:100%;
		height:35px;
		font-size: 12pt;
	}

	#info{
		width:100%;
	}

	#info li{
		width:100%;
		height:25px;
	}

	#info li span{
		padding-right:10px;
		margin-right:10px;
		border-right:#727776 1px solid;
	}

	#text{
		width:48%;
		padding:0 1%;
		line-height: 20px;
		height:215px;
		overflow-y: auto; 
	}

	#insideTitle{
		position: absolute;
		top:25px;
		right:25px;
	}

	.other{
		float: left;
		width:280px;
		height:505px;
		overflow-y: hidden;
		overflow-x: hidden;
	}

	.other img{
		width:100%;
	}

	.other div{
		position: relative;
		float: left;
		width:270px;
		height:150px;
		cursor: pointer;
		overflow: hidden;
		-webkit-transition:0.3s;
		-moz-transition:0.3s;
		-o-transition:0.3s;
		transition:0.3s;
	}

	.other div:last-child{
		margin-right: 0px;
	}

	#frame{
		position: absolute;
		top:85px;
		right:20px;
		width:260px;
		height:170px;
		border:#eee 10px solid;
		box-shadow: 0 0 3px rgba(0,0,0,0.5;)
	}

	#insideTitleImg{
		float: left;
		width:20%;
		margin:0 25px 0 -20px;
	}

}




@media screen and (max-width: 1200px) and (min-width: 900px) {

	#goback{
		position: absolute;
		background: #f3f5f5;
		color: #868686;
		padding: 5px 10px;
		bottom: -5px;
		right: -5px;
	}

	#wrapper{
		width:880px;
		margin: 25px auto;
	}

	/*.wrapperHeight{
		height:593px;
	}*/

	#inside{
		position: relative;
		width:880px;
		padding: 25px;
		background: #fff;
		overflow: hidden;
	}


	.insidePhoto{
		float: left;
		position: relative;
		float: left;
		width:600px;
		height:405px;
		margin-right:10px;
	}

	.banner div {
		width:600px; 
		height:405px;
		float: left; 
	}

	.insidePhoto img{
		width:600px;
	}

	#leftArrow{
		position: absolute;
		top:147px;
		left:10px;
		cursor: pointer;
	}

	#rightArrow{
		position: absolute;
		top:147px;
		left:510px;
		cursor: pointer;
	}

	#insideText{
		position: relative;
		float: left;
		width:860px;
		margin-left:20px;
		color:#727776;
		padding: 35px 0;
	}

	#insideLeft{
		float: left;
		width:25%;
		height: 170px;
		margin-right: 10px;
		border-right:#727776 1px solid;
	}

	#title{
		width:100%;
		height:35px;
		font-size: 12pt;
	}

	#info{
		width:100%;
	}

	#info li{
		width:100%;
		height:25px;
	}

	#info li span{
		padding-right:10px;
		margin-right:10px;
		border-right:#727776 1px solid;
	}

	#text{
		width:48%;
		padding:0 1%;
		line-height: 20px;
		height:170px;
		overflow-y: auto; 
	}

	#insideTitle{
		position: absolute;
		top:25px;
		right:25px;
	}

	.other{
		float: left;
		width:270px;
		height:375px;
		overflow-y: hidden;
		overflow-x: hidden;
	}

	.other img{
		width:100%;
	}

	.other div{
		position: relative;
		float: left;
		width:260px;
		height:150px;
		cursor: pointer;
		overflow: hidden;
		-webkit-transition:0.3s;
		-moz-transition:0.3s;
		-o-transition:0.3s;
		transition:0.3s;
	}

	.other div:last-child{
		margin-right: 0px;
	}

	#frame{
		position: absolute;
		top:120px;
		right:20px;
		width:250px;
		height:170px;
		border:#eee 10px solid;
		box-shadow: 0 0 3px rgba(0,0,0,0.5;)
	}

	#insideTitleImg{
		float: left;
		width:20%;
		margin:0 25px 0 -20px;
	}

}



@media screen and (max-width: 900px) and (min-width: 480px) {

	/*#content{
		height:800px !important;
	}*/

	#goback{
		position: absolute;
		background: #f3f5f5;
		color: #868686;
		padding: 5px 10px;
		bottom: 15px;
		right: 15px;
	}

	#wrapper{
		margin:25px auto;
		width:460px;
	}


	#inside{
		width:410px;
		padding: 25px;
		background: #fff;
		overflow: hidden;
	}

	#insideImg{
		position: relative;
		float: left;
		width:410px;
		height:256px;
		text-align: center;
		overflow: hidden;
	}

	.insidePhoto{
		width:410px;
		height:256px;
	}

	.banner ul li {
		width:410px; 
		height:100%;
		float: left; 
	}


	.insidePhoto img{
		width:410px;
	}

	#leftArrow{
		position: absolute;
		top:106px;
		left:10px;
		cursor: pointer;
	}

	#rightArrow{
		position: absolute;
		top:106px;
		left:380px;
		cursor: pointer;
	}

	#insideText{
		float: left;
		width:410px;
		margin:25px;
		color:#727776;
	}

	#title{
		width:100%;
		height:35px;
		font-size: 12pt;
	}

	#info{
		float: left;
		width:360px;
		border-bottom:#727776 1px solid;
	}

	#info li{
		width:360px;
		height:25px;
	}

	#info li span{
		padding-right:10px;
		margin-right:10px;
		border-right:#727776 1px solid;
	}

	#text{
		float: left;
		width:360px;
		padding:15px 0;
		line-height: 20px;
	}

	#insideTitle{
		display: none;
		position: absolute;
		top:25px;
		right:25px;
	}

	.other{
		display: none !important;
	}

	#frame{
		display:none;
	}

	#insideTitleImg{
		display: none;
	}


}



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

	/*#goback{
		position: absolute;
		background: #f3f5f5;
		color: #868686;
		padding: 5px 10px;
		bottom: 15px;
		right: 15px;
	}*/

	div#backBTN {
		margin-top: 25px;
		float: right;
		padding: 5px 10px;
		width: 50px;
		background: #f3f5f5;
		color: #868686;
		height: 25px;
		line-height: 25px;
		text-align: center;
	}


	#content{
		margin:0 auto;
		width:100%;
		min-height:800px !important;
	}

	#wrapper{
		margin:25px 6%;
		width:88%;
		padding:10px 0;
	}


	#inside{
		width:88%;
		padding: 5px 6%;
		background: #fff;
		overflow: hidden;
	}

	#insideImg{
		position: relative;
		float: left;
		width:100%;
		height:auto;
		text-align: center;
		overflow: hidden;
	}

	.insidePhoto{
		width:100%;
		height:auto;
	}

	.banner ul li {
		width:100%; 
		height:100%;
		float: left; 
	}


	.insidePhoto img{
		width:100%;
	}

	#leftArrow{
		position: absolute;
		top:38px;
		left:10px;
		cursor: pointer;
	}

	#rightArrow{
		position: absolute;
		top:38px;
		left:170px;
		cursor: pointer;
	}

	#insideText{
		float: left;
		width:100%;
		margin:25px 0;
		color:#727776;
	}

	#title{
		width:100%;
		margin-bottom:25px;
		font-size: 12pt;
	}

	#info{
		float: left;
		width:100%;
		border-bottom:#727776 1px solid;
	}

	#info li{
		width:100%;
		height:25px;
	}

	#info li span{
		padding-right:10px;
		margin-right:10px;
		border-right:#727776 1px solid;
	}

	#text{
		float: left;
		width:100%;
		padding:15px 0;
		line-height: 20px;
	}

	#insideTitle{
		display: none;
		position: absolute;
		top:25px;
		right:25px;
	}

	.other{
		display: none!important;
	}

	.slick-prev, .slick-next{
		top:65% !important;
		display:none !important;
	}

	#frame{
		display:none !important;
	}

	#insideTitleImg{
		display: none;
	}


}


/* for ipad */
@media screen and (device-aspect-ratio: 3/4) {

	/*#content{
		height:800px !important;
	}*/

	#goback{
		position: absolute;
		background: #f3f5f5;
		color: #868686;
		padding: 5px 10px;
		bottom: 15px;
		right: 15px;
	}


	#wrapper{
		margin:25px auto;
		width:460px;
	}


	#inside{
		width:410px;
		padding: 25px;
		background: #fff;
		overflow: hidden;
	}

	#insideImg{
		position: relative;
		float: left;
		width:410px;
		height:256px;
		text-align: center;
		overflow: hidden;
	}

	.insidePhoto{
		width:410px;
		height:256px;
	}

	.banner ul li {
		width:410px; 
		height:100%;
		float: left; 
	}


	.insidePhoto img{
		width:410px;
	}

	#leftArrow{
		position: absolute;
		top:106px;
		left:10px;
		cursor: pointer;
	}

	#rightArrow{
		position: absolute;
		top:106px;
		left:380px;
		cursor: pointer;
	}

	#insideText{
		float: left;
		width:410px;
		margin:25px;
		color:#727776;
	}

	#title{
		width:100%;
		height:35px;
		font-size: 12pt;
	}

	#info{
		float: left;
		width:360px;
		border-bottom:#727776 1px solid;
	}

	#info li{
		width:360px;
		height:25px;
	}

	#info li span{
		padding-right:10px;
		margin-right:10px;
		border-right:#727776 1px solid;
	}

	#text{
		float: left;
		width:360px;
		padding:15px 0;
		line-height: 20px;
	}

	#insideTitle{
		display: none;
		position: absolute;
		top:25px;
		right:25px;
	}

	.other{
		display: none !important;
	}

	#frame{
		display:none;
	}

	#insideTitleImg{
		display: none;
	}


}


/* for iphone */
@media screen and (device-aspect-ratio: 40/71) {

	/*#goback{
		position: absolute;
		background: #f3f5f5;
		color: #868686;
		padding: 5px 10px;
		bottom: 15px;
		right: 15px;
	}*/

	div#backBTN {
		margin-top: 25px;
		float: right;
		padding: 5px 10px;
		width: 50px;
		background: #f3f5f5;
		color: #868686;
		height: 25px;
		line-height: 25px;
		text-align: center;
	}


	#content{
		margin:0 auto;
		width:100%;
		min-height:800px !important;
	}

	#wrapper{
		margin:25px 6%;
		width:88%;
		padding:10px 0;
	}


	#inside{
		width:88%;
		padding: 5px 6%;
		background: #fff;
		overflow: hidden;
	}

	#insideImg{
		position: relative;
		float: left;
		width:100%;
		height:auto;
		text-align: center;
		overflow: hidden;
	}

	.insidePhoto{
		width:100%;
		height:auto;
	}

	.banner ul li {
		width:100%; 
		height:100%;
		float: left; 
	}


	.insidePhoto img{
		width:100%;
	}

	#leftArrow{
		position: absolute;
		top:38px;
		left:10px;
		cursor: pointer;
	}

	#rightArrow{
		position: absolute;
		top:38px;
		left:170px;
		cursor: pointer;
	}

	#insideText{
		float: left;
		width:100%;
		margin:25px 0;
		color:#727776;
	}

	#title{
		width:100%;
		margin-bottom:25px;
		font-size: 12pt;
	}

	#info{
		float: left;
		width:100%;
		border-bottom:#727776 1px solid;
	}

	#info li{
		width:100%;
		height:25px;
	}

	#info li span{
		padding-right:10px;
		margin-right:10px;
		border-right:#727776 1px solid;
	}

	#text{
		float: left;
		width:100%;
		padding:15px 0;
		line-height: 20px;
	}

	#insideTitle{
		display: none;
		position: absolute;
		top:25px;
		right:25px;
	}

	.other{
		display: none!important;
	}

	.slick-prev, .slick-next{
		top:65% !important;
		display:none !important;
	}

	#frame{
		display:none !important;
	}

	#insideTitleImg{
		display: none;
	}


}