/* hero */
#hero{
display: block;
margin: 60px 0 202px 0;
position: relative;
z-index: 2000;
}
.hero_slide{
display: block;
text-align: center;
}
.hero_slide li{
width: 900px;
display: block;
margin: 0;
border-radius: 30px;
text-align: center;
overflow: hidden;
}
.hero_slide li a{
text-align: center;
}
.hero_slide li img{
width: 85%;
height: auto;
margin-top: 3.5%;
margin-left: 7.5%;
border-radius: 30px;
}
.hero_slide li.slick-active img{
width: 100%;
height: auto;
margin-top: 0;
margin-left: 0;
}

.hero_banner{
width: 715px;
display: block;
position: absolute;
bottom: -170px;
left: calc((100% - 715px)/2);
}
.hero_banner img{
width: 100%;
height: auto;
}

.hero_slide .slick-prev{
width: 62px;
height: 62px;
display: block;
background: url(../img/main_arr_l.png) no-repeat center center;
background-size: 46px auto;
background-color: var(--bg-yellow);
border-radius: 31px;
position: absolute;
top: calc(50% - 11px);
left: calc(50vw - 450px - 26px);
z-index: 7500;
}
.hero_slide .slick-next{
width: 62px;
height: 62px;
display: block;
background: url(../img/main_arr_r.png) no-repeat center center;
background-size: 46px auto;
background-color: var(--bg-yellow);
border-radius: 31px;
position: absolute;
top: calc(50% - 11px);
right: calc(50vw - 450px - 26px);
z-index: 7501;
}
.hero_slide .slick-prev.slick-disabled,
.hero_slide .slick-next.slick-disabled{
display: none !important;
}

/* about */
#about{
display: block;
padding:32px 0 480px 0;
background: url(../img/outline_glass.png) no-repeat center bottom 80px,url(../img/outline_cloud.png) no-repeat center bottom 80px;
background-size: 100vw 205px,100vw auto;
background-color: var(--bg-blue);
position: relative;
z-index: 1000;
}
#about:before{
content: "";
width: 120vw;
height: 300px;
display: block;
border-radius: 50%;
background-color: var(--bg-blue);
position: absolute;
left: -10vw;
top: -150px
}
.about_cloud_top{
width: 110vw;
height: 36.4vw;
display: block;
background: url(../img/outline_cloud_top.png) no-repeat center center;
background-size: contain;
position: absolute;
top: -100px;
left: -7vw;
}
.about_catch{
width: 636px;
height: 0;
display: block;
margin: 0 auto 0 auto;
padding-top: 206px;
background: url(../img/about_catch.png) no-repeat center center;
background-size: contain;
font-size: 0px;
position: relative;
}
.about_catch:before{
content: "";
width: 819px;
height: 210px;
display: block;
background: url(../img/catch_onpu.png) no-repeat center center;
background-size: contain;
position: absolute;
top: 0;
left: calc(50% - 409px);
}
.about_txt{
display: block;
margin: 40px auto 0 auto;
font-size: var(--font-size-xxl);
font-weight: 600;
line-height: 2;
letter-spacing: 2px;
}
#about .photo01,
#about .photo02,
#about .photo03,
#about .photo04{
width: 255px;
height: 255px;
display: block;
position: absolute;
}
#about .photo01{
top: 100px;
left: calc(50% - 562px);
}
#about .photo03{
top: 400px;
left: calc(50% - 502px);
}
#about .photo02{
top: 112px;
right: calc(50% - 540px);
}
#about .photo04{
top: 412px;
right: calc(50% - 490px);
}
#about .photo01 img,
#about .photo02 img,
#about .photo03 img,
#about .photo04 img{
width: 100%;
height: auto;
}
#about .photo01:before{
content: "";
width: 70px;
height: 65px;
display: block;
background: url(../img/outline_heart.png) no-repeat center center;
background-size: contain;
position: absolute;
top: -42px;
left: -30px;
}
#about .photo03:before{
content: "";
width: 156px;
height: 84px;
display: block;
background: url(../img/outline_fukidashi.png) no-repeat center center;
background-size: contain;
position: absolute;
top: -36px;
left: -94px;
}
#about .photo04:before{
content: "";
width: 46px;
height: 58px;
display: block;
background: url(../img/outline_kirakira.png) no-repeat center center;
background-size: contain;
position: absolute;
top: -6px;
right: -16px;
}


