@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);


.cb-slideshow{
	margin-bottom: 55px;
}
.cb-slideshow,
.cb-slideshow:after {
/*
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: -999;
*/
	position: relative;
	overflow:hidden;
	width: 100%;
	height: 580px;
	z-index: -999;
}
.cb-slideshow:after {
 	z-index:10;
	content: '';
}

/* 背景 */
.cb-slideshow li .backimg {
	z-index:10;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	color: transparent;
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: none;
	opacity: 0;
	z-index: 0;
	-webkit-backface-visibility: hidden;
	-webkit-animation: imageAnimation 54s linear infinite 0s;
	-moz-animation: imageAnimation 54s linear infinite 0s;
	-o-animation: imageAnimation 54s linear infinite 0s;
	-ms-animation: imageAnimation 54s linear infinite 0s;
	animation: imageAnimation 54s linear infinite 0s;
}
.cb-slideshow li:nth-child(1) .backimg {
	background-image: url(../content/slide/Slide-01.png) 
}
.cb-slideshow li:nth-child(2) .backimg {
	background-image: url(../content/slide/Slide-02.png);
	-webkit-animation-delay: 9s;
	-moz-animation-delay: 9s;
	-o-animation-delay: 9s;
	-ms-animation-delay: 9s;
	animation-delay: 9s;
}
.cb-slideshow li:nth-child(3) .backimg {
	background-image: url(../content/slide/Slide-03.png);
	-webkit-animation-delay: 18s;
	-moz-animation-delay: 18s;
	-o-animation-delay: 18s;
	-ms-animation-delay: 18s;
	animation-delay: 18s;
}
.cb-slideshow li:nth-child(4) .backimg {
	background-image: url(../content/slide/Slide-04.png);
	-webkit-animation-delay: 27s;
	-moz-animation-delay: 27s;
	-o-animation-delay: 27s;
	-ms-animation-delay: 27s;
	animation-delay: 27s;
}
.cb-slideshow li:nth-child(5) .backimg {
	background-image: url(../content/slide/Slide-05.png);
	-webkit-animation-delay: 36s;
	-moz-animation-delay: 36s;
	-o-animation-delay: 36s;
	-ms-animation-delay: 36s;
	animation-delay: 36s;
}
.cb-slideshow li:nth-child(6) .backimg {
	background-image: url(../content/slide/Slide-06.png);
	-webkit-animation-delay: 45s;
	-moz-animation-delay: 45s;
	-o-animation-delay: 45s;
	-ms-animation-delay: 45s;
	animation-delay: 45s;
}

/* キャッチコピー */
.cb-slideshow li .txtbox {
	z-index: 1;
	position: absolute;
	width: 100%;
	height: 580px;
	text-align: center;
	opacity: 0;
	color: #fff;
	-webkit-animation: titleAnimation 54s linear infinite 0s;
	-moz-animation: titleAnimation 54s linear infinite 0s;
	-o-animation: titleAnimation 54s linear infinite 0s;
	-ms-animation: titleAnimation 54s linear infinite 0s;
	animation: titleAnimation 54s linear infinite 0s; 
}
/* キャッチコピー：文字サイズ通常 */
.cb-slideshow li .txtbox .txt {
	position: absolute;
	margin: 0;
	width: 100%;
	top: calc(50% + 50px);
	left: 50%;
	-webkit-transform: translate(-50%, -50%); /* Safari用 */
	transform: translate(-50%, -50%);
	color: #fff;
}
.cb-slideshow li .txtbox .txt h3 {
	font-size: 52px;
	font-size: 5.2rem;
	font-weight:100;
	padding: 0;
	line-height: 110%;
	color: #fff;
	letter-spacing: 0.18em;
}
.cb-slideshow li .txtbox .txt h4{
	display: block;
	font-size: 28px;
	font-size: 2.8rem;
	font-weight:100;
	background-image: none;
	background: transparent;
	letter-spacing: 0.1em;
}
.cb-slideshow li .txtbox .txt h5{
	display: block;
	margin-top: 70px;
	font-size: 20px;
	font-size: 2.0rem;
	background-image: none;
	font-weight: 100;
	background: transparent;
	letter-spacing: 0.05em;
}

