@charset "utf-8";
/* CSS Document */

section{padding:80px 0 0 ;}
section:last-child{padding: 80px 0;}
.posiA{position: absolute;}

#mainViewSec{background: url(/dreamcard26-27/images/main_img01.jpg)no-repeat;background-position: top center;position: relative;background-size: cover;padding: 10vw 0;border-bottom: 20px solid #1c7e8d;}
#mainViewSec .mainViewBox .ttl-h2{filter: drop-shadow(0px 0px 6px #666);width: 40%;margin: auto;}
#mainViewSec .mainViewBox .posiA{width: 30%;}
#mainViewSec .mainViewBox .posiA.fv01{bottom: 3%;left: 3%;}
#mainViewSec .mainViewBox .posiA.fv02{bottom: 3%;right: 3%;}
#mainViewSec .hdf_link{position: absolute;right: 0;top: 2em;width: 17%;text-align: end;}

#contentsBox{background:linear-gradient(300deg,#009091 0%,#3daba4 40% ,#009091 70%,#3daba4 100%) ;}
#contentsBox #contentsBoxInner{background: #fff;max-width: 1300px;margin: auto;padding:0 4em;width: 90%;}

section{padding:80px 0 0 ;}
#firstSec .preparationBox .preparationTtl{border-top: 3px solid #1d7987;border-bottom: 3px solid #1d7987;line-height: 1.3;font-size: 30px;font-weight: 900;color: #1d7987;padding: 20px 0;margin-bottom: 1.5em;}
#firstSec .preparationBox .preparationTxt{font-size: 22px;color: #3d1104;}
#firstSec .overviewBox .overview{margin:40px auto 40px;position: relative;}
#firstSec .overviewBox .overview::before{content: "";background: url(/dreamcard26-27/images/img_contents07.png)no-repeat;width: 210px;height: 600px;position: absolute;bottom: 0;left: 0;}
#firstSec .overviewBox .overview::after{content: "";background: url(/dreamcard26-27/images/img_contents08.png)no-repeat;width: 190px;height: 767px;position: absolute;bottom: 0;right: 0;}
#firstSec .overviewBox .overview .txtBox{position: relative;}
#firstSec .overviewBox .overview .txtBox .fuki{left: 1em ;top:-4em;max-width: 23%;}
#firstSec .overviewBox .overview .txtBox .ttl-h3{margin:0 auto 2em 8em;}
#firstSec .overviewBox .overview .txtBox p{font-size: 20px;line-height: 1.8;color: #3d1104;}
#firstSec .overviewBox .overview .imgBox{margin-top: 3em;position: relative;z-index: 2;}
#firstSec .overviewBox .overview .imgBox ul{display: flex;flex-wrap: wrap;justify-content: center;align-items: center;gap: 4em;margin-top: 4em;}

#firstSec .overview_atenBox{border: 8px solid #00afad;padding: 1em 2em;max-width: 1050px;margin: 2em auto 0;}

#firstSec .overview_atenBox .atenTxt{margin: 1.5em 0 0;border-bottom: 1px solid #3d1104;padding: 0 5em 1em;}
#firstSec .overview_atenBox .atenTxt .txt{position: relative;padding-left: 22px;font-size: 18px;}
#firstSec .overview_atenBox .atenTxt .txt::before{content: "※";position: absolute;left: 0;}
#firstSec .overview_atenBox .tel{font-size: 20px;margin-top: 10px;color: #3d1104;}
#firstSec .overview_atenBox .tel span{display: inline-block;}

