@charset "utf-8";

/* CSS INFORMATION -====================================================
File name : top.css
Description :
===================================================================== */
/* =====================================================================
*    mv
* =================================================================== */
.mv {
	overflow: hidden;
}

.mv::before {
	content: '';
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.mv svg {
	position: absolute;
	top: 0;
	left: 0;
}

.mv .inner {
	width: 100%;
}

.mv_slide {
	z-index: 2;
}

.mv .slick-slide {
	margin: 0 !important;
	line-height: 1;
}

.mv_slide li .slider-wrapper {
	width: 100%;
}

.mv .slick-arrow.prev {
	display: none;
}

.mv .slick-arrow.next {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	cursor: pointer;
	z-index: 3;
}

.mv_slide .slick-dots {
	width: 100%;
	height: .5em;
	bottom: 0 !important;
	background: #480404;
}

.mv_slide .slick-dots li {
	display: none;
}

.mv_slide .slick-dots li.slick-active {
	display: block;
}

.mv_slide .slick-dots li button,
.mv_slide .slick-dots li button:before {
	color: transparent;
	opacity: 0;
}

/* progress bar */

.mv_slide li .slider-progress {}

.mv_slide li .slider-progress .progress {
	width: 0%;
	height: .5em;
	background: #e60012;
}

.mv_ttl {
	visibility: hidden;
	width: calc(601 / 750 * 100%);
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: calc(182 / 750 * 100%) auto 0;
	z-index: 3;
}

.mv_onair {
	background-color: #9b200c;
	padding: calc(26 / 750 * 100%) 0;
}

.mv_onair img {
	width: calc(705 / 750 * 100%);
	margin: auto;
}


@media screen and (min-width: 768px) {
	.mv {
		padding: calc(40 / 1200 * 100%) 0;
	}

	.mv svg {
		-o-object-fit: cover;
		object-fit: cover;
		font-family: 'object-fit: cover;';
		height: calc(820 / 1200 * 100vw);
	}

	.mv_ttl {
		width: calc(817 / 1200 * 100%);
		margin: calc(240 / 1200 * 100%) auto 0;
	}

	.mv_onair {
		width: 100%;
		padding: calc(25 / 1200 * 100%) 0;
	}

	.mv_onair img {
		width: calc(922 / 1200 * 100%);
	}
}

@media screen and (min-width: 1200px) {

	.mv {
		padding: 40px 0;
	}

	.mv svg {
		margin-top: calc(-30 / 1200 * 100vw);
	}

	.mv_onair {
		padding: 25px 0;
	}

	.mv_onair img {
		width: 922px;
	}

}

@media screen and (min-width: 1600px) {
	.mv svg {
		margin-top: calc(-100 / 1200 * 100vw);
	}
}


/* =====================================================================
*    news&banner
* =================================================================== */
.news_wrap .outer::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../images/top/bg_deco1_sp.png) repeat-y top calc(18 / 750 * 100%) center/100% auto;
}

@media screen and (min-width: 768px) {

	.news_wrap .outer::before,
	.news_wrap .outer::after {
		content: '';
		position: absolute;
		top: 0;
		width: calc(498 / 1600 * 100%);
		height: 100%;
		background: url(../images/top/bg_deco1_pc.png) repeat-y top center/100% auto;
	}

	.news_wrap .outer::before {
		background-position: top right;
	}

	.news_wrap .outer::after {
		right: 0;
		background-position: top calc(1200 / 1600 * 100%) left;
	}
}

/* =====================================================================
*    bnr1
* =================================================================== */
.bnr1 {
	padding: calc(85 / 650 * 100%) 0;
}

.bnr1::before {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	background: url(../images/deco/bg_deco1.png) no-repeat center/contain;
	width: calc(129 / 650 * 100%);
	padding-top: calc(127 / 650 * 100%);
	margin: 0 calc(-105 / 650 * 100%) calc(-68 / 650 * 100%) 0;
}

.bnr1::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	background: url(../images/deco/img_chara1.png) no-repeat center/contain;
	width: calc(110 / 650 * 100%);
	padding-top: calc(192 / 650 * 100%);
	margin: 0 calc(-30 / 650 * 100%) calc(-50 / 650 * 100%) 0;
	z-index: 2;
}

.cam_banner {
	margin-top: calc(30 / 560 * 100%) !important;
}

@media screen and (min-width: 768px) {
	.bnr1 {
		padding: calc(75 / 1000 * 100%) 0;
	}

	.bnr1::before {
		width: calc(129 / 1000 * 100%);
		padding-top: calc(127 / 1000 * 100%);
		margin: 0 calc(-140 / 1000 * 100%) calc(-68 / 1000 * 100%) 0;
	}

	.bnr1::after {
		width: calc(110 / 1000 * 100%);
		padding-top: calc(192 / 1000 * 100%);
		margin: 0 calc(-60 / 1000 * 100%) calc(-50 / 1000 * 100%) 0;
	}

	.cam_banner {
		margin-top: 1rem !important;
		width: calc(500 / 1000 * 100%) !important;
	}

}


/* =====================================================================
*    news
* =================================================================== */
.news {
	padding: calc(135 / 650 * 100%) 0;
}

