@charset "utf-8";

/*--Reset-----------------------------------------------------------*/
* {
	margin: 0;
	padding: 0;
}

html {
	overflow-y: scroll;
}

html,body {
	height: 100%;
	-webkit-text-size-adjust: 100%;
}

img {
	border: none;
	vertical-align: middle;
	max-width: 100%;
}

ul {
	list-style: none;
}

body {
	font-size: 13px;
	line-height: 1.8;
	font-family: YakuHanJPs, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	color: #fff;
	position: relative;
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

h1,h2,h3,h4 {
	font-size: 100%;
}

a,a:link,a:visited {
	text-decoration: none;
    -webkit-transition: 0.1s ease-in-out;
    -moz-transition: 0.1s ease-in-out;
    -o-transition: 0.1s ease-in-out;
    transition: 0.1s ease-in-out;
    color: #fff;
    max-width: 350px;
}

a:hover {
	opacity: 0.8;
}

footer,header,nav,section {
	display: block;
}

/*--Reset-end----------------------------------------------------------*/

/*--all----------------------------------------------------------*/

.link-btn {
	display: block;
	background: #131550;
	padding: 10px 15px 10px 25px;
	width: 150px;
	text-align: center;
	font-weight: bold;
	letter-spacing: 1px;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.5);
	box-sizing: border-box;
}

.right-arrow {
	position: relative;
}

.right-arrow::before {
	position: absolute;
	content: "▼";
	color: #fff;
	left: 10px;
	transform: rotateZ(-90deg);
}

.main-title {
	max-width: 460px;
	margin:0 auto 20px;
}

/*--all-end----------------------------------------------------------*/

.header {
	position: relative;
}

.logo {
	position: absolute;
	top: 10px;
	left: 10px;
}

.logo_link {
	display: block;
	width: 80px;
}

.logo_img {
	height: 30px;
}

