@charset "UTF-8";
/* CSS Document */


header {
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1;
}


/*  メインビジュアル  */

section#image {
	height: 100vh;
	position: relative;
	padding-top: 70px;
	overflow: hidden;
}

section#image a {
	position: absolute;
	    bottom: 235px;
	    right: 16px;
}

section#image h1.catch_copy {
	position: absolute;
	bottom: 185px;
}

section#image dl.director {
	position: absolute;
	bottom: 124px;
}


section#image div.bg-slider {
	width: 100vw;
	height: 100vh;
	background-position:center center;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
}


section#image div.main_image {
	display: none;
}

@media screen and (min-width : 1025px) {
	section#image {
		margin-left: 0;
    	height: calc(100vw * 0.531 - 73px * 0.531 + 129px);
		padding-top: 129px;
	}
	
	section#image div.wrapper_sm_main_image {
		display: none;
	}
	
	section#image a {
		width: 170px;
    	margin-top: 25px;
    	margin-left: 36px;
    	z-index: 1;
		position: initial;
		display: block;
	}
	
	section#image h1.catch_copy {
		bottom: 135px;
	}
	
	section#image dl.director {
		bottom: 75px;
	}
	
	section#image div.main_image {
		display: block;
		position: fixed;
    	top: 129px;
    	right: 0;
    	z-index: -1;
    	width: 100%;
		aspect-ratio: 16 / 8.5;
    	overflow: hidden;
	}
	
	section#image div.main_image img.logo_moovie {
    	display: none;
	}
	
	section#image div.main_image iframe {
		aspect-ratio: 16 / 9;
    	width: 100%;
    	position: absolute;
    	top: 0;
    	bottom: 0;
    	margin: auto;
    	z-index: -2;
	}
}


@media screen and (min-width : 1280px) {
	
	section#image {
		height: calc(100vw * 0.499 - 100vw * 0.06 * 0.499 - 228px * 0.499 + 130px);
	}
	
	section#image {
		padding-top: 129px;
	}
	
	section#image a {
		margin-left: 6%;
		margin-top: 0;
		position: relative;
	    bottom: initial;
	    right: initial;
		z-index: 1;
	}
	
	section#image a img {
		transition: 0.3s;
		margin-bottom: 30px;
	}
	
	section#image a img:hover {
		transform: scale(1.1);
		transition: 0.3s;
	}

	section#image h1.catch_copy {
		position: initial;
		bottom: initial;
		margin-left: 6%;
		margin-bottom: 22px;
	}

	section#image dl.director {
		position: initial;
		bottom: initial;
		margin-left: 6%;
	}
	
	section#image div.main_image {
		display: block;
		position: fixed;
    	top: 130px;
    	right: 0;
    	z-index: -1;
    	width: calc(100vw - 100vw * 0.06 - 228px);
    	height: calc(100vw * 0.499 - 100vw * 0.06 * 0.499 - 228px * 0.499);
    	overflow: hidden;
	}
	
	section#image div.main_image img.logo_moovie {
		width: 45%;
    	z-index: 0;
    	display: block;
    	margin: 0 auto;
    	position: absolute;
    	left: 0;
    	right: 0;
    	bottom: 25%;
	}
	/*
	section#image div.main_image iframe {
		aspect-ratio: 16 / 9;
    	width: 100%;
    	height: auto;
    	position: absolute;
    	top: 0;
    	bottom: 0;
    	margin: auto;
    	z-index: -2;
	}
	*/
}




/*  ストーリー  */

section.story {
	padding-top: 80px;
	padding-bottom: 40px;
	position: relative;
	font-size: 0;
}

section.story h1.story_title {
	position: absolute;
	top: -34px;
	left: 5%;
}

section.story ul.content_right_up {
	margin-bottom: 40px;
}

section.story h1.story_catch {
	margin-bottom: 40px;
}

section.story div.creator {
	margin-bottom: 40px;
}

section.story div.creator:nth-of-type(2),
section.story div.creator:nth-of-type(3) {
	width: 50%;
	display: inline-block;
	vertical-align: top;
}