.news::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	background: url(../images/deco/bg_deco1.png) no-repeat center/contain;
	width: calc(129 / 650 * 100%);
	padding-top: calc(127 / 650 * 100%);
	margin: 0 0 calc(-40 / 650 * 100%) calc(15 / 650 * 100%);
}

.news::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	background: url(../images/deco/img_chara2.png) no-repeat center/contain;
	width: calc(155 / 650 * 100%);
	padding-top: calc(242 / 650 * 100%);
	margin: 0 0 calc(-50 / 650 * 100%) calc(-75 / 650 * 100%);
	z-index: 2;
}

.news_list li {
	background-color: #fff;
	padding: calc(60 / 650 * 100%) calc(30 / 650 * 100%) calc(30 / 650 * 100%);
	margin: 0 0 calc(27 / 650 * 100%);
	-webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.2);
}

.news_list_top {
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.news_list_top {
	position: absolute;
	top: 0;
	left: 0;
	margin: calc(10 / 650 * 100%) 0 0 calc(-20 / 650 * 100%);
	z-index: 1;
	width: 100%;
}

/*
.news_list_top .date {
color: #fff;
font-size: 2rem;
background: url(../images/top/bg_news_date.png) no-repeat center/contain;
padding: 0 1.9em 0.6em;
}
*/

.news_list_top .date {
	color: #fff;
	width: calc(162 / 650 * 100%);
	font-size: 2rem;
	background: url(../images/top/bg_news_date.png) no-repeat center left/contain;
	padding: 0 0 calc(16 / 650 * 100%) calc(30 / 650 * 100%);
}

.news_list_top .category {
	color: #d80c18;
	font-size: 2rem;
	padding-left: .1em;
	margin-left: .5em;
}

.news_list_bottom {
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: center;
}

.news_photo {
	margin-right: calc(30 / 590 * 100%);
	width: calc(220 / 590 * 100%);
}

.news_txt {
	width: calc(337 / 590 * 100%);
	margin-top: -.4em;
}

.news_list li a {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

@media screen and (min-width: 768px) {
	.news {
		padding: 0 0 calc(100 / 1000 * 100%);
	}

	.news::before {
		width: calc(129 / 1000 * 100%);
		padding-top: calc(127 / 1000 * 100%);
		margin: 0 0 calc(-155 / 1000 * 100%) 0;
	}

	.news::after {
		width: calc(120 / 1000 * 100%);
		padding-top: calc(189 / 1000 * 100%);
		margin: 0 0 calc(-85 / 1000 * 100%) calc(-60 / 1000 * 100%);
	}

	.news_list {
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-ms-align-items: flex-start;
	}

	.news_list li {
		width: calc(320 / 1000 * 100%);
		margin: 0;
		padding: calc(40 / 1000 * 100%) calc(10 / 1000 * 100%) calc(20 / 1000 * 100%);
		-webkit-transition: .2s;
		transition: .2s;
		top: 0;
	}

	.news_list li:not(:last-child) {
		margin: 0 calc(20 / 1000 * 100%) 0 0;
	}

	.news_list li:hover {
		top: -10px;
		-webkit-transition: .2s;
		transition: .2s;
	}

	.news_list_top {
		margin: calc(6 / 320 * 100%) 0 0 calc(-13 / 320 * 100%);
	}

	.news_list_top::before {
		width: 1em;
		-webkit-transition: .4s ease;
		transition: .4s ease;
	}

	.news_list li:hover .news_list_top::before {
		width: 100%;
		-webkit-transition: .4s ease;
		transition: .4s ease;
	}

	.news_photo {
		margin-right: calc(18 / 300 * 100%);
		width: calc(108 / 300 * 100%);
	}

	.news_txt {
		font-size: 1.4rem;
		width: calc(163 / 300 * 100%);
	}

	.news_list_top .date {
		font-size: 1.3rem;
		width: calc(100 / 300 * 100%);
		padding: calc(2 / 800 * 100%) 0 calc(11 / 300 * 100%) calc(20 / 300 * 100%);
	}

	.news_list_top .category {
		font-size: 1.2rem;
	}

}

@media screen and (min-width: 1200px) {}


/* =====================================================================
*    nextstory
* =================================================================== */
.nextstory {
	background: url(../images/common/bg_brown.jpg) repeat center/calc(250 / 750 * 100%) auto;
	padding: calc(100 / 750 * 100%) 0 calc(128 / 750 * 100%);
}

.nextstory h2 {
	margin-bottom: calc(113 / 650 * 100%);
}

.nextstory_box::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	background: url(../images/deco/bg_deco4.png) no-repeat center/contain;
	width: calc(324 / 650 * 100%);
	padding-top: calc(113 / 650 * 100%);
	margin: 0 0 calc(-77 / 650 * 100%) calc(-170 / 650 * 100%);
}

.nextstory_box::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	background: url(../images/deco/bg_deco3.png) no-repeat center/contain;
	width: calc(265 / 650 * 100%);
	padding-top: calc(143 / 650 * 100%);
	margin: 0 calc(-150 / 650 * 100%) calc(-83 / 650 * 100%) 0;
	z-index: -1;
}