nav {
	background: linear-gradient(#28236b,#363882,#28236b);
	/*border-bottom: 1px solid #9996cc;*/
	padding: 30px 0;
}

.nav_list {
	display: flex;
	justify-content: space-around;
}

.nav_list a {
	display: block;
	padding-top: 30px;
	position: relative;
}

.nav_list a::before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	margin: auto;
	width: 30px;
	height: 30px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.nav_list .nav_event a::before {
	background-image: url(../img/i-event.png);
}

.nav_list .nav_insta a::before {
	background-image: url(../img/i-insta.png);
}

.nav_list .nav_twitter a::before {
	background-image: url(../img/i-twitter.png);
}

.nav_list li span {
	display: none;
}

.summer {
	width: 100%;
	box-sizing: border-box;
	padding: 40px 20px; 
	background: linear-gradient(#28236b,#131550,#28236b);
}

.about-summer {
	text-align: center;
	margin-bottom: 30px;
}

.schedule {
	margin-bottom: 30px;
	font-weight: bold;
}

.date {
	margin-bottom: 30px;
}

.address {
	clear: both;
}

.bg-w {
	background: #fff;
	color: #131550;
	padding: 2px 5px;
	width: 70px;
	text-align: center;
	font-weight: bold;
	float: left;
	margin-right: 10px;
	margin-top: -2px;
}

.summer_img {
	text-align: center;
}

.event {
	width: 100%;
	box-sizing: border-box;
	padding: 40px 10px; 
	background: #000;
}

.event_list {
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	margin-bottom: calc(20px - 3%);
}

.event_detail {
	width: 100%;
}

.event_title {
	font-size: 1.18rem;
	text-align: center;
	line-height: 1.4;
	margin-bottom: 10px;
}

.event_title .sfont {
	font-size: 0.8rem;
}

.event-vr .event_title {
	color: #ee3b22;
}

.event-stamp .event_title {
	color: #f99e1a;
}

.event-paint .event_title {
	color: #ef519e;
}

.event-photo .event_title {
	color: #ada133;
}

.event_list {
	width: 85%;
	margin: auto;
}

.event_list dl {
	display: flex;
	max-width: 500px;
	margin: 0 auto;
}

.event_note {
	font-size: 0.7rem;
	max-width: 500px;
	margin: 0 auto;
}

.event-link {
	display: block;
	margin: 10px auto 60px;
}

.event_title+img {
	margin: 0 auto 10px;
	display: block;
}

.vrimg-pc {
	display: none;
}


.coop {
	text-align: center;
}

.insta-cp {
	background: url(../img/bg_wood.gif);
	width: 100%;
	box-sizing: border-box;
	padding: 60px 10px 10px;
	position: relative;
}

.insta-cp::before,
.insta-cp::after {
	content: "";
	display: block;
	position: absolute;
	background: url("../img/left-flag.png") no-repeat;
	background-size: contain;
	top: 0;
	left: 0;
	width: 90px;
	height: 90px;
}

.insta-cp::after {
	background: url("../img/right-flag.png") no-repeat;
	background-size: contain;
	top: 0;
	right: 0;
	left: inherit;
}

.block {
	margin-bottom: 60px;
}

.sub-title {
	margin: 0 auto 20px;
	text-align: center;
}

.sub-title img {
	max-height: 60px;
}

.about_detail {
	background: rgba(255,255,255,0.7);
	color: #000;
	width: 100%;
	padding: 25px;
	box-sizing: border-box;
	text-align: center;
	color: #131550;
}

/*--------------- prize ---------------*/

.prize_list {
	text-align: center;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.prize_list li {
	flex-basis: 50%;
}

li.prize_a {
	flex-basis: 80%;
	margin-bottom: 40px;
}

.prize_detail {
	background: rgba(255,255,255,0.7);
	color: #f99e1a;
	padding: 5px 20px;
	width: 90%;
	margin: 0 auto;
	font-weight: bold;
	box-sizing: border-box;
}

.prize_rank {
	font-size: 1.1rem;
	text-align: left;
}

.prize_num {
	text-align: right;
}

.prize_list li > img {
	height: 190px;
}

/*--------------- howto ---------------*/

.howto_list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 20px;
}

.howto_list li {
	flex-basis: 80%;
	text-align: center;
}

.howto_note .link-btn {
	width: 80%;
	margin: 0 auto; 
}

.howto_note li:first-child {
	margin-bottom: 20px;
}


/*--------------- pr ---------------*/

.pr {
	border-bottom: 1px dotted #867dff;
	padding-bottom: 5px;
}

.dvd {
	background: rgb(255,255,255);
	padding: 15px;
	color: #000;
	margin-bottom: 40px;
}

.dvd h3,
.book h3 {
	color: #f99e1a;
	text-align: center;
	font-size: 1.2rem;
	margin-bottom: 20px;
}

.dvd h4,.book h4  {
	text-align: center;
	font-size: 0.9rem;
	margin-bottom: 10px;
}

.dvd-txt {
	margin-bottom: 20px;
	text-align: center;
}

.dvd-img {
	text-align: center;
	margin-bottom: 15px;
}

.disney-link {
	width: 80%;
	margin: 0 auto;
	margin-bottom: 20px;
}

.dvd_block {
	text-align: center;
}

.dvd iframe {
	width: 100%;
	height: 300px;
	margin-top: 40px;
}

.copyright {
	color: #fff;
	text-align: center;
	font-size: 0.6rem;
}

.book {
	background: #fff;
	color: #131550;
	text-align: center;
}

.book_block {
	padding: 15px;
}

.footer {
	background: linear-gradient(#28236b,#131550,#28236b);
	padding: 10px 0 5px;
}

.footer_list {
	display: flex;
	justify-content: center;
}

.footer_list li {
	flex-basis: 60px;
	margin: 15px;
}

.half .disney-link {
	margin-top: 15px;
}


/* for IE10 & 11 */
/*
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {  
}

@supports (-ms-ime-align:auto) {
}
*/

@media all and (min-width: 768px) {

	.sp {
		display: none;
	}

	.tab-hidden {
		display: none;
	}

	.vrimg-sp {
		display: none !important;
	}

	.vrimg-pc {
		display: block;
		margin-bottom: 10px;
	}

	body {
		font-size: 14px;
	}

	.summer,.event {
		padding: 80px 30px;
	}

	.insta-cp {
		padding: 80px 30px 10px;
	}

	.sub-title img {
		max-height: 70px;
	}

	.visual-img {
		display: none;
	}

	.visual {
		background-image: url(../img/bg_main.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
		height: 768px;
	}

	nav {
	    padding: 30px 0 30px;
	}

	.nav_list {
		text-align: center;
	}

	.nav_list li {
		flex-basis: 33.3333333333%;
	}

	.nav_list li span {
		display: inline;
	}

	.nav_list a::before {
		width: 40px;
		height: 40px;
	}

	.nav_list a {
		padding-top: 43px;
	}

	.main-title {
		margin: 0 auto 30px;
	}

	.about_detail {
		text-align: left;
	}

	.schedule {
		width: 530px;
		margin: 0 auto 40px;
	}

	.event_list{
		display: flex;
		justify-content: space-between;
		width: 100%;
	}

	.event_list .event-vr {
		flex-basis: 100%;
	}

	.event_detail {
		flex-basis: 31%;
		margin-bottom: 60px;
	}

	.event-vr-float {
		width: 50%;
		float: left;
		margin-bottom: 20px;
	}

	.event_note {
		width: 50%;
		float: left;
	}

	.event-link {
		clear: both;
		max-width: 300px;
		margin: 20px auto 0;
	}

	.event_detail dt {
		white-space: nowrap;
	}

	.insta-cp::before,
	.insta-cp::after {
		width: 200px;
		height:200px;
	}

	li.prize_a,
	.prize_list li {
		flex-basis: 31%;
	}

	.howto_list li {
		flex-basis: 31%;
	}

	.howto_note {
		display: flex;
		justify-content: center;
	}

	.howto_note li {
		flex-basis: 300px;
	}

	.pr {
		overflow: hidden;
	}

	.book {
		display: flex;
		flex-direction: row-reverse;
		align-items: flex-start;
		justify-content: space-between;
	}

	.book_block {
		flex-basis: 50%;
	}

	.book_block + img {
		width: 50%;
		align-self: center;
	}

	.dvd {
		display: flex;
		align-items: stretch;
		padding: 0;
		margin-bottom: 60px;
	}

	.dvd_block {
		padding: 15px;
		flex-basis: 50%;
		box-sizing: border-box;
	}

	.dvd iframe {
		flex-basis: 50%;
		margin-top: 0;
		margin-bottom: -1px;
		height: inherit;
	}

	.half {
		width: 56%;
		float: left;
		margin-right: 4%;
		margin-bottom: 10px;
		text-align: left;
	}

	.half .disney-link {
		width: 100%;
		margin-bottom: 0;
	}

	.dvd-img {
		width: 40%;
		float: left;
	}

	.pr.summer {
		padding-bottom: 20px;
	}

}

@media all and (min-width: 1024px) {

	.tab-hidden {
		display: block;
	}

	.logo {
		width: 980px;
		top: 30px;
		right: 0;
		left: 0;
		margin: auto;
	}

	body {
		font-size: 16px;
	}

	.main-title {
		max-width: 560px;
		margin-bottom: 40px;
	}

	.nav_list {
		width: 980px;
		margin: 0 auto;
	}

	.about-summer {
		margin-bottom: 40px;
	}

	.schedule {
		margin-bottom: 50px;
		font-size: 18px;
		width: 600px;
	}

	.bg-w {
		width: 100px;
		margin-right: 20px;
	}

	.event_detail {
		margin-bottom: 100px;
	}

	.event-vr-float {
		width: 45%;
		margin-left: 10%;
	}

	.event_note {
		width: 45%;
	}

	.event_list  {
		width: 980px;
		margin: 0 auto;
	}

	.event_title {
		font-size: 1.4rem;
	}

	.event_title .sfont {
		font-size: 1rem;
	}

	.insta-cp {
		padding: 80px 10px 20px;
	}

	.insta-cp::before,
	.insta-cp::after {
		width: 260px;
		height:260px;
	}

	.block {
		margin-bottom: 100px;
	}

	.sub-title {
		margin-bottom: 25px;
	}

	.sub-title img {
		max-height: 78px;
	}

	.about_detail {
		width: 850px;
		margin: auto;
		padding: 30px 50px;
	}

	li.prize_a, .prize_list li {
		flex-basis: 33%;
	}

	.prize_list li > img {
		height: 250px;
	}

	.howto_list {
		margin-bottom: 30px;
	}

	.howto_list li {
		flex-basis: 32%;
	}

	.howto_note li {
		flex-basis: 350px;
	}

	.book_block .dvd-txt {
		margin-bottom: 40px;
	}

	.dvd-txt,
	.disney-link {
		font-size: 0.9rem;
	}

	.dvd h3, .book h3 {
		margin-bottom: 10px;
		font-size: 1.4rem;
	}

	.dvd h4, .book h4 {
		font-size: 1.1rem;
		margin-bottom: 15px;
	}

	.book,.dvd {
		width: 980px;
		margin-right: auto;
		margin-left: auto;
	}

	.cp-wrap {
		width: 980px;
		margin: 0 auto;
	}

	.footer {
		padding:20px 0 10px;
	}
}


@media all and (min-width: 1280px) {

	.event_list {
		width: 1100px;
	}

	.insta-cp::before,
	.insta-cp::after {
		width: 350px;
		height:350px;
	}

}

@media all and (min-width: 1450px) {

	.logo {
	    top: 15px;
	    left: 30px;
	    width: 1400px;
	    right: 0;
	    margin: 0 auto;
	}

}