@charset "UTF-8";

/*************************************************************
 *	milky milky.css
 ************************************************************/

*,::before,::after{box-sizing:border-box;border-style:solid;border-width:0}
html{line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{margin:0}
main{display:block}
p,table,blockquote,address,pre,iframe,form,figure,dl{margin:0}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0}
ul,ol{margin:0;padding:0;list-style:none}
dt{font-weight:700}
dd{margin-left:0}
hr{box-sizing:content-box;height:0;overflow:visible;border-top-width:1px;margin:0;clear:both;color:inherit}
pre{font-family:monospace,monospace;font-size:inherit}
address{font-style:inherit}
a{background-color:transparent;text-decoration:none;color:inherit}
abbr[title]{text-decoration:underline dotted}
b,strong{font-weight:bolder}
code,kbd,samp{font-family:monospace,monospace;font-size:inherit}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-.25em}
sup{top:-.5em}
svg,img,embed,object,iframe{vertical-align:bottom}
button,input,optgroup,select,textarea{-webkit-appearance:none;appearance:none;vertical-align:middle;color:inherit;font:inherit;background:transparent;padding:0;margin:0;border-radius:0;text-align:inherit;text-transform:inherit}
[type="checkbox"]{-webkit-appearance:checkbox;appearance:checkbox}
[type="radio"]{-webkit-appearance:radio;appearance:radio}
button,[type="button"],[type="reset"],[type="submit"]{cursor:pointer}
button:disabled,[type="button"]:disabled,[type="reset"]:disabled,[type="submit"]:disabled{cursor:default}
:-moz-focusring{outline:auto}
select:disabled{opacity:inherit}
option{padding:0}
fieldset{margin:0;padding:0;min-width:0}
legend{padding:0}
progress{vertical-align:baseline}
textarea{overflow:auto}
[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}
[type="search"]{outline-offset:-2px}
[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
label[for]{cursor:pointer}
details{display:block}
summary{display:list-item}
[contenteditable]:focus{outline:auto}
table{border-color:inherit}
caption{text-align:left}
td,th{vertical-align:top;padding:0}
th{text-align:left;font-weight:700}


/* --------------------------------------------------
	foundation
-------------------------------------------------- */
:root {
	--bar-width: 17px;
	--vh: 100vh;
}
html {
	font-size: 62.5%;
	background-color: #e70d1e;
}
html.is-naviopen {
}
body {
	position: relative;
	font-family: 'YuGothic', 'Yu Gothic', sans-serif;
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1.8;
	color: #ffffff;
}
svg {
	height: auto;
}
@media screen and (min-width: 768px) {
	html.is-naviopen,
	html.is-modalopen {
		margin-right: var(--bar-width);
	}
	img,
	svg {
		max-width: 100%;
	}
}
@media screen and (max-width: 767px) {
	body {
		font-size: 1.4rem;
	}
	img,
	svg {
		width: 100%;
	}
}
@keyframes hoverScalePop05 {
	  0% { transform: scale(1.0); }
	 50% { transform: scale(1.05); }
	100% { transform: scale(1.0); }
}
@keyframes hoverScalePop10 {
	  0% { transform: scale(1.0); }
	 50% { transform: scale(1.1); }
	100% { transform: scale(1.0); }
}


/* --------------------------------------------------
	layout
-------------------------------------------------- */
.l-cts {
	position: relative;
}
.l-cts__inner {
	position: relative;
	margin: 0 auto;
}
.l-main {
	position: relative;
	z-index: 2;
	padding-top: 80px;
}
.l-header {
	position: fixed;
	z-index: 100;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #e70d1e;
}
.l-header .l-header__inner {
	padding: 0 0;
	max-width: none;
	height: 80px;
}
.l-header__fujiyatop {
	position: absolute;
	left: 40px;
	top: 50%;
	transform: translateY(-50%);
}
.l-header__fujiyatop a {
	position: relative;
	display: inline-block;
	font-size: 1.6rem;
	letter-spacing: 0.1em;
	padding-right: 25px;
	background-image: url(../img/arrow_01.svg);
	background-size: 13px auto;
	background-position: right center;
	background-repeat: no-repeat;
}
.l-header__milky {
	width: 117px;
	margin: 0 auto;
	padding-top: 20px;
}
.l-header__followus {
	position: absolute;
	right: 120px;
	top: 50%;
	transform: translateY(-50%);
}
.l-header__followus a {
	display: flex;
	align-items: center;
	font-size: 1.3rem;
}
.l-header__followus .text--01 {
	position: relative;
	padding-right: 20px;
	margin-right: 10px;
	letter-spacing: 0.1em;
}
.l-header__followus .text--01:before {
	content: "";
	position: absolute;
	top: calc(50% - 6px);
	right: 0;
	width: 24px;
	height: 2px;
	border-radius: 2px 2px;
	background-color: #ffffff;
	transform-origin: right center;
	transform: rotate(35deg);
}
.l-header__followus .text--01:after {
	content: "";
	position: absolute;
	top: calc(50% + 6px);
	right: 0;
	width: 24px;
	height: 2px;
	border-radius: 2px 2px;
	background-color: #ffffff;
	transform-origin: right center;
	transform: rotate(-35deg);
}
.l-header__followus .text--02 {
	display: block;
	text-align: center;
	line-height: 1.3;
	color: #e70d1e;
	background-color: #ffffff;
	padding: 8px 0;
	width: 150px;
	border-radius: 30px 30px;
}
.l-nav-toggle__button {
	position: fixed;
	z-index: 220;
	top: 20px;
	right: 40px;
}
.l-nav-toggle__button a {
	display: block;
	font-size: 0;
	width: 40px;
	height: 40px;
}
.l-nav-toggle__button a:before {
	content: "";
	position: absolute;
	top: calc(50% - 14px);
	width: 100%;
	height: 4px;
	background-color: #ffffff;
	border-radius: 2px 2px;
}
.l-nav-toggle__button a:after {
	content: "";
	position: absolute;
	top: calc(50% + 10px);
	width: 100%;
	height: 4px;
	background-color: #ffffff;
	border-radius: 2px 2px;
}
.l-nav-toggle__button a span {
	position: absolute;
	top: calc(50% - 2px);
	width: 100%;
	height: 4px;
	background-color: #ffffff;
	border-radius: 2px 2px;
}
.l-nav-toggle__button.is-open a:before {
	top: calc(50% - 2px);
	transform: rotate(45deg);
}
.l-nav-toggle__button.is-open a:after  {
	top: calc(50% - 2px);
	transform: rotate(-45deg);
}
.l-nav-toggle__button.is-open a span {
	opacity: 0;
}
.l-nav__modal {
	position: fixed;
	z-index: 210;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #e70d1e;
	display: none;
}
.l-nav-modal__outer {
	position: relative;
	height: 100%;
	overflow-y: auto;
}
.l-nav-modal__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100%;
	padding: 100px 0;
	margin: auto 0;
}
.l-nav-modal__list {
	text-align: center;
}
.l-nav-modal__list li + li {
	margin-top: 40px;
}
.l-nav-modal__list li a {
	display: inline-block;
	font-size: 3.2rem;
	line-height: 1;
}
.l-nav-modal__list li a span {
	display: inline-block;
	font-size: 1.6rem;
}
.l-footer {
	position: relative;
	z-index: 2;
	background-color: #e70d1e;
	padding: 17px 0;
	margin-top: 200px;
}
.l-footer__logo {
	width: 165px;
	margin: 0 auto 15px;
	display: block;
}
.l-footer__copyright {
	font-size: 1.2rem;
	line-height: 1;
	text-align: center;
	letter-spacing: 0.05em;
}
.l-footer__pagetop {
	position: absolute;
	bottom: 150px;
	left: 30px;
}
.l-footer__pagetop a {
	position: relative;
	display: block;
	width: 150px;
	height: 150px;
	font-size: 0;
}
.l-footer__pagetop a:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(../img/pagetop_01.svg);
	background-size: contain;
}
.l-footer__pagetop a span {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: block;
	width: calc(33 / 150 * 100%);
}
.l-footer__sns {
	position: absolute;
	right: 30px;
	bottom: 130px;
	opacity: 0;
}
.l-footer__sns .title {
	width: 224px;
	margin: 0 auto 20px;
}
.l-footer__sns .list {
	display: flex;
	margin: 0 -10px;
}
.l-footer__sns .list li {
	margin: 0 10px;
}
.l-footer__sns .list li a {
	display: block;
	width: 60px;
	text-align: center;
}
.l-footer__sns .list li a span {
	display: block;
	font-size: 1.4rem;
	line-height: 1.5;
	margin-top: 4px;
}
@media screen and (min-width: 768px) {
	.l-cts__inner {
		padding: 0 30px;
	}
	.l-cts__inner.min {
		padding: 0 calc(30px + 5%);
	}
	html.is-naviopen .l-header,
	html.is-modalopen .l-header {
		padding-right: calc(var(--bar-width));
	}
	.l-header__fujiyatop a:hover {
		animation: hoverScalePop10 0.3s ease;
	}
	.l-header__followus a:hover .text--01 {
		animation: hoverScalePop10 0.3s ease;
	}
	.l-nav-toggle__button a:hover {
		animation: hoverScalePop10 0.3s ease;
	}
	html.is-naviopen .l-nav-toggle__button,
	html.is-modalopen .l-nav-toggle__button {
		right: calc(40px + var(--bar-width));
	}
	.l-nav-modal__list li a:hover {
		animation: hoverScalePop10 0.3s ease;
	}
	.l-footer__pagetop a:hover img {
		animation: pagetopArrow 0.4s ease 0s infinite;
	}
	.l-footer__pagetop a:hover:before {
		transform: rotate(0deg);
		animation: pagetopBg 0.8s steps(3) infinite;
	}
	.l-footer__sns .list li a:hover img {
		animation: hoverScalePop10 0.4s ease 0s;
	}
}
@media screen and (min-width: 1157px) {
	.l-cts__inner.min {
		max-width: 1020px;
		padding: 0 30px;
	}
}
@media screen and (min-width: 1277px) {
	.l-cts__inner {
		max-width: 1260px;
	}
}
@media screen and (max-width: 1297px) {
	.l-header__fujiyatop {
		left: calc(10px - (1297px - 100vw) * 0.5 + 30px);
	}
	.l-header__followus {
		right: calc(10px - (1297px - 100vw) * 0.5 + 110px);
	}
	.l-nav-toggle__button {
		right: calc(10px - (1297px - 100vw) * 0.5 + 30px);
	}
	html.is-naviopen .l-nav-toggle__button,
	html.is-modalopen .l-nav-toggle__button {
		right: calc(10px - (1297px - 100vw) * 0.5 + 30px + var(--bar-width));
	}
}
@media screen and (max-width: 1277px) {
	.l-header__fujiyatop {
		left: 30px;
	}
	.l-header__followus {
		right: 110px;
	}
	.l-nav-toggle__button {
		right: 30px;
	}
	html.is-naviopen .l-nav-toggle__button,
	html.is-modalopen .l-nav-toggle__button {
		right: calc(30px + var(--bar-width));
	}
}
@media screen and (max-width: 997px) {
	.l-header__followus .text--01 {
		display: none;
	}
}
@media screen and (max-width: 767px) {
	.l-cts__inner,
	.l-cts__inner.min {
		padding: 0 8%;
	}
	.l-main {
		padding-top: 50px;
	}
	.l-header .l-header__inner {
		height: 50px;
	}
	.l-header__fujiyatop {
		left: 4%;
	}
	.l-header__fujiyatop a {
		font-size: 1.1rem;
		padding-right: 20px;
		background-size: 10px auto;
	}
	.l-header__milky {
		width: 78px;
		padding-top: 10px;
	}
	.l-header__followus {
		display: none;
	}
	.l-nav-toggle__button {
		top: 15px;
		right: 4%;
	}
	html.is-naviopen .l-nav-toggle__button,
	html.is-modalopen .l-nav-toggle__button {
		right: 4%;
	}
	.l-nav-toggle__button a {
		width: 20px;
		height: 20px;
	}
	.l-nav-toggle__button a:before {
		top: calc(50% - 7px);
		height: 2px;
	}
	.l-nav-toggle__button a:after {
		top: calc(50% + 5px);
		height: 2px;
	}
	.l-nav-toggle__button a span {
		top: calc(50% - 1px);
		height: 2px;
	}
	.l-nav-modal__inner {
		padding: 60px 0;
	}
	.l-nav-modal__list li + li {
		margin-top: 30px;
	}
	.l-nav-modal__list li a {
		font-size: 2.5rem;
	}
	.l-nav-modal__list li a span {
		font-size: 1.3rem;
	}
	.l-footer {
		padding: 9px 0;
		margin-top: 100px;
	}
	.l-footer__logo {
		width: 83px;
		margin-bottom: 7px;
	}
	.l-footer__copyright {
		font-size: 0.6rem;
	}
	.l-footer__pagetop {
		bottom: 60px;
		left: 4%;
	}
	.l-footer__pagetop a {
		width: 70px;
		height: 70px;
	}
	.l-footer__sns {
		right: 4%;
		bottom: 60px;
	}
	.l-footer__sns .title {
		width: 112px;
		margin-bottom: 10px;
	}
	.l-footer__sns .list {
		margin: 0 -5px;
	}
	.l-footer__sns .list li {
		margin: 0 5px;
	}
	.l-footer__sns .list li a {
		width: 40px;
	}
	.l-footer__sns .list li a span {
		font-size: 0.8rem;
		margin-top: 2px;
	}
}
@media screen and (max-width: 320px) {
	.l-footer__sns .list {
		margin: 0 -2px;
	}
	.l-footer__sns .list li {
		margin: 0 2px;
	}
}
@keyframes pagetopArrow {
	  0% { transform: scale(1.0); }
	 50% { transform: scale(1.1); }
	100% { transform: scale(1.0); }
}
@keyframes pagetopBg {
	to { transform: rotate(45deg); }
}


