@charset "UTF-8";
/* TEXT 
   ========================================================================== */
.main_text{
	padding:2em; 
	width: 90%;
	max-width: 1200px;
}
		@media screen and (max-width:768px){
			.main_text{
				padding: 2.5em;
				width:80%;}}

.text{
	font-size: 18px;
	padding-left: 0.5em;
}
.jp{
	letter-spacing: -1px;
}
.more_btn{
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
	text-align: right;
	transition: all 0.3s ease 0s;
	display: block;
}
.more_btn a{
	width: 100%;
	height: 100%;
	display: inline-block;
}
		@media screen and (max-width:768px){
			.more_btn{
				text-align: center;}}

.more_btn:hover{
	transition: all 0.3s ease 0s;
	transform: translateY(-0.1875em);
}
.flex-container{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.bg_container .flex-container{
	justify-content: space-around;
}


/* section
   ========================================================================== */
.section_container{
	margin-bottom: 100px;
}
.section_ttl_imgbox{
	text-align: center;
	margin: 50px auto;
	width: 400px;
}
		@media screen and (max-width:768px){
			.section_ttl_imgbox{
			width: 300px;}}

.section_inner{
	max-width: 850px;
	width: 100%;
	margin:0 auto 50px;
	background-color: #fff;
	box-shadow: 0px 0px 10px 10px rgba(0, 0, 0, .1);
}
		@media screen and (max-width:768px){
			.section_inner{
				width: 95%;}}

.section_subttl{
	text-align: center;
	font-size: 18px;
	padding:0.5em;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
}
.section_content{
	font-size: 16px;
	position: relative;
}
		@media screen and (max-width:768px){
			.section_content{
			padding:3%;}}


		@media screen and (max-width:768px){
			.section_caption{
				margin-top: 0.5em;
				letter-spacing: -0.3px;}
			#section_event .section_caption,#section_event .section_caption02{
				margin-top: 0.5em;
				letter-spacing: -0.55px;
				width: 95%;}}

.section_content .smallfont{
	font-size: 80%;
}

.section_container .section_content .section_caption{
	max-width: 600px;
	margin: 2em auto;
	padding: 1em;
	border: solid 1px #ff0000;
}
.section_container .section_content .section_caption02{
	border: solid 1px #0000ff;
}
		@media screen and (max-width:768px){
			.section_container .section_content .section_caption{
			padding: 0.5em;
			width: 95%;}}

.section_container .section_content .section_caption .center{
	text-align: center;
	font-size:16px;
	margin: 0.5em auto 1em;
}



/* section_newmovie
   ========================================================================== */
.section_newmovie{
	text-align: center;
	margin-top: 200px;
}
@media screen and (max-width:768px){
	.section_newmovie{
	margin-top: 0px;
	padding-top: 150px;}	}

