.container{

	width:996px;

	margin:0 auto;

	position:relative;

	box-shadow: 0 0 32px 6px rgba(70%, 70%, 70%, 0.4);

}

.flex-control-nav li > a { text-align: center; background: #9a9a9a; }
.flex-control-nav li > a:hover { background:#fff; }
.flex-control-nav li > a.flex-active { background:#721f6e; }

.slider{

	background:url(../images/banner-bg.jpg) bottom left repeat-x #44033f;
	

}
section{
	position:relative;
}
section .tab{
	position:absolute;
	top:37px;
	left:0;
	z-index:999;
}
.slides img{

	float:left;

}

.slides > li{

	position:relative;

}
/*
.slides > li > a > div{

	width:28%;
	
	word-wrap:break-word;	

	color:#fff;

	position:absolute;

	right:12px;	

	bottom:top;	

	padding:16px;	
	font-size: 2.2em;	

}
*/
.main{

	background:#dcdcdc;

	padding:30px;

	margin-bottom:50px;

}

.main > div{

	margin-bottom:30px;

	width:100%;

	float:left;

	background:#fff;

	-moz-border-radius:20px;

	-webkit-border-radius:20px;

	border-radius:20px;

	padding:30px 80px;

	font-weight: bold;

	color:#000;

}

.main > .announcement{

	-moz-border-radius:20px;

	-webkit-border-radius:20px;

	border-radius:20px;

	border:2px solid #721f6e;

	padding:0 !important;

	font-size:15px;

	line-height:26px;
	margin-bottom:0;
}
.main hr{
	width:98%;
	float:right;
	margin:5px 1% 30px;
	height:2px;
	border:0;
	background:#721f6e;
}
.main > .announcement > div{
	width:90%;
	float:left;
	padding:0 10px;
}
.main > .announcement > div:first-child{
	background:#721f6e;
	color:#fff;
	-moz-border-radius:8px 0 0 8px;
	-webkit-border-radius:8px 0 0 8px;
	border-radius:8px 0 0 8px;
	display:inline-block;
	padding:0;
	font-weight:400;
	text-align:center;
	width:10%;
	float:left;

}



h2,
.heading{

	width:100% !important;

	float:left;

	font-size:30px;

	text-align:center;

	color:#555;

}
.heading{
    padding: 0 !important;
}

.main > div ul{

	width:90%;

	float:left;

	margin-left:25px;

	padding:20px 0;

	position:relative;

}

.main > div li{

	width:100%;

	float:left;

	list-style:disc;

	color:#555;

	line-height:24px;

}

.main > div li a:hover{

	text-decoration:underline;	

}

.main > div ul > a{

	position:absolute;

	right:0;

	bottom:20px;

	width:auto;

	display:block;

	background:#888;

	color:#fff;

	padding:2px 5px;

	font-size:12px;

	z-index: 999;

}

.main > div > div{

	width:50%;

	float:left;

	padding:30px 10px ;

}

.main > div > div > div:last-child{

	padding:0 5px 0 15px;

}

.main > div > div > div > p{

	width:100%;

	float:left;

	line-height:22px;

}

.main > div > div > div > p:first-child{

	padding-bottom:7px;

	line-height:26px;

}
.main > div > div > div > p.padd{
	padding-bottom:33px;	/*35px*/
}

.main > div > div > div > p:first-child a{
	color: #000;
}
.main > div > div > div > p:first-child a:hover{
	color: #721f6e;
	text-decoration: underline;
}
.main > div > div > div > p:nth-child(2) a{

	width:auto;

	display: inline-block;

	float:right;

	background:#888;

	color:#fff;

	padding:0 5px;

	font-size:12px;

}

.main > div > div.video{
	position:relative;
}
.main > div > div.video > div > p{
	padding:0 0 0 20px;
}
.main > div > div.video > div > p:first-child{
	padding-bottom:7px;
	line-height:26px;
}
.main > div > div.video a{
	width:auto;
	display: inline-block;
	float: left;
	background:#555;
	color:#fff;
	padding:0 5px;
	font-size:12px;
	position:absolute;
	bottom:35px;
	right:10px;
	line-height:22px;
}

iframe{

	width:100%;

}

#flexiselDemo2 > li > div{

	width:100%;

	float:left;

	padding:0 10px 0;

}
#flexiselDemo2 a:hover{
    opacity: .8;
}
#flexiselDemo2 a img{

	width:100%;

	margin-bottom:-7px;

}

