/*スライドショーに関するCSSの記述*/
.slider-inner li,.slider-inner02 li,.slider-inner-a  li,.slider-inner-b li {
	text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
	height: 100%;
    opacity: 0;
    -webkit-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -moz-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -o-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    pointer-events: none;
	list-style: none;
}
.slider-inner-a  li,.slider-inner-b li {margin-top: 134px}

.slider-inner  li.show,.slider-inner-a  li.show,.slider-inner-b  li.show {
	list-style: none;
	height: auto;
    opacity: 1;
    -webkit-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -moz-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    -o-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    z-index: 1;
    pointer-events: auto;
}

#dot-pozi,#dot-pozi2 {
	margin: 0 auto;
	width: 100%;
}

/*ドットナビの高さ(三次元の場合は矢印の高さ調節用)*/
.slider .dot-nav li {
	margin: 250px 20px 0 20px;
}
.slider .dot-nav-b li {
	margin: 285px 20px 0 20px;
}
.slider .dot-nav-c li {
	margin: 167px 20px 0 20px;
}	

.slider-inner li {
	margin-top: 125px;	/*横長画像の画像の高さ調節*/
	    display: inline-block;
}

.slider-inner02 li {
	margin-top: 105px;	/*縦長画像の画像の高さ調節*/
}
.yohaku-rb li {
	margin-top: 115px;	/*横長画像のルビ有画像の高さ調節*/
}
.yohaku-rb02 li {
	margin-top: 120px;	/*縦長画像のルビ有画像の高さ調節*/
}

/*画像変更前はslider-inner-bを消しておく*/
.slider-inner-b {
	display: none;
}
.slider .dot-nav li ,.slider .dot-nav-b li,.dot-nav-c li {
    display: inline-block;
	height: auto;
}
/*ドットナビ用*/
.dot-nav,.dot-nav-b,.dot-nav-c{
	list-style: none;
}


/*画像のサイズ*/
.slider-inner img {
	width: 700px;
	margin-top: -10px;
}
.slider-inner02 img {
	width: 500px;
}

/*矢印用CSS*/
#arrow-pozi {
	margin: 0 auto;
	max-width: 640px;
	width: 80vw;
	max-height: 70px;
	height: auto;
	border: #7F7F7F dashed 3px;
	border-radius: 10px;
	bottom: 0;
	margin-bottom: 50px;
}

.slider .arrow {
	width: auto;
    cursor: pointer;
    -webkit-transition: opacity 400ms;
    transition: opacity 400ms;
	margin-top: 8px;
}

.slider .arrow:hover {
    opacity: 0.7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

#arrow-prev {
	float: left;
	left: 180px;
	padding-left: 0;
	margin-left: 0;
}

#arrow-next {
	float: left;
	left: 260px;
	padding-right: 0;
	margin-right: 0;
}
.arrow img {width: 100px}

/*画像変更ボタンの位置調整*/
#chang-btn-vessel {
	max-width: 700px;
	width: 100vw;
	position: absolute;
	z-index: 2;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	margin-top: 1em;
}
#change-btn {
	position: absolute;
	top: 0;
	right: 0;
}

/*800px以下のドットナビの高さ調整*/
@media screen and (max-width : 800px){
	/*画像のサイズ*/
	.slider-inner img,#chang-btn-vessel {
		width: 87vw;
		max-width: 700px;
		margin-top: -12px;
	}
	.slider-inner02 img {
		width: 50vw;
		max-width: 500px;
		margin-top: -12px;
	}
	/*ドットナビの高さ(三次元の場合は矢印の高さ調節用)*/
	.slider .dot-nav li {margin: 63vw 1vw 0 1vw}
	.slider .dot-nav-b li {margin: 71vw 1vw 0 1vw}
	.slider .dot-nav-c li {margin: 31.5vw 1vw 0 1vw}
	#arrow-pozi {margin-top: 2vw}
	#arrow-prev {left: 22vw}
	#arrow-next {left: 29vw}
	.arrow img {
		max-width: 100px;
		width: 15vw;
	}
/*	.slider-inner li {margin-top: 145px}
*/
.slider-inner-a li,.slider-inner-b li {
	margin-top: 142px;
	max-width: 700px;
	}
	#chang-btn-vessel {margin-top: 22px;}
}
@media screen and (min-width : 700px){
	#arrow-pozi {margin-top: 1vw}
	.slider-inner li {margin-top: 140px}
	.slider-inner-a li,.slider-inner-b li {margin-top: 137px}	
	#chang-btn-vessel {margin-top: 18px}
}
@media screen and (max-width : 600px){
	#arrow-pozi {margin-top: 0vw}
/*	.slider-inner-a li,.slider-inner-b li {margin-top: 133px}*/	.slider .arrow {margin-top: 2vw}
	#chang-btn-vessel {margin-top: 15px}
}
@media screen and (max-width : 500px){
/*	.slider-inner li {margin-top: 138px}*/
	.slider .arrow {margin-top: 3vw}
	#chang-btn-vessel {margin-top: 14px}
}
@media screen and (max-width : 400px){
/*	.slider-inner li {margin-top: 136px}*/
	.slider-inner-a li,.slider-inner-b li {margin-top: 132px}	
	.slider .arrow {margin-top: 4vw}
	#chang-btn-vessel {margin-top: 7px}
}
@media screen and (max-width : 699px){
	.slider-inner img {
		margin-top: 0.3vw;
	}
}

