@charset "UTF-8";


#topConcert{
  max-width: 1200px;
  margin: 0 auto 100px auto;
}
#topConcert h1{
  font-size: 160%;
  font-weight: 500;
  margin: 0;
}
.alphabet{
  font-family: "Georgia", "Times New Roman", serif;
  font-size: 18px;
  font-style: italic;
  color: #BBB;
  margin-left: 10px;
}
#topConcert .box{
  background: #FFF;
  border: solid 1px #BBB;
  position: relative;
  margin-top: 20px;
}
#topConcert .box:nth-child(3), #topConcert .box:nth-child(6), #topConcert .box:nth-child(9), #topConcert .box:nth-child(12){margin-right: 0;}

#topConcert .box dl{z-index: 100;}
#topConcert .box dt{
  font-size: 14px;
  font-weight: normal;
  margin-bottom: 3px;
  }
#topConcert .box .eventOff{margin-right: 7px; padding: 4px 5px;}
#topConcert .box dd{
  font-size: 14px;
  line-height: 1.65;
}
#topConcert .box dd .place{
  font-size: 12px;
  margin-top: 5px;
}
#topConcert .soldout{height: 0;}
#topConcert .soldout img{
  width: 125px;
  font-size: 0;
  position: absolute;
  top: 15px;
  right: 10px;
  z-index: 200;
}

.topPr{
  border: solid 1px #333;
  margin-bottom: 50px;
}
.topPr .boxPr{
  float: left;
  width: 569px;
  height: 100px;
  text-align: center;
  border: solid 1px #333;
  margin: 20px 0 20px 20px;
}
#container .topPr h3{margin-top: 10px;}

/*----------お知らせ----------*/
#topNew{
  background: #f9f8e7;
  padding: 10px 0 70px 0;
  }
#container #topNew h2{font-size: 150%;}
#topNew .newContent ul{margin: 40px 0 0 0;}
#topNew .newContent ul li{
  font-size: 15px;
  border-bottom: solid 1px #D5D5D5;
  padding: 13px 25px;
}

#topNew .newContent ul li a:link, #topNew .newContent ul li a:visited{color: #000; text-decoration: none;}
#topNew .newContent ul li a:hover{color: #CB5920;}
#topNew .date{
  width: 8.25em;
  color: #666;
  display: inline-block;
}
.newContent{
  max-width: 1200px;
  margin: auto;
}

#container .announce{
  background: #FFF;
  border: solid 1px #FF9933;
}

#container .announce h2{
  font-size: 15px;
  font-weight: bold;
  background: #FFE4A0;
  margin: 0;
}
#container .announce ul{
  font-size: 15px;
  margin: 0;
}
#container .announce li{
  vertical-align: top; 
  background: url(img/disc_orange.png) no-repeat left 9px;
  margin: 10px 0 0 10px;
  padding-left: 15px;
}
#container .announce li a:link, #container .announce li a:visited{color: #333;}
#container .announce li a:hover{color: #CB5920;}

/*
#container .announce a{
  width: 800px;
  display: block;
  text-align: center;
  font-weight: bold;
  background: linear-gradient(to bottom right, #E98E3C, #FFA500);
  border: solid 1px #E98E3C;
  margin: 0 auto 60px auto;
  padding: 15px 15px;
}
#container .announce a:link, #container .announce a:visited{
  color: #FFF;
}
#container .announce a:hover{
  background: #00BFBC;
  border: solid 1px #009999;
}
#container .announce h3{margin-top: 10px;}
*/

/*-------------------------PC-------------------------*/
@media screen and (min-width:801px){

 /*---------------トップページ---------------*/
  
    
  /*----------アイコン----------*/
  #topConcert .buttonGray.forTop{
    font-size: 13px;
    text-align: right;
    margin-top: -34px;
  }
  
  .newContent .buttonGray.forTop{
    font-size: 12px;
    text-align: right;
    margin-top: -44px;
  }
  
  #container.topPage{max-width:100%; padding: 30px 0 0 0;}
  
  .boxConcert{margin: 35px 0 60px 0;}
  
  #topConcert .box{
    float: left;
    width: 32.06%;
    height: 160px;
    overflow: hidden;
    box-shadow: 0px 0px 3px rgba(0,0,0,0.1);
    margin-right: 1.9%;
    padding: 1.5%;
  }
  #topConcert .box img.thumb{
    float: left;
    width: 120px;
    height: 120px;
  }
  #topConcert dl{
    float: right;
    width: 208px;
    height: 120px;
    overflow: hidden;
    margin: 0;
  }
  
  /*----------お知らせ----------*/
  #topNew .topWhatsnew{
    float: left;
    width: 66.12%;
  }
  #topNew #twitterContent{
    float: right;
    width: 27.8%;
    height: 500px;
    overflow-y: scroll;
    border: solid 1px #D5D5D5;
    background: #FFF;
    margin-top: 60px;
  }
  
  #container .announce{
    width: 1200px;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    box-shadow: 0px 0px 3px rgba(0,0,0,0.1);
    margin: 0 auto 60px auto;
}
  #container .announce h2{
    display: inline-block;  
    vertical-align: middle;
    padding: 22px 40px 0 40px;
  }
  #container .announce ul{
    display: inline-block;
    margin: 18px 25px 21px 30px;
  }
  #container .announce li{
    font-size: 14px;
    margin: 5px 0 0 10px;
  }

}/*-----PC 閉じカッコ-----*/


/*-------------------------スマホ-------------------------*/
@media screen and (max-width:800px){

  
  /*----------アイコン----------*/
  .buttonGray.forTop{
    font-size: 13px;
    text-align: center;
    margin-top: 15px;
  }

 /*----------トップ----------*/
  .alphabet{font-size: 15px;}
  
  #topConcert{margin: 35px 2% 0 2%;}
  #topConcert .box{
    clear: both;
    margin: 0 0 8px 0;
    padding: 12px 2.5%; 
  }
  #topConcert img.thumb{
    float: left;
    width: 25%;
    max-width: 100px;
    min-width: 60px;
    margin-right: 4%;
  }
  #topConcert dl{
    float: left;
    width: 70%;
    margin: 0;
  }
  .boxConcert{margin-top: 35px;}
  
  #container .newContent h2{margin: 40px 0 15px 0;}
  
  .topPr{
    margin-top: 40px;
    padding-bottom: 20px;
  }
  .topPr .boxPr{
    width: 90%;
    height: 100px;
    text-align: center;
    border: solid 1px #333;
    margin: 20px 0 0 5%;
  }
  
  #topNew{
    margin-top: 60px;
    padding-top: 5px;
  }
  
  #container .announce{
  width: 96%;
  margin: 40px 2% 50px 2%;
}
  #container .announce h2{
    font-size: 15px;
    text-align: center;
    margin-top: 1px;
    padding: 6px 20px;
  }
  #container .announce ul{
    margin: 20px 15px 20px 10px;
  }
  

}/*-----スマホ 閉じカッコ-----*/