/* schedule */
#schedule{
display: block;
padding: 60px 0 90px 0;
background-color: var(--white);
position: relative;
z-index: 4000;
}
#schedule:before{
content: "";
width: 120vw;
height: 300px;
display: block;
border-radius: 50%;
background-color: var(--white);
position: absolute;
left: -10vw;
top: -150px;
z-index: 4001;
}
#schedule:after{
content: "";
width: 120vw;
height: 300px;
display: block;
border-radius: 50%;
background-color: var(--white);
position: absolute;
left: -10vw;
bottom: -150px;
z-index: 4002;
}
.nontan_tantan{
width: 386px;
height: 383px;
display: block;
background: url(../img/nontan_tatan.png) no-repeat center center;
background-size: contain;
position: absolute;
top: -420px;
left: calc(50% - 193px);
z-index: 4800;
}
.chara_ss{
width: 1113px;
height: 329px;
display: block;
background: url(../img/chara_ss.png) no-repeat center center;
background-size: contain;
position: absolute;
bottom: 30px;
left: calc((1000px - 1113px)/2);
z-index: 4800;
}
.chara_aw{
width: 1082px;
height: 354px;
display: block;
background: url(../img/chara_aw.png) no-repeat center center;
background-size: contain;
position: absolute;
bottom: 30px;
left: calc((1000px - 1082px)/2);
z-index: 4800;
}
#schedule .wrapper{
position: relative;
z-index: 4010;
}
#schedule h2{
height: 89px;
display: block;
background: url(../img/bg_tit_schedule.png) no-repeat center center;
background-size: auto 89px;
position: relative;
z-index: 4011;
}
#schedule h2 span{
height: 0;
display: block;
padding-top: 53px;
background: url(../img/tit_schedule.png) no-repeat center center;
background-size: auto 53px;
overflow: hidden;
position: relative;
top: 18px;
}
.schedule_list{
width: 100vw;
display: block;
margin: 40px 0 0 0;
padding-left: calc((100vw - 1000px)/2);
position: relative;
z-index: 4020;
overflow: visible;
}
.schedule_list .slick-list{
overflow-x: visible;
}
.schedule_box{
width: 1000px;
display: block;
margin: 0 165px 0 0;
padding: 60px 80px 60px 80px;
background-color: var(--pink);
border-radius: 50px;
position: relative;
}
.schedule_box:nth-of-type(2){
margin-right: calc((100vw - 1000px)/2);
}
.schedule_contents{
display: block;
padding: 60px;
background-color: var(--white);
border-radius: 50px;
text-align: center;
}
.schedule_box .btn_detail{
margin-top: 50px;
position: relative;
z-index: 5000;
}
.schedule_subtit{
color: var(--dark-pink);
font-size: var(--font-size-xl);
font-weight: 500;
line-height: 23px;
text-align: center;
position: relative;
}
.schedule_subtit:before{
content: "";
width: 100%;
height: 21px;
display: block;
background: url(../img/bg_subtit_ss.png) no-repeat center center;
background-size: auto 21px;
position: absolute;
top: 0;
left: 0;
}
.schedule_box h3{
margin-top: 30px;
text-align: center;
}
.schedule_box .embed{
margin-top: 50px;
}
.schedule_story{
display: block;
margin-top: 50px;
font-size: var(--font-size-l);
font-weight: 500;
position: relative;
z-index: 4900;
}

.schedule_box.schdule_aw{
background-color: var(--light-blue);
}
.schedule_box.schdule_aw .schedule_subtit{
color: var(--blue);
line-height: 23px;
}
.schedule_box.schdule_aw .schedule_subtit:before{
content: "";
width: 100%;
height: 23px;
display: block;
background: url(../img/bg_subtit_ss.png) no-repeat center center;
background-size: auto 23px;
position: absolute;
top: 0;
left: 0;
}

.schedule_list .slick-prev{
width: 123px;
height: 152px;
display: block;
background: url(../img/schedule_arr_r.png) no-repeat center center;
background-size: contain;
position: absolute;
top: calc(50% - 76px);
left: calc( 50% - 652px);
z-index: 7500;
}
.schedule_list .slick-next{
width: 123px;
height: 152px;
display: block;
background: url(../img/schedule_arr_l.png) no-repeat center center;
background-size: contain;
position: absolute;
top: calc(50% - 76px);
right: calc( 50% - 652px);
z-index: 7501;
}
.schedule_list .slick-prev.slick-disabled,
.schedule_list .slick-next.slick-disabled{
display: none !important;
}


/* ticket */
#ticket{
display: block;
padding: 200px 0 90px 0;
background-color: var(--bg-beige);
position: relative;
z-index: 3000;
}
#ticket h2{
height: 89px;
display: block;
background: url(../img/bg_tit_ticket.png) no-repeat center center;
background-size: auto 89px;
position: relative;
z-index: 4011;
}
#ticket h2 span{
height: 0;
display: block;
padding-top: 53px;
background: url(../img/tit_ticket.png) no-repeat center center;
background-size: auto 53px;
overflow: hidden;
position: relative;
top: 18px;
}
#ticket .now_title{
display: block;
font-size: var(--font-base);
}

.ticket_list{
display: flex;
justify-content: space-between;
gap: 32px;
margin: 50px 0 0 0;
}
.ticket_list .ticket_price{
width: calc((100% - 32px)/2);
display: flex;
flex-direction: column;
gap: 0;
background-color: var(--white);
border: 4px solid var(--light-brown);
border-radius: 20px;
overflow: hidden;
}
.ticket_list .ticket_price.withgoods{
border: 4px solid var(--light-orange);
}
.ticket_list .ticket_price dt{
display: block;
background-color: var(--light-brown);
color: var(--white);
font-size: var(--font-price);
font-weight: 600;
line-height: 132px;
}
.ticket_list .ticket_price.withgoods dt{
display: block;
padding: 32px 0 30px 0;
background-color: var(--light-orange);
line-height: 42px;
}
.ticket_list .ticket_price.withgoods dt span{
display: block;
font-size: var(--font-size-l);
line-height: 30px;
}
.ticket_list .ticket_price dd{
padding: 40px 0 40px 0;
font-size: var(--font-price);
font-weight: 700;
}
.ticket_list .ticket_price dd span{
display: inline-block;
margin: 0 0 0 10px;
font-size: var(--font-price-num);
}

