@charset "utf-8";
		.box_area {
		    margin:20px; width:720px; height:auto;
		}

		.box_area li {
		    position:relative;
			display:inline-block;
			margin:16px; padding:10px;
			width: 120px; height: 120px; line-height:30px;
			/*border: 1px solid rgb(163, 151, 198);*/
			background-color:#f5ecc3; /*#fac60e;*/
			color:#000000;
			border-radius: 50%;
			text-align:center;
			vertical-align:middle;
			white-space: normal;
			word-wrap:break-word;
			word-break:break-all;
			font-size:18px;
		}
		.box_area li.circle1 span{ position: absolute; top:24px; left:14px; right:14px;	}
		.box_area li.circle2 span{ position: absolute; top:40px; left:14px; right:14px; }
		.box_area li.circle3{line-height:120px;	}
		.box_area li.none { background-color:#ffffff; border:none; }


	@media all and (max-width:500px) {
	  .box_area {
		    margin:20px 1%; width:98%; height:auto;
		}

		.box_area li {
			margin:1vw; padding:10px;
			width: 12vw; height: 12vw;
			font-size:12px; 

		}
		.box_area li.circle1 span{ position: absolute; top:10px; left:4px; right:4px; font-size:11px; 	}
		.box_area li.circle2 span{ position: absolute; top:16px; left:4px; right:4px; }
		.box_area li.circle3{line-height:12vw; font-size:13px; 	}  

 }