@charset"utf-8";

img {
    max-width: 100%;
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 20px;
    color: #333;
    letter-spacing: 0.1em
}


/* ヘッダー----------------------------------------------- */
/* メニューバー 固定と位置 */
header ul {
    display: flex;
    justify-content: space-between;
    /* align-items: center; */
    margin: 0 auto;
    top: 0;
    right: 0;
    left: 0;
    }

header nav ul{
    background-color:rgba(255, 255, 255, 0.40);
    padding: 30px 370px 30px;
}

header nav ul li{color: #fff;

}
header{
    position: relative;
}

.logo{
    width: 70px;
    position: absolute;
    top: 5px;
    left: 50px;
}

/* TOPページ --------------------------------------------------*/

.topVisual{background: url(../images/top_img2-1.jpg) no-repeat right center/cover;
          height: 100vh;
          position: relative;}

.titleFont{
font-family:Noto Serif JP;
}

.title{
    /* padding-top: 200px; */
    text-align: center;
    color: #fff;
    width: 1400px;
    height: 872px;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}

.title .day3{
    text-align: left;
    padding-top: 0px;
    margin-bottom: -44px;
    margin-left: -27px;
}


.title h1{
    font-size: 90px;
    font-weight: 400;
    text-shadow: 0 0 10px #fff,0 0 15px #fff;
   
}

.title p{
    font-size: 28px;
}

.title .date{
    font-size: 28px;
    padding-top: 280px;
    margin-bottom: 40px;
    letter-spacing: 0.2em;
    text-shadow: 2px 2px 5px #000;
}


/* 割引クーポン----------------------------------- */
.coupon{
    color: #000;
    background-color: rgba(255, 255, 255, 0.70);
    width: 800px;
    margin: 0 auto;
    font-size: 24px;
    padding: 20px 0 20px 0;
    letter-spacing: 0.2em;
    font-family: Noto Sans JP;
    font-weight: 500;
}

/* チケットボタン----------------------------- */
.ticketBotton{
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 160px;
    height: 160px;
    background: #F6C14D;
    color: #000;
    text-decoration: none;
    text-align: center;
    /* margin: 10px 0; */
    /* margin-left: 1600px;
    margin-bottom: 20px; */
    position: fixed;
    bottom: 50px;
    right: 50px;
    z-index: 100;
}

.ticketBotton p{
    font-size: 20px;
    font-weight: 600;
    line-height: 1.6;
}
/* コンセプト------------------------------------------ */
.concept{
    background-image: url(../images/about_img.jpg);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    padding-bottom: 200px;
}
.concept .conaceptImg{
    display: flex;
    width: 1300px;
    margin: 0 auto;
    padding-bottom: 200px;
}

.concept .conceptTitle{
font-size: 54px;
text-align: center;
padding-top: 260px;
}


.concept .conceptText{
    width: 1100px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
    line-height: 1.6;
    text-shadow: #fff 2px -2px 10px,
    #fff -2px 2px 10px;
    font-weight: 400;
    /* #fff 1px -1px 10px,
    #fff -1px 1px 10px; */
     
    
    /* text-shadow:
    1px 1px 2px #fff,
    0 0 1em #fff,
    0 0 0.2em #fff; */
}

.concept .conceptMessage{
    margin: 100px 0;
    font-size: 24px;
    font-weight: 300;
}



/* 体験紹介----------------------------- */
.experience{
    width: 1200px;
    margin: 0 auto;
}

.experienceDetail{
    display: grid;
    grid-template-rows: 600px;
    grid-template-columns:50% 50%;
    /* padding-bottom: 50px; */
}

.experienceDetail .experienceImg{
    grid-row: 1/2;
    grid-column: 1/2;
    align-self: center;
    text-align: center;
}

.experienceDetail .experienceExplanation{
    grid-row: 1/2;
    grid-column: 2/3;
    align-self: center;
    text-align: center;
}

.experienceDetail .experienceImg img{
    width: 80%;
}
.experienceDetail .experienceExplanation img{
    width: 100%;
}


/* 体験反復------------------------ */
.reverse{
    display: grid;
    grid-template-rows: 600px;
    grid-template-columns:50% 50%;
    padding-bottom: 50px;
}

.reverse .reverseImg{
    grid-row: 1/2;
    grid-column: 2/3;
    align-self: center;
    text-align: center;
}

.reverse .reverseExplanation{
    grid-row: 1/2;
    grid-column: 1/2;
    align-self: center;
    text-align: center;
}

.reverse .reverseImg img{
    width: 80%;
}

.reverse .reverseExplanation img{
    width: 100%;

}


/* 上映スケジュール--------------- */
.schedule{
    background-image: url(../images/schedule.png);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    color: #021380;
}
/* 映画のフィルム */
.schedule p.film1{
    height: 73px;
    background-image: url(../images/film.png);
    background-repeat: no-repeat;
    background-position: top;
    transform: scale(1, -1);

}
.schedule p.film2{
    height: 73px;
    background-image: url(../images/film.png) ;
    background-repeat: no-repeat;
    background-position: top;
}