section.story p { 
	width: 90%;
	margin: 0 auto 40px;
    font-family: "Noto Sans JP";
	font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
}

section.story p span {
	display: block;
    font-size: 14px;
    text-indent: -14px;
    padding-left: 14px;
}

section.story p span.rb {
	font-size: 14px;
    display: inline;
    padding: 0;
}

section.story p sup {
	font-size: 12px;
    vertical-align: 5px;
}

section.story div.dvd_wrapper {
	margin-bottom: 40px;
}

@media screen and (min-width : 1025px) {
	section.story {
		background: white;
		padding-bottom: 80px;
		padding-top: 100px;
	}
	
	section.story h1.story_title {
		top: -45px;
	}
	
	section.story h1.story_catch {
		font-size: 30px;
	}
	
	section.story p {
		width: 88%;
		max-width: 950px;
	}
	
	section.story div.wao_shop {
		margin: 0 auto 40px;
	}
}

@media screen and (min-width : 1280px) {
	section.story {
		background: white;
		padding-bottom: 0;
	}
	
	section.story div.hidden {
		overflow: hidden;
		position: relative;
	}
	
	section.story h1.story_title {
		top: -60px;
		left: 6%;
	}
	
	section.story ul.content_right_up {
		position: absolute;
		right: 0;
		top: 0;
		margin-bottom: 0;
	}
	
	section.story h1.story_catch {
		margin-left: 6%;
		margin-bottom: 30px;
	}
	
	section.story div.creator {
		margin-left: 6%;
		margin-bottom: 25px;
	}
	
	section.story div.creator:nth-of-type(2),
	section.story div.creator:nth-of-type(3) {
		display: block;
	}
	
	section.story p {
		width: 40%;
		margin: 0 6%;
		    font-size: 16px;
    font-family: "Noto Sans JP";
    font-weight: 400;
    line-height: 1.8;
    margin-bottom: 40px;
	}
	
	section.story div.wao_shop {
		margin-left: 6%;
		margin-bottom: 36px;
	}
	
	section.story div.wao_shop p {
		width: 100%;
		margin: 0 auto 20px;
	}
	
	section.story div.dvd_wrapper {
		margin-bottom: 0;
	}
}



/*  アワード  */

section.awards {
	padding-bottom: 40px;
}

section.awards h2 {
	margin-bottom: 40px;
}

section.awards div.award_uniq {
	margin-bottom: 40px;
}

section.awards div.award_uniq:last-of-type {
	margin-bottom: 0;
}

section.awards img.cup {
	display: none;
}

div.world_map_point {
	display: none;
}

@media screen and (min-width : 1025px) {
	section.awards {
		padding-bottom: 80px;
		position: relative;
		background: white;
		background-image: url(../img/world_map.svg);
		background-size: 82.5% auto;
		background-repeat: no-repeat;
		background-position: top 140px right -25%;
	}

	section.awards h2 {
		margin-bottom: 100px;
	}
	
	section.awards div.award_uniq {
		margin-left: 6%;
		transition: 0.3s;
	}
	
	section.awards div.award_uniq:nth-of-type(2),
	section.awards div.award_uniq:nth-of-type(3) {
		display: inline-block;
		vertical-align: top;
		margin-bottom: 0;
	}
	
	section.awards div.award_uniq:nth-of-type(3) {
		margin-left: 40px;
	}
	
	section.awards img.cup {
		display: block;
		width: 26.4%;
		max-width: 360px;
		position: absolute;
		bottom: 0;
		right: 7.3%;
	}

	div.world_map_point {
		display: block;
		width: 69%;
		height: calc(69vw * 0.3);
		position: absolute;
		top: 140px;
		right: 0;
	}
	
	div.point_korea {
		text-align: right;
		width: 116px;
		position: absolute;
		bottom: 14%;
		right: 14%;
		transition: 0.3s;
		transform-origin: 102px 45px;
	}
	
	div.point_korea:after {
		content:"";
		display: block;
		clear: both;
	}
	
	div.point_france {
		width: 143px;
		text-align: right;
		position: absolute;
		right: 53%;
		bottom: 26.5%;
		transition: 0.3s;
		transform-origin: 129px 45px;
	}
	
	div.point_france:after {
		content:"";
		display: block;
		clear: both;
	}
	
	div.point_canada {
		width: 170px;
		position: absolute;
		left: 2%;
		bottom: 27%;
		transition: 0.3s;
		transform-origin: 14px 45px;
	}
	
	div.point_canada:after {
		content:"";
		display: block;
		clear: both;
	}
	
	img.flag {
		width: 30px;
		margin-bottom: 5px;
	}
	
	p.country {
		font-size: 13px;
    	font-family: "Noto Sans JP";
    	font-weight: 700;
	}
	
	img.point {
		width: 28px;
		float: right;
		margin-left: 8px;
	}
	
	div.point_canada img.point {
		float: left;
		margin-left: 0;
		margin-right: 8px;
	} 
	
}