.ticket_goods{
display: block;
margin: 32px 0 0 0;
padding: 65px 50px 65px 50px;
background-color: var(--white);
border-radius: 20px;
}
.ticket_goods dl{
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
flex-wrap: wrap;
}
.ticket_goods dt{
width: 320px;
display: block;
position: relative;
}
.ticket_goods dt img{
width: 100%;
height: auto;
}
.ticket_goods dt p{
width: 94px;
height: 0;
display: block;
padding-top: 94px;
overflow: hidden;
position: absolute;
}
.ticket_goods .ticket_goods25ss dt p{
background: url(../img/goods/tokuten25ss_caption.png) no-repeat center center;
background-size: contain;
bottom: 0;
left: -40px;
}
.ticket_goods dd{
width: calc(100% - 350px);
display: block;
text-align: left;
}
.ticket_goods .ticket_goods_subtit{
display: inline-block;
padding: 0 15px 0 15px;
background-color: var(--light-orange);
color: var(--white);
border-radius: 21px;
font-size: var(--font-size-xxxl);
font-weight: 500;
line-height: 42px;
}
.ticket_goods h5{
display: block;
margin: 30px 0 0 0;
}
.ticket_goods h5 span{
display: block;
margin: 0 0 12px 0;
color: var(--light-orange);
font-size: var(--font-size-xxxl);
}
.ticket_goods .ticket_goods_exp{
display: block;
margin: 20px 0 0 0;
}
.ticket_goods .ticket_goods_exp p{
display: block;
color: var(--red);
}

.btn_block{
margin-top: 90px;
padding: 40px;
min-height: 236px;
display: block;
background: url(../img/chara_btns.png) no-repeat center center;
background-size: auto 254px;
}

#ticket .btn_detail2{
margin-top: 30px;
}


/* photo_scroll */
.photo_scroll{
display: block;
background-color: var(--white);
}

/* enjoy */
#enjoy{
display: block;
padding: 60px 0 90px 0;
background-color: var(--light-pink);
}
#enjoy h2{
height: 53px;
display: block;
background: url(../img/bg_tit_enjoy.png) no-repeat center center;
background-size: 580px auto;
position: relative;
z-index: 4011;
}
#enjoy h2 span{
height: 0;
display: block;
padding-top: 53px;
background: url(../img/tit_enjoy.png) no-repeat center center;
background-size: auto 53px;
overflow: hidden;
position: relative;
}
#enjoy .txt{
display: block;
margin: 40px 0 0 0;
}

.enjoy_list{
display: flex;
justify-content: flex-start;
gap: 0;
margin: 40px 0 0 0;
}
.enjoy_list:after{
content: "";
display: block;
clear: both;
height: 0;
visibility: hidden;
}
.enjoy_list_left,
.enjoy_list_right{
width: 50%;
display: block;
position: relative;
}
.enjoy_list_left{
padding: 40px 30px 40px 30px;
background-color: var(--white);
border-top-left-radius: 50px;
border-bottom-left-radius: 50px;
}
.enjoy_list_right{
padding: 40px 30px 40px 30px;
background-color: var(--white);
border-top-right-radius: 50px;
border-bottom-right-radius: 50px;
}
.enjoy_list_right .enjoy_box{
background-color: var(--white);
border-top-right-radius: 50px;
border-bottom-right-radius: 50px;
}
.enjoy_list_right .enjoy_box:after{
content: "";
width: 50px;
height: 50px;
display: none;
background: url(../img/bg_enjoy_rad.png) no-repeat left top;
background-size: contain;
position: absolute;
bottom: -50px;
left: 0;
}
.enjoy_box{
display: block;
text-align: center;
}
.enjoy_list_right .enjoy_box{
display: block;
padding: 40px 30px 40px 30px;
padding: 0;
}
.enjoy_list_right .enjoy_box:nth-of-type(2){
padding: 40px 0 0 0;
}
.enjoy_box dt{
display: block;
}
.enjoy_box h4{
display: block;
color: var(--dark-pink);
text-align: center;
}
.enjoy_box dt p{
display: block;
margin: 10px 0 0 0;
}
.enjoy_box dd{
display: block;
margin: 20px 0 0 0;
}
.enjoy_box dd img{
width: 100%;
height: auto;
}

.enjoy_box2{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center;
margin: 50px 0 0 50px;
padding: 40px 30px 40px 30px;
background-color: var(--white);
border-radius: 50px;
text-align: left;
}
.enjoy_box2 dt{
width: 202px;
display: block;
}
.enjoy_box2 dt img{
width: 100%;
height: auto;
}
.enjoy_box2 dd{
width: calc(100% - 232px);
display: block;
font-size: var(--font-size-xl);
}

#enjoy .btn_detail{
margin-top: 120px;
}


/* staff */
#staff{
display: block;
padding: 60px 0 90px 0;
background-color: var(--bg-green);
}
#staff .wrapper{
display: flex;
flex-direction: column;
gap: 40px;
padding: 65px 50px 65px 50px;
background-color: var(--white);
border-radius: 50px;
}
#staff dl{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
#staff dl dt{
width: 200px;
display: block;
border-radius:10px;
overflow:hidden;
}
#staff dl dt img{
width: 100%;
height: auto;
}
#staff dl dd{
width: calc(100% - 230px);
display: flex;
flex-direction: column;
gap: 20px;
text-align: left;
}
.role{
display: block;
color: var(--green);
font-size: var(--font-h5);
font-weight: 600;
}
#staff dl dd h4{
}
#staff dl dd h4 span{
font-size: var(--font-size-xxl);
}
.writter_exp{

}