.nextstory_movie_photo {
	background: url(../images/top/bg_nextstory_movie_sp.png) no-repeat center/contain;
	width: calc(666 / 650 * 100%);
	padding: calc(25 / 650 * 100%);
	margin: 0 0 calc(34 / 630 * 100%) calc(-8 / 650 * 100%);
}

.nextstory_movie_photo img {
	-o-object-fit: cover;
	object-fit: cover;
	font-family: 'object-fit: cover;';
	-o-object-position: center;
	object-position: center;
	height: calc(330 / 750 * 100vw);
}

.nextstory_subttl {
	position: absolute;
	top: 0;
	right: 0;
	width: calc(213 / 650 * 100%);
	background: url(../images/top/bg_nextstory_subttl.png) no-repeat center/contain;
	padding: calc(43 / 650 * 100%) calc(30 / 650 * 100%) calc(30 / 650 * 100%) calc(113 / 650 * 100%);
	font-size: 4rem;
	font-weight: bold;
	line-height: 1;
	white-space: nowrap;
	color: #fff;
	font-family: YuMincho, 'Yu Mincho', serif;
	margin: calc(-62 / 650 * 100%) calc(-30 / 650 * 100%) 0 0;
	z-index: 1;
}

.nextstory_subttl.last {
	font-size: 2.5rem;
	padding: calc(43 / 650 * 100%) calc(30 / 650 * 100%) calc(30 / 650 * 100%) calc(98 / 650 * 100%);
}

.nextstory_date {
	width: calc(458 / 650 * 100%);
	color: #fff;
	font-size: 3rem;
	line-height: 1;
	margin: 0 auto calc(55 / 650 * 100%);
}

.nextstory_date p:first-child {
	background: url(../images/top/bg_nextsory_date.png) no-repeat center/100% auto;
	text-align: center;
	letter-spacing: 0.05em;
	font-weight: 700;
	padding: calc(10 / 458 * 100%) 0;
}

.nextstory_date small {
	color: #7f7575;
	display: block;
	font-size: 1.8rem;
	margin: 0.3em 0 0;
	text-align: right;
}

.nextstory_movie_btn::before {
	content: "";
	display: block;
	width: calc(100 / 750 * 100vw);
	height: calc(100 / 750 * 100vw);
	position: absolute;
	background-color: #982411;
	border-radius: 50%;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 1;
}

.nextstory_movie_btn::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: .4em;
	right: 0;
	margin: auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: .7em 0 .7em 1em;
	border-color: transparent transparent transparent #fff;
	border-radius: .3em;
	z-index: 1;
}

.nextstory_btn {
	margin-top: calc(60 / 650 * 100%);
}


@media screen and (min-width: 768px) {
	.nextstory {
		padding: calc(80 / 1200 * 100%) 0 calc(100 / 1200 * 100%);
		background-size: calc(250 / 1200 * 100%) auto;
	}

	.nextstory h2 {
		margin-bottom: calc(80 / 1000 * 100%);
	}

	.nextstory_box::before {
		width: calc(324 / 800 * 100%);
		padding-top: calc(113 / 800 * 100%);
		margin: 0 0 calc(-60 / 800 * 100%) calc(-220 / 800 * 100%);
	}

	.nextstory_box::after {
		width: calc(265 / 800 * 100%);
		padding-top: calc(143 / 800 * 100%);
		margin: 0 calc(-160 / 800 * 100%) calc(-75 / 800 * 100%) 0;
	}

	.nextstory_movie {
		padding: 0 calc(100 / 1000 * 100%);
	}

	.nextstory_subttl {
		width: calc(213 / 800 * 100%);
		font-size: 4rem;
		margin: calc(-50 / 800 * 100%) calc(40 / 800 * 100%) 0 0;
		padding: calc(43 / 800 * 100%) calc(50 / 800 * 100%) calc(30 / 800 * 100%) calc(113 / 800 * 100%);
	}

	.nextstory_subttl.last {
		padding: calc(43 / 800 * 100%) calc(50 / 800 * 100%) calc(30 / 800 * 100%) calc(108 / 800 * 100%);
	}

	.nextstory_movie_photo {
		width: 100%;
		background: url(../images/top/bg_nextstory_movie_pc.png) no-repeat center/contain;
		margin: 0 0 calc(22 / 800 * 100%);
		padding: calc(20 / 800 * 100%);
	}

	.nextstory_movie_photo img {
		height: calc(417 / 1200 * 100vw);
	}

	.nextstory_movie_btn::before {
		width: calc(107 / 1200 * 100vw);
		height: calc(107 / 1200 * 100vw);
	}

	.nextstory_movie_btn::after {
		border-width: 1.2em 0 1.2em 1.8em;
	}

	.nextstory_movie_btn::before,
	.nextstory_movie_btn::after {
		-webkit-transition: .2s;
		transition: .2s;
	}

	.nextstory_movie_btn:hover::before,
	.nextstory_movie_btn:hover::after {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
		-webkit-transition: .2s;
		transition: .2s;
	}

	.nextstory_date {
		width: calc(425 / 800 * 100%);
		font-size: 2.4rem;
		margin-bottom: calc(38 / 800 * 100%);
	}

	.nextstory_date p:first-child {
		padding: calc(10 / 425 * 100%);
	}

	.nextstory_date small {
		font-size: 1.2rem;
		margin-right: 1.2em;
	}

	.nextstory_txt {
		font-size: 1.6rem;
	}

}