/*
@media screen and (min-width: 1503px) {
	section.awards img.cup {
		width: 25.4%;
		right: 8%;
	}
}
	
@media screen and (min-width: 1830px) {	
	section.awards img.cup {
		width: 23.4%;
    	right: 12%;
	}
}
*/


/*  スタッフ  */

section.staff {
	padding-bottom: 40px;
	font-size: 0;
	background-image: url(../img/staff_img_back.jpg);
	background-repeat: no-repeat;
}

section.staff h2 {
	margin-bottom: 40px;
}

section.staff div.staff_director {
	margin-bottom: 40px;
}

section.staff div.staff_director p {
	margin-bottom: 0;
}
	
section.staff div.staff_director:nth-of-type(1) p {
	margin-bottom: 30px;
}

@media screen and (min-width : 1025px) {
	section.staff {
		padding-bottom: 80px;
		background: white;
	}
	
	section.staff h2 {
		margin-bottom: 100px;
	}
	
	section.staff div.staff_director {
		margin-bottom: 80px;
		max-width: initial;
	}
	
	section.staff div.staff_director.two {
		display: inline-block;
		vertical-align: top;
	}
	
	section.staff div.staff_director.two {
		margin-left: 6%;
	}
	
	section.staff div.staff_director.three {
		margin-left: 6%;
		display: inline-block;
		vertical-align: top;
	}
	
}


/*  キャスト  */

section.cast {
	padding-bottom: 40px;
	background-image: url(../img/cast_img_back.jpg);
    background-repeat: repeat-y;
}

section.cast h2 {
	margin-bottom: 40px;
}

section.cast div.cast {
	margin-bottom: 40px;
}

section.cast div.cast.two:last-of-type {
	padding-bottom: 0;
	margin-bottom: 0;
	border-bottom: none;
}

@media screen and (min-width : 1025px) {
	section.cast {
		padding-bottom: 80px;
		background: white;
	}
	
	section.cast h2 {
		margin-bottom: 100px;
	}
	section.cast div.cast {
		margin-bottom: 70px;
		max-width: initial;
	}
	
	section.cast div.cast:first-of-type {
		border: none;
		padding-top: 0;
	}
	
	section.cast div.cast.two {
		display: inline-block;
		margin-left: 6%;
		vertical-align: top;
	}
	
	section.cast div.cast:nth-of-type(6),
	section.cast div.cast:nth-of-type(7) {
		margin-bottom: 0;
	}
}



/*  ムービー  */

section.movie {
}

section.movie h2 {
	margin-bottom: 40px;
}

section.movie div.products {
	margin-bottom: 40px;
}

section.movie div.streaming {
	margin-bottom: 40px;
}

section.movie div.screening {
	margin-bottom: 40px;
}

section.movie div.accordion5 p.ac1 {
	width: 88%;
	max-width: 400px;
    margin: 0 auto 40px;
    text-align: center;
    height: 60px;
    line-height: 60px;
    background: #F48FB1;
    font-family: "Noto Sans JP";
    font-weight: 500;
    font-size: 17px;
    color: #fff;
    transition: 0.3s;
    display: block;
    cursor: pointer;
}