/* --------------------------------------------------
	component
-------------------------------------------------- */
.c-button--a {
}
.c-h2__title {
	position: relative;
	line-height: 1;
	text-align: center;
	margin-bottom: 60px;
}
.c-h2__title .en {
	position: relative;
	z-index: 1;
	display: inline-block;
	margin-bottom: 30px;
	font-size: 0;
}
.c-h2__title .en img {
	position: relative;
	z-index: 2;
	width: auto;
	height: 67px;
	transform: translateZ(0);
}
.c-h2__title .en img.clone {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: auto;
	height: 100%;
}
.c-h2__title .jp {
	position: relative;
	display: inline-block;
	font-size: 2.4rem;
}
.c-h3__title {
	position: relative;
	line-height: 1;
	text-align: center;
}
.c-h3__title .en {
	position: relative;
	z-index: 1;
	display: inline-block;
	margin-bottom: 20px;
}
.c-h3__title .en img {
	position: relative;
	z-index: 2;
	width: auto;
	height: 50px;
	transform: translateZ(0);
}
.c-h3__title .jp {
	position: relative;
	display: inline-block;
	font-size: 2.0rem;
}
[class*=c-fadeIn] {
	position: relative;
	opacity: 0;
}
@media screen and (min-width: 768px) {
	.c-button--a.s05:hover {
		animation: hoverScalePop05 0.3s ease;
	}
	.c-button--a.s10:hover {
		animation: hoverScalePop10 0.3s ease;
	}
}
@media screen and (max-width: 767px) {
	.c-h2__title {
		margin-bottom: 30px;
	}
	.c-h2__title .en {
		margin: 0 auto 15px;
		height: calc(100vw / 750 * 67);
	}
	.c-h2__title .en img {
		height: calc(100vw / 750 * 67);
	}
	.c-h2__title .jp {
		font-size: 1.8rem;
	}
	.c-h3__title .en {
		margin: 0 auto 10px;
	}
	.c-h3__title .en img {
		height: calc(100vw / 750 * 50);
	}
	.c-h3__title .jp {
		font-size: 1.4rem;
	}
}