@media screen and (min-width: 1200px) {
	.nextstory {
		padding: 80px 0 100px;
		background-size: 250px auto;
	}

	.nextstory_movie_btn::before {
		width: 107px;
		height: 107px;
	}

	.nextstory_movie_photo img {
		height: 417px;
	}
}


/* =====================================================================
*    delivery 
* =================================================================== */
.delivery {
	padding: calc(40 / 750 * 100%) 0 calc(190 / 750 * 100%);
}

.delivery .inner::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	background: url(../images/deco/bg_deco1.png) no-repeat center/contain;
	width: calc(129 / 650 * 100%);
	padding-top: calc(127 / 650 * 100%);
	margin: calc(-6 / 650 * 100%) calc(-65 / 650 * 100%) 0 0;
}

.delivery .inner::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	background: url(../images/deco/img_chara3.png) no-repeat center/contain;
	width: calc(174 / 650 * 100%);
	padding-top: calc(260 / 650 * 100%);
	margin: calc(-165 / 650 * 100%) calc(-35 / 650 * 100%) 0 0;
}

.delivery h2 {
	margin-bottom: calc(50 / 650 * 100%);
}


@media screen and (min-width: 768px) {
	.delivery {
		padding: calc(50 / 1200 * 100%) 0 calc(95 / 1200 * 100%);
	}

	.delivery .inner::before {
		width: calc(129 / 1200 * 100%);
		padding-top: calc(127 / 1200 * 100%);
		margin: calc(-10 / 1200 * 100%) calc(22 / 1200 * 100%) 0 0;
	}

	.delivery .inner::after {
		width: calc(138 / 1200 * 100%);
		padding-top: calc(205 / 1200 * 100%);
		margin: calc(-107 / 1200 * 100%) calc(82 / 1200 * 100%) 0 0;
	}

	.delivery h2 {
		margin-bottom: calc(44 / 1000 * 100%);
	}

	.delivery_list {
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-align-items: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: center;
		padding: 0 calc(50 / 1000 * 100%);
	}

	.delivery_list li {
		width: calc(440 / 900 * 100%);
		margin: 0;
	}

}

@media screen and (min-width: 1200px) {
	.delivery {
		padding: 50px 0 95px;
	}
}

/* =====================================================================
*    bnr2
* =================================================================== */
.bnr2 {
	padding: calc(89 / 750 * 100%) 0;
	background-color: #9b200c;
}

.bnr2 .inner::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background: url(../images/deco/bg_deco1.png) no-repeat center/contain;
	width: calc(129 / 650 * 100%);
	padding-top: calc(127 / 650 * 100%);
	margin: calc(-55 / 650 * 100%) 0 0 0;
}

.bnr2 .inner::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background: url(../images/deco/img_deco1.png) no-repeat center/contain;
	width: calc(205 / 650 * 100%);
	padding-top: calc(226 / 650 * 100%);
	margin: calc(-176 / 650 * 100%) 0 0 calc(-101 / 650 * 100%);
}

.bnr2 ul {
	z-index: 2;
}

.bnr2 ul::before {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	background: url(../images/deco/bg_deco1.png) no-repeat center/contain;
	width: calc(129 / 650 * 100%);
	padding-top: calc(127 / 650 * 100%);
	margin: 0 0 calc(-72 / 650 * 100%) 0;
}

.bnr2 ul::after {
	content: '';
	position: absolute;
	bottom: 0;
	right: 0;
	background: url(../images/deco/img_deco2.png) no-repeat center/contain;
	width: calc(298 / 650 * 100%);
	padding-top: calc(221 / 650 * 100%);
	margin: 0 calc(-125 / 650 * 100%) calc(-240 / 650 * 100%) 0;
}


@media screen and (min-width: 768px) {
	.bnr2 {
		padding: calc(48 / 1200 * 100%) 0;
	}

	.bnr2 .inner::before {
		width: calc(129 / 1200 * 100%);
		padding-top: calc(127 / 1200 * 100%);
		margin: calc(-98 / 1200 * 100%) 0 0 calc(25 / 1200 * 100%);
	}

	.bnr2 .inner::after {
		width: calc(165 / 1200 * 100%);
		padding-top: calc(181 / 1200 * 100%);
		margin: calc(-170 / 1200 * 100%) 0 0 calc(-65 / 1200 * 100%);
	}

	.bnr2 ul::before {
		width: calc(129 / 1000 * 100%);
		padding-top: calc(127 / 1000 * 100%);
		margin: 0 calc(-42 / 1000 * 100%) calc(-72 / 1000 * 100%) 0;
	}

	.bnr2 ul::after {
		width: calc(255 / 1000 * 100%);
		padding-top: calc(187 / 1000 * 100%);
		margin: 0 calc(-240 / 1000 * 100%) calc(-165 / 1000 * 100%) 0;
	}

}

