﻿
.comment01 {
	margin:0 auto;
	padding:20px 0;
	width:70%;
	font-size: 0.95rem;
	line-height: 1.6;
	text-align: left;
}
main h2,article h2 {
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 1.8;
}
main {
	margin: 0 auto 40px;
	width: 90%;
}
main ul{
	display:flex;
	flex-wrap: wrap;
	justify-content:space-between;
}
main li{
	width:24%;
	font-size: 1rem;
	line-height: 1.6;
	text-align:center;
}
article{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin:0 auto;
	width:90%;
}
article #profile {
	width:56%;
}
article h3{
	font-size:1.1rem;
	line-height:1.6;
}
article p {
	margin-left: 10px;
	font-size: 0.95rem;
	line-height: 1.6;
	letter-spacing: 1px;
	text-align: justify;
	text-indent: 12px;
}
article #tetsu {
	display: flow-root;
	width:36%;
}
article #tetsu img {
	float: right;
	padding: 10px 0 10px 10px;
}


/*Responsive===========================================================*/

@media screen and (max-width:1026px){
	
}
@media screen and (max-width:940px){
		
}

@media screen and (max-width:770px){
	.comment01 p {
		width: 98%;
		font-size:0.95rem;
		line-height: 1.6;
	}
	main {
		width: 96%;
	}
	main li {
		width: 48%;
	}
	main h2,article h2 {
		font-size: 1.3rem;
		line-height: 1.8;
	}
	article {
		flex-direction: column;
		width: 96%;
	}
	article #profile,
	article #tetsu {
		width: 96%;
		
	}
}
@media screen and (max-width:642px){
	.comment01 p {
		width: 100%;
		font-size:1rem;
	}
}