/* --------------------------------------------------
	project
-------------------------------------------------- */
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
}


/* --------------------------------------------------
	utility
-------------------------------------------------- */
.u-font-weight--noraml {
	font-family: 'YuGothic', 'Yu Gothic Medium', 'Yu Gothic', sans-serif;
	font-weight: 400;
}
.u-font-weight--bold {
	font-family: 'YuGothic', 'Yu Gothic', sans-serif;
	font-weight: 700;
}
.u-font--tsukushi {
	font-family: fot-tsukuardgothic-std, sans-serif;
}
.u-font-space--palt {
	font-feature-settings: "palt";
}
@media screen and (min-width: 768px) {
	.u-ancher {
		padding-top: 80px;
		margin-top: -80px;
	}
	.u-sp {
		display: none;
	}
}
@media screen and (max-width: 767px) {
	.u-ancher {
		padding-top: 50px;
		margin-top: -50px;
	}
	.u-pc {
		display: none;
	}
}


/* --------------------------------------------------
	bgmovie
-------------------------------------------------- */
.bgmovie {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.bgmovie:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(../img/bg_01.png);
	background-size: 100px 100px;
}
.bgmovie video {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
	.bgmovie:after {
		background-size: 50px 50px;
	}
}


/* --------------------------------------------------
	visual
-------------------------------------------------- */
.visual .l-cts__inner {
	max-width: none;
	padding: 0 0;
	height: calc(100vh - 80px);
	min-height: 800px;
	overflow: hidden;
	background-color: #e70d1e;
}
.visual img {
	max-width: none;
	width: 100%;
}
.visual__image {
	position: relative;
	opacity: 0;
	display: flex;
	height: 100%;
}
.visual__image .image {
	width: 50%;
	height: 100%;
}
.visual__image .image img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	object-position: 20% 20%;
}
.visual__title {
	position: absolute;
	bottom: calc(150 / 1080 * 100%);
	left: 50%;
	width: calc(1000 / 1560 * 100%);
	max-width: 1000px;
	transform: translateX(-50%);
	opacity: 0;
}
.visual__logo {
	position: absolute;
	opacity: 0;
	top: calc(30 / 1080 * 100%);
	left: calc(30 / 1560 * 100%);
	width: calc(78 / 1560 * 100%);
}
.visual__scroller {
	position: absolute;
	z-index: 2;
	width: 8px;
	height: 180px;
	background-color: #ffffff;
	border-radius: 4px 4px;
	bottom: -90px;
	left: calc(50% - 4px);
	opacity: 0;
}
.visual__scroller:before {
	content: "";
	position: absolute;
	top: 0;
	left: -12px;
	width: 32px;
	height: 32px;
	border-radius: 50% 50%;
	background-color: #ffffff;
	animation: visualScroller 2s ease 0s infinite;
}
.visual__banner {
	position: absolute;
	right: 40px;
	bottom: 40px;
	z-index: 90;
	opacity: 0;
}
.visual__banner a {
	position: relative;
	display: block;
	font-size: 0;
}
.visual__banner a .icon {
	position: absolute;
	z-index: 1;
	display: block;
	width: calc(45 / 300 * 100%);
	height: calc(45 / 100 * 100%);
	top: calc(28 / 100 * 100%);
	left: calc(228 / 300 * 100%);
}
.visual__banner a .icon .bg {
	position: relative;
	display: block;
	animation: visualbnrBg 0.8s steps(3) infinite;
}
.visual__banner a .icon .arrow {
	position: absolute;
	z-index: 1;
	display: block;
	width: calc(25 / 90 * 100%);
	height: calc(28 / 90 * 100%);
	top: calc(31 / 90 * 100%);
	left: calc(33 / 90 * 100%);
	animation: visualbnrArrow 0.6s ease 0s infinite;
}
@media screen and (min-width: 768px) {
	.visual__image .image.sp {
		display: none;
	}
}
@media screen and (max-width: 767px) {
	.visual .l-cts__inner {
		height: auto;
		min-height: 0;
	}
	.visual__image {
		display: block;
		height: auto;
	}
	.visual__image .image {
		width: 100%;
		height: calc(var(--vh) * 100 - 50px);
	}
	.visual__image .image img {
		object-position: 0 0;
	}
	.visual__image .image.pc {
		display: none;
	}
	.visual__title {
		position: absolute;
		top: calc(470 / 1176 * 100%);
		width: calc(720 / 750 * 100%);
		max-width: none;
	}
	.visual__logo {
		position: absolute;
		top: calc(20 / 1176 * 100%);
		left: calc(20 / 750 * 100%);
		width: calc(120 / 750 * 100%);
	}
	.visual__scroller {
		width: 4px;
		height: 80px;
		bottom: -15px;
		left: calc(50% - 2px);
	}
	.visual__scroller:before {
		left: -6px;
		width: 16px;
		height: 16px;
		animation: visualScrollerSp 2s ease 0s infinite;
	}
	.visual__banner {
		right: 4%;
		bottom: 15px;
	}
	.visual__banner a {
		width: 150px;
	}
	@media (orientation: landscape) {
		.visual__image .image {
			width: 100%;
			height: calc(100vw / 750 * 1176);
		}
	}
}
@keyframes visualScroller {
	  0% { top: 0; }
	 50% { top: calc(100% - 32px) }
	100% { top: 0 }
}
@keyframes visualScrollerSp {
	  0% { top: 0; }
	 50% { top: calc(100% - 16px) }
	100% { top: 0 }
}
@keyframes visualbnrArrow {
	  0% { transform: translateY(0); }
	 50% { transform: translateY(10%); }
	100% { transform: translateY(0); }
}
@keyframes visualbnrBg {
	to { transform: rotate(45deg); }
}