@media screen and (min-width: 1200px) {
	.bnr2 {
		padding: 48px 0;
	}
}


/* =====================================================================
*    movie
* =================================================================== */
.movie {
	padding: calc(150 / 750 * 100%) 0 calc(115 / 750 * 100%);
}

.movie .inner::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background: url(../images/deco/bg_deco4.png) no-repeat center/contain;
	width: calc(324 / 650 * 100%);
	padding-top: calc(113 / 650 * 100%);
	margin: calc(111 / 650 * 100%) 0 0 calc(-200 / 650 * 100%);
}

.movie .inner::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	background: url(../images/deco/bg_deco3.png) no-repeat center/contain;
	width: calc(265 / 650 * 100%);
	padding-top: calc(143 / 650 * 100%);
	margin: calc(100 / 650 * 100%) calc(-130 / 650 * 100%) 0 0;
	z-index: -1;
}

.movie h3 {
	text-align: center;
	color: #982411;
	margin-bottom: 1em;
	font-size: 3.2rem;
	font-weight: 700;
}

.movie_list {
	margin-bottom: calc(70 / 630 * 100%);
}

.slick-track {
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.movie_list .draggable {
	overflow: visible;
}

.slick-slide {
	margin: 0 10px;
	height: auto !important;
}

.movie_list li {}

.movie_list li a {
	background-color: #fff;
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.1);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.1);
	padding: 1.3em 1.3em 1.8em;
}

.movie_list li a span {
	display: block;
}

.movie_list li a span::before {
	content: "";
	display: block;
	width: calc(100 / 750 * 100vw);
	height: calc(100 / 750 * 100vw);
	position: absolute;
	background-color: #982411;
	border-radius: 50%;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 2;
}

.movie_list li a span::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: .4em;
	right: 0;
	margin: auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: .7em 0 .7em 1em;
	border-color: transparent transparent transparent #fff;
	border-radius: .3em;
	z-index: 2;
}

.movie_list_photo figcaption {
	margin-top: 1em;
	color: #1a160f;
}

.movie .slick-arrow {
	display: block;
	position: absolute;
	bottom: 0;
	top: 0;
	z-index: 3;
	margin: auto;
	width: 3em;
	height: 3em;
	background-color: #000;
	border-radius: 50%;
}

.movie .slick-arrow::before {
	content: "";
	display: block;
	width: .7em;
	height: .7em;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 2;
	margin: auto;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
}

.movie .slick-arrow.prev {
	left: 0;
	margin-left: calc(-25 / 630 * 100%);
}

.movie .slick-arrow.prev::before {
	left: .2em;
	-webkit-transform: rotate(-135deg);
	transform: rotate(-135deg);
}

.movie .slick-arrow.next {
	right: 0;
	margin-right: calc(-25 / 630 * 100%);
}

.movie .slick-arrow.next::before {
	right: .2em;
	-webkit-transform: rotate(-315deg);
	transform: rotate(-315deg);
}

.movie_more_btn {
	margin-top: 3em;
}

/*Huluオリジナルストーリー*/
.hulu_box::before {
/*	content: '';*/
	position: absolute;
	bottom: 0;
	left: 0;
	background: url(../images/deco/bg_deco4.png) no-repeat center/contain;
	width: calc(324 / 650 * 100%);
	padding-top: calc(113 / 650 * 100%);
	margin: 0 0 calc(-77 / 650 * 100%) calc(-170 / 650 * 100%);
}

.hulu_box::after {
/*	content: '';*/
	position: absolute;
	bottom: 0;
	right: 0;
	background: url(../images/deco/bg_deco3.png) no-repeat center/contain;
	width: calc(265 / 650 * 100%);
	padding-top: calc(143 / 650 * 100%);
	margin: 0 calc(-150 / 650 * 100%) calc(-83 / 650 * 100%) 0;
	z-index: -1;
}

.hulu_movie_photo {
	background: url(../images/top/bg_nextstory_movie_sp.png) no-repeat center/contain;
	width: calc(666 / 650 * 100%);
	padding: calc(25 / 650 * 100%);
	margin: 0 0 calc(34 / 630 * 100%) calc(-8 / 650 * 100%);
}

.hulu_movie_photo img {
	-o-object-fit: cover;
	object-fit: cover;
	font-family: 'object-fit: cover;';
	-o-object-position: center;
	object-position: center;
	height: calc(330 / 750 * 100vw);
}

.hulu_movie_btn::before {
	content: "";
	display: block;
	width: calc(100 / 750 * 100vw);
	height: calc(100 / 750 * 100vw);
	position: absolute;
	background-color: #982411;
	border-radius: 50%;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 1;
}

.hulu_movie_btn::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: .4em;
	right: 0;
	margin: auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: .7em 0 .7em 1em;
	border-color: transparent transparent transparent #fff;
	border-radius: .3em;
	z-index: 1;
}


