@charset "UTF-8";
/*---------------
 	PC&SP
---------------*/
.scroll_fix {
	position: absolute;
}
.scroll_fix.fixed {
	position: fixed;
	top: 0;
}
.s5_category {
	z-index:10;
}
.s5_omosiroikoto a.link {
	color: #333;
}
.s5_omosiroikoto .is_blue a.link,
.s5_omosiroikoto a.link:hover {
	color: #2F5883;
}
.s5_omosiroikoto a:hover img {
	opacity: 1;
}
.is_gray .link {
	color: #B5B5B6;
}
.is_gray .txt {
	color: #B5B5B6;
}
.btnshine{
	position: relative;
	display:inline-block;
	background: #333;
	color: #fff;
	text-decoration: none;
	outline: none;
	overflow: hidden;
}
.btnshine:hover img {
	opacity:1;
}
.btnshine::before {
	content: '';
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
	transform: skewX(-25deg);
}
.btnshine:hover::before {
	animation: shine 3.5s infinite;
}
@keyframes shine {
	20% {
		left: 125%;
	}
	20.001% {
		left: -75%;
	}
	100% {
		left: -75%;
	}
}
.btnshine_roop {
	position: relative;
	display:inline-block;
	background: #fff;
	color: #fff;
	text-decoration: none;
	outline: none;
	overflow: hidden;
}
.btnshine_roop:hover img {
/*	opacity:1;*/
}
.btnshine_roop::before {
	content: '';
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
	transform: skewX(-25deg);
	animation: shineroop 3.5s infinite;
}
@keyframes shineroop {
	20% {
		left: 125%;
	}
	20.001% {
		left: -75%;
	}
	100% {
		left: -75%;
	}
}
/*---------------
 	PC
---------------*/
@media screen and (min-width:751px) {
	.pc_none {
		display: none;
	}
	.sp_none {
		display: block;
	}
	.br_sp,
	.br_pcnone,
	.br_pc_none {
		display: none;
	}
	.br_pc,
	.br_spnone,
	.br_sp_none {
		display: inline-block;
	}
	.header_top,
	.s5_category,
	.s5_category .list .item,
	.s5_category .list .item:nth-child(1) {
		border-color: #ccc;
	}
	.header_top .inner {
		width: 1020px;
	}
	.txt_box .pc_tsume {
		padding-top: 0;
	}
	/*---------------
	 	footer
	---------------*/
	.footer .flex {
		align-items: center;
		justify-content: center;
	}
	.footer .inner {
		flex-direction: row-reverse;
	}

	/*---------------
	  movie
	---------------*/
	.movie {
		min-width: 1160px;
		padding-bottom: 100px;
		background: url(../../img/bg.png) center center no-repeat;
		background-size: 100% 100%;
	}
	.movie .head {
		display: flex;
		align-items: center;
		min-width: 1160px;
		margin: 0 auto;
	}
	.movie .head .movie-logo {
		width: 465px;
		margin: 0 auto 0 0;
	}
	.movie .head .movie-txt {
		flex: 1;
		padding: 0 0 80px 50px;
	}
	.movie .head .movie-txt p {
		color: #fff;
		line-height: 2.4;
	}
	.movie .head .movie-txt p a {
		color: #fff;
		text-decoration: underline;
	}
	.movie .foot .txt {
		margin-bottom: 30px;
	}
	.movie .foot .txt p {
		color: #fff;
		font-size: 1.8rem;
		text-align: center;
		line-height: 1.5;
	}
	.movie .foot .btn a {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 260px;
		height: 75px;
		margin: 0 auto;
		background: #fff;
		border: 2px solid #1d50a2;
		border-radius: 130px;
		font-size: 2.0rem;
		text-align: center;
		font-weight: 500;
		text-decoration: none;
		transition: background 0.2s, color 0.2s;
	}
	.movie .foot .btn a:hover {
		background: #1d50a2;
		color: #fff;
	}
	.movie .foot .btn a span {
		position: relative;
		padding: 0 15px;
	}
	.movie .foot .btn a span::after {
		content: '';
		position: absolute;
		top: 50%;
		right: 0;
		width: 10px;
		height: 10px;
		border-width: 2px 2px 0 0;
		border-style: solid;
		border-color: #1d50a2 #1d50a2 transparent transparent;
		transform: translateY(-50%) rotate(45deg);
		transition: border 0.2s;
	}
	.movie .foot .btn a:hover span::after {
		border-color: #fff #fff transparent transparent;
	}
	
	.videos {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 1160px;
		margin: 0 auto 50px;
		padding: 0 0 50px;
	}
	.videos .videos-stitle {
		width: 100%;
		margin: 120px 0 40px;
	}
	.videos .videos-stitle:first-of-type {
		margin-top: -35px;
	}
	.videos .videos-stitle>span{
		display: block;
		width: 480px;
		margin: 0 auto;
	}
	.videos>.videoItem {
		display: flex;
		justify-content: center;
		position: relative;
		z-index: 0;
		width: 580px;
		margin: 0;
		background: center top no-repeat;
		background-size: 100%;
	}
	.videos>.videoItem::before {
		content: '';
		padding-bottom: 90%;
	}
	.videos>.videoItem::after {
		content: '';
		position: absolute;
		z-index: -1;
		width: 100%;
		margin-top: 0;
		padding-bottom: 100%;
		background: center center no-repeat;
		background-size: 100%;
	}
	.videos>.videoItem.type03::after {
		background-image: url(../../img/video_bg03.svg);
	}
	.videos>.videoItem.type02::after {
		background-image: url(../../img/video_bg02.svg);
	}
	.videos>.videoItem.type01::after {
		background-image: url(../../img/video_bg01.svg);
	}
	.videos>.videoItem.type04::after {
		background-image: url(../../img/video_bg04.svg);
	}
	.videos>.videoItem>div {
		position: relative;
		width: 475px;
	}
	.videos>.videoItem>div>p {
		color: #fff;
		text-align: right;
		font-size: 1.4rem;
		line-height: 1;
	}
	.videos>.videoItem .videoBody {
		margin-bottom: 14px;
	}
	.videos>.videoItem .videoBody img {
		display: block;
	}
	.videos>.videoItem .videoBody a {
		display: block;
	}
	.videos>.videoItem .videoBody a figure {
		position: relative;
		overflow: hidden;
	}
	.videos>.videoItem .videoBody a figure img {
		display: block;
		margin: -9.4% 0;
	}
	.videos>.videoItem .videoBody a figure>span {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		width: 100%;
		height: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
			-ms-flex-pack: center;
				justify-content: center;
		-webkit-box-align: center;
			-ms-flex-align: center;
				align-items: center;
	}
	.videos>.videoItem .videoBody a figure>span::after {
		content: "";
		display: block;
		width: 68px;
		height: 48px;
		background-image: url("../../img/youtube_play_icon/yt_icon_mono_light_min.png");
		background-repeat: no-repeat;
		background-size: 100% auto;
		opacity: 0.9;
		-webkit-transition: 0.1s ease-out;
		-o-transition: 0.1s ease-out;
		transition: 0.1s ease-out;
	}
	.videos>.videoItem .videoBody a:hover figure>span::after {
		background-image: url("../../img/youtube_play_icon/yt_icon_rgb_min.png");
		opacity: 1.0;
	}
	.videos>.videoItem.videoCenter {
		margin: 0 auto;
	}

	/*---------------
	  movie_special
	---------------*/
	.movie_special {
		padding-top: 90px;
		padding-bottom: 170px;
	}
	.movie_special .inner {
		width: 900px;
	}
	.movie_special .inner .head {
		margin-bottom: 60px;
	}
	.movie_special .list {
		margin-top: 25px;
		display: flex;
		justify-content: space-between;
		align-items: stretch;
	}
	.movie_special .list .item {
		font-family: '游ゴシック体', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
		max-width: 200px;
	}
	.movie_special .list .link {
		display: block;
	}
	.movie_special .list .link:hover + .tit {
		opacity: .8;
	}
	.movie_special .list .tit {
		display: block;
		margin-top: 15px;
		font-weight: bold;
		text-align: center;
		cursor: pointer;
	}
	.movie_special .list .txt {
		font-size: 14px;
		line-height: 1.8em;
	}
}
/*---------------
 	SP
---------------*/
@media screen and (max-width: 750px) {
	/* スクロールバー消す */
	html {
		overflow: scroll;
		-ms-overflow-style: none;
		scrollbar-width: none;
	}
	html::-webkit-scrollbar {
		display:none;
	}
	.pc_none {
		display: block;
	}
	.sp_none {
		display: none;
	}
	.br_sp,
	.br_pcnone,
	.br_pc_none {
		display: inline-block;
	}
	.br_pc,
	.br_spnone,
	.br_sp_none {
		display: none;
	}
	.header_top .clearfix::after {
	    content: none;
	}
	.inner {
		/*width: auto;*/
	}
	.header .inner {
		width: 81%;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.header .season5 {
		border-bottom: 1px solid #777;
		line-height: 1;
	}

	/*---------------
	  movie
	---------------*/
	.movie {
		padding-bottom: 60px;
		background: url(../../img/bg.png) center center no-repeat;
		background-size: 100% 100%;
	}
	.movie .head .movie-logo {
		width: 96%;
		margin: 0 auto 0 0;
	}
	.movie .head .movie-txt p {
		color: #fff;
		text-align: center;
		line-height: 2.8;
	}
	.movie .head .movie-txt p a {
		color: #fff;
		text-decoration: underline;
	}
	.movie .foot .txt {
		margin-bottom: 20px;
	}
	.movie .foot .txt p {
		color: #fff;
		font-size: 1.6rem;
		text-align: center;
		line-height: 1.5;
	}
	.movie .foot .btn a {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 260px;
		height: 75px;
		margin: 0 auto;
		background: #fff;
		border: 1px solid #1d50a2;
		border-radius: 130px;
		font-size: 2.0rem;
		text-align: center;
		font-weight: 500;
		text-decoration: none;
	}
	.movie .foot .btn a span {
		position: relative;
		padding: 0 15px;
	}
	.movie .foot .btn a span::after {
		content: '';
		position: absolute;
		top: 50%;
		right: 0;
		width: 10px;
		height: 10px;
		border-width: 2px 2px 0 0;
		border-style: solid;
		border-color: #1d50a2 #1d50a2 transparent transparent;
		transform: translateY(-50%) rotate(45deg);
	}
	
	.videos {
		/*width: 93.334%;
		margin: 0 auto;*/
		padding: 0 0 10%;
	}
	.videos .videos-stitle {
		width: 81.334%;
		margin: 18% auto 5%;
	}
	.videos>.videoItem {
		display: flex;
		justify-content: center;
		position: relative;
		z-index: 0;
		margin: 0 0 10%;
	}
	.videos>.videoItem::before {
		content: '';
		padding-bottom: 102%;
	}
	.videos>.videoItem::after {
		content: '';
		position: absolute;
		z-index: -1;
		width: 100%;
		margin-top: 8%;
		padding-bottom: 100%;
		background: center center no-repeat;
		background-size: 100%;
	}
	.videos>.videoItem:nth-of-type(4n+1)::after {
		background-image: url(../../img/video_bg03.svg);
	}
	.videos>.videoItem:nth-of-type(4n+2)::after {
		background-image: url(../../img/video_bg02.svg);
	}
	.videos>.videoItem:nth-of-type(4n+3)::after {
		background-image: url(../../img/video_bg01.svg);
	}
	.videos>.videoItem:nth-of-type(4n+4)::after {
		background-image: url(../../img/video_bg04.svg);
	}
	.videos>.videoItem>div {
		position: relative;
		width: 81.334%;
	}
	.videos>.videoItem a {
		display: block;
	}
	.videos>.videoItem>div>p {
		color: #fff;
		text-align: right;
		font-size: 1.2rem;
		line-height: 1;
	}
	.videos>.videoItem .videoBody {
		margin-bottom: 10px;
	}
	.videos>.videoItem .videoBody img {
		display: block;
	}
	.videos>.videoItem .videoBody a figure {
		position: relative;
		overflow: hidden;
	}
	.videos>.videoItem .videoBody a figure>img {
		display: block;
		margin: -9.4% 0;
	}
	.videos>.videoItem .videoBody a figure>span {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		width: 100%;
		height: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
			-ms-flex-pack: center;
				justify-content: center;
		-webkit-box-align: center;
			-ms-flex-align: center;
				align-items: center;
	}
	.videos>.videoItem .videoBody a figure>span::after {
		content: "";
		display: block;
		width: 68px;
		height: 48px;
		background-image: url("../../img/youtube_play_icon/yt_icon_mono_light_min.png");
		background-repeat: no-repeat;
		background-size: 100% auto;
		opacity: 0.9;
		-webkit-transition: 0.1s ease-out;
		-o-transition: 0.1s ease-out;
		transition: 0.1s ease-out;
	}
	.videos>.videoItem+.videoBody a:hover figure>span::after {
		background-image: url("../../img/youtube_play_icon/yt_icon_rgb_min.png");
		opacity: 1.0;
	}

	/*---------------
	  movie_special
	---------------*/
	.movie_special {
		padding-top: 15%;
		padding-bottom: calc(100vw * 170 / 750);
	}
	.movie_special .inner {
		width: 81%;
	}
	.movie_special .inner .head {
		margin: 0 0 calc(100vw * 60 / 750);
	}
	.movie_special .list {
		margin-top: calc(100vw * 25 / 750);
		display: flex;
		flex-wrap: wrap;
	/*	justify-content: space-between;
		align-items: stretch;*/
	}
	.movie_special .list .item {
		font-family: '游ゴシック体', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	/*	max-width: 200px;*/
		margin: 0 6% calc(100vw * 25 / 750) 0;
		width:calc(50% - 6% / 2);
	}
	.movie_special .list .item:nth-child(2n) {
		margin-right:0;
	}
	.movie_special .list .link {
		display: block;
	}
	.movie_special .list .link:hover + .tit {
		opacity: .8;
	}
	.movie_special .list .tit {
		display: block;
		margin-top: calc(100vw * 15 / 750);
		font-weight: bold;
		text-align: center;
		cursor: pointer;
		font-size: 3.733vw;
	}
	.movie_special .list .txt {
		font-size: 2.933vw;
		line-height: 1.8em;
	}
}

/* modal custom */
body .blocker {
	z-index: 9999;
}
.modalObj-clone {
	display: none;
}
.videoItem.modal {
	max-width: 60vw;
	padding: 0;
	background-color: #ddd;
	border-radius: 0;
}
.videoItem.modal>div>.videoBody {
	max-width: 100%;
	height: auto;
	padding-bottom: 56.25%;
	position: relative;
	overflow: hidden;
}
.videoItem.modal>div>.videoBody>iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
@media screen and (max-width: 767px) {
	.videos {
		display: block;
	}
	.videos>.videoItem {
		width: 100%;
		max-width: 100%;
		margin: 0 0 25px;
	}
	/* modal custom */
	.videoItem.modal {
		width: 100%;
		max-width: calc(100vw - 20px);
	}
}