/* --------------------------------------------------
	lead
-------------------------------------------------- */
.lead .l-cts {
	padding: 240px 0 120px;
}
.lead__title {
	font-size: 6.4rem;
	line-height: 1.4;
	text-align: center;
	margin: 0 -20px 60px;
}
.lead__title span {
	position: relative;
	display: inline-block;
}
.lead__title > span:before {
	content: "";
	position: absolute;
	bottom: 0.15em;
	left: 0;
	width: 0;
	height: 0.5em;
	background-color: #ff0042;
	border-radius: 6px 6px;
	transition: width .4s cubic-bezier(0.77, 0, 0.175, 1);
}
.lead__title > span.is-show:before {
	width: 100%;
}
.lead__title span span {
	z-index: 1;
	padding: 0 0.2em;
}
.lead__text {
	font-size: 2.4rem;
	line-height: 2.0;
	text-align: center;
}
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
	.lead .l-cts {
		padding: 120px 0 60px;
	}
	.lead__title {
		font-size: 3.2rem;
		margin: 0 calc(-60 / 630 * 100%) 30px;
	}
	.lead__text {
		font-size: 1.6rem;
	}
}


/* --------------------------------------------------
	adgallery
-------------------------------------------------- */
.adgallery .l-cts {
	padding: 120px 0;
}
.adgallery__title {
	margin-bottom: 120px;
}
.adgallery__unit + .adgallery__unit {
	margin-top: 120px;
}
.adgallery__subtitle {
	margin-bottom: 30px;
}
.movie__box .movie-wrap {
	position: relative;
	border-radius: 10px 10px;
	border: 8px solid #ffffff;
	background-color: #000000;
}
.movie__box .movie-wrap .movie {
	position: relative;
	overflow: hidden;
	height: 0;
	padding-bottom: 56.25%;
}
.movie__box .movie-wrap .thumb {
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	cursor: pointer;
	display: none;
}
.movie__box .movie-wrap.is-ready .thumb {
	display: block;
}
.movie__box .movie-wrap .thumb:after {
	content: "";
	position: absolute;
	z-index: 1;
	top: calc(50% - 43px);
	left: calc(50% - 68px);
	width: 136px;
	height: 86px;
	background-image: url(../img/icon_play.svg);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	pointer-events: none;
}
.movie__box .movie-wrap .movie iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.movie__box .movie-select {
	position: relative;
	margin: 30px auto 0;
	border-radius: 10px 10px;
	border: 4px solid #ffffff;
	width: 372px;
	display: flex;
	justify-content: center;
	background-color: #ffffff;
}
.movie__box .movie-select:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 50%;
	height: 100%;
	background-color: #ff0042;
	border-radius: 8px 8px;
	transition: left 0.3s ease;
}
.movie__box .movie-select[data-pt="1"]:before {
	left: 0;
}
.movie__box .movie-select[data-pt="2"]:before {
	left: 50%;
}
.movie__box .movie-select li {
	width: 50%;
}
.movie__box .movie-select li a {
	position: relative;
	z-index: 1;
	text-align: center;
	display: block;
	padding: 10px 0;
	color: #ff0042;
}
.movie__box .movie-select li a.is-active {
	color: #ffffff;
}
.graphic__box {
	margin: 0 -15px;
}
.graphic__box .item {
	text-align: center;
	font-size: 0;
}
.graphic__box .image {
	position: relative;
	border-radius: 10px 10px;
	background-color: #ffffff;
	display: block;
	margin: 0 auto;
	overflow: hidden;
}
.graphic__box .image:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	box-shadow: 0 0 0 8px inset;
}
.graphic__box .image.type--a {
	width: calc(100% - 30px);
}
.graphic__box .image.type--b {
	width: calc((100% - 30px) * 0.5);
}
.graphic__box .slick-arrow.slick-prev {
	left: -45px;
}
.graphic__box .slick-arrow.slick-next {
	right: -45px;
}
.adgallery-modal {
	position: relative;
	margin: 60px auto;
	padding: 0 40px;
	font-size: 0;
}
.adgallery-modal.type--a {
	max-width: 1212px;
}
.adgallery-modal.type--b {
	max-width: 646px;
}
.adgallery-modal .inner {
	position: relative;
	overflow: hidden;
	border: 8px solid #ff0042;
	border-radius: 20px 20px;
}
.adgallery-modal .mfp-close {
	top: -30px;
	right: 10px;
}
.mfp-adgallery.mfp-bg {
}
@media screen and (min-width: 768px) {
	.movie__box .movie-wrap .thumb:hover:after {
		animation: hoverScalePop10 0.3s ease;
	}
	.movie__box .movie-select li a:not(.is-active):hover {
		animation: hoverScalePop10 0.3s ease;
	}
}
@media screen and (max-width: 767px) {
	.adgallery .l-cts {
		padding: 60px 0;
	}
	.adgallery__title {
		margin-bottom: 60px;
	}
	.adgallery__unit + .adgallery__unit {
		margin-top: 60px;
	}
	.adgallery__subtitle {
		margin-bottom: 15px;
	}
	.movie__box .movie-wrap {
		border-radius: 6px 6px;
		border-width: 4px;
	}
	.movie__box .movie-wrap .thumb:after {
		top: calc(50% - 24px);
		left: calc(50% - 38px);
		width: 75px;
		height: 48px;
	}
	.movie__box .movie-select {
		margin-top: 15px;
		border-radius: 8px 8px;
		border-width: 3px;
		width: 212px;
	}
	.movie__box .movie-select:before {
		border-radius: 6px 6px;
	}
	.movie__box .movie-select li a {
		padding: 6px 0;
	}
	.graphic__box {
		margin: 0 calc(100vw / 750 * -30);
	}
	.graphic__box .image {
		border-radius: 6px 6px;
	}
	.graphic__box .image:after {
		box-shadow: 0 0 0 4px inset;
	}
	.graphic__box .image.type--a {
		width: calc(100% - (100vw / 750 * 60));
	}
	.graphic__box .image.type--b {
		width: calc((100% - (100vw / 750 * 60)) * 0.5);
	}
	.graphic__box .slick-arrow.slick-prev {
		left: calc(100vw / 750 * -15);
	}
	.graphic__box .slick-arrow.slick-next {
		right: calc(100vw / 750 * -15);
	}
	.adgallery-modal {
		padding: 0 0;
	}
	.adgallery-modal.type--a {
		max-width: calc(100vw / 750 * 680);
	}
	.adgallery-modal.type--b {
		max-width: calc(100vw / 750 * 570);
	}
	.adgallery-modal .inner {
		border-width: 4px;
		border-radius: 10px 10px;
	}
	.adgallery-modal .mfp-close {
		top: -15px;
		right: -15px;
	}
}