.cb-slideshow li:nth-child(2) .txtbox .txt {
	-webkit-animation-delay: 9s;
	-moz-animation-delay: 9s;
	-o-animation-delay: 9s;
	-ms-animation-delay: 9s;
	animation-delay: 9s;
}
.cb-slideshow li:nth-child(3) .txtbox .txt {
	-webkit-animation-delay: 18s;
	-moz-animation-delay: 18s;
	-o-animation-delay: 18s;
	-ms-animation-delay: 18s;
	animation-delay: 18s;
}
.cb-slideshow li:nth-child(4) .txtbox .txt {
	-webkit-animation-delay: 27s;
	-moz-animation-delay: 27s;
	-o-animation-delay: 27s;
	-ms-animation-delay: 27s;
	animation-delay: 27s;
}
.cb-slideshow li:nth-child(5) .txtbox .txt {
	-webkit-animation-delay: 36s;
	-moz-animation-delay: 36s;
	-o-animation-delay: 36s;
	-ms-animation-delay: 36s;
	animation-delay: 36s;
}
.cb-slideshow li:nth-child(6) .txtbox .txt {
	-webkit-animation-delay: 45s;
	-moz-animation-delay: 45s;
	-o-animation-delay: 45s;
	-ms-animation-delay: 45s;
	animation-delay: 45s;
}

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation { 
	0% {
		opacity: 0;
		-webkit-animation-timing-function: ease-in;
	}
	6% {
		opacity: 1;
		-webkit-transform: scale(1.05);
		-webkit-animation-timing-function: ease-out;
	}
	17% {
		opacity: 1;
		-webkit-transform: scale(1.1);
	}
	28% {
		opacity: 0;
		-webkit-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-moz-keyframes imageAnimation { 
	0% {
		opacity: 0;
		-moz-animation-timing-function: ease-in;
	}
	6% {
		opacity: 1;
		-moz-transform: scale(1.05);
		-moz-animation-timing-function: ease-out;
	}
	17% {
		opacity: 1;
		-moz-transform: scale(1.1);
	}
	28% {
		opacity: 0;
		-moz-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-o-keyframes imageAnimation { 
	0% {
		opacity: 0;
		-o-animation-timing-function: ease-in;
	}
	6% {
		opacity: 1;
		-o-transform: scale(1.05);
		-o-animation-timing-function: ease-out;
	}
	17% {
		opacity: 1;
		-o-transform: scale(1.1);
	}
	28% {
		opacity: 0;
		-o-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-ms-keyframes imageAnimation { 
	0% {
		opacity: 0;
		-ms-animation-timing-function: ease-in;
	}
	6% {
		opacity: 1;
		-ms-transform: scale(1.05);
		-ms-animation-timing-function: ease-out;
	}
	17% {
		opacity: 1;
		-ms-transform: scale(1.1);
	}
	28% {
		opacity: 0;
		-ms-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation { 
	0% {
		opacity: 0;
		animation-timing-function: ease-in;
	}
	6% {
		opacity: 1;
		transform: scale(1.05);
		animation-timing-function: ease-out;
	}
	17% {
		opacity: 1;
		transform: scale(1.1);
	}
	28% {
		opacity: 0;
		transform: scale(1.1);
	}
	100% { opacity: 0 }
}
/* Animation for the title */
@-webkit-keyframes titleAnimation { 
    0% { opacity: 1 }
    6% { opacity: 1 }
    17% { opacity: 1 }
    24% { opacity: 1 }
    100% { opacity: 1 }
}
@-moz-keyframes titleAnimation { 
    0% { opacity: 1 }
    6% { opacity: 1 }
    17% { opacity: 1 }
    24% { opacity: 1 }
    100% { opacity: 1 }
}
@-o-keyframes titleAnimation { 
    0% { opacity: 1 }
    6% { opacity: 1 }
    17% { opacity: 1 }
    24% { opacity: 1 }
    100% { opacity: 1 }
}
@-ms-keyframes titleAnimation { 
    0% { opacity: 1 }
    6% { opacity: 1 }
    17% { opacity: 1 }
    24% { opacity: 1 }
    100% { opacity: 1 }
}
@keyframes titleAnimation { 
    0% { opacity: 1 }
    6% { opacity: 1 }
    17% { opacity: 1 }
    24% { opacity: 1 }
    100% { opacity: 1 }
}

/* Show at least something when animations not supported */
.no-cssanimations .cb-slideshow li span{
	opacity: 1;
}
/*
@media screen and (max-width: 1140px) { 
	.cb-slideshow li div h3 { font-size: 100px }
}
@media screen and (max-width: 600px) { 
	.cb-slideshow li div h3 { font-size: 50px }
}
*/


@media (max-width: 1040px) {
	.cb-slideshow,
	.cb-slideshow:after {
		height: 550px;
	}
	.cb-slideshow li .txtbox .txt {
		top: calc(50% + 20px);
	}
	.cb-slideshow li .txtbox .txt h3 {
		font-size: 45px;
		font-size: 4.5rem;
	}
	.cb-slideshow li .txtbox .txt h4{
		font-size: 22px;
		font-size: 2.2rem;
	}
	.cb-slideshow li .txtbox .txt h5{
		margin-top: 150px;
		font-size: 16px;
		font-size: 1.6rem;
	}
}
@media (max-width: 769px) {
	.cb-slideshow,
	.cb-slideshow:after {
		height: 500px;
	}
	.cb-slideshow li .txtbox .txt {
		top: calc(50% - 0);
	}
	.cb-slideshow li .txtbox .txt h3 {
		font-size: 35px;
		font-size: 3.5rem;
	}
	.cb-slideshow li .txtbox .txt h4{
		font-size: 20px;
		font-size: 2.0rem;
	}
	.cb-slideshow li .txtbox .txt h5{
		margin-top: 80px;
		font-size: 14px;
		font-size: 1.4rem;
	}
}
@media (max-width: 550px) {
	.cb-slideshow,
	.cb-slideshow:after {
		height: 400px;
	}
	.cb-slideshow li .txtbox .txt {
		top: calc(50% - 40px);
	}
	.cb-slideshow li .txtbox .txt h3 {
		font-size: 25px;
		font-size: 2.5rem;
	}
	.cb-slideshow li .txtbox .txt h4{
		font-size: 16px;
		font-size: 1.6rem;
	}
	.cb-slideshow li .txtbox .txt h5{
		margin-top: 50px;
		font-size: 10px;
		font-size: 1.0rem;
	}
}