.sectionBox .Sec-TtlBox{margin-bottom: 50px;}
.sectionBox .Sec-TtlBox .ttl-h3{background:#404040 ;color: #fff;font-size: 28px;position: relative;margin: 0 1em;padding: 10px 55px;font-weight: 900;}
.sectionBox .Sec-TtlBox .ttl-h3::before{content: "";background: url(/dreamcard26-27/images/img_Ttl_left.png)no-repeat;position: absolute;left: -1em;top: 0;width: 89px;height: 100%;z-index: 2;display: block;background-size: 100% 100%;}
.sectionBox .Sec-TtlBox .ttl-h3::after{content: "";background: url(/dreamcard26-27/images/img_Ttl_right.png)no-repeat;position: absolute;right: -1em;top: 0;width: 89px;height: 100%;z-index: 2;display: block;background-size: 100% 100%;}
.sectionBox .cs{font-size: 60px;font-weight: 900;color: #404040;} 
.brown_txt{font-size: 20px;color: #42210b;line-height: 1.5;margin-top: 0.2em;}

#priceSec .venueList{display: flex; flex-wrap: wrap;align-items: center;justify-content: center;gap: 2em;margin-top: 3em;}
#priceSec .venueList li a{position: relative;display: flex;align-items: center;width: 18em;min-height: 3.5em;padding: 0.5em 2.5em 0.5em 0.8em;font-size: 24px;background-color: #e84709;color: #fff;font-weight: 600;line-height: 1.2;}
#priceSec .venueList li a::after{content: "";position: absolute;transform: rotate(45deg) translate(-50%, -50%);top: 50%;right: 1em;width: 1em;height: 1em;border-right: 4px solid #fff;border-bottom: 4px solid #fff;}

#priceSec .seatBox{margin-top: 4em;}
#priceSec .seatBox .seat_txt{font-size: 28px;color: #3d1104;font-weight: 700;line-height: 1.2;border-left: 10px solid #e84709;padding-left: 0.5em;margin-bottom: 0.5em;}
#priceSec .seatBox .seat_txt .txtSizeS{font-size: 80%;}
#priceSec .seatBox ul{display: flex;justify-content:flex-start;align-items: flex-start;margin: 1em 2em;}
#priceSec .seatBox ul .seat_img{margin-right: 2em;width: 55%;}
#priceSec .seatBox ul .seat_price{margin-top: 0.5em;background: #d0edef;}
#priceSec .seat_name{font-size:30px;font-weight: bold;line-height: 1.3;width: 45%;}
#priceSec .seat_name span{display: block;}
#priceSec .seat_name .color01{color: #c2f1c8;}
#priceSec .seat_name .color02{color: #00ff00;}
#priceSec .seat_name .color03{color: #275317;}
#priceSec .seat_name .color04{color: #01b051;}
#priceSec .seat_name .color05{color: #ff0067;}
#priceSec .seat_name .brown_txt{font-size:16px ;}

#ctaSec .cta_btn {margin: 1em auto;}
#ctaSec .cta_btn img{background:linear-gradient(45deg,#00afad 0% ,#51c4ba 100%) ;padding: 1.5em 3em;border-radius: 7px;}
#ctaSec .cta_btn:hover{opacity: 0.8;}

#scheduleSec.sectionBox .Sec-TtlBox{margin-bottom: 30px;}
#scheduleSec .schedule_img{margin-top: 1em;}

#benefitsSec .benefits_Ttl{margin-bottom: 1em;}

#reviewSec .reviewInner .img{margin-bottom: 1em;}
#reviewSec .reviewInner .reviewTxt{font-size: 28px;font-weight: 900;color: #3d1104;border-bottom: 2px dashed #e94709;margin: 1em 2em;padding-bottom: 5px;} 
#reviewSec .reviewInner .review_aten{text-align: end;}

#attenSec .attentionBox p{margin-bottom: 0.8em;line-height: 1.5em;font-size: 16px;position: relative;padding-left: 15px;}  
#attenSec .attentionBox p::before{content:"・";position: absolute;left: 0;}

footer #page-top{display: none!important;}
.back_top{width: 120px; position: fixed; bottom: 2%; right: 2%; z-index: 100;}

@media (min-width: 768px) and (max-width: 1300px) {
  #contentsBox #contentsBoxInner{padding:0 2em ;}
  #firstSec .overviewBox .overview .txtBox .fuki{left: -3em ;}
  #firstSec .overview_atenBox .atenTxt{padding:0 0em 1em ;}
  #priceSec .seat_name{font-size: 220%;}
  #reviewSec .reviewInner .reviewTxt{margin: 1em;}
}

@media screen and (max-width: 767px) {
  section{padding: 40px 0 0;}
  section:last-child{padding: 40px 0;}
  #mainViewSec{background: url(/dreamcard26-27/images/main_img01_sp.jpg)no-repeat;background-position: top center;position: relative;background-size: cover;padding: 6vw 0 50vw;border-bottom: 15px solid #1c7e8d;}
  
  #mainViewSec .mainViewBox .ttl-h2{width: 70%;}
  #mainViewSec .mainViewBox .posiA.fv01{bottom:32%;left: 25%;width: 45%;}
  #mainViewSec .mainViewBox .posiA.fv02{bottom:18%;right: 18%;width: 53%;}
  #mainViewSec .hdf_link{max-width: 45%;top: auto;bottom: 0px;width: auto;}

  #contentsBox #contentsBoxInner{padding: 1em;}
  #firstSec{padding:20px 0 0 ;}
  #firstSec .preparationBox .preparationTtl{font-size:4.5vw ;line-height: 1.5;border-top: 2px solid #1d7987;border-bottom: 2px solid #1d7987;padding:15px 0 ;}
  #firstSec .preparationBox .preparationTxt{font-size:3.5vw ;}
  #firstSec .overviewBox .overview{margin:0px auto ;}
  #firstSec .overviewBox .overview .txtBox .ttl-h3{margin:0px auto 2em 3em;}
  #firstSec .overviewBox .overview .txtBox .fuki{width:23%;left: -2em;top: -2em;}
  #firstSec .overviewBox .overview .txtBox p{font-size: 3.5vw;text-align: left;}
  #firstSec .overviewBox .overview::before,
  #firstSec .overviewBox .overview::after{display: none;}
  #firstSec .overviewBox .overview .imgBox ul{gap: 1em;margin-top: 2em;}
  #firstSec .overviewBox .overview .imgBox ul li{width: 70%;}
  #firstSec .overview_atenBox{padding: 1em ;}
  #firstSec .overview_atenBox .atenTxt{padding: 0 0 10px;}
  #firstSec .overview_atenBox .atenTxt .txt{font-size: 3.2vw;padding-left: 15px;}
  #firstSec .overview_atenBox .tel{font-size: 3.5vw;}
  #firstSec .overview_atenBox .tel span{display: none;}
  .sectionBox .Sec-TtlBox{margin-bottom:20px;}
  .sectionBox .Sec-TtlBox .ttl-h3{font-size: 4.5vw;margin:0 0.5em ;padding:10px 28px ;}
  .sectionBox .Sec-TtlBox .ttl-h3::before,
  .sectionBox .Sec-TtlBox .ttl-h3::after{background-size: 100% 101%;width: 45px;}
  .sectionBox .cs{font-size:8vw ;}
  .brown_txt{font-size:3.5vw ;text-align: left;}

  #priceSec .fuki{width: 90%;margin: auto;}
  #priceSec .grayBox{padding:1em ;}
  #priceSec .venueList{gap: 1em;margin-top: 2em;}
  #priceSec .venueList li{width: 100%;}
  #priceSec .venueList li a{width: 100%;font-size: 4vw;}
  #priceSec .seatBox{margin-top: 3em;}
  #priceSec .seatBox ul{display: block;margin: 1em;}
  #priceSec .seatBox ul .seat_img{width: 100%;margin-left: 0;margin-bottom: 0.5em;}
  #priceSec .seatBox ul .seat_price{padding: 0 1em;}
  #priceSec .priceListBox{padding:1em ;display: block;} 
  #priceSec .seatBox .seat_txt{font-size: 4.5vw;}
  #priceSec .seat_name{font-size: 5.5vw;width: 100%;}
  #priceSec .seat_name .brown_txt{font-size:3.5vw ;}
  #priceSec .priceListBox .seat_name{font-size: 5.5vw;}
  #priceSec .priceListBox .seat_price{width: 80%;margin: 0.5em auto 0;}

  #ctaSec .cta_txt{width: 65%;margin: auto;}
  #scheduleSec .schedule_img{overflow: scroll;width: 100%;margin-top: 0;}
  #scheduleSec .schedule_img img{min-width: 600px;}
  #scheduleSec .sp_aten{font-size: 3vw;margin-top: 1em;}

  #benefitsSec .benefits_Ttl{margin-bottom: 1em;}

  #reviewSec .reviewInner .reviewTxt{margin: 0 0 1em;font-size: 3.8vw;}
  #reviewSec .reviewInner .img03{width: 60%;margin: auto;}
  #reviewSec .reviewInner .review_aten{font-size: 3vw;text-align: center;line-height: 1.2;margin-top: 1em;}
  #attenSec .attentionBox p{font-size: 3.5vw;}

  #page-top a{width:20% ;}
  #page-top img{width:100% ;}
}