/* --------------------------------------------------
	profile
-------------------------------------------------- */
.profile .l-cts {
	padding: 120px 0;
}
.profile-cols {
	display: flex;
	justify-content: space-between;
}
.profile__image {
	width: calc(330 / 960 * 100%);
}
.profile__image .image {
	position: relative;
	overflow: hidden;
	border-radius: 10px 10px;
}
.profile__body {
	width: calc(570 / 960 * 100%);
}
.profile__body .title {
	width: 222px;
	margin-bottom: 20px;
}
.profile__body .text {
	line-height: 2.0;
}
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
	.profile .l-cts {
		padding: 60px 0;
	}
	.profile-cols {
		display: block;
	}
	.profile__image {
		width: calc(510 / 630 * 100%);
		margin: 0 auto 30px;
	}
	.profile__image .image {
		border-radius: 6px 6px;
	}
	.profile__body {
		width: calc(510 / 630 * 100%);
		margin: 0 auto;
	}
	.profile__body .title {
		width: 166px;
	}
}


/* --------------------------------------------------
	character
-------------------------------------------------- */
.character .l-cts {
	padding: 120px 0;
}
.character__title {
	margin-bottom: 0;
}
.character__wrap {
	padding: 170px 0 120px;
	margin-top: -80px;
	background-color: #ff9bb6;
	border-radius: 20px 20px;
}
.character__inner {
	max-width: 1080px;
	padding: 0 calc(60 / 1200 * 100%);
	margin: 0 auto;
}
.character-cols {
	display: flex;
	margin-bottom: 120px;
	justify-content: space-between;
}
.character__image {
	width: calc(450 / 960 * 100%);
}
.character__image .image {
	position: relative;
	max-width: calc(332 / 450 * 100%);
	width: 100%;
	margin: 0 auto;
}
.character__image .image a {
	position: absolute;
	display: block;
	width: calc(48 / 332 * 100%);
	filter: drop-shadow(3px 6px 0 rgba(0, 0, 0, 0.15));
}
.character__image .image a:nth-of-type(1) {
	top: calc(58 / 641 * 100%);
	left: calc(33 / 332 * 100%);
}
.character__image .image a:nth-of-type(2) {
	top: calc(-34 / 641 * 100%);
	left: calc(138 / 332 * 100%);
}
.character__image .image a:nth-of-type(3) {
	top: calc(229 / 641 * 100%);
	left: calc(6 / 332 * 100%);
}
.character__image .image a:nth-of-type(4) {
	top: calc(485 / 641 * 100%);
	left: calc(302 / 332 * 100%);
}
.character__image .image a:nth-of-type(5) {
	top: calc(477 / 641 * 100%);
	left: calc(38 / 332 * 100%);
}
.character__image .image a:nth-of-type(6) {
	top: calc(214 / 641 * 100%);
	left: calc(306 / 332 * 100%);
}
.character__body {
	width: calc(450 / 960 * 100%);
	align-self: center;
}
.character__body .text {
	margin-bottom: 60px;
}
.character__body .list {
	display: flex;
	flex-wrap: wrap;
	margin: -30px calc(-15 / 450 * 100%);
}
.character__body .list .item {
	width: calc(1 / 3 * 100%);
	padding: 0 calc(15 / 480 * 100%);
	margin-top: 30px;
	text-align: center;
	font-size: 1.6rem;
	line-height: 1.3;
}
.character__body .list .item a {
	display: block;
	border: 4px solid #ffffff;
	overflow: hidden;
	border-radius: 8px 8px;
	margin-bottom: 8px;
	background-color: #ffffff;
}
.character-modal {
	position: relative;
	max-width: 600px;
	margin: 60px auto;
	border: 8px solid #ff0042;
	border-radius: 20px 20px;
	padding: 40px 0 50px;
	background-color: #ffffff;
	text-align: center;
}
.character-modal .image {
	max-width: 352px;
	margin: 0 auto;
}
.character-modal .body {
	color: #ff0042;
	margin-top: 30px;
	padding: 0 calc(60 / 584 * 100%);
}
.character-modal .title {
	font-size: 3.2rem;
	line-height: 1.4;
}
.character-modal .text {
	font-size: 1.6rem;
	margin-top: 10px;
}
.character-modal .mfp-close {
	top: -30px;
	right: -30px;
}
.mfp-character.mfp-bg {
	opacity: 0;
}
.illustrator__subtitle {
	position: relative;
	padding: 30px 10px 0;
	margin: -30px -10px 30px;
	overflow: hidden;
}
.illustrator__subtitle .en:before {
	content: "";
	position: absolute;
	top: calc(50% - 2px);
	left: calc(100% + 20px);
	height: 4px;
	width: calc((960px - 100%) * 0.5 - 20px);
	background-color: #ffffff;
	box-shadow: 4px 4px #ff0042;
}
.illustrator__subtitle .en:after {
	content: "";
	position: absolute;
	top: calc(50% - 2px);
	right: calc(100% + 20px);
	height: 4px;
	width: calc((960px - 100%) * 0.5 - 20px);
	background-color: #ffffff;
	box-shadow: 4px 4px #ff0042;
}
.illustrator-cols {
	position: relative;
	display: flex;
	justify-content: space-between;
}
.illustrator__image {
	width: calc(240 / 960 * 100%);
}
.illustrator__image .image {
	position: relative;
	overflow: hidden;
	border-radius: 8px 8px;
}
.illustrator__body {
	width: calc(680 / 960 * 100%);
}
.illustrator__body .name {
	width: 116px;
	font-size: 1;
	margin-bottom: 20px;
}
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 1027px) {
	.character__body .text br.u-pc {
		display: none;
	}
}
@media screen and (max-width: 767px) {
	.character .l-cts {
		padding: 60px 0;
	}
	.character__wrap {
		padding: calc(65px + calc(100vw / 750 * 70)) 0 60px;
		margin-top: calc(-35px - calc(100vw / 750 * 30));
		border-radius: 10px 10px;
	}
	.character__inner {
		max-width: none;
		padding: 0 calc(30 / 630 * 100%);
	}
	.character-cols {
		display: block;
		margin-bottom: 60px;
	}
	.character__image {
		width: 100%;
		margin-bottom: 30px;
	}
	.character__image .image {
		max-width: calc(416 / 590 * 100%);
	}
	.character__body {
		width: 100%;
		display: flex;
		flex-direction: column-reverse;
	}
	.character__body .text {
		margin-bottom: 0;
	}
	.character__body .list {
		display: block;
		margin: 0 calc(39 / 570 * 100%) 30px;
	}
	.character__body .list .item {
		width: calc(100vw / 750 * 164);
		padding: 0 calc(100vw / 750 * 12);
		margin-top: 0;
		font-size: 1.0rem;
	}
	.character__body .list .item a {
		border-width: 2px;
		border-radius: 6px 6px;
		margin-bottom: 4px;
	}
	.character__body .slick-arrow.slick-prev {
		left: calc(100vw / 750 * -40);
		top: calc(100vw / 750 * 70);
		transform: translateY(-50%);
	}
	.character__body .slick-arrow.slick-next {
		right: calc(100vw / 750 * -40);
		top: calc(100vw / 750 * 70);
		transform: translateY(-50%);
	}
	.character-modal {
		width: calc(100vw / 750 * 570);
		border-width: 4px;
		border-radius: 10px 10px;
		padding: 20px 0 30px;
	}
	.character-modal .image {
		max-width: none;
		width: calc(460 / 554 * 100%);
	}
	.character-modal .body {
		margin-top: 15px;
		padding: 0 calc(30 / 554 * 100%);
	}
	.character-modal .title {
		font-size: 2.0rem;
	}
	.character-modal .text {
		font-size: 1.2rem;
		margin-top: 5px;
	}
	.character-modal .text br {
		display: none;
	}
	.character-modal .mfp-close {
		top: -15px;
		right: -15px;
	}
	.illustrator__subtitle .en:before {
		top: calc(50% - 1px);
		left: calc(100% + 15px);
		height: 2px;
		width: calc(((100vw - 90px) - 100%) * 0.5 - 15px);
		box-shadow: 2px 2px #ff0042;
	}
	.illustrator__subtitle .en:after {
		top: calc(50% - 1px);
		right: calc(100% + 15px);
		height: 2px;
		width: calc(((100vw - 90px) - 100%) * 0.5 - 15px);
		box-shadow: 2px 2px #ff0042;
	}
	.illustrator-cols {
		display: block;
	}
	.illustrator__image {
		width: 100%;
		margin-bottom: 20px;
	}
	.illustrator__image .image {
		border-radius: 6px 6px;
		width: calc(270 / 590 * 100%);
		margin: 0 auto;
	}
	.illustrator__body {
		width: 100%;
		padding-top: 0;
	}
	.illustrator__body .name {
		width: 76px;
		margin: 0 auto 20px;
	}
}


