@charset "utf-8";
/* CSS Document */




/* pictgram */
#pictgram{
	height:auto;
	padding-bottom:100px;
	background-color:#fff799;
	}

#pictgram h1{
	height:55px;
	background-color:white;
	color:#555;
	font-size:28px;
	font-weight:bold;
}

#icon{
	display:inline-block;
	margin-left:10%;
	}

.info{
	margin:35px 15%;
}


.info h2{
		color:#2a2b2b;
		font-size:26px;
		line-height:26px;
}

.info p{
	color:#2a2b2b;
	line-height:30px;
	margin-top:20px;
	}

.topic{
	margin-top:30px;
	color:#2a2b2b;
	font-size:26px;
	line-height:26px;
}

.tag{
	margin-top:30px;
}

.set{
	margin:10px;
}

.diamond{
	display:inline-block;
	width:0;
	height:0;
	border:solid 10px transparent;
	border-bottom-color:#2a2b2b;
	position:relative;
	top:-10px;	
	}
	
.diamond::after{
	content:"";
	position:absolute;
	top:10px;
	left:-10px;
	width:0;
	height:0;
	border:solid 10px transparent;
	border-top-color:#2a2b2b;
}

.sub_title{
	display:inline-block;
	vertical-align:top;
	}
	
.topic_title{
	margin:30px 0px 5px;}

.menu{
	width:100%;
}

#useful_point ul li{
	margin-left:100px;
}


/* pictgram end */



@media screen and (max-width:900px){
#useful_point ul li{
	margin-left:0px;
}
}
	
@media screen and (max-width:640px){
	/*ここに640pxまでのCSSを記述*/



#pictgram h1{
	font-size:24px;
}
	


#icon{
	width:5%;
}


.info{
	margin:30px 10%;
}

.info h2{
	font-size:20px;
	line-height:20px;
}

.topic{
	font-size:20px;
	line-height:30px;
}

.info p{
	font-size:14px;
	line-height:28px;
}

.sub_title{
	font-size:14px;
}


.diamond{
	display:inline-block;
	width:0;
	height:0;
	border:solid 8px transparent;
	border-bottom-color:#2a2b2b;
	position:relative;
	top:-8px;	
	}
	
.diamond::after{
	content:"";
	position:absolute;
	top:8px;
	left:-8px;
	width:0;
	height:0;
	border:solid 8px transparent;
	border-top-color:#2a2b2b;
}

.sub_title{
	font-size:12px;
}

.topic_title{
	font-size:12px;
}


}

@media screen and (max-width:480px){
	/*ここに480pxまでのCSSを記述*/

#pictgram{
	height:2500px;
	}
	


.info h2{
	font-size:20px;
	line-height:30px;
}

#icon{
	margin-left:5%;
}
		
}