
/* ------------------------------------------------------------ piece-bell ------------------------------------------------------------ */

html { height: 100%; }
body { height: 100%; font-family:"ヒラギノ角ゴ Pro w3","Hiragino Kaku Gothic Pro","Meiryo","メイリオ","Osaka","ＭＳ Ｐゴシック","MS P Gothic","Arial",sans-serif; }
#live { color: #fff; }
#live .btns a,
#live .btns input[type="submit"] { vertical-align: middle; display: inline-block; color: #fff; width: 280px; border-radius: 30px; border: none;
	background: #ce1e64;
	height: 60px;
	line-height:60px;
	margin: 5px;
	min-width: inherit;
}
#live .btns a { background: #ce1e64; }
#live .btns a.back { background: #888888; }


#live { display: flex; height: 100%;}
#live .header { text-align: center; }
#live .header img { padding: 0 0 20px; }

#modal {  height: 100%;}
#live section#left { width: 60%; height: 100%;}
#live section#left.live1 { background: url(../images/live/live1.jpg) no-repeat center center; background-size: cover; }
#live section#left.live2 { background: url(../images/live/live3.jpg) no-repeat center center; background-size: cover; }
#live section#left.live3 { background: url(../images/live/live2.jpg) no-repeat center center; background-size: cover; }




#live section#right { width: 40%; padding: 6% 4%;}
#live section#right { background: #000; }
#live section#right h1 { text-align: center; padding: 0 0 40px; font-size: 20px; }
#live section#right h1 span { display: inline-block; }
#live section#right p { line-height: 180%; font-size: 16px; }
#live section#right h3 { font-size: 27px; padding: 0 0 20px; line-height: 150%; text-align: center; }
#live section#right h3 span { display: inline-block; }
#live section#right .btns { text-align: center; padding: 40px 0 0; }
#live section#right .btns p { text-align: center !important; background: #b3b3b3 ; color: #fff; width: 300px; padding: 15px 0; border-radius: 30px; margin: 0 auto;}

#live section#right .btns { text-align: center; padding: 40px 0 0; }
#live section#right .btns.open p { background: inherit; width: inherit; padding: inherit; border-radius:inherit;  } 
#live section#right .btns.open p a { text-align: center !important; background: linear-gradient(0deg, rgba(153, 41, 204, 0.9), rgba(108, 222, 245, 0.9));
	background: -webkit-linear-gradient(0deg, rgba(153, 41, 204, 0.9), rgba(108, 222, 245, 0.9));
	 color: #fff; width: 300px; padding: 15px 0; border-radius: 30px; margin: 0 auto; height: 30px; line-height: 30px; text-decoration: none;}



#live.en section#right p { word-break: break-word; text-align: justify;}
#live.en section#right h3 { word-break: break-word; }

#live section#left.enter1 { background: url(../images/spot/enter_01.jpg) no-repeat center center; background-size: cover; }


@media only screen and (max-width: 1100px) {
	#live section#left ,#live section#right { width: 50%; }
	#live section#right h1 { text-align: center; padding: 0 0 30px; font-size: 16px; line-height: 160%;}
	#live section#right h3 { font-size: 20px; padding: 0 0 20px; line-height: 150%; text-align: center; }
	#live section#right p { line-height: 200%; font-size: 14px;}
} 

/* ----------------------------- mobile ------------------------------- */
@media only screen and (max-width: 768px) {
	#live { display: block; }
	#live section#left { width: 100%; }
	#live section#right { width: 92%; padding: 6% 4% 20%;}
	#live section#left { height: 250px; }
	
	#live section#right h1 { text-align: center; padding: 0 0 30px; font-size: 16px; line-height: 160%;}
	#live section#right h3 { font-size: 20px; padding: 0 0 20px; line-height: 150%; text-align: center; }
	#live section#right p { line-height: 180%; font-size: 14px;}

}