/* --------------------------------------------------
	campaign
-------------------------------------------------- */
.campaign .l-cts {
	padding: 120px 0;
}
.campaign__image {
	position: relative;
	max-width: 578px;
	margin: 0 auto 20px;
	border: 4px solid #ffffff;
	border-radius: 10px 10px;
	overflow: hidden;
}
.campaign__button a {
	display: block;
	margin: 0 auto;
	padding: 13px 0;
	width: 330px;
	border: 4px solid #ffffff;
	border-radius: 10px 10px;
	text-align: center;
	font-size: 2.0rem;
	background-color: #ff0042;
	color: #ffffff;
}
.campaign__button a span {
	display: inline-block;
	padding-right: 30px;
	background-image: url(../img/arrow_02.svg);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: 18px auto;
}
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
	.campaign .l-cts {
		padding: 60px 0;
	}
	.campaign__image {
		max-width: none;
		margin-bottom: 15px;
		border-width: 2px;
		border-radius: 6px 6px;
	}
	.campaign__button a {
		padding: 10px 0;
		width: calc(510 / 630 * 100%);
		border-width: 2px;
		border-radius: 6px 6px;
		font-size: 1.4rem;
	}
	.campaign__button a span {
		padding-right: 22px;
		background-size: 14px auto;
	}
}


