@charset "utf-8";


main{ width:100%; padding:0 1vw;}	
.subtit{font-family:var(--font1); font-weight:bold; color:#fff; font-size:5vw; line-height:1em; letter-spacing:0.02em; margin-bottom:4vw;}
.subtitjp{font-family: "メイリオ","Meiryo","MS PGothic","Osaka",Arial,sans-serif; font-weight:bold; color:#fff; font-size:3.7vw; line-height:1em;  margin-bottom:1.5vw;}


@media only screen and (max-width: 768px){
	main{  padding:0 2vw;}
	.subtit{font-size:9vw; margin-bottom:10px; }
	.subtitjp{font-size:7vw; margin-bottom:20px;}
	.a_tit img{height: 6vw;}
}

/********************** top *******************************/
body#top{/* background: no-repeat center url(../images/v15/bg_gradient_square.jpg); */background-size: 100% 100%;background-attachment: fixed;}

.mainarea{position: relative;margin: calc(6vw + 35px) auto 5vw;display: flex;justify-content: space-between;align-items: flex-start;width: 82%;max-width: 1600px;}
.mainarea img{ width:100%;}

.mainarea figure{ width:50%; filter: drop-shadow(0 0 10px rgba(0,0,0,0.3));}
.mainarea .main_r{ width:42%; line-height:0;}
.mainarea .main_r h1{ margin-bottom:2.4vw;}
.mainarea .main_r h1 .powered{display: block; width: 40%; margin-bottom: 0;}
.mainarea .main_r .main_date {margin-bottom: 1.5vw;}
.mainarea .main_r .main_date img{margin-bottom: 20px;}
.mainarea .main_r .artists {display: block; width: 100%; margin: 0 auto;}
.mainarea .main_r .artists img {width: 100%; height: auto;}


@media only screen and (max-width: 768px){
body#top{}
	
.mainarea{margin-top: 60px;flex-direction: column;width: 90%}
.mainarea figure{ width:100%; padding:0 7%;}
.mainarea .main_r{ width:100%; padding:30px 0;}
.mainarea .main_r h1{ padding:0 15% 25px;}
.mainarea .main_r .main_date{ padding:0 7%; margin-bottom:0;}
.mainarea .main_r .artists {width: 90%;}
}


/********************** ABOUT *******************************/
#about{ position:relative; width:100%; margin-bottom:10vw;}
.about_wrap{ width:75vw; margin:0 0 0 auto;background-color:#000; padding:2.5vw 4vw 6vw; text-align: left; position:relative; min-height:30.5vw;}
.about_wrap h2 {margin-bottom: 0.7em; /* background: linear-gradient(90deg, #0b7fcc 0%, #0b7fcc 20%, #f96430 80%, #f96430 100%); */ /* -webkit-background-clip: text; */ /* -webkit-text-fill-color: transparent; */ font-size: 3.5vw; line-height: 1.4em; font-weight: bold; color: #e7e5d6;}
.about_wrap h2 span{ font-size: 2vw;}

.about_wrap h2 img{ width:100%;}
.about_txt{ padding-left:6vw; font-weight:bold; line-height:1.8em; font-size:1.3vw; color: #ffffff;}
.about_txt span{ color:#a76e01; word-break: break-word; }
.about_txt p{word-break: break-word; margin-bottom: 2em;}
.about_wrap .other_btn{ display: block; text-align: right;}
.about_wrap .other_btn img{ max-width: 100%;}
.about_wrap .about_link{ text-align:right; position:absolute; width:30vw; right:0; bottom:-1vw; line-height:0; }
.about_wrap .about_link img{ width:100%; transition:0.4s;margin-right:-1vw;}
.about_wrap .about_link a:hover img{ opacity:1;margin-right:0; }
.about_wrap .about_spotify{position: absolute;width: 25vw;height: 28vw;left: -18vw;bottom: -3vw;max-height: 500px;}
.about_wrap .about_spotify iframe{ width:100%; height:100%;}

@media only screen and (max-width: 768px){
	.about_wrap{ width:100%; margin:0 auto; padding:30px 3vw;}
	.about_wrap h2{ margin-bottom: 20px;}
	.about_txt{ padding-left:0; font-size:16px; line-height:1.7em;}
	.about_txt p{ margin-bottom:10px;}
	.about_wrap .other_btn{display: block;line-height: 0;margin-bottom: 8vw;}
	.about_wrap .about_spotify{ position:inherit; left:auto; bottom:auto; height:80vw; width:100%;}
	.about_wrap .about_link{ position: inherit; width:100%;  bottom:0; line-height:0; margin-bottom:15px;}
	.about_wrap .about_link img{ margin-right:0;}
	.about_wrap .about_spotify { height: 360px;}
	.about_wrap .about_spotify iframe{ height:360px; }
	
	.about_wrap h2 { font-size: 6vw; text-align: center; line-height: 1.3em;}
	.about_wrap h2 span{ font-size: 4vw; display: block; line-height: 1.5em; margin-bottom: 0.25em;}
	
}

/********************** ARTISTS *******************************/
#lineup{ margin-bottom:10vw;}
#lineup ul{ margin-bottom: 4vw; display: flex; flex-wrap: wrap;}
#lineup ul.act_oa li{margin: 0 auto; width:30%;}
#lineup li{ width:50%;  line-height:0; }
#lineup li a{ display: block;position:relative;}

#lineup li figure img{ width: 100%;}

#lineup li .name{ position: absolute; right: 0; bottom: 1vw; line-height: 1em; margin: 0; color: #fff;background-color:#000;width: 60%; border-radius: 100vw 0 0 100vw; padding: 0.6em 0; font-weight: bold; font-size: 1.3vw;}
#lineup li .name:after{content: ""; position: absolute; top: calc(50% - 4px); right: 5%; width: 8px; height: 8px; border: 1px solid; border-color: transparent #fff #fff transparent; transform: rotate(-45deg);}

#lineup .day2 li .name{ background-color: var(--keyc2);}
#lineup li.a81 .name{ background-color: #212121;}
#lineup ul.act_oa li .name{font-size: 1.0vw;}

#lineup .more{ text-align: center; margin-bottom: 5vw; font-weight: bold;font-size: 46px; line-height: 0.5em;font-family: var(--font1); color:#fff;}


#lineup li.new:before{ display:block; content:'NEW'; position:absolute; background-color:#2c42c1; color:#fff; line-height:1em;border-radius: 5vw; width: 5vw; height: 5vw; z-index:5; top:0.5vw; left:0.5vw; line-height:5.3vw;font-family:var(--font1); font-weight:bold; font-size:1.2vw;}

#lineup .andmore{ width:100%; padding:2vw 3vw 0; text-align:right;}
#lineup .andmore img{ width:200px;}

.a_tit { /* background-color: var(--keyc1); */ padding: 0.5em 0 1.0em; font-size:1.3vw; color: #fff; line-height: 1em; font-family: var(--font1); font-weight: 500; }
.a_tit span{ font-size: 0.5em;}
.a_tit.a_2{background-color: var(--keyc2);}

@media only screen and (max-width: 768px){
	#lineup{margin-bottom: 20vw;}
	#lineup ul{ margin-bottom: 10px;}
	#lineup ul.act_oa li{width:80%;}
	#lineup li{ width:100%; margin-bottom:0px; }
	#lineup li.more{ width:50%; }

	#lineup li.new:before{line-height:1em;border-radius: 10vw; width: 10vw; height: 10vw;line-height:10.5vw; font-size:2vw;}

	#lineup .more {font-size: 30px;line-height: 0.5em;}

	#lineup .andmore{ text-align:center; padding:15px 0;}
	#lineup .andmore img{ width:33%; }
	
	.a_tit{font-size:4.5vw;line-height: 1.3em;padding-bottom: 0.5em;}
	#lineup li .name{ font-size: 4vw; bottom: 10px; padding: 0.7em 0; width:70%; }
	#lineup ul.act_oa li .name{font-size:3.5vw;}
}

/********************** TICKETS *******************************/
#tickets{ margin-bottom:12vw;}
.ticket_wrap{ background-color:#fff; color: #222; width:94%; margin:0 auto; max-width:1000px; padding:60px 25px;}
.ticket_tit{ font-family:var(--font1); font-weight:bold;}
.ticket_tit h3{ font-size:64px;font-weight:bold; line-height:1em; margin-bottom: 18px;}
.ticket_tit h3 .date{ font-size:0.5em;}
.ticket_tit h3 .venue{ font-size:0.75em;}
.ticket_tit h3 .venue .txts{ font-size:0.5em;}
.ticket_tit p.time{ display:inline-block;}
.ticket_tit p.map{ display:inline-block; margin-left:10px;}
.ticket_tit p.map a{ display:block; color:#fff; background-color:#061f58; line-height:1em; padding:7px 15px 5px;}
.ticket_tit p.map a:hover{ opacity:0.8;}

.ticket_wrap .price{  border-top:1px solid #000; width:80%; margin:0 auto 25px;}
.ticket_wrap .price li{ border-bottom:1px solid #000; padding:24px 0; font-size:26px; line-height:1em; font-weight:bold;}
.ticket_wrap .price span{ font-size:0.7em;}
.ticket_wrap .price .act{display: block;padding-top: 1em;}

.ticket_info{ font-weight:bold; font-size:30px; line-height:1.4em; color:#bb0f0f;margin-bottom: 50px;}
.ticket_info h4{ font-weight:bold;margin-bottom: 0.5em;}
.ticket_info h4 span{ font-size:0.7em;}
.ticket_info .date{ font-size:60px; line-height:1em; margin:0 0 10px;}
.ticket_info .date span{ font-size:0.6em;}
.ticket_info .notes{ font-size:14px; line-height:1em; display:block; margin-bottom:25px;}
.ticket_info  a{ display:block; background-color:#bb0f0f; color:#fff; border-radius:100px; padding:30px 0 ; font-size:24px; font-weight:bold; line-height:1em; width:80%; margin:0 auto;}
.ticket_info  a:hover{ opacity:0.8;}

.venue_info{ background-color:#f2f2f2; width:80%; margin:0 auto 20px; padding:20px 0;}
.venue_info .time{}
.venue_info dl{ text-align:left; display:inline-block; margin-bottom:1em;}
.venue_info dt{ float:left; width:7em; clear:both;}
.venue_info dd{ float:left;}
.venue_info .link{ margin:0;}
.venue_info .link a{ display:inline-block; color:#fff; background-color:var(--theme_color); line-height:1em; padding:7px 15px 10px;}
.venue_info .link a:hover{ opacity:0.8;}


.ticket_info .sold{ font-size:70px; line-height:1em; font-weight:bold; margin:0; color:#c00;}

.ticket_wrap .notice{ text-align:left; font-size:14px; line-height:1.6em;}

.ticket_wrap .tokuten { border: 2px solid #000; padding: 30px clamp(10px , 2vw , 30px); text-align: center; margin-bottom: 20px;}
.ticket_wrap .tokuten h3 {display: block; font-size: clamp(20px , 4vw , 24px); font-weight: bold; margin-bottom: 1em;background-color:var(--theme_color); color: #fff; padding: 0.6em; line-height: 1.4em;}
.ticket_wrap .tokuten .catch {font-size: clamp(16px , 3vw , 20px); font-weight: bold; margin-bottom: 1.5em;}
.ticket_wrap .tokuten .tokuten_list {margin-bottom: 1.5em;}
.ticket_wrap .tokuten .tokuten_list li {display: block; color: var(--keyc1); font-weight: bold; padding: 1.0em; padding-left: 0.9em; font-size: clamp(14px , 2vw , 16px); border: 1px solid var(--keyc1); margin-bottom: 0.8em; text-align:center;}
.ticket_wrap .tokuten .tokuten_list li:last-of-type { margin-bottom: 0;}
.ticket_wrap .tokuten .tokuten_list li span {white-space: nowrap;}
.ticket_wrap .tokuten .notice {font-size: 14px; text-align: left; margin-bottom: 0;} 

.touken{ border: 10px solid #ddd; padding: 5%; margin-bottom: 30px;}
.touken h4{ font-weight: bold; font-size: 30px; line-height: 1.7em; margin-bottom: 0.5em;color: var(--theme_color);}
.touken .price{ border-top: 1px solid #dc5d3d; border-bottom: 1px solid #dc5d3d;  font-weight: bold; font-size: 26px; line-height: 1.7em; padding: 0.5em 0; width: 100%;}
.touken h5{ font-weight: bold; color: var(--theme_color); font-size: 22px; line-height: 1.7em;}
.touken .date{ font-size: 24px; line-height: 1.7em; margin-bottom: .5em;}
.touken .touken_blk{ background-color: #f2f2f2; margin-bottom: 1em; padding: 3%;}
.touken .ticket_btn a{  display:block; background-color: var(--keyc1); color:#fff; border-radius:100px; padding:30px 0 ; font-size:24px; font-weight:bold; line-height:1em; width:80%; margin:0 auto;}
.touken .ticket_btn  a:hover{ opacity:0.8;}


@media only screen and (max-width: 1100px){
	.ticket_tit h3{ font-size:6.2vw; line-height:1em;}

}


@media only screen and (max-width: 768px){
	.ticket_wrap{ width:96%; padding:7vw 3vw;}
	.ticket_tit h3{ font-size:13vw; line-height:1em; margin-bottom:2vw;}
	.ticket_tit h3 .venue{ display:block; line-height:1em;}
	.ticket_tit h3 .venue .txts{ font-size:0.5em; display:block;}
	.ticket_tit p{ font-size:3vw;}

	.ticket_wrap .price{ width:100%; margin-bottom:15px;}
	.ticket_wrap .price li{ font-size:17px; line-height:1.2em; padding:14px 0 12px;}
	.ticket_wrap .price span{ display:block;}
	.ticket_wrap .price .act{padding-top:0.5em;}

	.ticket_info{ font-size:18px; font-weight:bold;margin-bottom: 20px; }
	.ticket_info .date{ font-size:32px;line-height:1em; margin-bottom:10px;}
	.ticket_info a{ width:100%; font-size:16px; line-height:1em; padding:18px 0; }

	.ticket_info .notes{ font-size:10px; margin-bottom:10px;}

	.ticket_wrap .notice{ font-size:12px; line-height:1.6em;}
	.ticket_info .sold{ font-size:36px; line-height:1.1em;}

	.venue_info{  width:100%;  padding:10px ;}
	.venue_info dl{ border-top:1px solid #ccc;}
	.venue_info dt{ float:none; width:100%;}
	.venue_info dd{ float:none; border-bottom:1px solid #ccc; padding:5px;}

	.touken{ border: 6px solid #ddd; padding: 5%; margin-bottom: 30px;}
	.touken h4{ font-size: 20px; margin-bottom: 0.5em;}
	.touken .price{ font-size: 18px; }
	.touken h5{  font-size: 18px; }
	.touken .date{ font-size: 24px; margin-bottom: .5em;}
	.touken .touken_blk{ padding: 10px;}
	.touken .date{ font-size: 16px;}
	.touken .ticket_btn a{ font-size: 16px; width: 100%; line-height: 1em; padding: 18px 0;}

}

/******************POP UP*******************/
#popup{margin-bottom:5vw;}
#popup .container{width: 94%; max-width: 1000px;margin: 0 auto;color:#ffffff;}

#popup .pop_lead{font-family: var(--font1);font-weight: bold;    font-size: 30px;
    line-height: 40px;}
#popup .txt_box{text-align: left;font-size: 18px;
    line-height: 1.9em;border: 1px solid #fff;padding: 36px 54px;}
#popup .txt_box p{    margin-bottom: 30px;}

#popup figure{width:100%;}
#popup img{ width:100%;}


/******************MOVIE*******************/
#movie{margin-bottom:5vw;}
#movie .container{width: 94%; max-width: 1000px;margin: 0 auto;color:#ffffff;}
#movie .movie_box {	position: relative;width: 100%;padding-bottom: 56.25%;height: 0;}



@media only screen and (max-width: 768px){
	#popup{margin-bottom: 40px; padding-top:10px;}
	#popup .container {width: 90%;}	
	#popup .subtit{line-height: 1.0em;}
	#popup .pop_lead{font-size: 18px;line-height: 1.7em; text-align: left;}
	#popup .txt_box{padding: 22px; font-size:16px;}
}




/********************** EARLY NOISE *******************************/
#earlynoise{background-color: #000;color:#222;padding:5vw 0;font-family:var(--font1);font-weight:bold;}
#earlynoise .lead{ width:80%; margin:0 auto 40px; line-height:1.7em; font-size:1.5vw; text-align:left;}
#earlynoise .lead p{ margin:0;}
#earlynoise h2{margin-bottom:20px;color: #ffffff;text-align:center;line-height:1em;font-size:5vw;font-weight:bold;}

#earlynoise ul{ width:98%; margin:0 auto 3vw;}
#earlynoise li{ float:left; width:10%; font-weight:bold; font-size:13px; line-height:1.6em; padding:4px;}
#earlynoise li a{ color:#fff;}
#earlynoise li figure{ line-height:0;}
#earlynoise li p{ margin:0; padding:10px 0 20px;}
#earlynoise img{ width:100%;}

#earlynoise a.more{display:block;width:30%;padding:1.5vw 0;margin:0 auto;}
/* #earlynoise a.more:hover{ background-color:var(--theme_color);} */

@media only screen and (max-width: 768px){
	#earlynoise{ padding:20px 0;}
	#earlynoise .lead{ width:94%; margin-bottom:10px;}
	#earlynoise h2{ margin-bottom:10px; font-size:7vw;}

	#earlynoise ul{ margin-bottom:15px;}
	#earlynoise li{width:20%; padding:2px;}

	#earlynoise a.more{ width:90%; font-size:14px; padding:15px 0;}
}



/********************** ARTIST DETAIL *******************************/
.artistpage{  background-repeat:no-repeat; background-position:center top; background-attachment:fixed; background-size:cover;}

/* .artistpage.ap01{background-image:url(../images/v13_abg01.jpg);}
.artistpage.ap02{background-image:url(../images/v13_abg02.jpg);}
.artistpage.ap03{background-image:url(../images/v13_abg03.jpg);}
.artistpage.ap04{background-image:url(../images/v13_abg04.jpg);} */

.artistpage_bg {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 110%;height: 110%;opacity: 0.7;}
.artistpage_bg img {width: 100%; height: 100%; filter: blur(50px); object-fit: cover;}


.arrow div{ position:fixed; top:50%; margin-top:-41px; z-index:99;}
.arrow .prev{ left:1.5vw;}
.arrow .next{ right:1.5vw;} 

.artist_wrap{ position:relative; padding:0 0 7vw 5vw; padding-top:calc(42px + 2.5vw);}
.artist_wrap:after{clear:both;display:block;height:0;line-height:0;visibility:hidden;font-size:0.1em;content:".";}
.artist_wrap .left{ width:47%; float:left;}
.artist_wrap .left figure{ line-height:0;}
.artist_wrap .left img{ width:100%;}
.artist_wrap .left iframe{ width:100%;  height:400px;}

.artist_wrap .right{ background-color:#fff; float:right; width:53%; padding:0 5vw 0 3.5%; text-align:left; margin-top:6vw; color:#000;}
.artist_wrap .right h1{margin-top: 3.6vw;margin-bottom:1vw;font-family:var(--font1);color:#000;font-weight:bold;font-size: 3.5vw;line-height: 1.5em;}
.artist_wrap .right h1.day20{color: #0f7ec9;}
.artist_wrap .right h1 span{ font-size: 0.6em;}

.artist_wrap .right h1 img{ height:5.5vw;}
.artist_wrap .right h2{ color:var(--theme_color);font-family:var(--font1); font-weight:bold; font-size:2vw; line-height:1em; margin-bottom:0.5em;}
.artist_wrap .right .prof_txt{ margin-bottom:3em;}

.youtube{ position: relative; height: 0px; width: 100%; padding-bottom: 56.25%; margin-bottom:1vw;}
.youtube iframe{ width:100%; height:100%; position:absolute; top:0; left:0;}

.artist_wrap .right dl{ margin-bottom:3vw;}
.artist_wrap .right dt{color:var(--theme_color);font-family:var(--font1); font-weight:bold; font-size:2vw; line-height:1em; margin-bottom:0.7em;}
.artist_wrap .right dd{}
.artist_wrap .right dd a{display:block;background-color: #000;color:#fff;padding:0.75em 3%;margin-bottom:5px;line-height:1em;}
.artist_wrap .right dd a:hover{  background-color:rgba(217,27,59,0.8);}

.artist_wrap .right .link{ margin-bottom:30px; padding-top:10px;}
.artist_wrap .right .link .spotifylink { width:100%; }
.artist_wrap .right .link .spotifylink a{ display:block; background-color:#1db954; color:#fff;border-radius:100px; text-align:center;font-family:var(--font1); font-weight:bold; font-size:16px; line-height:1em; padding:20px 0; }
.artist_wrap .right .link .spotifylink a:hover{ background-color:#1fc359;}
.artist_wrap .right .link .share{ display:table; margin:0 auto;}
.artist_wrap .right .link .share div{ display: table-cell; vertical-align:middle; padding:0 2px; line-height:0;}
.artist_wrap .right .link .share div.sharetit{ padding:0 10px 0 0;  font-family:var(--font1); font-weight:bold;}
.artist_wrap .right .link .share img{ width:58px;}

.artist_wrap .right .backtop a{display:block;background-color: #000;color:#fff;border-radius:100px;text-align:center;font-family:var(--font1);font-weight:bold;font-size:16px;line-height:1em;padding:20px 0;margin-bottom:-30px;}
.artist_wrap .right .backtop a:hover{ background-color:#e52642;}


.artist_wrap .right.a81{ padding-top: 50px;}
.artist_wrap .right h1.t81{ font-size: 2.5vw; line-height: 1.2em;}
.artist_wrap .right.a81 dt{color: rgb(255 116 69);font-size:2.5vw; line-height:1.5em; margin-bottom:0.2em;}

@media only screen and (max-width: 768px){
	.arrow div{ position:absolute; top:calc(60px + 22vw); margin-top:0; }
	.arrow div img{width: 7vw;}
	.arrow .prev{ left:0vw;}
	.arrow .next{ right:0vw;}

	.artist_wrap{ padding:48px 0 0; }
	.artist_wrap .left{ width:100%; float:none;}
	.artist_wrap .right{  float:none; width:100%; padding:15px 3% 15px; margin-top:0;}

	.artist_wrap .right h1{text-align:center; margin-bottom:15px; font-size:9vw; margin-top:0;}
	.artist_wrap .right h1.t81{ font-size: 5.5vw;}
	
	.artist_wrap .right h2{ font-size:20px; text-align: center; margin-bottom:8px;}
	.artist_wrap .right dt{ font-size:20px; text-align: center; margin-bottom:8px;}
	.artist_wrap .right dl{ margin-bottom:30px;}
	.artist_wrap .right.a81 dt{ font-size: 30px;}

	.artist_wrap .right .link .spotifylink { width:100%; float: none; margin-bottom:10px;}
	.artist_wrap .right .link .spotifylink a{ padding:15px 0;}
	.artist_wrap .right .link .share img{ width:40px;}

	.youtube{ margin-bottom:10px;}
	.artist_wrap .right .spspotify iframe{ width:100%; margin-bottom:0px;}

	.artist_wrap .right .backtop a{ margin-bottom:0;}
	
}



/********************** ARCHIVE *******************************/
#archive{color: #ffffff;padding-top: calc(10vw + 35px);}
#archive .lead{ width:80%; margin:0 auto 3em; line-height:2em; font-size:1.5vw; text-align:left;}
#archive .lead p{ margin:0;}
#archive h1{margin-bottom:1em;color: #ffffff;text-align:center;line-height:1em;font-size:5vw;font-family:var(--font1);font-weight:bold;}

#archive ul{display: flex; flex-wrap: wrap; list-style: none; padding: 0; width:96%; margin:0 auto 2vw;}
#archive li{ width:33.33%; font-weight:bold; font-size:16px; line-height:1.7em; margin-bottom:1vw;}
#archive li a{display:block;padding:10px;color: #ffffff;transition:0.4s;}
#archive li a:hover{background-color: #393939;}
#archive li a:hover img{ opacity:1;}
#archive li figure{ line-height:0;}
#archive li .artist{ text-align:left; padding:1vw 0 0;}
#archive li .artist .date{ margin:0; border-bottom:1px solid #666; padding-bottom:0.5vw; margin-bottom:0.5vw;}
#archive li .artist .lineup{}
#archive img{ width:100%;}

@media only screen and (max-width: 768px){
	#archive{  padding-top: calc(8vw + 35px);}
	#archive .lead{ width:94%; margin-bottom:10px;}
	#archive  h2{  margin-bottom: 10px; font-size: 7vw;}
	#archive .lead p{ font-size:16px; line-height:1.5em;}

	#archive ul{ width:100%;}
	#archive li{width:100%;margin-bottom:5px;}
	#archive li a{background-color: #111111;padding:15px 10px;}
	#archive li figure{ width:30%; display:table-cell; vertical-align:top;}
	#archive li .artist{  width:70%; padding:0 0 0 5%; font-size:12px; line-height:1.4em; display:table-cell; vertical-align:top;}
	#archive li .artist .date{ padding-bottom:10px; margin-bottom:5px;}
	#archive li .artist .lineup{ margin-bottom:0;}
}


/*lightbox*/

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box;}
/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#ccc;}
#colorbox{outline:none;}
   /* #cboxContent{margin-bottom:60px; overflow:visible;}*/
    #cboxContent{margin-right:60px; overflow:visible; margin-bottom:0;}
        .cboxIframe{background:#000;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{background:#fff;}
        #cboxLoadingGraphic{background:url(../images/loading.gif) no-repeat center center;}
        #cboxLoadingOverlay{background:#fff;}
        #cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}
        #cboxSlideshow, #cboxClose{text-indent:-9999px; width:40px; height:100%; position:absolute; top:0;background:url(../images/controls2.png) no-repeat 0 0;}
		
        #cboxClose{background-position:7px 0; right:-50px; border:0; outline:none;}
        #cboxClose:hover{background-position:-40px 0;}


@media screen and (max-width: 768px) {
#cboxContent{ margin-right:0; margin-bottom:50px;}
#cboxClose{ right:0; top:inherit; bottom:-35px; height: 22px;}
}