.scheduleTitle{
    font-size: 54px;
    text-align: center;
}

.scheduleIntro{
    padding: 150px 0 100px 0;
}

.scheduleIntro ul li{
    width: 950px;
    margin: 0 auto;
    font-size: 24px;
    background-image: url(../images/yellow_circle.png);
    background-repeat: no-repeat;
    background-position: left;
    text-decoration: underline 2px;
    text-underline-offset:10px;
    margin-bottom: 50px;
    padding-left: 40px;
}

.scheduleIntro .line{
    margin-top: 10px;
}

.schedule .scheduleText{
    width: 800px;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
    line-height: 2.0;
    text-align: center;  
    font-weight: 400;  
}

.schedule .scheduleMessage{
    margin: 100px 0;
    font-weight: 300;
}


/* 上映作品------------------------------------------ */
.movieGroup h3{
    font-size: 32px;
    color: #F9FAFF;
    background-color: rgba(2, 19, 128, 1);
    text-align: center;
    margin-bottom: 30px;
    letter-spacing: 0.4em

}

.movieGroup{
    width: 1200px;
    margin: 100px auto;
    line-height: 3;
}
.movieGroup .movieTitle{
        font-size: 32px;
        text-align: center;
        margin-top: 60px;
    }

.movieGroup p img{
    text-align: center;
    /* width: 125%; */

}
.movieGroup .movieSubtitle{
    font-size: 32px;
}



/* イベント詳細 -------------------------*/
.descriptionSection{
    background-image: url(../images/event.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;



    /* background-color: #000A49; */
    color: #fff;
    text-align: center;
    padding-top: 100px;
    padding-bottom: 200px;
}

.descriptionSection h3{
    font-size: 32px;
    text-align: center;
    margin-bottom: 50px;
}

.descriptionSection h2{
    font-size: 40px;
    margin-bottom: 40px;
}

/*詳細について------------------------------  */
.descriptionSection .detailGroup{
    line-height: 1.6;
    text-align: left;
}

.descriptionSection .detailGroup ul li{
    	list-style-type: disc;/* リストの左側に黒丸 */
	    margin-left: 24px;/* リストの左側に余白 */
	    text-align: left;
}

.descriptionSection .descriptionItem{
    width: 900px;
    margin: 100px auto;
}


/* 料金について------------------ */
.descriptionSection .feeGroup{
    line-height: 1.6;
    text-align: left;
}

.descriptionSection .feeText{
        margin-bottom: 30px;
}

.feeGroup .feeClass{
    margin-bottom: 30px;
}

.descriptionSection .feeGroup ul li{
    list-style-type: disc;/* リストの左側に黒丸 */
	    margin-left: 24px;/* リストの左側に余白 */
	    text-align: left;
}

.descriptionSection .feeClass{
    text-align: left;
    margin-bottom: 0px;
}
/* 注意事項 ------------------------------------*/
       .cautionGroup ul li{
        list-style-type: disc;/* リストの左側に黒丸 */
	    margin-left: 24px;/* リストの左側に余白 */
	    text-align: left;
}
.cautionGroup p{
    text-align: left;
}
.cautionGroup{
        line-height: 1.6;
}

.cautionGroup ul{
padding-left:33px;
}

/* 問い合わせ--------------------------------- */
.contact .snsIcon{
/* width: 500px; */
display: flex;
/* justify-content: space-evenly; */
justify-content: center;
margin:50px;
}

.contact .snsIcon img{
width: 60px;
}
.contact .icon{margin: 0 20px 0 20px;
}

.contact .post{
    font-size: 32px;
}


/* 再度メインビジュアル */
.footerVisual{
    background: url(../images/top_img2-1.jpg) no-repeat right center/cover;
    height: 90vh;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.title2{
    padding-top: 200px;
    text-align: center;
   color: #fff;

}

.title2 h1{
    font-size: 90px;
    font-weight: 400;
    text-shadow: 0 0 10px #fff,0 0 15px #fff;
   
}
/* チケット購入はこちら---------------------------- */

.footerVisual p.ticket2{
    font-size: 32px;
    width: 100%;
    position: absolute;
    bottom: 180px;
    /* text-align: right; */
    font-family: Noto Sans JP;
}

.title2 p{
    font-size: 28px;
}

/* フッター -------------------------------*/
footer ul {
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    top: 0;
    right: 0;
    left: 0;
    padding: 30px 370px 30px;
    /* margin-top: 450px; */
    align-self: flex-end;
    }
footer{
    background-color:rgba(255, 255, 255, 0.40);
    color: #fff;
}

footer p{
    text-align: center;
    font-size: 10px;
    padding: 30px 0;
}