@charset "UTF-8";
/* CSS Document */
html{ font-size: 62.5%; /* 10px */ }
body{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;

	text-align: center;
	font-size: 1.4rem;
	line-height: 1.6;
	min-width: 320px;
	color: #000000;
    /* background: #fffae6; */
    background: url(../img/bg.jpg);
    background-size:cover;
    margin: 0;
}

/* ios用
=================================== */
body:before{
  content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-1;
  width:100%;
  height:100vh;
  background: url(../img/bg.jpg);
  background-size:cover;
}


#main{
  background-image: url("../img/main.jpg");
 font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  width: 100%;
  padding-top: 56.4%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain; 
} 


.sp{ display: block; }
.pc{ display: none; }


h1,h2,h3,h4,h5,h6{
	font-size: 100%;
	font-weight: normal;
	padding: 0; margin: 0;
}
ul,li,ol{
	list-style: none outside none;
	margin: 0;
	padding: 0;
}
em{ font-style: normal; }
dl{ margin: 0; padding: 0; }
p{ margin: 0; padding: 0; }
img{ max-width: 100%; vertical-align: top; }

a{ color: #0096ff; text-decoration: none; }
/*a:visited{ color: #4900c1; text-decoration: none; }*/
a:hover, a:active, a:focus{ color: #ff0096; text-decoration: none; }
a:hover img, a:active img, a:focus img{ opacity: 0.8; filter: alpha(opacity=80); }


div#wrap{}
div#ctv_tab{}

div#container{
	width: 100%;
/*	max-width: 960px;*/
	margin: 0 auto;
	padding: 0;
}
.contents{
    padding-top: 20px;
/*    background: #A4ECFE;*/
}

header{
	width: 100%;
	margin: 0 auto;
	text-align: left;
}

/*フッター*/
footer{
/*
  background:#e62e8b;
  padding:1em 0 2em 0;
*/
  }
footer div{
  }

footer p{
  clear:both;
  color:#fff;
  margin:0 auto;
  padding:0;
font-size: 12px;
padding-bottom: 20px;
  }

.copyright a,
.copyright .attention{
  display: block;
  color: #000000;
  text-decoration: none;
}




#pageTopBar {
display: block;
background: #56acea;
}

#pageTopBar a {
display: block;
width: 100%;
padding: 2rem 0;
color: #fff;
font-family: 'Poppins', sans-serif;
font-size: 2.0rem;
font-weight: 600;
line-height: 1;
letter-spacing: 0.5rem;
}




/* Page Top
=================================== */
.page-topLink{
  bottom: 5px;
  right: 5px;
  width: 20px;
  padding: 13px 10px;
  }

  /**/
.page-topLink{
  display: block;
  position: fixed;
  z-index: 9999;
  bottom: 10px;
  right: 5px;
  width: 14px;
  padding: 13px 13px;
  background: rgba(255,255,255,.7);
  border-radius: 80%;
  border: 4px solid #ff8807;
  color: #E76F71;
  font-size:16px;
  text-align: center;
  text-decoration: none;
  line-height: 1;
  cursor:pointer;
  behavior: url(PIE.htc);
}
.page-topLink a{
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color: #ff8807;
  text-decoration:none;
}
.page-topLink:hover{
  background: rgba(255,255,255,1);
}


table{
  /* width: 100%; */
  margin: 0 auto;
}

table th{
  color: #083191;
  position: relative;
  text-align: left;
  /* width: 15%; */
}


table td{
  text-align: left;
  padding:7px 0 7px 20px;
  /* width: 85%; */
}




.tab-2 {
  display: flex;
  flex-wrap: wrap;
  gap: 0 10px;
  /* max-width: 500px; */
}

.tab-2 > label {
  flex: 1 1;
  order: -1;
  opacity: .5;
  min-width: 70px;
  padding: .6em 1em;
  border-radius: 5px 5px 0 0;
  background-color: #003296;
  color: #fff;
  font-size: 1.5em;
  text-align: center;
  cursor: pointer;
  font-weight: bold;
}