/* cast */
#cast{
display: block;
padding: 60px 0 90px 0;
background-color: var(--white);
}
#cast h2{
height: 107px;
display: block;
background: url(../img/bg_tit_friends.png) no-repeat center center;
background-size: 660px auto;
position: relative;
z-index: 1;
}
#cast h2 span{
height: 0;
display: block;
padding-top: 107px;
background: url(../img/tit_friends.png) no-repeat center center;
background-size: auto 107px;
overflow: hidden;
position: relative;
}
#cast .wrapper{
display: flex;
flex-direction: column;
gap: 40px;
margin: 40px auto 0 auto;
padding: 65px 80px 65px 80px; 
background-color: var(--bg-yellow);
border-radius: 50px;
}
.main_cast,
.cast3,
.cast4,
.cast_uta{
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 40px;
text-align: center;
}
.main_cast li{
width: 300px;
display: block;
position: relative;
}
.cast3 li{
width: 240px;
display: block;
position: relative;
}
.cast3 li.usagi{
width: 520px;
display: block;
}
.cast_uta li{
display: flex;
}
.cast4 li{
width: 180px;
display: block;
}
.main_cast h4,
.cast3 h4,
.cast4 h4,
.cast_uta h4{
margin: 20px 0 0 0;
font-size: var(--font-size-xxl);
text-align: center;
}
.main_cast img,
.cast3 img,
.cast4 img,
.cast_uta img{
width: 100%;
height: auto;
border-radius:50% 50%;
}
.main_cast dl,
.cast3 dl{
display: flex;
flex-direction: column;
gap: 5px;
position: relative;
}
.main_cast dl dt,
.cast3 dl dt{
display: block;
position: relative;
}
.main_cast dl dd,
.cast3 dl dd{
display: block;
position: relative;
z-index: 4000;
}
li.usagi dl{
display: block;
padding: 32px 0 0 0;
}
li.usagi dt{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
li.usagi div{
width: 165px;
height: auto;
}
li.usagi dd{
display: block;
padding: 42px 0 0 0;
}

#cast h5{
margin-top: 30px;
color: var(--dark-pink);
font-size: var(--font-size-xxxl);
text-align: center;
}
.cast_uta dl{
display: flex;
justify-content: center;
flex-direction: row-reverse;
align-items: center;
gap: 40px;
}
.cast_uta dl dt{
display: block;
}
.cast_uta dl dd{
width: 180px;
}
.cast_sub{
color: var(--dark-pink);
}    
.cast_uta h4{
margin: 10px 0 0 0;
}
.cast_uta img{
width: 250px;
height: auto;
}

.cast_att{
display: block;
margin: 30px 0 0 0;
text-align: center; 
}

.more{
width: 56px;
height: 57px;
display: block;
background: url(../img/ico_popup.png) no-repeat center center;
background-size: contain;
position: absolute;
bottom: 10px;
right: 10px;
z-index: 5000;
}
li.usagi .more{
bottom: -40px;
right: calc(50% - 28px);
}

.intro_box{
display: none;
}
.intro_box.on{
width: 280px;
display: flex;
flex-direction: column;
gap: 30px;
padding: 20px 20px;
border-radius: 10px;
background-color: var(--white);
border: 3px solid #eba40a;
box-shadow: 2px 2px 2px rgba(0,0,0,0.25);
text-align: left;
position: absolute;
bottom: 120px;
right: -190px;
z-index: 6000;
}
.intro_box:after {
content: "";
width: 20px;
height: 12px;
display: block;
background-color: #eba40a;
box-sizing: border-box;
position: absolute;
top: 100%;
left: 50px;
transform: translateX(-50%);
clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.intro_box dt{
font-size: var(--font-size-xxxl);
font-weight: 700;
color: #eba40a;
}
.intro_box dd{
line-height: 1.6;
}
li.usagi div.intro_box{
width: 280px !important;
bottom: 120px;
right: 32px;
}
li.usagi div.intro_box dl{
padding: 0 !important;
}
li.usagi div.intro_box dl dd{
padding: 0 !important;
}

/* goods */
#goods{
display: block;
padding: 60px 0 90px 0;
background-color: var(--bg-pink);
position: relative;
}
#goods h2{
height: 63px;
display: block;
background: url(../img/bg_tit_goods.png) no-repeat center center;
background-size: 470px auto;
position: relative;
z-index: 4011;
}
#goods h2 span{
height: 0;
display: block;
margin-top: 10px;
padding-top: 53px;
background: url(../img/tit_goods.png) no-repeat center center;
background-size: auto 53px;
overflow: hidden;
position: relative;
}
#goods .txt{
display: block;
margin: 40px 0 0 0;
font-weight: 500;
}
#goods .txt strong{
display: block;
font-size: var(--font-size-xl);
}
.goods_slider{
width: 100vw;
margin: 40px 0 0 0;
}
.goods_slider li{
width: 360px;
display: block;
margin: 0 20px 0 20px;
}
.goods_slider li img{
width: 100%;
height: auto;
border:8px solid var(--white);
border-radius:20px;
}
#goods .btn_detail{
margin-top: 120px;
}


