.juxtapose {
	font-family: Helvetica, Arial, sans-serif;
}
.jx-slider {
	/*width: 100%;*/
	height: 100%;
	position: relative;
	/*overflow: hidden;*/
	cursor: pointer;
	color: #f3f3f3;
}
.jx-handle {
	position: absolute;
	height: 100%;
	width: 40px;
	cursor: col-resize;
	z-index: 9;
	margin-left: -20px;
}


/*真ん中の線*/
.jx-control {
	height: 100%;
	margin-right: auto;
	margin-left: auto;
	width: 0px; /*3px*/
	background-color: currentColor;
}


/*真ん中の白いの*/
.jx-controller {
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	height: 60px;
	width: 0px; /*6px*/
	margin-left: -3px;
	background-color: currentColor;
}
.jx-arrow {
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	width: 0;
	height: 0;
	transition: all .2s ease;
}


/*三角の大きさ左*/
.jx-arrow.jx-left {
	left: -10px;
	border-style: solid;
	border-width: 15px 15px 15px 0;
	border-color: transparent currentColor transparent transparent;
}
/*三角の大きさ右*/
.jx-arrow.jx-right {
	right: -7px;
	border-style: solid;
	border-width: 15px 0 15px 15px;
	border-color: transparent transparent transparent currentColor;
}　
.jx-arrow.jx-left {
	left: 0px;
	top: 2px;
	border-style: solid;
	border-width: 0px 8px 8px 8px;
	border-color: transparent transparent currentColor transparent;
}　
.jx-arrow.jx-right {
	right: 0px;
	top: auto;
	bottom: 2px;
	border-style: solid;
	border-width: 8px 8px 0 8px;
	border-color: currentColor transparent transparent transparent;
}
.jx-handle:hover .jx-arrow.jx-left,
.jx-handle:active .jx-arrow.jx-left {
	left: -1px;
}
.jx-handle:hover .jx-arrow.jx-right,
.jx-handle:active .jx-arrow.jx-right {
	right: -1px;
}
/*追加指定*/
@media screen and (max-width: 600px){
.jx-arrow.jx-left{
	left: -7px;
border-width: 12px 12px 12px 0;
}
.jx-arrow.jx-right {
	right: -4px;
border-width: 12px 0 12px 12px;
}
}
@media screen and (max-width: 480px){
.jx-arrow.jx-left{
border-width: 12px 12px 12px 0;
}
.jx-arrow.jx-right {
border-width: 12px 0 12px 12px;
}
}
@media screen and (max-width: 360px){
.jx-arrow.jx-left{
	left: -4px;
border-width: 10px 10px 10px 0;
}
.jx-arrow.jx-right {
	right: -1px;
border-width: 10px 0 10px 10px;
}
}

.jx-image {
	position: absolute;
	height: 100%;
	display: inline-block;
	top: 0;
	overflow: hidden;
	-webkit-backface-visibility: hidden;
}
.jx-image img {
	height: 100%;
	width: auto;
	z-index: 5;
	position: absolute;
	margin-bottom: 0;
	max-height: none;
	max-width: none;
	max-height: initial;
	max-width: initial;
}


.jx-image.jx-left {
	left: 0;
	background-position: left;
}
.jx-image.jx-left img {
	left: 0;
}
.jx-image.jx-right {
	right: 0;
	background-position: right;
}
.jx-image.jx-right img {
	right: 0;
	bottom: 0;
}


/* Animation */
.jx-image.transition {
	transition: width .5s ease;
}
.jx-handle.transition {
	transition: left .5s ease;
}