.tab-2 > label:hover {
  opacity: .8;
}

.tab-2 input {
  display: none;
}

.tab-2 > div {
  display: none;
  width: 100%;
  padding: 1.5em 1em;
  background-color: #fdf055;
}

.tab-2 label:has(:checked) {
  opacity: 1;
}

.tab-2 label:has(:checked) + div {
  display: block;
}




/* -------------------------------------------------------------------------------------------------------------------
Tablet&SP                                                                                                        
------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 959px) {
	.pc { 
		display: none;
	}
  .sp {
	  display: block; 
	}

		#wrap {
	max-width: 100%; 
	margin-left: auto; 
	margin-right: auto; 
}

#main{
  margin: 0 auto;
  /* margin-top: 30px; */
}
  

    #titl{
      
      width: 60%;
      margin: 0 auto;
      margin-top: 50px;
      margin-bottom: 10px;
    }
    
    .free{
      padding: 10px;
      font-size: 2.8rem;
      font-weight: bold;
      width: 50%;
      margin: 0 auto;
      background-color: #ffeb03;
      border-radius: 60px;
      border: solid 3px #083191;
      color: #083191;
      margin-bottom: 20px;
    }
    
    
    #about{
      margin: 20px 0;
      font-size: 1.2em;
      line-height: 2em;
    }
    
    .map iframe{
      width: 95%;
      margin: 0 auto;
    }
    
    
    #shop{
      width: 100%;
      margin: 0 auto;
      /* display: flex;
      flex-wrap: wrap;
      align-items: stretch; */
    }
    
    .shop_box{
      /* margin: 15px 5px; */
      width: 80%;
      padding: 15px;
      background-color: #fdf055;
      border-radius: 20px;
      margin: 0 auto;
      margin-bottom: 20px;
      border: solid 1px #083191;
    }
    
    .shop_name{
      font-weight: bold;
      font-size: 1.8rem;
      padding: 10px;
      color: #073190;
    }
    
    .shop_name_right{
      color: #073190;
      font-weight: bold;
      font-size: 1.8rem;
      padding: 10px;
    text-align: right;
    display: flex;
    justify-content: center;
    }
    
    .text_s{
      font-size: 1.5rem;
      margin-top: -3px;
      display: block;
    }
    
    .food_menu{
      background-color: #083191;
      color: #fff;
      font-weight: bold;
      font-size: 1.8rem;
      border-radius: 20px;
      padding: 3px 0;
    }
    
    .shop_price{
      margin: 10px;
      font-weight: bold;
      font-size: 1.8rem;
    }
    
    .shop_about{
      text-align: left;
      padding: 5px;
      font-size: 1.5rem;
    }
    
    #overview{
      padding: 10px;
      margin: 0 auto;
      font-size: 1.3rem;
      background-color: #fff;
      width: 80%;
      border-radius: 20px;
      margin-top: 50px;
    }

    #ambassador{
      /* background-color: #fdf055;
      border-radius: 20px;
      border: solid 1px #083191; */
      width: 90%;
      margin: 0 auto;
      padding: 10px;
      /* margin-top: 20px; */
    }

    .ambassador_img{
      margin-top: -20px;
    }
    
    .text_info{
      margin: 0 auto;
      background-color: #fff;
      padding: 10px;
      border-radius: 15px;
      text-align: left;
      font-size: 1.5rem;
    }

    #comedian{
      width: 90%;
      margin: 0 auto;
      padding: 10px;

    }

    .comedian_box{
      margin-bottom: 10%;
    }

    #dj{
      width: 90%;
      margin: 0 auto;
      padding: 10px;

    }
    
.dj_time{
  width: 40%;
  margin: 0 auto;
}

.dj_name{
  font-weight: bold;
  font-size: 2.2rem;
  padding: 10px;
  color: #073190;
}

.dj_text{
  text-align: left;
  font-size: 1.5rem;
}

.name_s{
  font-size: 1.5rem;
}

.dj_box{
  padding:10% 0;
  border-bottom: solid 1px #073190;
}

