@charset "utf-8";
 /*---PC用　ブレークポイント　600pxーーーーーー*/
body {
	text-align: left;
	background-color : #ffff80;
	padding : 0pc 0px 0px 5%;
	max-width: 768px;
}
ul li :any-link{
 	color:blue;
}
ul :hover {
	background-color: #F4F4F4;
}
.do-01{
  text-align : left;
}
.red{
  font-size : 1.1em;
  color : red;
}
/*ーーーーー　ボタン　ーーー*/
.ul-quiz{
	margin:0px 1em 0px 1em;
}
.ul-quiz li{
	margin:0.5em 0.5em 0.5em 0.5em;
	padding:0.5em 0.5em 0.5em 2em;
	border:1px silver solid;
	border-radius:5px;
}
.ul-quiz li a{			/*ーボタン全体へリンクー*/
    	display: block;
       	height: 100%;
    	width: 100%
}
/*ーーーーーーカラム落ちーーーーー*/
.container {
	  	display: table;
	  	width: 100%;
}
.column_l30 {
		display: inline-block;
		text-align:center;	
	    	width: 33%;
	   	 margin: 0px auto 0px auto;
	   	 float : left;
}
.column_r30 {
		display: inline-block;
		text-align:center;	
	    	width: 33%;
	    	 margin: 0px 3% 0px 3%;
	   	 float : right;
}
.column_l70 {
		display: inline-block;
	    	width: 60%;
	   	 margin: 0px auto 0px auto;
	   	 float : left;
}
.column_r70 {
		display: inline-block;
	    	width: 60%;
	    	 margin: 0px 3% 0px 3%;
	   	 float : right;
}
.column_l50{
		display: inline-block;
		text-align:left;
	   	 margin: 0px auto 0px auto;
	   	  width: 47%;
	   	 float : left;
}
.column_r50{
		display: inline-block;
	 	text-align : left;
	    	 margin: 0px 3% 0px 3%;
	   	width :47%;
     		float : right;
}

@media screen and (max-width: 600px) {
/* ----------スマホ用　600px以下のデザイン-------- */
body {
	box-sizing:border-box;
	width:98%;	
	padding: 5px 10px 10px 5px;
	text-align : left;
}
.do-01,.do-02{
	text-align : left;
	width: 98%;
}
.red{
  font-size : 1.1em;
  color : red;
}
 /*---カラム落ちーーーーーー*/
.container {
		width: 100%;
}    
.column_l,.column_r {
		width: 100%;
}
.container ,.column_l,.column_r {
		width: 100%;
}
.column_l30,.column_r30,.column_l70,.column_r70,.column_l50,.column_r50,.column-3 {
		width: 100%;
		 margin: 0px auto 0px 1em;
}
}