/* newws */
#news{
display: block;
padding: 90px 0 390px 0;
background-color: var(--white);
position: relative;
}
#news h2{
height: 0;
display: block;
padding-top: 53px;
background: url(../img/tit_news.svg) no-repeat center center;
background-size: auto 53px;
overflow: hidden;
position: relative;
}
.newsList{
display: block;
margin: 40px 50px 0 50px;
position: relative;
}
.newsList ul{
display: block;
border-top: 2px solid var(--base);
}
.newsList li{
display: block;
margin: 0 0 30px 0;
padding: 0 0 30px 0;
border-bottom: 2px solid var(--base);
}
.newsList li:first-child{
margin: 0 0 30px 0;
padding: 30px 0 30px 0;
}
.newsList li dl{
display: flex;
}
.newsList li dl dt{
width: 130px;
display: block;
box-sizing: border-box;
font-weight: 700;
color: var(--orange);
text-align: left;
}
.newsList li dl dd{
width: calc(100% - 130px);
display: block;
font-weight: 700;
text-align: left;
}
.newsList li dl dd a{
display: block;
}
.newsList li dl dd a:hover{

}
#news .btn_detail{
margin-top: 90px;
}

/* -- */
/* -- */
/* SP */
/* -- */
/* -- */
@media screen and (max-width: 768px) {
/* */
/* */


/* hero */
#hero{
margin: 0 0 38.6vw 0;
}
.hero_slide{
}
.hero_slide li{
width: 100vw;
border-radius: 0;
}
.hero_slide li a{
text-align: center;
}
.hero_slide li img{
width: 100%;
height: auto;
margin-top: 0;
margin-left: 0;
border-radius: 0;
}
.hero_slide li.slick-active img{
}

.hero_banner{
width: 82vw;
position: absolute;
bottom:-30vw;
left: 9vw;
}
.hero_banner img{
width: 100%;
height: auto;
}

.hero_slide .slick-prev{
width: 42px;
height: 42px;
background: url(../img/main_arr_l.png) no-repeat center center;
background-size: 32px auto;
background-color: var(--bg-yellow);
border-radius: 21px;
position: absolute;
top: calc(50% - 2px);
left: 14px;
z-index: 7500;
}
.hero_slide .slick-next{
width: 42px;
height: 42px;
background: url(../img/main_arr_r.png) no-repeat center center;
background-size: 32px auto;
background-color: var(--bg-yellow);
border-radius: 21px;
position: absolute;
top: calc(50% - 2px);
right: 14px;
z-index: 7501;
}
.hero_slide .slick-prev.slick-disabled,
.hero_slide .slick-next.slick-disabled{
display: none !important;
}

/* about */
#about{
padding:0 0 210px 0;
background: url(../img/outline_glass.png) no-repeat center bottom 80px,url(../img/outline_cloud.png) no-repeat center bottom 80px;
background-size: 100vw 115px,100vw auto;
background-color: var(--bg-blue);
position: relative;
z-index: 1000;
}
#about:before{
width: 120vw;
height: 300px;
border-radius: 50%;
background-color: var(--bg-blue);
left: -10vw;
top: -150px
}
.about_cloud_top{
width: 110vw;
height: 36.4vw;
display: block;
background: url(../img/outline_cloud_top.png) no-repeat center center;
background-size: contain;
position: absolute;
top: -100px;
left: -7vw;
}
.about_catch{
width: 90vw;
padding-top: 29.3vw;
padding-top: 26.3vw;
background: url(../img/about_catch.png) no-repeat center center;
background-size: contain;
}
.about_catch:before{
content: "";
width: 120vw;
width: 110vw;
height: 34vw;
background: url(../img/catch_onpu.png) no-repeat center center;
background-size: contain;
top: -3vw;
left: -10vw;
}
.about_txt{
margin: 40px auto 0 auto;
font-size: var(--font-size-xxl-sp);
line-height: 1.8;
letter-spacing: 1px;
text-align: left;
}
.about_top{
position: relative;
}
#about .photo01,
#about .photo02,
#about .photo03,
#about .photo04{
width: 225px;
height: 225px;
margin: 20px 0 0 0;
position: relative;
}
#about .photo01{
top: auto;
left: 10px;
}
#about .photo03{
top: -120px;
left: 20px;
}
#about .photo02{
top: -60px;
right: auto;
left: calc(100% - 235px);
}
#about .photo04{
top: -170px;
right: auto;
left: calc(100% - 255px);
}
#about .photo01 img,
#about .photo02 img,
#about .photo03 img,
#about .photo04 img{
}
#about .photo01:before{
content: "";
width: 35px;
height: 33px;
display: block;
background: url(../img/outline_heart.png) no-repeat center center;
background-size: contain;
position: absolute;
top: -11px;
left: -10px;
}
#about .photo03:before{
content: "";
width: 104px;
height: 56px;
display: block;
background: url(../img/outline_fukidashi.png) no-repeat center center;
background-size: contain;
position: absolute;
top: -24px;
left: -42px;
}
#about .photo04:before{
content: "";
width: 46px;
height: 58px;
display: block;
background: url(../img/outline_kirakira.png) no-repeat center center;
background-size: contain;
position: absolute;
top: -6px;
right: -16px;
}