.dj_box:last-child{
  border-bottom: none;
}

}





/* -------------------------------------------------------------------------------------------------------------------
961px-                                                                                                           
------------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width: 960px) {
	.pc {
		display: block;
	}
  .sp {
	  display: none;
	}
	
  .f-small {
	  font-size: 1.4rem;
	}
	
  .f-middle {
	  font-size: 1.6rem;
	}
    
	#wrap{
    max-width: 100%; 
/* margin-left: auto; 
margin-right: auto; 
  background-image: url("../img/bg.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed; 
overflow: hidden; */
}

#main{
  /* margin-top: 50px; */
}

#titl{
  margin-top: 100px;
}

.free{
  padding: 15px;
  font-size: 4rem;
  font-weight: bold;
  width: 300px;
  margin: 0 auto;
  background-color: #ffeb03;
  border-radius: 60px;
  border: solid 5px #083191;
  color: #083191;
}


#about{
  margin: 50px 0;
  font-size: 1.2em;
  line-height: 2em;
}

.map iframe{
  width: 960px;
  margin: 0 auto;
}


#shop{
  width: 90%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

.shop_box{
  margin: 30px 10px;
  width: 29%;
  padding: 15px;
  background-color: #fdf055;
  border-radius: 20px;
  border: solid 1px #083191;
}

.shop_name{
  font-weight: bold;
  font-size: 2.2rem;
  padding: 10px;
  color: #073190;
}

.shop_name_right{
  color: #073190;
  font-weight: bold;
  font-size: 2.2rem;
  padding: 10px;
text-align: right;
display: flex;
justify-content: center;
}

.text_s{
  font-size: 1.5rem;
  margin-top: -3px;
  display: block;
}

.food_menu{
  background-color: #083191;
  color: #fff;
  font-weight: bold;
  font-size: 2rem;
  border-radius: 20px;
  padding: 3px 0;
}

.shop_price{
  margin: 10px;
  font-weight: bold;
  font-size: 1.8rem;
}

.shop_about{
  text-align: left;
  padding: 5px 10px;
  font-size: 1.5rem;
}

#overview{
  padding: 20px;
  margin: 0 auto;
  font-size: 1.8rem;
  background-color: #fff;
  width: 50%;
  border-radius: 20px;
  margin-top: 100px;
}

#ambassador{
  /* background-color: #fdf055;
  border-radius: 20px;
  border: solid 1px #083191; */
  width: 85%;
  margin: 0 auto;
  /* padding: 20px; */
  /* margin-top: 30px; */
}

.ambassador_img{
  width: 700px;
  margin: 0 auto;
}

.ambassador_p span{
  font-weight: bold;
  font-size: 2.2rem;
  color: #073190;
}

.text_info{
  width: 700px;
  margin: 0 auto;
  background-color: #fff;
  padding: 20px;
  border-radius: 15px;
  text-align: left;
  font-size: 1.5rem;
}

#comedian{
  /* margin-top: 150px; */
}

.comedian_info{
  /* display: flex;
  justify-content: space-evenly; */
  margin: 0 auto;
}

.comedian_box{
  width: 700px;
  margin: 0 auto;
  margin-bottom: 100px;
}



#dj{
  width: 90%;
  margin: 0 auto;
}

.dj_time{
width: 150px;
margin: 0 auto;
margin-bottom: 20px;
}

.dj_info{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.dj_box{
  width: 21%;
  border-right: solid 1px #073190;
  padding: 0 20px;
}

.dj_box:last-child{
  border-right: none;
}

.dj_name{
  font-weight: bold;
  font-size: 2.2rem;
  padding: 10px;
  color: #073190;
}

.dj_text{
  text-align: left;
  font-size: 1.5rem;
}

.name_s{
  font-size: 1.5rem;
}
    
              /* フッター =================================== */
    #pageTopBar{
        margin-top: 50px;
        padding-top: 10px;
    }
    
    .fas img{
        width: 150px;
    margin-top: -100px;
    }
    

}