/*　スクロール
--------------------------------------------*/
.ccm-page .toppilescroll{
	position:absolute;
	height:auto;
	z-index:10;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
.ccm-page .toppilescroll img{
	width:100%;
	height:auto;
}
	.ccm-page .toppileimg{
	top:48%;
    }
.ccm-page .ccm-responsiveslider-container{
  position: relative;
}
.ccm-page .ccm-responsiveslider-text p{
	position:absolute;
	color:rgba(255,255,255,1);
	-webkit-text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
    -moz-text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
    -ms-text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
    -o-text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
    margin: 0;
    font-weight: bold;
}
.ccm-page .slides a:hover img{
	filter: alpha(opacity=100);
	-webkit-opacity: 1;
	-moz-opacity: 1;
	opacity: 1;
}
.ccm-page .slideshow_link{
	text-decoration:none;
	color: rgba(255,255,255,1);
	line-height:1.3;
	font-size:1.3rem;
	padding:8px 16px;
	position:absolute;
	bottom:24%;
	left:50%;
	-webkit-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);
	z-index:1;
}
.ccm-responsiveslider-container img{
  width: 100%;
    display: block;
    position: absolute;
    margin: auto;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.ccm-page .rslides li{
  height: 100%;
}
/*　スマホ（スマートフォン・タブレット）・タブレット用
---------------------------------------------------------------------*/
@media (max-width: 768px) {
  .ccm-page .rslides{
    height: 48vh;
  }
  .ccm-responsiveslider-container img{
    height: 100%;
    width: auto;
  }
  .ccm-page .slideshow_link{
    bottom:4%;
    left: 50%;
    font-size: 1rem;
  }
  .ccm-page .ccm-responsiveslider-text p{
    font-size:1.4rem;
    padding: 16px;
    bottom: 4%;
    left:0%;
    width:100%;
    text-align: center;
  }
    .ccm-page .toppilescroll{
    display: none;
  }
}
/*　パソコン用
---------------------------------------------------------------------*/
@media (min-width: 769px) {
  .ccm-page .rslides{
    height: 88vh;
  }
	.ccm-page .toppilescroll{
	width:8%;
	bottom:16%;
    }
  .ccm-page .ccm-responsiveslider-text p{
    font-size:2rem;
    top:24%;
    padding: 0 32px;
    left:8%;
    width: 72%;
    text-align: left;
  }
}