section.movie div.accordion5 div.inner {
	display: none;
    font-size: 0;
    padding: 75px 6%;
    border-top: 3px solid #d2d2d2;
    border-bottom: 3px solid #d2d2d2;
    background-color: #fcfcfc;
}

section.movie div.accordion5 div.inner div.screening_info:first-of-type {
	margin-right: 0;
}

section.movie div.accordion5 div.inner div.screening_info {
	display: block;
    width: 100%;
}

section.movie div.accordion5 div.inner div.screening_info dl {
	font-size: 16px;
    line-height: 1.9;
    font-family: "Noto Sans JP";
    font-weight: 400;
}

section.movie div.accordion5 div.inner div.screening_info:first-of-type dl dt:first-of-type {
	margin-top: 0;
}

section.movie div.accordion5 div.inner div.screening_info dl dt {
	font-weight: 700;
    display: block;
	margin-top: 15px;
}

section.movie div.accordion5 div.inner div.screening_info dl dd {
	display: block;
}

section.movie div.accordion5 div.inner p.ask {
	width: 100%;
	max-width: 400px;
	text-align: center;
    margin: 70px auto 30px auto;
    height: 60px;
    line-height: 54px;
    background: #fff;
    font-family: "Noto Sans JP";
    font-weight: 500;
    font-size: 17px;
    color: #F48FB1;
    cursor: pointer;
    display: block;
    border: 3px solid #F48FB1;
}

section.movie div.accordion5 div.inner p.ask a {
	display: block;
}

section.movie div.accordion5 div.inner p.close {
	width: 100%;
	max-width: 400px;
	text-align: center;
    margin: 0 auto;
    height: 60px;
    line-height: 60px;
    background: #F48FB1;
    font-family: "Noto Sans JP";
    font-weight: 500;
    font-size: 17px;
    color: #fff;
    transition: 0.3s;
    cursor: pointer;
    display: block!important;
}


@media screen and (min-width : 1025px) {
	section.movie {
		background: white;
		padding-bottom: 0;
	}
	
	section.movie h2.section_title {
		margin-bottom: 0;
	}
	
	section.movie img.section_img {
		margin-bottom: 100px;
	}
	
	section.movie div.products {
		margin-bottom: 80px;
	}
	
	section.movie div.streaming {
		margin-bottom: 80px;
	}
	
	section.movie div.accordion5 {
		padding-bottom: 80px;
	}
	
	section.movie div.accordion5 p.ac1 {
		width: 400px;
		transition: 0.3s;
		margin-bottom: 0;
	}
	
	section.movie div.accordion5 p.ac1:hover {
		transform: scale(1.1);
		transition: 0.3s;
	}
	
	section.movie div.accordion5 div.inner {
		margin-top: 80px;
	}
	
	section.movie div.accordion5 div.inner div.screening_info:first-of-type {
		margin-right: 6%;
	}
	
	section.movie div.accordion5 div.inner div.screening_info {
		width: 47%;
    	display: inline-block;
    	vertical-align: top;
	}
	
	section.movie div.accordion5 div.inner p.ask {
		width: 400px;
	}
	
	section.movie div.accordion5 div.inner p.close {
		width: 400px;
	}
}



/*  実績  */
section.achievement {
	padding-bottom: 40px;
	background-image: url(../img/achievement_plaid.png),url(../img/achievement_sm.jpg);
	background-position: 0% 0%,center;
    background-size: 2px 2px,cover;
    background-repeat: repeat,no-repeat;
	color: white;
	font-size: 0;
}

section.achievement h2 {
	padding-top: 14px;
	height: 78px;
	line-height: 1;
	margin-bottom: 40px;
}

section.achievement h2 span.cap {
	display: block;
	font-size: 12px;
	margin-top: 5px;
}

div.achievement {
	margin-bottom: 30px;
}

div.achievement:last-of-type {
	margin-bottom: 0;
}

@media screen and (min-width : 560px) {
	section.achievement div.achievement {
		width: 42.5%;
		display: inline-block;
		margin-left: 5%;
		vertical-align: top;
	}
	
	section.achievement div.achievement img {
		margin-bottom: 15px;
	}
	
}