@media screen and (min-width: 768px) {
	.movie {
		padding: calc(120 / 1200 * 100%) 0 calc(100 / 1200 * 100%);
	}

	.movie .inner::before {
		width: calc(324 / 1200 * 100%);
		padding-top: calc(113 / 1200 * 100%);
		margin: calc(70 / 1200 * 100%) 0 0 calc(-53 / 1200 * 100%);
	}

	.movie .inner::after {
		top: auto;
		bottom: 0;
		width: calc(265 / 1200 * 100%);
		padding-top: calc(143 / 1200 * 100%);
		margin: 0 calc(-40 / 1200 * 100%) calc(40 / 1200 * 100%) 0;
	}

	.movie h3 {
		font-size: 2.6rem;
	}

	.movie_list {
		margin-bottom: calc(60 / 1000 * 100%);
	}

	.movie_list .slick-list {
		padding: 10px 0 !important;
		margin-top: -10px;
	}

	.movie_list .draggable {
		padding: 0 !important;
		overflow: hidden;
	}

	.movie .slick-arrow {
		width: 2em;
		height: 2em;
		cursor: pointer;
	}

	.movie .slick-arrow::before {
		width: .5em;
		height: .5em;
	}

	.movie .slick-arrow.prev {
		margin-left: calc(-45 / 1000 * 100%);
	}

	.movie .slick-arrow.next {
		margin-right: calc(-45 / 1000 * 100%);
	}

	.movie .slick-slide {
		margin: 0 .35em;
	}

	.movie_list li a {
		padding: 1em 1em 2em;
		top: 0;
	}

	.movie_list li a:hover {
		top: -10px;
	}

	.movie_list li a span::before {
		width: calc(45 / 1200 * 100vw);
		height: calc(45 / 1200 * 100vw);
	}

	.movie_list li a span::after {
		border-width: 0.5em 0 0.5em 0.8em;
		left: .2em;
	}

	.movie_list_photo figcaption {
		font-size: 1.4rem;
	}

	.hulu_box::before {
		width: calc(324 / 800 * 100%);
		padding-top: calc(113 / 800 * 100%);
		margin: 0 0 calc(-60 / 800 * 100%) calc(-220 / 800 * 100%);
	}

	.hulu_box::after {
		width: calc(265 / 800 * 100%);
		padding-top: calc(143 / 800 * 100%);
		margin: 0 calc(-160 / 800 * 100%) calc(-75 / 800 * 100%) 0;
	}

	.hulu_movie {
		padding: 0 calc(100 / 1000 * 100%);
	}

	.hulu_movie_photo {
		width: 100%;
		background: url(../images/top/bg_nextstory_movie_pc.png) no-repeat center/contain;
		margin: 0 0 calc(22 / 800 * 100%);
		padding: calc(20 / 800 * 100%);
	}

	.hulu_movie_btn::before {
		width: calc(107 / 1200 * 100vw);
		height: calc(107 / 1200 * 100vw);
	}

	.hulu_movie_btn::before,
	.hulu_movie_btn::after {
		-webkit-transition: .2s;
		transition: .2s;
	}

	.hulu_movie_btn::after {
		border-width: 1.2em 0 1.2em 1.8em;
	}

	.hulu_movie_photo img {
		height: calc(417 / 1200 * 100vw);
	}

	.hulu_movie_btn:hover::before,
	.hulu_movie_btn:hover::after {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
		-webkit-transition: .2s;
		transition: .2s;
	}

}

@media screen and (min-width: 1200px) {
	.movie {
		padding: 120px 0 100px;
	}

	.movie_list li a span::before {
		width: 45px;
		height: 45px;
	}

	.hulu_movie_btn::before {
		width: 107px;
		height: 107px;
	}

	.hulu_movie_photo img {
		height: 417px;
	}

}


/* =====================================================================
*    topics
* =================================================================== */
.topics {
	background: url(../images/common/bg_brown.jpg) repeat center/calc(250 / 750 * 100%) auto;
}

.topics .outer {
	padding: calc(90 / 750 * 100%) 0 calc(125 / 750 * 100%);
}

.topics .outer::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../images/top/bg_deco1_sp.png) repeat-y top calc(50 / 750 * 100%) center/100% auto;
}

.topics .inner::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background: url(../images/deco/bg_deco1.png) no-repeat center/contain;
	width: calc(129 / 650 * 100%);
	padding-top: calc(127 / 650 * 100%);
	margin: calc(-138 / 650 * 100%) 0 0 0;
}

.topics .inner::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background: url(../images/deco/img_deco3.png) no-repeat center/contain;
	width: calc(181 / 650 * 100%);
	padding-top: calc(310 / 650 * 100%);
	margin: calc(-310 / 650 * 100%) 0 0 calc(-100 / 650 * 100%);
}

.topics_list li {
	background-color: #fff;
	margin-bottom: calc(30 / 650 * 100%);
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2);
}

.topics_box dl {
	padding: calc(40 / 650 * 100%) calc(50 / 650 * 100%);
}

.topics_box .data {
	margin-top: .2em;
	color: #d80c18;
	font-size: 2rem;
}

