@charset "utf-8";
body {
		font-family: YakuHanRP, "Zen Maru Gothic", serif;
		font-weight: 500;
}
.movie_wrap {
		max-width: 1200px;
		margin: 0 auto;
		padding: 0 40px;
		box-sizing: content-box;
		padding-top: 200px;
}
.section_title_gr {
		margin-bottom: 90px;
}
@media(max-width: 767px) {
		.section_title_gr {
				margin-bottom: 25px;
		}
}
.movie_col {
		border: 1px solid #e4002b;
		border-radius: 48px;
		margin: 0 0 110px;
		padding: 100px 70px;
		position: relative;
}
.movie_col.new::after {
		content: '';
		display: block;
		position: absolute;
		top: -40px;
		left: -40px;
		width: 100px;
		height: 100px;
		background: url("../images/icon_new_l.png") no-repeat 0 0;
		background-size: 100px;
}
.movie_title {
		color: #e4002b;
		font-weight: 700;
		font-size: 44px;
		margin-block: calc((1em - 1lh) / 2);
		margin: 0 0 40px;
}
.movie_col p {
		font-size: 19px;
		font-weight: 500;
		line-height: 2.0;
		margin: 0 0 1em
}
.movie_col p.pdn {
		padding-bottom: 1em;
}
.movie_col p.extra {
		margin-bottom: 0 !important;
}
.movie_col p:last-child {
		margin-bottom: 0;
}
.movie_player {
		position: relative;
		width: 100%;
		padding-top: 56.25%;
		margin: 0 0 80px;
}
.movie_player iframe {
		position: absolute;
		top: 0;
		right: 0;
		width: 100% !important;
		height: 100% !important;
}
@media(max-width: 840px) {
		.movie_col {
				padding: 80px 50px;
		}
}
@media(min-width: 768px) {
		.more_btn_center {
				display: none;
		}
}
@media(max-width: 767px) {
		.movie_wrap {
				padding: 0 20px;
				padding-top: 120px;
		}
		.movie_col {
				border-radius: 30px;
				margin: 0 0 60px;
				padding: 18px;
		}
		.movie_col.new::after {
				top: -10px;
				left: -10px;
				width: 50px;
				height: 50px;
				background: url("../images/icon_new_l.png") no-repeat 0 0;
				background-size: 50px;
		}
		.movie_title {
				font-size: 20px;
				margin: 0 0 15px;
		}
		.movie_col.new .movie_title {
				padding-left: 30px;
		}
		.movie_col p {
				font-size: 15px;
				line-height: 1.8;
				margin: 0 0 1em
		}
		.introduction {
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 3; /* 表示したい行数を指定 */
				overflow: hidden;
		}
		.isActive .introduction {
				display: block;
				overflow: visible;
		}
		.more {
				display: none;
		}
		.more_btn_center {
				display: flex;
				justify-content: center;
				color: #e4002b;
				cursor: pointer;
				position: relative;
		}
		.more_btn_center::before {
				content: '';
				display: block;
				position: absolute;
				top: -4em;
				left: 0;
				width: 100%;
				height: 4em;
				background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
				pointer-events: none;
		}
		.more_btn_center.isOpen {
				padding-top: 15px;
		}
		.more_btn_center.isOpen::before {
				display: none;
		}
		.more_btn {
				font-size: 16px;
				font-family: 'Roboto', sans-serif;
				font-weight: 500;
				position: relative;
				transform: translateX(-9px);
		}
		.more_btn .more_btn_trigger {
				position: absolute;
				width: 13px;
				height: 13px;
				background: #e4002b;
				border-radius: 50%;
				top: calc(50% - 6.5px);
				right: -18px;
		}
		.more_btn_trigger::before, .more_btn_trigger::after {
				content: '';
				display: block;
				position: absolute;
				top: 6px;
				left: 2px;
				width: 9px;
				height: 1px;
				background: #fff;
				transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
		}
		.more_btn_trigger::after {
				transform: rotate(90deg)
		}
		.isOpen .more_btn_trigger::before {
				transform: rotate(180deg);
		}
		.isOpen .more_btn_trigger::after {
				transform: rotate(270deg);
				opacity: 0;
		}
		.movie_player {
				margin: 0 0 20px;
		}
}
/* ============== */
.pcNav {
		margin-bottom: 100px;
}
@media(min-width: 768px) {
		.spNav {
				display: none;
		}
}
@media(max-width: 767px) {
		.pcNav {
				display: none;
		}
}
.pcNav_global {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 30px 25px;
		list-style: none;
}
.pcNav_global li {
		font-size: 18px;
		position: relative;
}
li.new::after {
		content: '';
		display: block;
		position: absolute;
		top: -10px;
		left: -20px;
		width: 50px;
		height: 50px;
		background: url("../images/icon_new_s.png") no-repeat 0 0;
		background-size: 50px;
		pointer-events: none;
}
.pcNav_global li a {
		color: #000;
		text-decoration: none;
		display: flex;
		align-items: center;
		height: 64px;
		background: #fff;
		border: 1px solid #e4002b;
		box-sizing: border-box;
		padding: 0 0 0 35px;
		border-radius: 60px;
		transition: background 0.4s;
		position: relative;
}
.pcNav_global li a::after {
		content: '';
		display: block;
		position: absolute;
		top: calc(50% - 13px);
		right: 20px;
		width: 25px;
		height: 25px;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 25px;
		border-radius: 50%;
		background-image: url("../images/movie_arw_wht.png");
		background-color: #e4002b;
		pointer-events: none
}
@media(max-width: 1200px) {
		.pcNav_global {
				gap: 15px 10px;
		}
		.pcNav_global li {
				font-size: 15px;
		}
		.pcNav_global li a {
				padding-left: 20px;
				height: 54px;
		}
		.pcNav_global li a::after {
				right: 15px
		}
}
@media(max-width: 1060px) {
		.pcNav_global {
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				gap: 15px 10px;
		}
		.pcNav_global li {
				font-size: 16px;
		}
		.pcNav_global li a {
				padding-left: 20px;
				height: 54px;
		}
		.pcNav_global li a::after {
				right: 15px
		}
}
.pcNav_global li a span {
		transform: translateY(-1px)
}
@media (hover: hover) {
		.pcNav_global li a:hover {
				background: #e4002b;
				color: #fff;
		}
		.pcNav_global li a:hover::after {
				background-image: url("../images/movie_arw_red.png");
				background-color: #fff;
		}
}
@media(max-width: 767px) {
		.spNav {
				margin-bottom: 80px;
		}
		.spNav.isFixed {
				position: fixed;
				top: 80px;
				left: 0;
				width: 100%;
				z-index: 10;
				box-sizing: border-box;
				padding: 0 20px;
		}
		.spNav_outer {
				height: 100px;
				position: relative;
				z-index: 100
		}
		.spNav dl {
				border: 1px solid #e4002b;
				border-radius: 30px;
				background: #fff;
		}
		.spNav dl dt {
				font-size: 20px;
				font-weight: 700;
				height: 50px;
				display: flex;
				align-items: center;
				color: #e4002b;
				cursor: pointer;
				padding-left: 25px;
				position: relative;
		}
		.spNav dl dd {
				display: none;
		}
		.spNav dl dt .acc_trigger {
				position: absolute;
				right: 20px;
				top: 13px;
				width: 24px;
				height: 24px;
				border-radius: 50%;
				background: #e4002b;
		}
		.acc_trigger::before, .acc_trigger::after {
				content: '';
				display: block;
				position: absolute;
				top: 11px;
				left: 5px;
				width: 14px;
				height: 2px;
				background: #fff;
				transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
		}
		.acc_trigger::after {
				transform: rotate(90deg)
		}
		.isOpen .acc_trigger::before {
				transform: rotate(180deg);
		}
		.isOpen .acc_trigger::after {
				transform: rotate(270deg);
				opacity: 0;
		}
		.spNav_global li {
				list-style: none;
				font-size: 15px;
				border-bottom: 1px solid #e4002b;
				position: relative;
		}
		.spNav_global li:first-child {
				border-top: 1px solid #e4002b;
		}
		.spNav_global li:last-child {
				border-bottom: none;
		}
		.spNav_global li a {
				color: #000;
				text-decoration: none;
				padding: 0 15px 0 50px;
				display: flex;
				align-items: center;
				height: 44px;
		}
		.spNav_global li a.current {
				background: #fce5e8;
		}
		li.new::after {
				top: 7px;
				left: 12px;
				width: 30px;
				height: 30px;
				background: url("../images/icon_new_s.png") no-repeat 0 0;
				background-size: 30px;
				pointer-events: none;
		}
}