.spinoff-area{margin:0 auto}.spinoff-inner{width:calc(800/1000*100%);max-width:800px;margin:0 auto;padding:0}.spinoff-box{margin-bottom:80px}.spinoff-title{padding:40px 0 60px;position:relative}.spinoff-title .d-box-title{background:url(../images/spinoff/spinoff-tit.png);width:calc(600/800*100%);padding:16% 0 0;margin:0 auto;background-repeat:no-repeat;background-position:center;background-color:transparent;background-size:contain;font-size:0;text-indent:-9999px;overflow:hidden;white-space:nowrap;z-index:20}.spinoff-mv{background:#e3f8d6;text-align:center}.spinoff-mv img{width:100%;vertical-align:middle}.spinoff-section1{padding:60px 0 35px;text-align:center}.spinoff-section1 .spinoff-movie{width:100%;background-color:#fff;position:relative;z-index:50;margin-bottom:60px}.spinoff-section1 .spinoff-movie-data{padding-top:56%;position:relative}.spinoff-section1 .spinoff-movie-data iframe{width:100%;height:100%;position:absolute;top:0;left:0;z-index:10}.spinoff-section1 .spinoff-broadcast{display:flex;flex-wrap:wrap;justify-content:space-between;margin-top:60px}.spinoff-section1 .spinoff-broadcast-box{width:48%;margin-bottom:45px;font-family:'Noto Sans JP Bold', sans-serif;text-align:left}.spinoff-section1 .spinoff-broadcast-img{margin-bottom:10px;background:rgba(255,255,255,0.5);border:1px solid #67ae3e;position:relative}.spinoff-section1 .spinoff-broadcast-img :before,.spinoff-section1 .spinoff-broadcast-img :after{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:30}.spinoff-section1 .spinoff-broadcast-img :before{content:'';display:block;width:0;height:0;border-style:solid;border-width:17px 0 17px 29px;border-color:transparent transparent transparent rgba(255,255,255,0.6);margin-left:7px}.spinoff-section1 .spinoff-broadcast-img :after{content:'';display:block;width:76px;height:76px;border:2px solid rgba(255,255,255,0.6);border-radius:100%}.spinoff-section1 .spinoff-broadcast-number{color:#67ae3e;font-size:1.4rem;line-height:1}.spinoff-section1 .spinoff-broadcast-number span{margin-right:10px;font-size:3.2rem;font-weight:bold}.spinoff-section1 .spinoff-broadcast-title{margin-top:12px;font-size:1.8rem}.spinoff-section2{padding:40px 0;background:#e3f8d6;text-align:center}.spinoff-section2 .spinoff-section2-text{font-family:'Noto Sans JP Bold', sans-serif;font-size:3rem;font-weight:bold}.spinoff-section2 .spinoff-section2-text span{font-size:4.2rem;margin-right:4px}.spinoff-section3{background:url(../images/spinoff/bg.png)}.spinoff-section3-title{position:relative;margin:0;padding:60px 0}.spinoff-section3-title .d-box-title{padding:15% 0 0;margin:0 auto;font-size:0;text-indent:-9999px;overflow:hidden;white-space:nowrap;z-index:20}.spinoff-section3-intro .spinoff-section3-title .d-box-title{width:calc(440/800*100%);background:url(../images/spinoff/hulu-intro_tit.png) center/contain no-repeat}.spinoff-section3-story .spinoff-section3-title .d-box-title{width:calc(261/800*100%);background:url(../images/spinoff/story_tit.png) center/contain no-repeat}.spinoff-section3-schedule .spinoff-section3-title .d-box-title{width:calc(367/800*100%);background:url(../images/spinoff/schedule_tit.png) center/contain no-repeat}.spinoff-section3-title .d-box-title:not(:first-of-type){border-top:1px dotted #000}.spinoff-section3-intro{padding-bottom:80px}.spinoff-section3-text--intro{text-align:center;font-size:0;width:calc(562/800*100%);max-width:562px;margin:0 auto}.spinoff-section3-text--intro img{width:100%}.spinoff-section3-story{margin-bottom:80px;font-size:1.8rem;border-top:2px dotted #cfcfcf}.spinoff-section3-schedule{padding-bottom:80px;font-size:2.0rem;border-top:2px dotted #cfcfcf}.spinoff-section3-text--schedule{display:flex;justify-content:center}.spinoff-section4{background:#67ae3e;padding:40px 0px}.spinoff-section4 .spinoff-section4-box{padding:40px 10px;background:#fff;font-family:'Noto Sans JP Light', sans-serif;font-size:1.8rem;line-height:1.8;text-align:center}.spinoff-section4 .spinoff-section4-title{margin-bottom:23px}.spinoff-section4 .spinoff-section4-title img{vertical-align:middle}.spinoff-section4 .spinoff-section4-text{margin-bottom:30px}.spinoff-banner a{display:inline-block}.spinoff-banner img{vertical-align:middle;max-width:100%}@media only screen and (max-width: 600px){.spinoff-inner{padding:0;width:calc(670/750*100%);margin:0 auto;max-width:670px}.spinoff-box{margin-bottom:50px}.spinoff-title{padding:30px 0}.spinoff-title .d-box-title{width:calc(600/750*100%);padding:20% 0 0}.spinoff-section1{padding:30px 0 10px}.spinoff-section1 .spinoff-movie{margin-bottom:30px}.spinoff-section1 .spinoff-broadcast{margin-top:30px}.spinoff-section1 .spinoff-broadcast-box{margin-bottom:20px}.spinoff-section1 .spinoff-broadcast-img{margin-bottom:5px}.spinoff-section1 .spinoff-broadcast-img :before{border-width:10px 0 10px 18px;margin-left:3.5px}.spinoff-section1 .spinoff-broadcast-img :after{width:45px;height:45px}.spinoff-section1 .spinoff-broadcast-number{font-size:0.7rem}.spinoff-section1 .spinoff-broadcast-number span{margin-right:5px;font-size:1.6rem}.spinoff-section1 .spinoff-broadcast-title{margin-top:6px;font-size:0.9rem}.spinoff-section2{padding:30px 20px}.spinoff-section2 .spinoff-section2-text{font-size:1.5rem}.spinoff-section2 .spinoff-section2-text span{font-size:2.1rem;margin-right:3px}.spinoff-section3-title{padding:40px 0}.spinoff-section3-title .d-box-title{padding:20% 0 0;margin:0 auto}.spinoff-section3-intro .spinoff-section3-title .d-box-title{width:calc(440/750*100%)}.spinoff-section3-story .spinoff-section3-title .d-box-title{width:calc(261/750*100%)}.spinoff-section3-schedule .spinoff-section3-title .d-box-title{width:calc(367/750*100%)}.spinoff-section3-intro{padding-bottom:40px}.spinoff-section3-text--intro{width:calc(562/750*100%)}.spinoff-section3-story{margin-bottom:40px;font-size:1.4rem}.spinoff-section3-schedule{padding-bottom:40px;font-size:1.6rem}.spinoff-section4 .spinoff-section4-box{font-size:1.4rem}.spinoff-section4 .spinoff-section4-title{margin-bottom:18px}.spinoff-section4 .spinoff-section4-text{margin-bottom:35px}}
