.keyvisual
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}

.keyvisual .contentWrap
{
	flex-grow: 1;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-align-items: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	overflow: hidden;
	position: relative;
}

.keyvisual[class*="keyvisual-small"] .contentWrap
{
	min-height: 50vh;
}

.keyvisual[class*="keyvisual-medium"] .contentWrap
{
	min-height: 75vh;
}

.keyvisual[class*="keyvisual-fullHeight"] .contentWrap
{
	min-height: 100vh;
}

.keyvisual[class*="left"] .row
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-justify-content: flex-start;
	-ms-flex-pack: start;
	justify-content: flex-start;
}

.keyvisual[class*="right"] .row
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-justify-content: flex-end;
	-ms-flex-pack: end;
	justify-content: flex-end;
}

.keyvisual[class*="center"] .row
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.keyvisual[class*="top"] .contentWrap
{
	-webkit-align-items: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
}

.keyvisual[class*="middle"] .contentWrap
{
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
}

.keyvisual[class*="bottom"] .contentWrap
{
	-webkit-align-items: flex-end;
	-ms-flex-align: end;
	align-items: flex-end;
}

.keyvisual .contentHolder
{
	-webkit-flex-direction:column;
	-ms-flex-direction:column;
	flex-direction:column;
	width: 100%;
}

.keyvisual .imgFullCover
{
	position: absolute;
	width: 100%;
	top: 0;
}

.keyvisual .imgFullCover[class*="top"]
{
	background-position-y: top;
}

.keyvisual .imgFullCover[class*="middle"]
{
	background-position-y: center;
}

.keyvisual .imgFullCover[class*="bottom"]
{
	background-position-y: bottom;
}

.keyvisual .imgFullCover[class*="left"]
{
	background-position-x: left;
}

.keyvisual .imgFullCover[class*="center"]
{
	background-position-x: center;
}

.keyvisual .imgFullCover[class*="right"]
{
	background-position-x: right;
}

.keyvisual .contentOverlay
{
	-webkit-flex-grow: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	z-index: 1;
	position: relative;
}

.keyvisual .contentVideo
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	min-height: 100%;
}

.keyvisual .contentVideo::before
{
	position: relative;
	top: 0;
	left: 0;
	content: '';
	display: block;
	padding-top: calc(100% / 16 * 9);
}

.keyvisual .contentVideo iframe
{
	position: absolute;
	width: 100%;
	border: none;
	height: 100%;
	top: 0;
	left: 0;
}

.keyvisual .imgFullCover .image-caption,
.keyvisual .contentVideo .video-caption
{
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 20px 30px;
    background: rgba(30, 30, 30, 0.7);
    color: #FFFFFF;
}