/* --------------------------------------------------
	lineup
-------------------------------------------------- */
.lineup .l-cts {
	padding: 120px 0;
}
.lineup__banner {
	margin-bottom: 30px;
}
.lineup__list {
	display: flex;
	flex-wrap: wrap;
	margin: -30px calc(-15 / 960 * 100%) 0;
}
.lineup__list li {
	width: calc(1 / 3 * 100%);
	padding: 0 calc(15 / 990 * 100%);
	margin-top: 30px;
}
.lineup__list li:nth-of-type(-n+2) {
	width: calc(1 / 2 * 100%);
}
.lineup__list li .button {
	position: relative;
	display: block;
	background-color: #ffffff;
	border-radius: 10px 10px;
	border: 4px solid #ffffff;
	text-align: center;
}
.lineup__list li .button .name {
	font-size: 1.6rem;
	line-height: 1.4;
	background-color: #ff0042;
	display: flex;
	align-items: center;
	height: 80px;
	padding: 0 10px;
	border-radius: 0 0 8px 8px;
	font-feature-settings: 'palt';
	letter-spacing: 0.02em;
}
.lineup__list li .button .name span {
	display: block;
	width: 100%;
}
.lineup__list li .button .icon {
	position: absolute;
	top: -20px;
	right: calc(-20 / 300 * 100%);
	font-size: 1.4rem;
	line-height: 1.3;
	color: #ff0042;
	border-radius: 50% 50%;
	border: 2px solid #ff0042;
	background-color: #ffffff;
	text-align: center;
	width: 100px;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 0.4em;
}
.lineup__list li:nth-of-type(10) .image {
	background-image: url(../img/lineup_p41291_w.png);
	background-repeat: no-repeat;
	background-size: auto 100%;
}
.lineup__list li:nth-of-type(10) .icon span span {
	font-size: 1.0rem;
	display: inline-block;
	line-height: 1.65;
}
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 977px) {
	.lineup__list li {
		width: calc(1 / 2 * 100%);
	}
}
@media screen and (max-width: 767px) {
	.lineup .l-cts {
		padding: 60px 0;
	}
	.lineup__banner {
		margin-bottom: 15px;
	}
	.lineup__list {
		margin: -15px calc(-15 / 630 * 100%) 0;
	}
	.lineup__list li {
		width: calc(1 / 2 * 100%);
		padding: 0 calc(15 / 660 * 100%);
		margin-top: 15px;
	}
	.lineup__list li .button {
		border-radius: 6px 6px;
		border-width: 2px;
	}
	.lineup__list li .button .name {
		font-size: 1.0rem;
		height: 56px;
		padding: 0 4px;
		border-radius: 0 0 6px 6px;
	}
	.lineup__list li .button .icon {
		top: -10px;
		right: calc(-20 / 300 * 100%);
		font-size: 0.7rem;
		border-width: 1px;
		width: 50px;
		height: 50px;
	}
	.lineup__list li:nth-of-type(10) .icon span span {
		font-size: 0.46rem;
	}
}


