@charset "UTF-8";

@media screen and (min-width:1024px) {
	/* .column.float-box-quarter .inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	border: 1px solid #000;
	margin-top: 300px;
    }
    .column.float-box-quarter .image {
    	width: calc(50% - 35px);
    } */

	.column.quarter ul {
	display: flex;
    }
    
    .column.quarter li {
    	width: calc((100% - 99px) / 4);
    	margin-left: 30px;
		border: 1px solid #000;
		text-align: center;
		padding: 20px 0 15px;
    }
    .column.quarter li:nth-child(4n + 1) {
    	margin-left: 0;
    }
    .column.quarter li:nth-child(n + 5) {
    	margin-top: 70px;
    }
	.fs_100 {
		font-size: 100px;
		font-weight: bold;
		text-shadow: 1px 1px 0px #000, /* 横、縦、ぼかし、色 */
                     -1px -1px 0px #000,
                     1px -1px 0px #000,
                     -1px 1px 0px #000;
	}
	.mt50 {
		margin-top: 50px;
	}
	.column.quarter a:hover {
	    opacity: 0.55;
    }

	/* how2use */
	.bold {
      font-weight: bold;
	}

}





@media screen and (max-width:1023px) {
	.column.quarter ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    }
    
    .column.quarter li {
    	width: calc(50% - 12px);
    	margin-left: 20px;
		border: 1px solid #000;
		text-align: center;
		padding: 20px 0 15px;

    }
    .column.quarter li:nth-child(2n + 1) {
    	margin-left: 0;
    }
    .column.quarter li:nth-child(n + 3) {
    	margin-top: 20px;
    }
	.fs_100 {
		font-size: 50px;
		font-weight: bold;
		text-shadow: 1px 1px 0px #000, /* 横、縦、ぼかし、色 */
                     -1px -1px 0px #000,
                     1px -1px 0px #000,
                     -1px 1px 0px #000;
	}

	/* how2use */
	#how2use .column.triple ul {
	display: block;
    }

	#how2use .column.triple li {
		width: 100%;
	}
    
    #how2use .column.triple li {
    	margin-left: 0;
		margin-top: 20px;
    }
	#how2use .column.pad {
		padding-top: 100px;
	}
	.bold {
      font-weight: bold;
	}

}