#flexiselDemo2 a p{

	width:100%;

	float: left;

	position:relative;

	background:#721f6e;

	padding:30px 20px 90px;

	color:#fff;

	font-size:14px;

	text-align:left;

}
#flexiselDemo2 a p .more{

	position:absolute;

	right:20px;

	bottom:20px;

	width:auto;

	display:block;

	border:1px solid #fff;

	color:#fff;

	padding:2px 5px;

	font-size:12px;
    margin: 0;
    height: auto;

}
/*
#flexiselDemo2 p a{

	position:absolute;

	right:20px;

	bottom:20px;

	width:auto;

	display:block;

	border:1px solid #fff;

	color:#fff;

	padding:2px 5px;

	font-size:12px;

}

#flexiselDemo2 p a:hover{

	border:1px solid #feffca;

	color:#feffca;

}
*/

.link{

	background:#dcdcdc;

	margin-top:20px;

}

.link .nbs-flexisel-container{

	padding:20px 0 0;

}

.link img{

	border-bottom:3px solid #721f6e;

}

.link .nbs-flexisel-nav-left {

	background: url(../images/prevArrow01.png) no-repeat center center;

	left:10px;

	width:22px;

}

.link .nbs-flexisel-nav-right{

	background: url(../images/nextArrow01.png) no-repeat center center;

	right:10px;

	width:22px;

}

.icon{

	background:#721f6e;

	padding:70px 50px;

}

.icon > div{

	width:25%;

	float:left;

	text-align:center;

}

.icon > div > p,

.icon > div > a {

	font-size:16px;

	color:#fff;

	width:100%;

	float:left;

	padding-top:10px;

}

.icon > div > a:hover { color: #aaa }
#flexiselDemo2 > li > div p > span{
	height:40px;
	display:inline-block;
}

.slideText {
		position: relative;
		overflow: hidden;	/* 超出範圍的部份要隱藏 */
		width: 100%;
		height: 26px;
	}
	.slideText ul, .slideText li {
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
		width: 100% !important;
	}
	.slideText ul {
		position: absolute;
	}
	.slideText ul li a {
		display: block;
		overflow: hidden;	/* 超出範圍的部份要隱藏 */
		height: 26px;
		line-height: 25px;
		text-decoration: none;
		color:#721f6e;
	}
	.slideText ul li a:hover {
		color:#000;
	}


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

.container{

	width:960px;

}
.main > div{
	padding: 30px 60px;
}
.slides > li > a > div{
	width:19%;

}



}



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

.container{

	width:750px;

}
.main > div{
	padding: 30px 30px;
}
.main [class^='width-']{
	width:100% !important;
}
.main .width-28{
	text-align:center;
}
.main > div > div > div:last-child {
    padding: 0 10px 0 0;
}
.main iframe{
	margin-bottom:20px;
}
.main > div > div > div > p a{
	margin-left:10px;
	float:none;
}
.main > div > div.video > div > p{
	padding:0;
}
.main > div > div.video a{
	bottom:0;
	right:10px;
}
.main > div > div > div > p:first-child{
	padding-top:5px;
}

.icon > div > a p,
.icon > div > a {
	font-size:15px;
	color:#fff;
	width:100%;
	float:left;
	padding-top:10px;
}
.icon > div > a img{
	width:70px;
}
.icon{
	padding: 50px;
}
.slides > li > a > div{
	width:100%;
	position:relative;
	right:0;
	bottom:0;
	padding:10px;
	float:left;
	font-size: 30px;
	color: #fff;
}
}



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

.container{
	width:95%;

}
.main > .announcement > div{
	width:85%;
}
.main > .announcement > div:first-child{
	width:15%;

}
.flexslider {
    min-height: 100px;
}
.flex-control-nav {
    bottom: 4px; right:8px; text-align: right; /*40px*/
}

}

@media only screen and (max-width: 656px){
.main > div > div > div > p.padd{
	padding-bottom:7px;
}

}


@media only screen and (max-width: 580px){
.main > div > div{
	width:100%;
}
.main > div > div br{
	display:none;
}
.main > div ul > a{
	bottom:-5px;
}
.icon{
	padding: 50px 50px 30px;
}
.icon > div{
	width:50%;
	padding-bottom:40px;
}
.main > .announcement > div{
	width:80%;
}
.main > .announcement > div:first-child{
	width:20%;

}

}

@media only screen and (max-width: 400px){
#flexiselDemo2 > li > div p > span{
	height: auto;
}
.main > .announcement > div{
	width:70%;
}
.main > .announcement > div:first-child{
	width:30%;

}

}
@media only screen and (max-width: 370px){
.icon > div{
	width:100%;
}

}