@media screen and (min-width : 1025px) {
	section.achievement {
		padding-bottom: 80px;
		background-image: url(../img/achievement_plaid.png),url(../img/achievement_pc.jpg);
		background-position: 0% 0%,center;
    	background-size: 2px 2px,cover;
    	background-repeat: repeat,no-repeat;
		background-attachment:　fixed,fixed;
		color: white;
		font-size: 0;
	}
	
	section.achievement h2 {
		height: 100px;
		padding-top: 0;
		line-height: 100px;
		margin-bottom: 100px;
	}
	
	section.achievement h2 span.cap {
		display: inline;
	}
	
	section.achievement div.achievement {
		vertical-align: top;
		margin-bottom: 80px;
		width: 25%;
		margin-left: 0;
	}
	
	section.achievement div.achievement:last-of-type {
		margin-bottom: 0;
	}
	
}




/*  レビュー  */

section.review {
	padding-bottom: 40px;
}

section.review h2.section_title {
	margin-bottom: 40px;
}

section.review div#review_wrapper div.li {
	width: 90%;
	max-width: 650px;
	margin: 0 auto 40px;
}

section.review div#review_wrapper div.li h3 {
	padding: 15px 25px;
	background: #feedd5;
    font-family: "Noto Sans JP";
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 20px;
    line-height: 1.6;
}

section.review div#review_wrapper div.li p {
	font-family: "Noto Sans JP";
    font-weight: 400;
    font-size: 16px;
    line-height: 1.9;
}

section.review div#review_wrapper span.morelink {
	display: block;
	max-width: 400px;
	width: 90%;
    text-align: center;
    margin: 0 auto;
    height: 60px;
    line-height: 60px;
    background: #F48FB1;
    font-family: "Noto Sans JP";
    font-weight: 500;
    font-size: 17px;
    color: #fff;
    cursor: pointer;
}


section.review div#review_wrapper span.close {
	display: block;
	max-width: 400px;
	width: 90%;
    text-align: center;
    margin: 40px auto 0;
    height: 60px;
    line-height: 60px;
    background: #F48FB1;
    font-family: "Noto Sans JP";
    font-weight: 500;
    font-size: 17px;
    color: #fff;
    cursor: pointer;
}


@media screen and (min-width : 1025px){
	section.review {
		padding-bottom: 80px;
		background: white;
	}
	
	section.review h2.section_title {
		margin-bottom: 0;
	}
	
	section.review img.section_img {
		margin-bottom: 80px;
	}
	
	section.review div#review_wrapper div.li {
		width: 88%;
		max-width: 1400px;
		margin: 0 auto 60px;
	}
	
	section.review div#review_wrapper span.morelink {
		width: 400px;
		transition: 0.3s;
	}
	
	section.review div#review_wrapper span.morelink:hover {
		transform: scale(1.1);
		transition: 0.3s;
	}
	
	section.review div#review_wrapper span.close {
		width: 400px;
		transition: 0.3s;
	}
	
	section.review div#review_wrapper span.close:hover {
		transform: scale(1.1);
		transition: 0.3s;
	}
	
}





/*  リンク  */

section.link {
	padding-bottom: 40px;
}

section.link ul.anime {
	margin-bottom: 40px;
}

@media screen and (min-width : 560px) {
	section.link ul.anime {
		font-size: 0;
	}
	
	section.link ul.anime li {
		width: 50%;
		display: inline-block;
	}
	
	section.link ul.corp {
		font-size: 0;
		max-width: 650px;
		margin: 0 auto;
	}
	
	section.link ul.corp li {
		width: 50%;
		display: inline-block;
	}
	
	section.link ul.corp li:nth-of-type(odd) {
		border-right: 1px dotted black;
	}
	
}

@media screen and (min-width : 1025px) {
	section.link {
		padding-bottom: 80px;
		background: white;
	}
	
	section.link ul.anime {
		margin-bottom: 60px;
	}
	
	section.link ul.anime li {
		width: 25%;
	}
	
	section.link ul.corp {
		width: 88%;
		max-width: initial;
	}
	
	section.link ul.corp li {
		width: 25%;
	}
	
}

/*  フッター  */