div.carousel {
	position:relative;
}
div.carousel div.outer {
	position:relative;
	margin:0 30px;
	overflow:hidden;
}
div.carousel div.outer ul {
	position:absolute;
	display:table;
	-webkit-transform: translateZ(0);
}
div.carousel div.outer ul.inner li {
	display:table-cell;
	padding-right:6px;
}
div.carousel div.outer ul.inner li > span,
div.carousel div.outer ul.inner li > span > img {
	display:block;
}
div.carousel div.outer ul.inner li > span {
	text-decoration:none;
	background-color:hsla(0,0%,100%,0.5);
	/**/
	-webkit-transition-duration: 0.5s;
	-webkit-transition-timing-function:ease-in-out;
	transition-duration: 0.5s;
	transition-timing-function:ease-in-out;
	transition-property:opacity;
	opacity:0.3;
	/**/
}
div.carousel div.outer ul.inner li.yes > span {
	opacity:1;
}
div.carousel div.outer ul.inner li > span {
	position:relative;
	background-position:left top;
	background-size:cover;
}

@media all and (min-width: 768px) {
div.carousel {
	margin-bottom:30px;
}
div.carousel div.outer {
	height:342px;
}
div.carousel div.outer ul.inner li > span > img {
	width:520px;
	height:342px;
}
div.carousel-wide div.outer ul.inner li > span > img {
	width:684px;
}
}
@media all and (min-width: 375px) and (max-width: 767px) {
div.carousel {
	margin-bottom:20px;
}
div.carousel div.outer {
	height:159px;
}
div.carousel div.outer ul.inner li > span > img {
	width:242px;
	height:159px;
}
div.carousel-wide div.outer,
div.carousel-wide div.outer ul.inner li > span > img {
	height:121px;
}
}
@media all and (max-width: 374px) {
div.carousel {
	margin-bottom:10px;
}
div.carousel div.outer {
	height:134px;
}
div.carousel div.outer ul.inner li > span > img {
	width:204px;
	height:134px;
}
div.carousel-wide div.outer,
div.carousel-wide div.outer ul.inner li > span > img {
	height:102px;
}
}



/*	disc
============================== */
div.carousel ul.ctrl-disc {
	text-align:center;
	height:34px;
	/* background-color:hsla(0,0%,100%,0.5); */
}
div.carousel ul.ctrl-disc li {
	display:inline-block;
	width:24px;
	padding-top:9px;
}
div.carousel ul.ctrl-disc li a {
	display:inline-block;
	text-decoration:none;
	width:16px;
	height:16px;
	background-color:#fff;
	border-radius:8px;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
div.carousel ul.ctrl-disc li a.now {
	background-color:hsla(280,56%,59%,1);
}

/*	arrow
============================== */
div.carousel ul.ctrl-arrow li {
	position:absolute;
	top:50%;
	margin-top:-34px;
}
div.carousel ul.ctrl-arrow li.ctrl-lef {
	left:0;
}
div.carousel ul.ctrl-arrow li.ctrl-rig {
	right:0;
}
div.carousel ul.ctrl-arrow li a {
	display:block;
	position:relative;
	width:24px;
	height:68px;
	overflow:hidden;
}
div.carousel ul.ctrl-arrow li a:hover {
	/* background-color:#5e9aa9; */
}
div.carousel ul.ctrl-arrow li a span {
	display: inline-block;
	color: #fff;
	width: 20px;
	height: 20px;
	border: 3px solid hsla(280,56%,59%,1);
	border-left: 0;
	border-bottom: 0;
	/**/
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	/**/
	position: absolute;
	top: 50%;
	left: 50%;
}

div.carousel ul.ctrl-arrow li.ctrl-lef a span {
	transform: translate(-25%, -50%) rotate(-135deg);
}
div.carousel ul.ctrl-arrow li.ctrl-rig a span {
	transform: translate(-75%, -50%) rotate(45deg);
}
@media all and (min-width: 768px) {
}
@media all and (min-width: 375px) and (max-width: 767px) {
}
@media all and (max-width: 374px) {
}


@media print {
div.carousel {
	display:none;
}
}