.section_newmovie .section_inner{
	max-height: 500px;
	max-width: 850px;
	background-color: #fff;
}
.section_newmovie .section_ttl_imgbox {
    position: relative;
}
.section_newmovie .section_ttl_imgbox::before{
position: absolute;
    content: "";
    width: 400px;
    height: 200px;
    background: url("../imgs/newmovie_title.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: -185px;
    left: 0px;
}
		@media screen and (max-width:768px){
			.section_newmovie .section_ttl_imgbox::before{
				width: 100%;
			top: -163px;}}

.section_newmovie .youtube{
	position:relative;
	width: 100%;
	 padding-top: 56.25%;
}
.section_newmovie .youtube iframe{
	position: absolute;
	top: 5%;
	right: 5%;
	width: 90%;
	height: 90%;
}


/* btn_backnumber
   ========================================================================== */
.btn_backnumber{
	text-align: center;
}

@media screen and (max-width:768px){
	.btn_backnumber{
		width: 80%;
		margin: 0 auto;
	}
}


/* section_01 
   ========================================================================== */
.section_01{
	border-radius: 20px;
	margin-top: 300px;
}
		@media screen and (max-width:768px){
			.section_01{
				width: 96%;
				margin: 200px auto 50px;}}

.section_01 .section_ttl_imgbox{
	position: relative;
}

.section_01 .section_ttl_imgbox::before{
	position:absolute;
	content:"";
	width: 400px;
	height: 200px;
	background: url("../imgs/sec01_title .png");
	background-repeat: no-repeat;
	background-position:center;
	background-size:contain;
	top: -187px;
	left: 0px;
}
		@media screen and (max-width:768px){
			.section_01 .section_ttl_imgbox::before{
			top: -166px;
			left: 0px;
			width: 100%;}}


.section_01 .section_inner{
	max-height: 500px;
}
.section_01 .section_inner01{
	margin-bottom: 0;
	box-shadow: inherit;
	
}
.section_01 .section_inner02{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 290px;
}
		@media screen and (max-width:768px){
			.section_01 .section_inner02{
			height: 400px;}}

.section_01 .text_box{
	text-align: center;
	border-radius: 10px;
	width: 100%;
	max-width: 820px;
	height: 250px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	color:#0098bd;
	font-size: 25px;
	background:url("../imgs/sec01_bg.png");
	background-repeat: no-repeat;
	background-position:center;
	background-size: cover;
}
		@media screen and (max-width:768px){
			.section_01 .text_box{
				width: 95%;
				height: 375px;
				background:url("../imgs/sec01_bg_sp.png");
				background-repeat: no-repeat;
				background-position:center;
				background-size: cover;}}

.section_01 .text_box p{
	font-size: 24px;
	width: 100%;
}
		@media screen and (max-width:768px){
			.section_01 .text_box p{
				line-height: 1.8em;
				font-size: 17px;}}

/* section_02
   ========================================================================== */
.section_02{
	border-radius: 20px;
	margin-top: 400px;
}
		@media screen and (max-width:768px){
			.section_02{
				width: 96%;
				margin: 250px auto 50px;}}

.section_02 .section_ttl_imgbox{
	position: relative;
}

.section_02 .section_ttl_imgbox::before{
	position:absolute;
	content:"";
	width: 400px;
	height: 200px;
	background: url("../imgs/sec02_title .png");
	background-repeat: no-repeat;
	background-position:center;
	background-size:contain;
	top: -182px;
	left: 0px;
}
		@media screen and (max-width:768px){
			.section_02 .section_ttl_imgbox::before{
			top: -162px;
			left: 0px;
			width: 100%;}}

.section_02 .section_inner01{
	margin-bottom: 0;
	box-shadow: inherit;
}
.section_02 .section_inner02{
	padding-top: 5px;
	padding-bottom: 5px;
}

.section_02 .character_container{
	text-align: center;
	border-radius: 10px;
	max-width: 820px;
	margin: 1em auto;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	background:url("../imgs/sec02_bg.png");
	background-repeat: no-repeat;
	background-position:center;
	background-size: cover;
	padding-bottom: 2em;
}
		@media screen and (max-width:768px){
			.section_02 .character_container{
				width: 95%;
				margin: 0.5em auto;}}

.section_02 .character_container .flex-container{
	justify-content: space-between;
	width: 88%;
}
		@media screen and (max-width:768px){
			.section_02 .character_container .flex-container{
			width: 88%;}}

.chara_box{
	width: calc(100%/3.7);
	text-align: center;
	margin-top: 1em;
}
		@media screen and (max-width:768px){
			.chara_box{
			width: calc(100%/2.2);
				margin-top: 2em;}}

.chara_text{
	color:#ed6480;
	font-size: 16px;
	text-align: left;
	margin-top: 1em;
}


/* section_03
   ========================================================================== */
.section_03{
	border-radius: 20px;
	margin-top: 400px;
}
		@media screen and (max-width:768px){
			.section_03{
				width: 96%;
				margin: 200px auto 50px;}}

.section_03 .section_ttl_imgbox{
	position: relative;
}

.section_03 .section_ttl_imgbox::before{
	position:absolute;
	content:"";
	width: 400px;
	height: 200px;
	background: url("../imgs/sec03_title .png");
	background-repeat: no-repeat;
	background-position:center;
	background-size:contain;
	top: -182px;
	left: 0px;
}
		@media screen and (max-width:768px){
			.section_03 .section_ttl_imgbox::before{
			top: -161px;
			left: 0px;
			width: 100%;}}

.section_03 .section_inner01{
	margin-bottom: 0;
	box-shadow: inherit;
}
.section_03 .section_inner02{
	padding-top: 5px;
	padding-bottom: 5px;
}

.section_03 .bk_container{
	text-align: center;
	border-radius: 10px;
	max-width: 820px;
	margin: 1em auto;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	background:url("../imgs/sec03_bg.png");
	background-repeat: no-repeat;
	background-position:center;
	background-size: cover;
	padding-bottom: 2em;
}
.section_03 .bk_container .flex-container{
	justify-content: space-between;
	width: 90%;
	margin: 50px auto;
}

		@media screen and (max-width:768px){
			.section_03 .bk_container{
				width: 95%;
				margin: 0.5em auto;}
			.section_03 .bk_container .flex-container{
			width:88%;
			margin: 10px auto;}}



/* bk_container
   ========================================================================== */
.bk_box{
	width: calc(100%/3.7);
	text-align: center;
	margin-top: 1em;
}
		@media screen and (max-width:768px){
			.bk_box{
				width: calc(100%/2.2);
				margin-top: 2em;}}

.bk_text{
	color:#3c3c3c;
	font-size: 14px;
	text-align: left;
	margin-top: 1em;
}

/* bnr_container
   ========================================================================== */
.bg_container .bnr_container{
	max-width: 780px;
	margin: 0 auto;
	justify-content: space-between;
}
.bnr_box{
	width: calc(100%/2);
	text-align: center;
	margin: 1em auto;
}
		@media screen and (max-width:768px){
			.bnr_box{
			width: 70%;}}

/* caption_container
   ========================================================================== */
.bg_container .caption_container{
	margin: 50px auto;
	justify-content: space-between;
}
.bg_container .caption_container .flex-container{
	justify-content: space-between;
}
.bg_container .caption_container .section_inner{
	background-color: inherit;
	box-shadow: inherit;
}
.caption_box{
	margin-top: 1em;
}
.caption_box01{
	width: 60%;
}
.caption_box02{
	width: 30%;
	text-align: right;
}
		@media screen and (max-width:768px){
			.caption_box01,.caption_box02{
				width: 100%;
				text-align: left;}}