.topics_box:not(:first-child) dl {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.topics_box:not(:first-child) dt {
	width: calc(220 / 550 * 100%);
	padding-bottom: calc(40 / 550 * 100%);
}

.topics_box:not(:first-child) .data {
	position: absolute;
	top: 0;
	left: 0;
	width: auto;
	margin: calc(165 / 650 * 100%) 0 0 calc(50 / 650 * 100%);
}

.topics_box:not(:first-child) .txt {
	width: calc(300 / 550 * 100%);
	margin-top: calc(-8 / 550 * 100%);
}

.topics_box a {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.topics_more_btn {
	margin-top: 3em;
}

@media screen and (min-width: 768px) {
	.topics {
		background-size: calc(250 / 1200 * 100%) auto;
	}

	.topics .outer {
		padding: calc(98 / 1200 * 100%) 0 calc(110 / 1200 * 100%);
	}

	.topics .outer::before,
	.topics .outer::after {
		content: '';
		position: absolute;
		top: 0;
		width: calc(498 / 1600 * 100%);
		height: 100%;
		background: url(../images/top/bg_deco1_pc.png) repeat-y top center/100% auto;
	}

	.topics .outer::before {
		background-position: top calc(1200 / 1600 * 100%) right;
	}

	.topics .outer::after {
		right: 0;
		background-position: top left;
	}

	.topics .inner::before {
		width: calc(129 / 1200 * 100%);
		padding-top: calc(127 / 1200 * 100%);
		margin: calc(-115 / 1200 * 100%) 0 0 calc(138 / 1200 * 100%);
	}

	.topics .inner::after {
		width: calc(126 / 1200 * 100%);
		padding-top: calc(216 / 1200 * 100%);
		margin: calc(-235 / 1200 * 100%) 0 0 calc(75 / 1200 * 100%);
	}

	.topics_list {
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		margin-bottom: calc(60 / 1000 * 100%);
		background-color: transparent;
		border: 0;
		margin-bottom: 0;
	}

	.topics_list li {
		top: 0;
		width: calc(320 / 1000 * 100%);
		margin: calc(40 / 1000 * 100%) calc(20 / 1000 * 100%) 0 0;
		-webkit-transition: .3s;
		transition: .3s;
	}

	.topics_list li:nth-child(-n+3) {
		margin-top: 0;
	}

	.topics_list li:nth-child(3n),
	.topics_list li:last-child {
		margin-right: 0;
	}

	.topics_list li:hover {
		top: -10px;
		-webkit-transition: .3s;
		transition: .3s;
	}

	.topics_list dl {
		display: block !important;
		padding: calc(20 / 320 * 100%) calc(20 / 320 * 100%) calc(30 / 320 * 100%);
	}

	.topics_box dt {
		width: 100% !important;
	}

	.topics_box:not(:first-child) dt {
		padding-bottom: 0;
	}

	.topics_box .data {
		position: relative !important;
		font-size: 1.2rem;
		margin: 0 !important;
	}

	.topics_box .txt {
		width: 100% !important;
		font-size: 1.4rem;
		margin-top: .5em !important;
	}

}

@media screen and (min-width: 1200px) {
	.topics {
		background-size: 250px auto;
	}

	.topics .outer {
		padding: 98px 0 110px;
	}

}


/* =====================================================================
*    sns
* =================================================================== */
.sns {
	padding: calc(120 / 750 * 100%) 0 calc(184 / 750 * 100%);
}

.sns .inner::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	background: url(../images/deco/bg_deco1.png) no-repeat center/contain;
	width: calc(129 / 650 * 100%);
	padding-top: calc(127 / 650 * 100%);
	margin: calc(-81 / 650 * 100%) calc(51 / 650 * 100%) 0 0;
}

.sns .inner::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	background: url(../images/deco/img_deco4.png) no-repeat center/contain;
	width: calc(259 / 650 * 100%);
	padding-top: calc(229 / 650 * 100%);
	margin: calc(-208 / 650 * 100%) calc(-110 / 650 * 100%) 0 0;
}

.sns h2 {
	margin-bottom: calc(50 / 650 * 100%);
}

.twitter {
	background: url(../images/top/bg_twitter_sp.png) no-repeat center/contain;
	width: calc(666 / 650 * 100%);
	margin-left: calc(-8 / 650 * 100%);
	padding: calc(25 / 650 * 100%);
}

.twitter_wrap {
	padding: calc(30 / 666 * 100%);
	background-color: #f8f8f8;
}

.twitter_box {
	padding-top: calc(535 / 606 * 100%);
	overflow: hidden;
}

.twitter_box iframe {
	width: 740px !important;
	height: 30em !important;
	font-size: 2rem;
	position: absolute !important;
	top: 0;
	left: 0;
	-webkit-overflow-scrolling: touch;
}

.sns_list {
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	margin-top: calc(30 / 650 * 100%);
}

.sns_list li {
	width: calc(202 / 650 * 100%);
}