@media (min-width: 768px)
{
	.keyvisual .contentVideo iframe.moreHeight
	{
		height: 100%;
		width: calc(100% / 9 * 16);
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="top"][class*="center"] iframe
	{
		left: 50%;
		transform: translateX(-50%);
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="top"][class*="right"] iframe
	{
		left: auto;
		right: 0;
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="middle"][class*="left"] iframe
	{
		transform: translateY(calc((50vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="middle"][class*="center"] iframe
	{
		left: 50%;
		transform: translate(-50%, calc((50vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="middle"][class*="right"] iframe
	{
		left: auto;
		right: 0;
		transform: translateY(calc((50vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="bottom"][class*="left"] iframe
	{
		transform: translateY(calc(50vh - 100%));
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="bottom"][class*="center"] iframe
	{
		left: 50%;
		transform: translate(-50%, calc(50vh - 100%));
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="bottom"][class*="right"] iframe
	{
		left: auto;
		right: 0;
		transform: translateY(calc(50vh - 100%));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="top"][class*="left"] iframe
	{
		transform: translateY(calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="top"][class*="center"] iframe
	{
		left: 50%;
		transform: translate(-50%, calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="top"][class*="right"] iframe
	{
		left: auto;
		right: 0;
		transform: translateY(calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="middle"][class*="left"] iframe
	{
		transform: translateY(calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="middle"][class*="center"] iframe
	{
		left: 50%;
		transform: translate(-50%, calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="middle"][class*="right"] iframe
	{
		left: auto;
		right: 0;
		transform: translateY(calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="bottom"][class*="left"] iframe
	{
		transform: translateY(calc(75vh - 100%));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="bottom"][class*="center"] iframe
	{
		left: 50%;
		transform: translate(-50%, calc(75vh - 100%));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="bottom"][class*="right"] iframe
	{
		left: auto;
		right: 0;
		transform: translateY(calc(75vh - 100%));
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="top"][class*="left"] iframe
	{
		transform: translateY(calc((100vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="top"][class*="center"] iframe
	{
		left: 50%;
		transform: translate(-50%, calc((100vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="top"][class*="right"] iframe
	{
		left: auto;
		right: 0;
		transform: translateY(calc((100vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="middle"][class*="left"] iframe
	{
		transform: translateY(calc((100vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="middle"][class*="center"] iframe
	{
		left: 50%;
		transform: translate(-50%, calc((100vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="middle"][class*="right"] iframe
	{
		left: auto;
		right: 0;
		transform: translateY(calc((100vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="bottom"][class*="left"] iframe
	{
		transform: translateY(calc(100vh - 100%));
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="bottom"][class*="center"] iframe
	{
		left: 50%;
		transform: translate(-50%, calc(100vh - 100%));
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="bottom"][class*="right"] iframe
	{
		left: auto;
		right: 0;
		transform: translateY(calc(100vh - 100%));
	}
}

@media screen and (-ms-high-contrast:none) and (min-width: 768px)
{
	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="middle"][class*="left"] iframe
	{
		transform: translateY(calc((50vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="middle"][class*="center"] iframe
	{
		transform: translate(-50%, calc((50vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="middle"][class*="right"] iframe
	{
		transform: translateY(calc((50vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="bottom"][class*="left"] iframe
	{
		transform: translateY(calc(50vh - 100%));
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="bottom"][class*="center"] iframe
	{
		transform: translate(-50%, calc(50vh - 100%));
	}

	.keyvisual[class*="keyvisual-small"] .contentVideo[class*="bottom"][class*="right"] iframe
	{
		transform: translateY(calc(50vh - 100%));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="top"][class*="left"] iframe
	{
		transform: translateY(calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="top"][class*="center"] iframe
	{
		transform: translate(-50%, calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="top"][class*="right"] iframe
	{
		transform: translateY(calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="middle"][class*="left"] iframe
	{
		transform: translateY(calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="middle"][class*="center"] iframe
	{
		transform: translate(-50%, calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="middle"][class*="right"] iframe
	{
		transform: translateY(calc((75vh - 100%) / 2));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="bottom"][class*="left"] iframe
	{
		transform: translateY(calc(75vh - 100%));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="bottom"][class*="center"] iframe
	{
		transform: translate(-50%, calc(75vh - 100%));
	}

	.keyvisual[class*="keyvisual-medium"] .contentVideo[class*="bottom"][class*="right"] iframe
	{
		transform: translateY(calc(75vh - 100%));
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="top"][class*="left"] iframe
	{
		transform: translateY(0);
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="top"][class*="center"] iframe
	{
		transform: translate(-50%, 0);
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="top"][class*="right"] iframe
	{
		transform: translateY(0);
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="middle"][class*="left"] iframe
	{
		transform: translateY(0);
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="middle"][class*="center"] iframe
	{
		transform: translate(-50%, 0);
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="middle"][class*="right"] iframe
	{
		transform: translateY(0);
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="bottom"][class*="left"] iframe
	{
		transform: translateY(0);
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="bottom"][class*="center"] iframe
	{
		transform: translate(-50%, 0);
	}

	.keyvisual[class*="keyvisual-fullHeight"] .contentVideo[class*="bottom"][class*="right"] iframe
	{
		transform: translateY(0);
	}
}
