@charset "utf-8";
#live img{
	width: 100%;
}
#live .sp{
	display: none;
}
#live .clrTxt {
	text-indent:-10000px;
	text-decoration:none;
	overflow:hidden;
    position:absolute;
}
#live{
	font-family: 'Noto Sans JP', sans-serif;
	width: 100%;
}
#live #header{
	position: relative;
	width: 100%;
	height: 550px;
	overflow: hidden;
}
#live #header .inner{
	position: relative;
	background: url("../images/header_bg.jpg") no-repeat top center / cover;
	width: 100%;
	padding-top: 36%;
}
#live #header .main_ttl{
	position: absolute;
	max-width: 1000px;
	width: 65%;
	margin: 0 auto;
	top: 2%;
	left: 5%;
	right: 0;
}
#live #header .main_ttl .img{
	background: url("../images/header_logo.png") no-repeat top center / cover;
	padding-top: 53.333%;
}


#live #info{
	background: url("../images/bg.jpg") no-repeat top center / cover;
	padding: 1% 0;
	width: 100%;
}
#live #info .img{
	background: url("../images/main.png") no-repeat top center / cover;
	padding-top: 30.85%;
	height: auto;
	width: 60%;
	margin: 0 auto;
}


#live #outline{
	background: url("../images/guide_bg.png") no-repeat top center / cover;
	padding: 1% 0;
	width: 100%;
}
#live #outline .img{
	background: url("../images/guide_pc.jpg?210630") no-repeat top center / cover;
	padding-top: 24.46%;
	width: 60%;
	margin: 1% auto;
}

#live .link{
	background: url("../images/bg.jpg") no-repeat top center / cover;
	padding: 2% 0 2%;
}

#live .btn{
    margin: 0 auto;
    background: #aa4500;
    width: 50%;
    border: 8px solid #ffffff;
    border-radius: 10px;
    box-shadow: 3px 5px 4px 0px #aaaaaa;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    padding: 20px 0;
}
#live .gray{
	background: #9c9c9c;
	margin: 0 auto;
	width: 50%;
	border: 8px solid #F0F0F0;
	border-radius: 10px;
	box-shadow: 3px 5px 4px 0px #aaaaaa;
	font-size: 23px;
	font-weight: bold;
	text-align: center;
	padding: 20px 0;
}
#live .btn a{
    display: block;
    color: #ffffff;
}
#live .gray a{
	display: block;
	color:#d4d4d4;
}
#live .btn:hover{
	opacity: 0.6;
    transition: 0.3s;
}
#live .btn a:hover{
    text-decoration: none;
	transition-duration: .3s;
}
#live .gray a:hover{
	text-decoration: none;
}

#live #present{
	background: url("../images/bg.jpg") no-repeat top center / cover;
	padding: 1% 0;
	width: 100%;
}
#live #present .img{
	background: url("../images/present_pc.jpg") no-repeat top center / cover;
	padding-top: 32.85%;
	width: 60%;
	margin: 0% auto 3%;
}
#live #present .btn a{
	color: #dd2296;
	text-decoration: none;
}
#live #present .link{
	
}
#live #present .btn{
    margin: 0 auto;
    width: 90%;
    background: #F0F0F0;
    max-width: 840px;
    border: 8px solid #dd2296;
    border-radius: 10px;
    box-shadow: 3px 5px 4px 0px #aaaaaa;
    font-size: 23px;
    font-weight: bold;
    text-align: center;
    padding: 20px 0;
	transition-duration: .3s;
}
#live #present .btn a:hover{
    text-decoration: none;
	transition-duration: .3s;
}


@media screen and (max-width:1706px) {
	#live #header{
		height: auto;
	}
}
@media screen and (max-width:1000px) {
	#live #info p{
		font-size: 2.4vw;
	}
	#live #info p span{
		font-size: 2vw;
	}
	#live .flex{
		display: block;
		text-align: center;
	}
	#live #outline .txt{
		width: 100%;
		text-align: center;
		margin-top: 15px;
	}
}