/* schedule */
#schedule{
padding: 10px 0 30px 0;
}
#schedule:before{
width: 120vw;
height: 200px;
border-radius: 50%;
background-color: var(--white);
position: absolute;
left: -10vw;
top: -150px;
}
#schedule:after{
width: 120vw;
height: 200px;
border-radius: 50%;
background-color: var(--white);
left: -10vw;
bottom: -150px;
z-index: 4002;
}
.nontan_tantan{
width: 280px;
height: 278px;
display: block;
background: url(../img/nontan_tatan.png) no-repeat center center;
background-size: contain;
top: -320px;
left: calc(50% - 140px);
}
.chara_ss{
width: 1113px;
height: 329px;
display: none;
background: url(../img/chara_ss.png) no-repeat center center;
background-size: contain;
position: absolute;
bottom: 30px;
left: calc((1000px - 1113px)/2);
z-index: 4800;
}
.chara_aw{
width: 1082px;
height: 354px;
display: none;
background: url(../img/chara_aw.png) no-repeat center center;
background-size: contain;
position: absolute;
bottom: 30px;
left: calc((1000px - 1082px)/2);
z-index: 4800;
}
#schedule .wrapper{
}
#schedule h2{
height: 89px;
display: block;
background: url(../img/bg_tit_schedule.png) no-repeat center center;
background-size: auto 89px;
position: relative;
z-index: 4011;
}
#schedule h2 span{
height: 0;
display: block;
padding-top: 53px;
background: url(../img/tit_schedule.png) no-repeat center center;
background-size: auto 53px;
overflow: hidden;
position: relative;
top: 18px;
}
.schedule_list{
width: 100vw;
margin: 0 0 0 0;
}
.schedule_list .slick-list{
overflow-x: visible;
}
.schedule_box{
width: 94vw;
margin: 0 0 0 0;
padding: 30px 6vw 30px 6vw;
border-radius: 36px;
}
.schedule_box:nth-of-type(1){
margin-left:6vw;
}
.schedule_box:nth-of-type(2){
margin-right:0;
}
.schedule_contents{
padding: 30px 20px;
border-radius: 36px;
}
.schedule_box .btn_detail{
margin-top: 40px;
}
.schedule_subtit{
width: 100%;
font-size: var(--font-size-xl-sp);
line-height: 23px;
}
.schedule_subtit:before{
width: 100%;
height: 100%;
background: url(../img/bg_subtit_ss.png) no-repeat center bottom 5px;
background-size: auto 12px;
top: 0;
left: 0;
}
.schedule_box h3{
margin-top: 30px;
}
.schedule_box .embed{
margin-top: 40px;
}
.schedule_story{
margin-top: 40px;
font-size: var(--font-base-sp);
text-align: left;
}

.schedule_box.schdule_aw{
}
.schedule_box.schdule_aw .schedule_subtit{
line-height: 23px;
}
.schedule_box.schdule_aw .schedule_subtit:before{
content: "";
width: 100%;
height: 23px;
display: block;
background: url(../img/bg_subtit_ss.png) no-repeat center center;
background-size: auto 23px;
position: absolute;
top: 0;
left: 0;
}

.schedule_list .slick-prev{
width: 123px;
height: 152px;
display: block;
background: url(../img/schedule_arr_r.png) no-repeat center center;
background-size: contain;
position: absolute;
top: calc(50% - 76px);
left: calc( 50% - 652px);
z-index: 7500;
}
.schedule_list .slick-next{
width: 123px;
height: 152px;
display: block;
background: url(../img/schedule_arr_l.png) no-repeat center center;
background-size: contain;
position: absolute;
top: calc(50% - 76px);
right: calc( 50% - 652px);
z-index: 7501;
}
.schedule_list .slick-prev.slick-disabled,
.schedule_list .slick-next.slick-disabled{
display: none !important;
}
.schedule_list .slick-prev{
width: 42px;
height: 42px;
background: url(../img/main_arr_l.png) no-repeat center center;
background-size: 32px auto;
background-color: var(--white);
border-radius: 21px;
position: absolute;
top: calc(50% - 2px);
left: 14px;
}
.schedule_list .slick-next{
width: 42px;
height: 42px;
background: url(../img/main_arr_r.png) no-repeat center center;
background-size: 32px auto;
background-color: var(--white);
border-radius: 21px;
position: absolute;
top: calc(50% - 2px);
right: 14px;
}

/* ticket */
#ticket{
padding: 200px 0 90px 0;
}
#ticket h2{
height: 59px;
display: block;
background: url(../img/bg_tit_ticket.png) no-repeat center center;
background-size: auto 59px;
position: relative;
z-index: 4011;
}
#ticket h2 span{
height: 0;
display: block;
padding-top: 33px;
background: url(../img/tit_ticket.png) no-repeat center center;
background-size: auto 33px;
overflow: hidden;
position: relative;
top: 13px;
}
#ticket .now_title{
font-size: var(--font-base-sp);
}

.ticket_list{
flex-direction: column;
gap: 30px;
margin: 40px 0 0 0;
}
.ticket_list .ticket_price{
width: 100%;
border: 3px solid var(--light-brown);
border-radius: 20px;
}
.ticket_list .ticket_price.withgoods{
border: 3px solid var(--light-orange);
}
.ticket_list .ticket_price dt{
font-size: var(--font-price-sp);
font-weight: 600;
line-height: 114px;
}
.ticket_list .ticket_price.withgoods dt{
padding: 22px 0 20px 0;
background-color: var(--light-orange);
line-height: 42px;
}
.ticket_list .ticket_price.withgoods dt span{
font-size: var(--font-base-sp);
line-height: 30px;
}
.ticket_list .ticket_price dd{
padding: 22px 0 20px 0;
font-size: var(--font-price-sp);
}
.ticket_list .ticket_price dd span{
margin: 0 0 0 10px;
font-size: var(--font-price-num-sp);
}

