@charset "UTF-8";
/* cl 効果的な練習法 */

h3#practice01,
h3#practice02,
h3#practice03{
	background-image: url('https://www.alsoj.net/images/cl/article/263/3581/pra.png');
	height: 100px;
	background-repeat: no-repeat;
}

h3#practice01 span.none,
h3#practice02 span.none,
h3#practice03 span.none{
	display: inline-block;
	vertical-align: middle;
	text-align: left;
	width: 86%;
	padding: 1% 2%;
	margin: 4% 0 4% 10%;
	border-radius: 20px;
}

h3#practice01 span.none{
	background-color: #00a0c6;
	color: #FFFFFF;
}

h3#practice02 span.none{
	background-color: #fbca2e;
	color: #FFFFFF;
}

h3#practice03 span.none{
	background-color: #f85979;
	color: #FFFFFF;
}

h3#practice01 span.none:after{
	content: '';
	display: inline-block;
	position: relative;
	background-image: url('https://www.alsoj.net/images/cl/article/263/3581/practice01.png');
	height: 30px;
	width: 30px;
	top: 5px;
}

h3#practice02 span.none:after{
	content: '';
	display: inline-block;
	position: relative;
	background-image: url('https://www.alsoj.net/images/cl/article/263/3581/practice02.png');
	height: 30px;
	width: 30px;
	top: 5px;
}

h3#practice03 span.none:after{
	content: '';
	display: inline-block;
	position: relative;
	background-image: url('https://www.alsoj.net/images/cl/article/263/3581/practice03.png');
	height: 30px;
	width: 30px;
	top: 5px;
}





div.practice01,
div.practice02,
div.practice03{
	margin: 0 0 2em;
	border-radius: 10px;
	padding: 2em 3em 2em 4em;
	letter-spacing: 1px;
	line-height: 2em;
	background-repeat: no-repeat;
	background-position-x: 20px;
	background-position-y: 20px;
}


div.practice01{
	background-color: #a2dbdf;
	background-image: url('https://www.alsoj.net/images/cl/article/263/3581/practice01.png');
}

div.practice02{
	background-color: #fcee66;
	background-image: url('https://www.alsoj.net/images/cl/article/263/3581/practice02.png');
}

div.practice03{
	background-color: #fbb3bc;
	background-image: url('https://www.alsoj.net/images/cl/article/263/3581/practice03.png');
}

div.practice01 strong,
div.practice02 strong,
div.practice03 strong{
	font-size: 1.2em;
}

.name{
	font-size: 1.4em;
}

#main_left #magazine_main hr.line{
	height: 1px;
	background-color: transparent;
}

.mame{
	line-height: 2em;
	letter-spacing: 1px;
	padding: 2em;
	background-color: #b2df96;
}

/* PC */
@media (min-width:1000px){ 


	/* box2_rs */
	.box2_rs{
		display: flex;
		justify-content:space-between;
		padding: 1rem 0 ;
	}
	
	.box2_rs .item{
		max-width: 47%;
	}
	.box2_rs .item img{
		max-width: 100%;
	}
	
	/*box2 profile archive article */
	.box2_profile{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.box2_profile .item{
		width: 44%;
		margin: 0 3%
	}

	.box2_profile .item img{
		width: 50%;
	}	

	.box2_profile .item:nth-child(1){
		text-align: right;
	}

	.box2_profile .item:nth-child(2){
		text-align: left;
		font-size: 1.8em;
	}


	.pc{display: block;}
	.sp{display: none;}
}

/* SP */
@media (max-width:999px){


	h3#practice01 span.none,
	h3#practice02 span.none,
	h3#practice03 span.none{
		display: inline-block;
		vertical-align: middle;
		text-align: left;
		width: 76%;
		padding: 1% 2% 4% 1%;
		margin: 4% 0 4% 20%;
		border-radius: 20px;
	}



	.box2_rs{/*clarinetに限りmagazine_Pspace相殺のため*/
		width: 100%;
		margin: 0;
		padding: 0;
	}

	/* box2_rs */
	.box2_rs .item{
		width: 100%;
	}

	.box2_rs .item img{
		max-width: 100%;
	}



	.box2_rs .caption{
		font-size: 0.8em;
	}

	/*box2 profile archive article */
	.box2_profile{
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.box2_profile .item{
		width: 44%;
		margin: 0 3%
	}

	.box2_profile .item img{
		width: 50%;
	}	

	.box2_profile .item:nth-child(1){
		text-align: right;
	}

	.box2_profile .item:nth-child(2){
		text-align: left;
		font-size: 1.4em;
		font-weight: bold;
	}
	
	.pc{display: none;}
	.sp{display: block;}
}