@charset "utf-8";

/* Reset Style
==================================================*/

* { margin: 0; padding: 0; font-size: 100%; box-sizing: border-box;}
html { height: 100%; margin: 0; padding: 0; line-height: 1; zoom: 1;}
body { height: 100%; margin: 0; padding: 0; font-family:'Noto Sans Japanese', Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; font-size: 1em; zoom: 1; color: #333333;}

hr { display: none; }
img { border: none; line-height: 0; vertical-align: bottom; }
div, dl, dt, dd, form, input, ul, ol, li, p, select, textarea, span, th, td { margin: 0; padding: 0; }
li { list-style-type: none; border: 0; outline: 0; }
address, th, caption, em, dfn { font-style: normal; font-weight: normal; font-size: 100%; }
strong{font-weight: bold;}
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; margin: 0; padding: 0; }
ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; font-size: 100%; font-size: inherit; }

a { color: #fff; text-decoration: none;
}
a:link { color: #fff; text-decoration: none;}
a:visited {}
a:hover { text-decoration: underline;opacity: 0.8;}
a:active { text-decoration: underline;}

img{width:100%;height: auto;}
/* clearfix
============================= */
.clearfix:after {
content: "" ;
display: block ;
clear: both ;
height: 0 ;
visibility: hidden ;
font-size: 0.1em;
line-height: 0;
}
.clearfix { min-height: 1px;}
* html .clearfix {height: 1px;}

/*----------------------------------------------------------------------------
 ***                                                                    共通
----------------------------------------------------------------------------*/
.pcNone{ display:none;}
.spNone{ display:block;}
.dispFlex{ display: flex;}
.posiR{ position: relative;}
.posiA{ position: absolute;}

.tac{ text-align:center;}
.tar{ text-align:right;}
.tal{ text-align:left;}

.txtColorWh{ color: #ffffff;}
.txtColorOr{ color: #E84709;}
.txtColorBl{ color: #0C3484;}
.txtColorGld{ color: #E2B41E;}
.bgColorWh{ background-color: #ffffff;}
.bgColorOr{ background-color: #E84709;}
.bgColorGr{ background-color: #F7F7F7;}
.bgColorBl{ background-color: #0C3484}
.bgColorGld{ background-color: #E2B41E;}

.radius10{ border-radius: 10px;}

.floatR{ float:right;}
.floatL{ float:left;}
.imgfloatR{ float:right;}
.imgfloatL{ float:left;}


/*----------------------------------------------------------------------------
 ***                                                                  header
----------------------------------------------------------------------------*/
/*header*/
#pageHeader{background:#000;position: sticky;top: 0;z-index: 100;}
#pageHeader .headerInner{padding:0 0% 0 1%;position: relative;display: flex;}
#pageHeader .headerInner h1{ float:left;}
#pageHeader .headerInner h1 img{padding:18px 0;}
#pageHeader .headerInner ul{display: flex;justify-content: flex-end;float: left;align-items: center;padding: 0px 0 0px 1%;width: 100%;}
#pageHeader .headerInner li{border-left: 1px solid #e2e2e2;padding: 2% 3%;}
#pageHeader .headerInner li:last-child{border-right: none;}
#pageHeader .headerInner li a:hover{opacity: 0.8;}
#pageHeader .headerInner p{padding: 10px;}


/*----------------------------------------------------------------------------
 ***                                                                  section
----------------------------------------------------------------------------*/
.mainBox{background: url(/files/user/_/dreamcard25-26/img/bg_fv.jpg);background-position: top center;background-size: 100%;background-repeat: no-repeat;}
.mainBox h2{padding: 3% 0% 9% 0%;font-size: 35px;text-align: center;margin: auto;color: #fff;line-height: 1.6;}
.mainBox img{width: 35%;}
.mainBox .mainBoxInner .fv01{bottom: 1%;left: 2%;max-width:702px;width: 42%; }
.mainBox .mainBoxInner .fv02{bottom: 0%;right: 1%;max-width: 1046px;width: 45%;}
.mainBox .mainBoxInner .posiA img{width: 100%;}


.back_top{width: 120px; position: fixed; bottom: 2%; right: 2%; z-index: 100;}
/*----------------------------------------------------------------------------
 ***                                                                mainImgBox
--------------------------------------------------------------------------*/
.partnerBox{background: #00a0a0;padding: 0 0 2em;}
.partnerBox .ttl{padding: 1em 0;border-top: 8px solid #fff;border-bottom: 8px solid #fff;}
.partnerBox .ttl img{width: auto;margin: auto;}
.partnerBox ul{background: url(/files/user/_/dreamcard25-26/img/bg_contents03.png); display: flex;flex-wrap: wrap;justify-content: center;align-items: center;max-width: 1500px;margin: 2em auto 1em;background-size: 100% 100%;background-repeat: no-repeat;padding: 3em 0;}
.partnerBox ul li{margin: 0.5em 5em 1em;}
.partnerBox ul li video{object-fit: cover; width: 100%; height: 100%; display: block; border: solid 13px #000; border-radius: 30px;}


.partnerBox4 ul li{width: 35%;}
.partnerBox4 ul li .mgb{margin-bottom: 1em}

.partnerBox2 ul{background: url(/files/user/_/dreamcard25-26/img/bg_contents04.png); background-size: 100% 100%; background-repeat: no-repeat;}
.partnerBox2 ul li{width: 35%;}
.partnerBox2 ul li .mgb{margin-bottom: 1em}
.partnerBox3 ul{background: url(/files/user/_/dreamcard25-26/img/bg_contents05.png); background-size: 100% 100%; background-repeat: no-repeat;}

.contentsBox{background: #E7360C;}
.contentsBox .contentsInner{background: #fff;max-width: 1200px;width: 95%;margin: auto;padding-bottom: 80px;}

#first{width: 95%; margin: 0 auto; padding: 3em 0 0;}
#first h3{width: 100%; padding: 2em 0 1em;text-align: center;margin: 0 auto;}
#first p{font-size: 19px; color: #42210B; text-align: left; line-height: 1.5;}

#dc_info{width: 95%; margin: 0 auto; padding: 3em 0 0;}
#dc_info h3{max-width: 714px;width: 60%; padding: 4em 0 2em;text-align: center;margin: 0 14% 0 auto;}
#dc_info .posiA{top: 3%;left: 0;max-width: 250px;width: 21%;}
#dc_info .TxtBox{background: url(/files/user/_/dreamcard25-26/img/bg_contents01.png)no-repeat;background-size: contain;background-position: center top;}
#dc_info .dc_txt{max-width: 785px;width: 75%; margin: 2em auto 0.5em;text-align: center;color: #3d1104;font-weight: bold;font-size: 19px;line-height: 2;}
#dc_info .dc_img{margin: 0em auto;max-width: 590px;width: 55%;}
#dc_info ul{display: flex;flex-wrap: wrap;justify-content: space-around;align-items: flex-end;margin: 0 auto; width: 90%;}
#dc_info ul li{width: 33%;}
#dc_info .subject_Box{border: solid 10px #00A0A0; width: 90%; margin: 4em auto 0; position: relative; padding: 1em 2em;}
#dc_info .subject_Box h3{margin: 0 auto; padding: 0; width: 65%;}
#dc_info .subject_Box .more{width: 11%; position: absolute; top: -15%; left: 8.5%;}
#dc_info .subject_Box p.txt{width: 90%; margin: 1em auto 0.8em; text-align: left;}
#dc_info .subject_Box p{font-size: 19px; color: #3d1104; text-align: center; font-weight: 500; line-height: 1.5;}
#dc_info .subject_Box .tel{font-size: 25px; border-top: 2px solid #3D1104; margin-top: 0.3em; padding: 0.3em 0 0;}
#dc_info .subject_Box .tel a{color: #3D1104;}

#price{width: 95%; margin: 0 auto; padding: 3em 0 0;}
#price h3{width: 90%; margin: 0 auto;}
#price h4{width: 53%; margin: 1.5em auto 0;}
#price .fee_img{background: #ececec; padding: 1em; margin: 0 auto 0.2em;}
#price .fee_imgtxt{margin-bottom: 2em; text-align: right;}
#price .sunpra{margin: 2em auto; max-width: 670px; width: 80%;}
#price p{font-size: 19px; color: #42210B; line-height: 2; width: 93%; margin: 0 auto;}
#price p a{text-decoration:underline!important; color: #42210B;}


/*#座席からの観戦イメージ*/
#price .watchingBox{width: 95%; margin: 3em auto; border: #008f8f solid 8px;}
#price .watchingBox h4{background: #008f8f; margin: 0 auto; width: 100%;}
#price .watchingBox h4 img{width: 50%; margin: 0 auto; display: block; padding: 1em 0;}
#price .slideBox{width: 95%; margin: 0 auto; max-width: 1700px; padding: 3em 0;}
#price .slideBox li{position: relative; width: 270px; height: 500px; border: 12px solid #000; border-radius: 30px; margin: 0 2em; overflow: hidden;}
#price .slideBox li .ttlBox{position: absolute; top: 0; width: 100%;}
#price .slideBox li .ttlBox p{color: #fff; text-align: center; font-size: 25px; font-weight: bold;}
#price .slideBox li.Box01 .ttlBox{background: #1d84c3;}
#price .slideBox li.Box02 .ttlBox{background: #85ad22;}
#price .slideBox li.Box03 .ttlBox{background: #dc5a24;}
#price .slideBox li video{object-fit: cover; width: 100%; height: 100%; display: block;}
#price .slideBox li .txtBox{position: absolute; bottom: 0; background: #000; width: 100%; padding-bottom: 0.4em;}
#price .slideBox li .txtBox .txt{color: #fff; text-align: center; font-size: 100%;}
#price .slideBox li button{background: none; margin: 0 auto; display: block; color: #fff; border: solid 1px #fff; width: 75%; border-radius: 50vw;}
#price .slideBox li button:hover{cursor: pointer; background: #fff; color: #000;}
#price .slide-arrow{width: 30px; height: 65px; background-repeat: no-repeat; background-position: center; position: absolute;border: none;z-index: 90;cursor: pointer; top: 50%; transform: translateY(-50%);}
#price .slideBox .prev-arrow{background: url("../img/btn_slide01.png");left: 32%; background-size: cover;}
#price .slideBox .next-arrow{background: url("../img/btn_slide02.png");right: 32%; background-size: cover;}
#price .slideBox .slick-slide{opacity: 0.5;}
#price .slideBox .slick-center{opacity: 1;}
/*ドットナビゲーションの設定*/
#price .slick-dots {text-align:center;margin:2em 0 0.5em 0;}
#price .slick-dots li{display:inline-block;margin:0 5px;transform:skew(-25deg,0deg);}
#price .slick-dots button {
    color: transparent;
    outline: none;
    width:30px;/*ドットボタンのサイズ*/
    height:30px;/*ドットボタンのサイズ*/
    display:block;
    background:#ffffff;/*ドットボタンの色*/
	border: none;
}
.slick-slider {
        -ms-touch-action: auto!important;
        touch-action: auto!important;
}

/*ポップアップ設定*/
#price .Inner{display: none;}
#price .Inner.open{display: block;}
#price .Inner{
   visibility: hidden;
   position: fixed;
   left: 0;
   top: 0;
   width: 100vw;
   height: 100vh;
   background-color: rgba(0,0,0,.7);
   z-index: 999;
   transition: 1s;
   opacity:0;
}
#price .Inner.open{
   visibility: visible;
   transition: 1s;
   animation-name: fadeInAnime;
   animation-duration:0.5s;
   animation-fill-mode:forwards;
   opacity:0
}
#price .Inner.open video{width: 100%; height: 300px;}
#price .Inner.open p{color: #fff;}
#price .Inner.open .title{border: solid 2px; font-size: 24px; text-align: center; font-weight: bold; padding: 0.1em; width: 65%; margin: 1em auto;}
#price .Inner.open .flexBox{display: flex;}
#price .Inner.open .pricetxt{text-align: center; font-size: 18px; line-height: 1.4em;}
#price .draggable{padding:0 calc(50% - 250px) 0 calc(50% - 250px)!important;}
@keyframes fadeInAnime{
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

#price .modal-window{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background-color: #000; width: 45%; max-width: 550px; height: auto; margin: 0; padding: 50px 30px; overflow-y: auto; color: #fff; border-radius: 20px;}
#close{ width: 40px;height: 40px;position: absolute;right: 15px;background:none;color: #fff;font-size: 35px;font-weight: 300;border: none;font-family:'Noto Sans Japanese',"游ゴシック", YuGothic; top: 0;}
body.no_scroll{overflow: hidden;}

/*ポップアップ中身スライダー*/
#price .slideBox02{box-sizing: border-box; width: 100%; height: auto;}
#price .slideBox02 .slide-arrow{width: 15px; height: 35px;}
#price .slideBox02 .prev-arrow{background: url("../img/btn_slide03.png");left: -5%; background-size: cover;}
#price .slideBox02 .next-arrow{background: url("../img/btn_slide04.png");right: -5%; background-size: cover;}


#application{width: 95%; margin: 0 auto; padding: 3em 0 0;}
#application h3{width: 90%; margin: 0 auto;}
#application h4{width: 25%; margin: 1.5em auto 1em;}
#application .point{width: 75%; margin: 1em auto;}
#application p{font-size: 19px; color: #42210B; text-align: center; line-height: 1.5;}
#application .seatBox{background: url(/files/user/_/dreamcard23-24/img/bg_contents02.png)no-repeat; background-position: bottom center; background-size: cover; margin: 3em 2em 2em;}
#application .seatBox .blue{background: #00a0a0; padding: 1em; text-align: center;}
#application .seatBox .blue img{width: 80%; max-width: 624px;}
#application .seatBox .seatPhoto{max-width: 1140px; width: 95%; margin: 0.5em auto 0em; padding: 0em 1em 7%;}
#application .slideBox{margin: 3em auto 6em;}
#application .slideBox li{border: 3px solid #e64709;border-radius: 10px;position: relative;margin: 0 2em;height: 470px;width: 400px;}
#application .slideBox .flex .flexBox{display: flex;}
#application .slideBox li .ttl{background:#f5c2af; border-radius: 9px 9px 0 0;}
#application .slideBox li .ttl p{height: 48px; text-align: left; font-size: 23px;}
#application .slideBox li .ttl p span.Oswald{background:#e64709;display: inline-block;padding: 6px 0px 0;text-align: center;color: #fff;width: 15%;vertical-align: top;height: 48px;}
#application .slideBox li .ttl p span.Oswald img{width: 43%; margin: 0 auto;}
#application .slideBox li .ttl p span.main_ttl{padding:0px 0px 0px 15px;display: inline-block;font-weight: bold;margin-top: 5px;}
#application .slideBox li .img{margin: 1em auto 0;width: 250px;}
#application .slideBox li .img img{margin: auto;width: 100%;}
#application .slideBox li .txt{padding: 1em;font-size: 16px;line-height: 1.3;}
#application .slideBox li .txt p{font-size: 100%; text-align: left;}
#application .slideBox li .txt a{color: #000;text-decoration: inherit;border-bottom: 1px solid;}
#application .slideBox li .txt span.blue{color:#347bf6; }
#application .slideBox li.img_only .img{margin: 2em auto 0; }
#application .slideBox li.flex .img{margin: 1em auto 0; width: 185px;}
#application .slideBox li.flex .txt{padding: 0.3em 1em 0;font-size: 15px;}
#application .slideBox li.flex .txt p span{font-weight: bold;}
#application .slide-arrow{position: absolute;background: none;border: none;z-index: 99;cursor: pointer;font-size: 30px;color: #e64709;}
#application .prev-arrow {top: 0;left: 30%;bottom: 0;}
#application .next-arrow {top: 0;right: 26%;bottom: 0;}
#application .slick-slider .slick-list{padding:0 calc(65% - 350px) 0 calc(65% - 350px)!important;}
/*ドットナビゲーションの設定*/
#application .slick-dots {text-align:center;margin:2em 0 0.5em 0;}
#application .slick-dots li{display:inline-block;margin:0 5px;transform:skew(-25deg,0deg);}
#application .slick-dots button {color: transparent; outline: none; width:30px;/*ドットボタンのサイズ*/ height:30px;/*ドットボタンのサイズ*/ display:block; background:#ffffff; /*ドットボタンの色*/border: none;}
.slick-slider {-ms-touch-action: auto!important; touch-action: auto!important;}

#sale{width: 95%; margin: 0 auto; padding: 3em 0 0;}
#sale h3{width: 90%; margin: 0 auto;}
#sale p{font-size: 19px; color: #42210B; text-align: center; line-height: 1.5; margin: 1.5em 0 2em;}
#sale .schedule{width: 70%; margin: 0 auto 4em;}

#benefit{width: 95%; margin: 0 auto; padding: 3em 0 0;}
#benefit h3{width: 90%; margin: 0 auto;}
#benefit .abbyBox{margin: 2em 5em;}
#benefit .abbyBox .txt{max-width:671px;width: 70%; margin: auto;}
#benefit .abbyBox .posiA{top: 0;right: 7%;}
#benefit .benefit_img{margin: 2em auto 0;width: 75%;}

#letter{width: 95%; margin: 0 auto; padding: 3em 0 0;}
#letter h3{width: 90%; margin: 0 auto;}
#letter p{width: 95%; margin: 0.5em auto 0;}

#review{width: 95%; margin: 0 auto; padding: 3em 0 0;}
#review h3{width: 90%; margin: 0 auto;}
#review h4{width: 60%; margin: 5em auto 0;}
#review ul{display: flex;flex-wrap: wrap;justify-content: center;align-items: flex-start;}
#review ul li{margin: 2em 2em 1em;width: 40%;max-width: 422px;}
#review .review_Txt{font-size: 26px;font-weight: bold;color: #42210b;border-bottom: 4px dashed #e54909;line-height: 2.5em;margin: 0 3em;text-align: center}
#review .review_img{margin: 2em 1em;}

#notes{margin:80px 3em 50px;padding: 2em 0;border-top: 2px solid #e54909;border-bottom: 2px solid #e54909; }
#notes h3{max-width: 136px;width: 50%;margin: auto;}
#notes .notesBox{margin:2em 1em 0 0; }
#notes p{padding-left: 25px;font-size: 17px;font-weight: 500;line-height: 1.5;position: relative;padding-bottom: 10px;}
#notes p::before{content: "●";display: block;top: 3px;left: 0;position: absolute;font-size: 19px;line-height: 1;}

#sponsor{margin: 5em auto 0;}
#sponsor p{text-align: center;font-size: 25px;font-weight: bold;line-height: 1.8;color:#42210b;margin:0em auto 1em;}
#sponsor ul{display: flex;flex-wrap: nowrap;justify-content: center;align-items: center;max-width: 1100px;margin: auto;}
#sponsor ul li{margin: 0.4em 1em;}
#sponsor ul li img{width: 100%; height: auto;}
#sponsor ul:nth-of-type(2) li{margin: 1em 1em;}
#sponsor ul li .mgb{margin-bottom: 1em;}

.lineBtn{width: 45%; margin: 1.5em auto 0.8em;}
.lineBtn:hover{opacity: 0.8;}


/*----------------------------------------------------------------------------
 ***                                                                 footer
----------------------------------------------------------------------------*/
/* footer */
#pageFooter{ background:#E9470B;}
#pageFooter .footerInner{ padding:1% 1%;}
#pageFooter dl{ float:left; width:60%;}
#pageFooter dt{ width:7%; float:left;}
#pageFooter dd{ float:left; font-size:80%; color:#FFF; padding:3% 0 0 2%;}
#pageFooter  p{ float:right; font-size:80%; color:#FFF; padding-top:1.5%;}



@media screen and (max-width: 1200px) and (min-width: 951px){
	#pageHeader .headerInner ul{padding: 0px 0 0px 2%;}
	#pageHeader .headerInner li{padding:3% 2%; }
}


