@charset "UTF-8";

#movie-container {
width:100%;
margin:0 auto;
overflow:hidden;}
#movie {
position:relative;
display:block;
background:#000;
width:100%;
padding-top:43.63636363%;
height:0;
overflow:hidden;}
#movie::after {
content:"";}
#movie img {
max-width:100%;
height:auto;}
#movie img {
position:absolute;
max-width:inherit;
max-width:initial!important;
opacity:0;}
#movie-nojs {
display:none;}



.index-manifesto24 {
position:relative;
text-align:center;
margin:0 auto 7%;
width:100%;
max-width:1000px;}
.index-manifesto24 img {
border-radius:10px;}
.index-manifesto24 .pc {
display:block;}  
.index-manifesto24 .sp {
display:none;}
.index-manifesto24 img {
border-radius:10px;}
.index-manifesto24 .btn02 {
position:absolute;
bottom:16%;
right:4%;
width:32.7%;}
.index-manifesto24 .btn01 {
position:absolute;
bottom:16%;
right:38.1%;
width:32.7%;}
.index-manifesto24 a {
position:relative;
display:block;
font-size:110%;
line-height:1.2;
font-weight:bold;
white-space:nowrap;
overflow:hidden;
padding:6% 0;
background:#0098ee;
background-image:repeating-linear-gradient(-55deg,rgba(255,255,255,0.3) 0, rgba(255,255,255,0.3) 1px,transparent 1px, transparent 3px);
color:#fff;
border-radius:8px;
transition:background 0.25s;}
.index-manifesto24 a:hover {
background:#ee8800;}
.index-manifesto24 a::after {
content:"";
position:absolute;
right:3%;
top:50%;
width:6px;
height:6px;
border-bottom:1px solid #fff;
border-right:1px solid #fff;
transform:translate(0,-50%) rotate(-45deg);}

@media only screen and (max-width:960px) {

.index-manifesto24 a {
padding:5.8% 0;
font-size:1.9vw;}

}

@media only screen and (max-width:640px) {

.index-manifesto24 .pc {
display:none;}  
.index-manifesto24 .sp {
display:block;}
.index-manifesto24 .btn02 {
bottom:8%;
right:3.9%;
width:60%;}
.index-manifesto24 .btn01 {
position:absolute;
bottom:32.5%;
right:3.9%;
width:60%;}
.index-manifesto24 a {
font-size:2.9vw;}

}




/* index-manifesto20 ============*/

#index-manifesto20 {
position:relative;
text-align:center;
margin:0 auto 7%;
width:100%;
max-width:960px;}
#index-manifesto20 img {
border-radius:8px;}
#index-manifesto20 .pc {
display:block;}  
#index-manifesto20 .sp {
display:none;}
#index-manifesto20 img {
border-radius:8px;}
#index-manifesto20 .btn02 {
position:absolute;
bottom:13%;
right:4%;
width:33%;}
#index-manifesto20 .btn01 {
position:absolute;
bottom:13%;
right:38.5%;
width:33%;}
#index-manifesto20 a {
position:relative;
display:block;
font-size:110%;
line-height:1.15;
font-weight:bold;
white-space:nowrap;
overflow:hidden;
padding:6% 0;
background:#0098ee;
color:#fff;
border-radius:8px;
transition:0.3s;}
#index-manifesto20 a:hover {
background:#ee8800;}
#index-manifesto20 a::after {
content:"";
position:absolute;
right:3%;
top:50%;
width:6px;
height:6px;
border-bottom:1px solid #fff;
border-right:1px solid #fff;
transform:translate(0,-50%) rotate(-45deg);}

@media only screen and (max-width:960px) {

#index-manifesto20 a {
font-size:1.8vw;
line-height:1.15;}

}

@media only screen and (max-width:480px) {

#index-manifesto20 .pc {
display:none;}  
#index-manifesto20 .sp {
display:block;}
#index-manifesto20 .btn02 {
bottom:8%;
right:3.9%;
width:60%;}
#index-manifesto20 .btn01 {
position:absolute;
bottom:32.5%;
right:3.9%;
width:60%;}
#index-manifesto20 a {
font-size:2.8vw;
line-height:1.15;}

}

/* index-manifesto16 ============*/

#index-manifesto16 {
margin:0 auto 7%;
width:100%;
max-width:840px;
position:relative;}
#index-manifesto16 img {
border-radius:8px;}
#index-manifesto16 .btn01 {
position:absolute;
bottom:11%;
left:4%;
width:32%;}
#index-manifesto16 .btn02 {
position:absolute;
bottom:11%;
left:37%;
width:32%;}
#index-manifesto16 a {
display:block;
margin:0 0 0 0;
transition:all .3s;}
#index-manifesto16 a:hover {
margin:-6px 0 6px 0;}

.contents-index {
width:92%;
margin:6% auto;}

@media only screen and (max-width:960px) {

.contents-index {
margin:7% auto;}

}

@media only screen and (max-width:640px) {

.contents-index {
width:94%;
margin:8.5% auto;}

}

.index01 .left {
float:left;
width:67%;}
.index01 .right {
float:right;
width:27%;
text-align:center;}

@media only screen and (max-width:960px) {

.index01 .left {
float:none;
width:100%;}
.index01 .right {
display:none;}

}

.index02 {}
.index02 ul {
justify-content: space-between;}
.index02 li {
width:31%;
margin:30px 0 0 0;
padding:0 1px 0 0;
border:1px solid #e3e3e3;
box-shadow:1px 1px 2px 0 rgba(0,0,0,0.3);}

@media only screen and (max-width:960px) {

.index02 {
width:100%;
max-width:500px;
margin:0 auto;}
.index02 li {
width:100%;}

}

.index03 {  
margin:10px 0 30px 0;}
.index03 .intro {
position:relative;
padding:20px 0 18px 0;}
.index03 .intro .ttl {
position:absolute;
width:260px;
left:0;
top:50%;
transform:translate(0,-50%);}
.index03 .intro .txt {
margin:0 0 0 280px;
line-height:1.3;}
.index03 ul {
justify-content:space-between;}
.index03 li {
width:24%;
padding:15px 0 0 0;}
.index03 li a img {
border:1px solid #e3e3e3;
box-shadow:1px 1px 2px 0 rgba(0,0,0,0.3);
transition:0.3s;}
.index03 li a:hover img {
margin:-4px 0 4px 0;}

@media only screen and (max-width:800px) {

.index03 {  
margin:0 0 10px 0;}
.index03 .intro {
text-align:center;
padding:20px 0 10px 0;}
.index03 .intro .ttl {
width:100%;
position:static;
transform:translate(0,0);
padding:0 0 13px 0;
border-bottom:1px solid #185aac;}
.index03 .intro .txt {
margin:14px 0 0 0;}
.index03 li {
width:49%;
padding:2% 0 0 0;}

}

.index-left {
width:48%;
float:left;}
.index-right {
width:46%;
float:right;}

@media only screen and (max-width:800px) {

.index-left {
width:100%;
float:none;
padding:0 0 8% 0;}
.index-right {
width:100%;
float:none;
max-width:500px;
margin:0 auto;}

}