/*動画を見るボタンをクリックするまで非表示*/
.video,.photo-btn {
	display: none;
}
/*スライドショーに関するCSSの記述*/
.slider-inner  li,.slider-inner-a li,.slider-inner-b li,.slider-inner02 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  li.show,.slider-inner02 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-inner li,.slider-inner02 li {
	margin-top: 125px;
	display: inline-block;
}

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

/*画像変更前は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 {
	max-width: 700px;
}
.slider-inner02 img {
	max-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;
}

/*動画,写真を見るボタンの位置設定*/
#video-photo-btn-pozi {
	margin-top: 30px;
}
.video-btn,.photo-btn {
	max-width: 120px;
	width: 120px;
	margin-top: 0;
	padding: 5px 20px
}

/*矢印のhover設定*/
.arrow-photo img:hover{
    opacity: 0.7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

/*右矢印*/
#arrow-next {
	float: right;
	margin-right: 220px;
	margin-top: 0;
}
/*左矢印*/
#arrow-prev {
	float: left;
	margin-left: 220px;
	margin-top: 0;
}
.mar-top-20{
	display: block;
	height: 20px;
}

/*写真カウンター*/
#counter,#counter02 {
	font-size: 18px;
	font-weight: 700;
	margin-top: 12px;
}
.arrow-photo img {
	width: 100px;
	padding: 0;
	margin: 0;
}

.text-red {
	width: 70vw;
	margin: 0 auto;
}
/*縦長の動画,写真を見るボタンの位置設定*/
#main-container-d .text-red {
	margin-top: 6vw;
	
}

/*800px以下のドットナビの高さ調整*/
@media screen and (max-width : 800px){
	/*画像のサイズ*/
	.slider-inner img,#chang-btn-vessel {
		width: 87vw;
		max-width: 700px;
	}
	.slider-inner02 img {
		width: 55vw;
		max-width: 500px;
	}
	/*ドットナビの高さ(三次元の場合は矢印の高さ調節用)*/
	.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-photo img {
		max-width: 100px;
		width: 20vw;
	}
	#video-photo-btn-pozi {
	margin-top: 4vw;
	}
	#arrow-next {margin-right: 20vw}
	#arrow-prev {margin-left: 20vw}
	/*写真カウンター*/
	#counter, #counter02 {margin-top: 1.5vw}
}
@media screen and (max-width : 700px){
	.slider .arrow-photo {margin-top: 1vw}
	#counter{margin-top: 2vw}
	#counter02{margin-top: 2vw}
	#arrow-next {margin-right: 16vw}
	#arrow-prev {margin-left: 16vw}
}
@media screen and (max-width : 600px){
	.slider .arrow-photo {margin-top: 2vw}
	#counter02{margin-top: 2.5vw}
	#arrow-next {margin-right: 14vw}
	#arrow-prev {margin-left: 14vw}

}
@media screen and (max-width : 500px){
	.slider .arrow-photo {margin-top: 3vw}
	#counter02{margin-top: 2vw}
	#arrow-next {margin-right: 12vw}
	#arrow-prev {margin-left: 12vw}
}
@media screen and (max-width : 400px){
	.slider .arrow-photo {margin-top: 4vw}
	#counter {margin-top: 1vw}
	#counter02{margin-top: 1.5vw}
	#arrow-next {margin-right: 10vw}
	#arrow-prev {margin-left: 10vw}
}