.ticket_goods{
margin: 30px 0 0 0;
padding: 30px 20px 30px 20px;
border-radius: 20px;
}
.ticket_goods dl{
flex-direction: column;
}
.ticket_goods dt{
width: auto;
max-width: 420px;
margin: 0 auto 0 auto;
}
.ticket_goods dt img{
}
.ticket_goods dt p{
}
.ticket_goods .ticket_goods25ss dt p{
left: calc(100vw - 114px - 6vw);
}
.ticket_goods dd{
width: 100%;
margin: 30px 0 0 0;
}
.ticket_goods .ticket_goods_subtit{
display: block;
border-radius: 5px;
font-size: var(--font-size-xl-sp);
line-height: 42px;
text-align: center;
}
.ticket_goods h5{
margin: 30px 0 0 0;
}
.ticket_goods h5 span{
margin: 0 0 12px 0;
font-size: var(--font-size-xxl-sp);
}
.ticket_goods .ticket_goods_exp{
margin: 20px 0 0 0;
}
.ticket_goods .ticket_goods_exp p{
}

.btn_block{
margin-top: 30px;
padding: 0 6vw 0 6vw;
min-height: 236px;
display: block;
background: url(../img/chara_btns.png) no-repeat center center;
background-size: auto 276px;
}

#ticket .btn_detail2{
margin-top: 30px;
}


/* photo_scroll */
.photo_scroll{
}

/* enjoy */
#enjoy{
padding: 60px 0 90px 0;
background-color: var(--light-pink);
}
#enjoy h2{
height: 33px;
background: url(../img/bg_tit_enjoy.png) no-repeat center center;
background-size: 340px auto;
}
#enjoy h2 span{
padding-top: 33px;
background: url(../img/tit_enjoy.png) no-repeat center center;
background-size: auto 33px;
}
#enjoy .txt{
margin: 40px 0 0 0;
text-align: left;
}

.enjoy_list{
flex-direction: column;
margin: 40px 0 0 0;
}
.enjoy_list:after{
}
.enjoy_list_left,
.enjoy_list_right{
width: 100%;
}
.enjoy_list_left{
padding: 30px 20px 30px 20px;
background-color: var(--white);
border-top-left-radius: 36px;
border-top-right-radius: 36px;
border-bottom-left-radius:0;
}
.enjoy_list_right{
padding: 0 20px 30px 20px;
background-color: var(--white);
border-top-right-radius: 0;
border-bottom-right-radius: 36px;
border-bottom-left-radius: 36px;
}
.enjoy_list_right .enjoy_box{
background-color: var(--white);
border-top-right-radius: 36px;
border-bottom-right-radius: 36px;
}
.enjoy_list_right .enjoy_box:after{
content: "";
width: 50px;
height: 50px;
display: none;
background: url(../img/bg_enjoy_rad.png) no-repeat left top;
background-size: contain;
position: absolute;
bottom: -50px;
left: 0;
}
.enjoy_box{
}
.enjoy_list_right .enjoy_box{
}
.enjoy_list_right .enjoy_box:nth-of-type(1){
padding: 10px 0 0 0;
}
.enjoy_list_right .enjoy_box:nth-of-type(2){
padding: 40px 0 0 0;
}
.enjoy_box dt{
}
.enjoy_box h4{
text-align: center;
}
.enjoy_box dt p{
margin: 10px 0 0 0;
}
.enjoy_box dd{
margin: 20px 0 0 0;
}
.enjoy_box dd img{
}

.enjoy_box2{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center;
margin: 50px 0 0 50px;
padding: 40px 30px 40px 30px;
background-color: var(--white);
border-radius: 50px;
text-align: left;
}
.enjoy_box2 dt{
width: 202px;
display: block;
}
.enjoy_box2 dt img{
width: 100%;
height: auto;
}
.enjoy_box2 dd{
width: calc(100% - 232px);
display: block;
font-size: var(--font-size-xl);
}

#enjoy .btn_detail{
margin: 50px 6vw 0 6vw;
}


/* staff */
#staff{
padding: 60px 0 90px 0;
}
#staff .wrapper{
gap: 30px;
padding: 30px 20px 30px 20px;
border-radius: 36px;
}
#staff dl{
flex-direction: column;
gap: 20px;
}
#staff dl dt{
width: 100%;
max-width: 400px;
margin: 0 auto 0 auto;
}
#staff dl dt img{
}
#staff dl dd{
width: 100%;
gap: 20px;
}
.role{
font-size: var(--font-h5-sp);
}
#staff dl dd h4{
}
#staff dl dd h4 span{
font-size: var(--font-size-xxl-sp);
}
.writter_exp{

}