/* --------------------------------------------------
	special
-------------------------------------------------- */
.special .l-cts {
	padding: 120px 0 240px;
}
.special__download {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: -30px auto 100px;
}
.special__download .item {
	width: calc(450 / 960 * 100%);
	margin-top: 30px;
}
.special__download .item .image {
	position: relative;
	overflow: hidden;
	border-radius: 8px 8px;
	border: 4px solid #ffffff;
	margin-bottom: 20px;
}
.special__download .item .image img {
	max-width: none;
	width: 100%;
}
.special__download .item .list {
	display: flex;
	justify-content: space-between;
}
.special__download .item .list li {
	width: calc(220 / 450 * 100%);
}
.special__download .item .list li a {
	display: block;
	border-radius: 8px 8px;
	border: 4px solid #ffffff;
	text-align: center;
	font-size: 1.4rem;
	line-height: 1.4;
	padding: 11px 0;
	background-color: #ff0042;
}
.special-howto__title {
	position: relative;
	text-align: center;
	overflow: hidden;
}
.special-howto__title span {
	position: relative;
	display: inline-block;
	font-size: 2.4rem;
}
.special-howto__title span:before {
	content: "";
	position: absolute;
	left: calc(100% + 20px);
	top: calc(50% - 2px);
	width: calc((960px - 100%) * 0.5 - 20px);
	height: 4px;
	background-color: #ffffff;
}
.special-howto__title span:after {
	content: "";
	position: absolute;
	right: calc(100% + 20px);
	top: calc(50% - 2px);
	width: calc((960px - 100%) * 0.5 - 20px);
	height: 4px;
	background-color: #ffffff;
}
.special-howto__list {
	font-size: 1.6rem;
}
.special-howto__list li {
	margin-top: 2.0em;
}
@media screen and (min-width: 768px) {
	.special__download .item .list li:nth-of-type(3) {
		display: none;
	}
}
@media screen and (max-width: 977px) {
	.special__download .item {
		width: 100%;
	}
}
@media screen and (max-width: 767px) {
	.special .l-cts {
		padding: 60px 0 30px;
	}
	.special__download {
		width: calc(450 / 630 * 100%);
		min-width: 225px;
		margin: -30px auto 60px;
	}
	.special__download .item {
		width: 100%;
	}
	.special__download .item .image {
		border-radius: 6px 6px;
		border-width: 2px;
		margin-bottom: 10px;
	}
	.special__download .item .list li:nth-of-type(-n+2) {
		display: none;
	}
	.special__download .item .list li {
		width: 100%;
	}
	.special__download .item .list li a {
		border-radius: 6px 6px;
		border-width: 2px;
		padding: 13px 0;
	}
	.special-howto__title span {
		font-size: 1.8rem;
	}
	.special-howto__title span:before {
		left: calc(100% + 15px);
		top: calc(50% - 1px);
		width: calc((100vw - 100%) * 0.5 - 15px);
		height: 2px;
	}
	.special-howto__title span:after {
		right: calc(100% + 15px);
		top: calc(50% - 1px);
		width: calc((100vw - 100%) * 0.5 - 15px);
		height: 2px;
	}
	.special-howto__list {
		font-size: 1.2rem;
	}
}


/* --------------------------------------------------
	pagenote
-------------------------------------------------- */
.pagenote {
	display: none;
}
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
	.pagenote {
		display: block;
	}
	.pagenote .l-cts {
		padding-bottom: 120px;
	}
	.pagenote__text {
		border: 2px solid #ffffff;
		border-radius: 6px 6px;
		padding: 15px 15px;
		font-size: 1.2rem;
		text-align: center;
	}
}


/* --------------------------------------------------
	slick
-------------------------------------------------- */
.slick-arrow {
	position: absolute;
	z-index: 2;
	top: calc(50% - 23px);
	width: 40px;
	height: 46px;
	font-size: 0;
	background-size: contain;
	background-repeat: no-repeat;
}
.slick-arrow.slick-prev {
	background-image: url(../img/arrow_03.svg);
}
.slick-arrow.slick-next {
	background-image: url(../img/arrow_04.svg);
}
@media screen and (min-width: 768px) {
	.slick-arrow:hover {
		animation: hoverScalePop10 0.4s ease 0s;
	}
}
@media screen and (max-width: 767px) {
	.slick-arrow {
		top: calc(50% - (100vw / 750 * 17));
		width: calc(100vw / 750 * 30);
		height: calc(100vw / 750 * 34);
	}
}


/* --------------------------------------------------
	magnific-popup
-------------------------------------------------- */
.mfp-container {
	padding-left: 0;
	padding-right: 0;
}
button.mfp-close {
	width: 60px;
	height: 60px;
	font-size: 0;
	background-image: url(../img/icon_close.svg);
	background-size: contain;
	background-repeat: no-repeat;
	opacity: 1;
	padding: 0 0;
	top: 0;
	right: 0;
}
@media screen and (min-width: 768px) {
	button.mfp-close:hover {
		animation: hoverScalePop10 0.3s ease;
	}
}
@media screen and (max-width: 767px) {
	button.mfp-close {
		width: 30px;
		height: 30px;
	}
}


/* --------------------------------------------------
	※※※※※
-------------------------------------------------- */
@media screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
}