
/**************** PC ****************/

@media only screen and (min-width:751px){


		.content{
			margin: 0 auto;
			padding: 40px;
		}
		.modal{
			display: none;
			height: 100vh;
			position: fixed;
			top: 0;
			width: 100%;
		}
		#chart .modal section {
			background: none;
			text-align: left;
			padding: 0;
			margin: 0;
	}
		
		.modal__bg{
			background: rgba(0,0,0,0.8);
			height: 100vh;
			position: absolute;
			width: 100%;
		}
		.modal__content{
			background: #000;
			left: 50%;
			padding: 2em;
			position: absolute;
			top: 50%;
			transform: translate(-50%,-50%);
			width: 70%;
			display: flex;
		}
		.modal__content img{
			width:240px;
			margin-right: 2em;
		}
	
	/*text*/
	
	#main .m_text h1,
	#main .m_text h2 {
		text-align: left;
	}
	.m_text h1 {
		font-size: 220%;
		line-height: 1;
		margin-bottom: 0.5em;
	}
	.m_text h1 span {
		font-size:50%;
		margin-left: 1.5em;
	}
	.m_text .actor {
		border-top: 1px solid #fff;
		padding-top: 2em;
		margin-top: 2em;
		margin-bottom: 1em;
		text-align: left;
	}
	
	.m_text h2 {
		font-size: 150%;
	}
	.m_text .closebtn {
		text-align: right;
	}
	.m_text .closebtn a {
		display: inline-block;
		background-color: rgba(255,255,255,1.00);
		border: 1px solid #fff;
		padding: 0.2em 1em 0.3em 1em;
		font-weight: bold;
		color: #000;
		text-decoration: none;
		font-size: 150%;
		line-height: 1;
	}
	.m_text .closebtn a:hover {
		opacity: 0.7;
	}
	.m_text .closebtn a span {
		font-size: 50%; margin-right: 1em;
	}
	
}



/**************** MOBILE ****************/

/* モニター幅750px以下 */

/**************** MOBILE ****************/

@media only screen and (max-width:750px){


		.content{
			margin: 0 auto;
			padding: 40px;
		}
		.modal{
			display: none;
			height: 100vh;
			position: fixed;
			top: 0;
			width: 100%;
		}
		#chart .modal section {
			background: none;
			text-align: left;
			padding: 0;
			margin: 0;
	}
		
		.modal__bg{
			background: rgba(0,0,0,0.8);
			height: 100vh;
			position: absolute;
			width: 100%;
		}
		.modal__content{
			background: #000;
			left: 50%;
			padding: 2em;
			position: absolute;
			top: 50%;
			transform: translate(-50%,-50%);
			width: 95%;
			display:block;
		}
		.modal__content img{
			display: block;
			width:50%;
			margin-right: auto;
			margin-left: auto;
		}
	
	/*text*/
	.m_text h1 {
		font-size: 180%;
		line-height: 1;
		margin-bottom: 0.5em;
	}
	.m_text h1 span {
		font-size:50%;
		margin-left: 1em;
	}
	
	.m_text p {
		line-height:1.2;
	}
	
	.m_text .actor {
		border-top: 1px solid #fff;
		padding-top:0.5em;
		margin-top:1em;
		margin-bottom:2em;
	}
	
	.m_text h2 {
		font-size: 120%;
	}
	.m_text .closebtn {
		text-align: center;
	}
	.m_text .closebtn a {
		display: inline-block;
		background-color: rgba(255,255,255,1.00);
		border: 1px solid #fff;
		padding: 0.2em 1em 0.3em 1em;
		font-weight: bold;
		color: #000;
		text-decoration: none;
		font-size: 120%;
		line-height: 1;
	}
	.m_text .closebtn a:hover {
		opacity: 0.7;
	}
	.m_text .closebtn a span {
		font-size: 50%; margin-right: 1em;
	}
	
	

}