@media screen and (min-width: 768px) {
	.sns {
		padding: calc(100 / 1200 * 100%) 0 calc(180 / 1200 * 100%);
	}

	.sns .inner::before {
		width: calc(129 / 1200 * 100%);
		padding-top: calc(127 / 1200 * 100%);
		margin: calc(-100 / 1200 * 100%) calc(134 / 1200 * 100%) 0 0;
	}

	.sns .inner::after {
		width: calc(182 / 1200 * 100%);
		padding-top: calc(161 / 1200 * 100%);
		margin: calc(-182 / 1200 * 100%) calc(42 / 1200 * 100%) 0 0;
	}

	.sns h2 {
		margin-bottom: calc(50 / 1000 * 100%);
	}

	.sns_box {
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}

	.twitter {
		background: url(../images/top/bg_twitter_pc.png) no-repeat center/contain;
		width: calc(516 / 1000 * 100%);
		margin: 0 calc(50 / 1000 * 100%) 0 0;
		padding: calc(20 / 1000 * 100%);
		height: 100%;
	}

	.twitter_wrap {
		padding: calc(10 / 476 * 100%);
	}

	.twitter_box {
		padding-top: calc(345 / 466 * 100%);
	}

	.twitter_box iframe {
		height: 100% !important;
	}

	.sns_list {
		/*		display: block;*/
		margin: 0;
		width: 100%;
		/*        width: calc(400 / 1000 * 100%);*/
	}

	.sns_list li {
		width: 100%;
		margin: calc(16 / 400 * 100%) calc(2 / 400 * 100%) 0;
	}

	.sns_list li {
		background: url(../images/top/bg_btn_sns.png) no-repeat center/contain;
		padding: calc(12 / 400 * 100%) calc(4 / 400 * 100%);
	}

	.sns_list li a {
		overflow: hidden;
	}

	.sns_list li a::before {
		content: '';
		position: absolute;
		bottom: -70px;
		right: 0;
		background: url(../images/top/img_sns_h.png) no-repeat center/contain;
		width: calc(76 / 376 * 100%);
		padding-top: calc(66 / 376 * 100%);
		z-index: 2;
		margin: 0 calc(19 / 376 * 100%) 0 0;
		-webkit-transition: .3s;
		transition: .3s;
	}

	.sns_list li a:hover::before {
		bottom: 0;
		-webkit-transition: .3s;
		transition: .3s;
	}

}

@media screen and (min-width: 1200px) {
	.sns {
		padding: 100px 0 180px;
	}
}


/* =====================================================================
*    hulu_popup
* =================================================================== */
.hulu_popup {
	display: none;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.7);
	z-index: 100000;
}

.hulu_popup_inner {
	width: calc(650 / 750 * 100%);
	max-width: 650px;
	height: auto;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	margin: auto;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	text-align: center;
}

.hulu_popup_area1 {}

.hulu_popup_btn {
	width: calc(300 / 650 * 100%);
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: calc(295 / 650 * 100%) auto 0;
}

.hulu_popup_btn a {
	padding: 0.7em 0;
	background-color: #fff;
	border: 1px solid #000;
	font-size: 2.4rem;
	line-height: 1;
}

.hulu_popup_btn a::after {
	content: "";
	display: block;
	width: 0.4em;
	height: 0.4em;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto 1em auto 0;
}

.hulu_popup_area2 {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	margin: calc(453 / 650 * 100%) 0 0;
}

.hulu_link_list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin: 0 0 calc(80 / 650 * 100%);
}

.hulu_link_list li {
	width: calc(264 / 650 * 100%);
	margin: 0 calc(40 / 650 * 100%) 0 0;
}

.hulu_link_list li:last-child {
	margin-right: 0;
}

.hulu_popup_check {
	color: #e9ebec;
	font-size: 2rem;
	font-weight: 700;
	letter-spacing: 0.05em;
}

.hulu_popup_check input {
	-webkit-transform: scale(1.5);
	transform: scale(1.5);
	margin-right: 10px;
	top: -0.13em;
	cursor: pointer;
}

.hulu_popup_close {
	margin: calc(35 / 650 * 100%) 0 0;
	color: #bda855;
	font-size: 2.4rem;
	line-height: 1;
	text-align: center;
	cursor: pointer;
	-webkit-transition: 0.3s ease;
	transition: 0.3s ease;
}

.hulu_popup_close::before {
	content: "×";
	display: inline-block;
	margin-right: 0.5em;
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	position: relative;
	top: 0.05em;
}

@media screen and (min-width: 768px) {
	.hulu_popup_btn {
		width: calc(200 / 650 * 100%);
		margin: calc(310 / 650 * 100%) auto 0;
	}

	.hulu_popup_btn a {
		padding: 0.6em 0 0.75em;
		font-size: 16px;
	}

	.hulu_popup_btn a:hover {
		background-color: #000;
		color: #fff;
	}

	.hulu_popup_btn a:hover::after {
		border-color: #fff;
	}

	.hulu_link_list {
		margin: 0 0 calc(87 / 650 * 100%);
	}

	.hulu_link_list li a:hover {
		opacity: 0.7;
	}

	.hulu_popup_check {
		font-size: 16px;
	}

	.hulu_popup_check input {
		top: 0;
	}

	.hulu_popup_close {
		margin: calc(25 / 650 * 100%) 0 0;
		font-size: 18px;
	}

	.hulu_popup_close:hover {
		opacity: 0.7;
	}
}