/* cast */
#cast{
padding: 60px 0 90px 0;
}
#cast h2{
height: 72px;
background: url(../img/bg_tit_friends.png) no-repeat center center;
background-size: 380px auto;
}
#cast h2 span{
padding-top: 72px;
background: url(../img/tit_friends.png) no-repeat center center;
background-size: auto 72px;
}
#cast .wrapper{
gap: 30px;
margin: 40px auto 0 auto;
padding: 30px 20px;
border-radius: 36px;
}
.main_cast,
.cast3,
.cast4,
.cast_uta{
gap: 20px;
}
.main_cast li{
width: calc((100% - 20px)/2);
}
.cast3 li{
width: calc((100% - 20px)/2);
}
.cast3 li.usagi{
width: 100%;
}
.cast_uta li{
width: 100%;
}
.cast4 li{
width: calc((100% - 20px)/2);
}
.main_cast h4,
.cast3 h4,
.cast4 h4,
.cast_uta h4{
margin: 20px 0 0 0;
font-size: var(--font-size-xxl-sp);
}
.cast4 h4{
font-size: var(--font-size-l-sp);
}
.main_cast img,
.cast3 img,
.cast4 img,
.cast_uta img{
}
.main_cast dl,
.cast3 dl{
}
.main_cast dl dt,
.cast3 dl dt{

}
.main_cast dl dd,
.cast3 dl dd{
}
li.usagi dl{
padding: 0 0 0 0;
}
li.usagi dt{
gap: 10px;
}
li.usagi div{
width: calc((100% - 20px)/3);
}
li.usagi dd{
display: block;
padding: 0 0 0 0;
}

#cast h5{
margin-top: 20px;
font-size: var(--font-size-xxxl-sp);
text-align: center;
}
.cast_uta dl{
gap: 20px;
}
.cast_uta dl dt{
width: calc((100% - 20px)/2);
}
.cast_uta dl dd{
width: 120px;
}
.cast_sub{
color: var(--dark-pink);
}    
.cast_uta h4{
margin: 10px 0 0 0;
}
.cast_uta img{
width: 100%;
height: auto;
}

.cast_att{
margin: 30px 6vw 0 6vw;
text-align: left; 
}

.more{
width: 32px;
height: 33px;
background: url(../img/ico_popup.png) no-repeat center center;
background-size: contain;
bottom: 5px;
right: 5px;
}
li.usagi .more{
bottom: -16px;
right: calc(50% - 16px);
}

.intro_box{
display: none;
}
.intro_box.on{
width: 220px;
display: flex;
flex-direction: column;
gap: 30px;
padding: 20px 20px;
border-radius: 10px;
background-color: var(--white);
border: 3px solid #eba40a;
box-shadow: 2px 2px 2px rgba(0,0,0,0.25);
text-align: left;
position: absolute;
bottom: 100px;
right: -90px;
z-index: 7000;
}
.intro_box:after {
content: "";
width: 20px;
height: 12px;
display: block;
background-color: #eba40a;
box-sizing: border-box;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.main_cast li:nth-child(2n) .intro_box,
.cast3 li:nth-child(2n) .intro_box{
bottom: 100px;
right: 0;
}
.main_cast li:nth-child(2n) .intro_box:after,
.cast3 li:nth-child(2n) .intro_box:after{
left: 195px;
}

.intro_box dt{
font-size: var(--font-size-xxxl);
font-weight: 700;
color: #eba40a;
}
.intro_box dd{
line-height: 1.6;
}
li.usagi div.intro_box{
width: 220px !important;
}
.cast3 li.usagi .intro_box{
bottom: 75px;
right: 48px;
}
.cast3 li.usagi .intro_box:after{
top: 100%;
left: 50%;
}
li.usagi div.intro_box dl{
padding: 0 !important;
}
li.usagi div.intro_box dl dd{
padding: 0 !important;
}

/* goods */
#goods{
padding: 60px 0 90px 0;
}
#goods h2{
height: 45px;
display: block;
background: url(../img/bg_tit_goods.png) no-repeat center center;
background-size: 340px auto;
}
#goods h2 span{
margin-top: 0;
padding-top: 45px;
background: url(../img/tit_goods.png) no-repeat center center;
background-size: auto 33px;
}
#goods .txt{
margin: 40px 0 0 0;
text-align: left;
}
#goods .txt strong{
font-size: var(--font-size-xl-sp);
}
.goods_slider{
margin: 40px 0 0 0;
}
.goods_slider li{
width: 88vw;
margin: 0 10px 0 10px;
}
.goods_slider li img{
}
#goods .btn_detail{
margin: 50px 6vw 0 6vw;
}


/* newws */
#news{
padding: 60px 0 290px 0;
}
#news h2{
padding-top: 33px;
background: url(../img/tit_news.svg) no-repeat center center;
background-size: auto 33px;
}
.newsList{
margin: 30px 0 0 0;
position: relative;
}
.newsList ul{
border-top: 2px solid var(--base);
}
.newsList li{
margin: 0 0 30px 0;
padding: 0 0 30px 0;
border-bottom: 2px solid var(--base);
}
.newsList li:first-child{
margin: 0 0 30px 0;
padding: 30px 0 30px 0;
}
.newsList li dl{
flex-direction: column;
}
.newsList li dl dt{
width: 100%;
}
.newsList li dl dd{
width: 100%;
}
.newsList li dl dd a{
}
.newsList li dl dd a:hover{

}
#news .btn_detail{
margin: 50px 6vw 0 6vw;
}

/* */
/* */
}
/* -- */
/* -- */
/* SP */
/* -- */
/* -- */

@media screen and (max-width: 560px) {
#news{
padding: 60px 0 190px 0;
}
}