@charset "utf-8";


/* content===========================================

	utility.css
	
		Utilities
		Colors
		Spacing
		Border radius
		Table (Responsive)


	KABOSU MEDIA WORKS

===================================================== */



/*	 Utilities
===================================================== */
	
	.u-clear { clear: both; }
	.u-clearfix:after {
		content: " ";
		display: block;
		clear: both;
		}

	.is-dn { display: none; }
	.is-di { display: inline; }
	.is-db { display: block; }
	.is-vh { visibility: hidden; }
	
	@media (max-width: 767px) {
	/*SP～TB縦*/		
	.is-hidden-medium { display:none; }
	}
	@media print, screen and (min-width: 768px) {
	.is-hidden-large { display:none; }
	}
	
	.u-fln { float: none; }
	.u-fll { float: left; }
	.u-flr { float: right; }
	
	.u-tal { text-align: left; }
	.u-tac { text-align: center; }
	.u-tar { text-align: right; }





/*	Colors
===================================================== */

	/* cRed:Red, cGrey:Grey  */

		.u-cRed-light 	{ color: #FFCCCC; }
		.u-cRed 				{ color: #FF0000; }
		.u-cRed-dark 		{ color: #990000; }
		
		.u-cGrey-light 	{ color: #F5F5F5; }
		.u-cGrey			 	{ color: #666666; }
		.u-cGrey-dark	 	{ color: #333333; }


		/* background color */
		
		.u-bgcWhite			{ background-color: #FFFFFF; }
		
		.u-bgcRed-light 	{ background-color: #FFCCCC; }
/*		.u-bgcRed 			{ background-color: #FF0000; }*/
		.u-bgcRed-dark 		{ background-color: #990000; }
		
		.u-bgcGrey-light 	{ background-color: #F5F5F5; }	
		.u-bgcGrey 				{ background-color: #666666; }
		.u-bgcGrey-dark 	{ background-color: #333333; }


	


/*	Spacing
===================================================== */

	/*margin (rem) */
		.u-ma { margin: auto; }
		.u-mn { margin: 0; }
		
		.u-mtn { margin-top: 0; }
		.u-mts { margin-top: .4rem; }
		.u-mtm { margin-top: 1.6rem; }
		.u-mtl { margin-top: 3.2rem; }
		.u-mtx { margin-top: 4.8rem; }
		
		.u-mbn { margin-bottom: 0; }
		.u-mbs { margin-bottom: .4rem; }
		.u-mbm { margin-bottom: 1.6rem; }
		.u-mbl { margin-bottom: 3.2rem; }
		.u-mbx { margin-bottom: 4.8rem; }
	
	/*margin (px) */
		.u-mt5 { margin-top:    5px !important;}
		.u-mr5 { margin-right:  5px !important;}
		.u-mb5 { margin-bottom: 5px !important;}
		.u-ml5 { margin-left:   5px !important;}
			 
		.u-mt10 { margin-top:    10px !important;}
		.u-mr10 { margin-right:  10px !important;}
		.u-mb10 { margin-bottom: 10px !important;}
		.u-ml10 { margin-left:   10px !important;}
		
		.u-mt15 { margin-top:    15px !important;}
		.u-mr15 { margin-right:  15px !important;}
		.u-mb15 { margin-bottom: 15px !important;}
		.u-ml15 { margin-left:   15px !important;}
		
		.u-mt20 { margin-top:    20px !important;}
		.u-mr20 { margin-right:  20px !important;}
		.u-mb20 { margin-bottom: 20px !important;}
		.u-ml20 { margin-left:   20px !important;}
		
		.u-mt25 { margin-top:    25px !important;}
		.u-mr25 { margin-right:  25px !important;}
		.u-mb25 { margin-bottom: 25px !important;}
		.u-ml25 { margin-left:   25px !important;}
		
		.u-mt30 { margin-top:    30px !important;}
		.u-mr30 { margin-right:  30px !important;}
		.u-mb30 { margin-bottom: 30px !important;}
		.u-ml30 { margin-left:   30px !important;}
		
		.u-mt40 { margin-top:    40px !important;}
		.u-mr40 { margin-right:  40px !important;}
		.u-mb40 { margin-bottom: 40px !important;}
		.u-ml40 { margin-left:   40px !important;}
		
		.u-mt50 { margin-top:    50px !important;}
		.u-mr50 { margin-right:  50px !important;}
		.u-mb50 { margin-bottom: 50px !important;}
		.u-ml50 { margin-left:   50px !important;}	
	
	
	/*padding (rem) */
		.u-pn { padding: 0; }
		
		.u-pm { padding: 1.6rem; }
		
		.u-ptn { padding-top: 0; }
		.u-pts { padding-top: .4rem; }
		.u-ptm { padding-top: 1.6rem; }
		.u-ptl { padding-top: 3.2rem; }
		.u-ptx { padding-top: 4.8rem; }
		
		.u-pbn { padding-bottom: 0; }
		.u-pbs { padding-bottom: .4rem  !important; }
		.u-pbm { padding-bottom: 1.6rem !important; }
		.u-pbl { padding-bottom: 3.2rem !important; }
		.u-pbx { padding-bottom: 4.8rem !important; }
	
	/*padding (px) */
		.u-pt5 { padding-top:      5px !important;}
		.u-pr5 { padding-right:    5px !important;}
		.u-pb5 { padding-bottom:   5px !important;}
		.u-pl5 { padding-left:     5px !important;}
		
		.u-pt10 { padding-top:    10px !important;}
		.u-pr10 { padding-right:  10px !important;}
		.u-pb10 { padding-bottom: 10px !important;}
		.u-pl10 { padding-left:   10px !important;}
		
		.u-pt15 { padding-top:    15px !important;}
		.u-pr15 { padding-right:  15px !important;}
		.u-pb15 { padding-bottom: 15px !important;}
		.u-pl15 { padding-left:   15px !important;}
		
		.u-pt20 { padding-top:    20px !important;}
		.u-pr20 { padding-right:  20px !important;}
		.u-pb20 { padding-bottom: 20px !important;}
		.u-pl20 { padding-left:   20px !important;}
		
		.u-pt25 { padding-top:    25px !important;}
		.u-pr25 { padding-right:  25px !important;}
		.u-pb25 { padding-bottom: 25px !important;}
		.u-pl25 { padding-left:   25px !important;}
		
		.u-pt30 { padding-top:    30px !important;}
		.u-pr30 { padding-right:  30px !important;}
		.u-pb30 { padding-bottom: 30px !important;}
		.u-pl30 { padding-left:   30px !important;}

		.u-pt40 { padding-top:    40px !important;}
		.u-pr40 { padding-right:  40px !important;}
		.u-pb40 { padding-bottom: 40px !important;}
		.u-pl40 { padding-left:   40px !important;}
		
		.u-pt50 { padding-top:    50px !important;}
		.u-pr50 { padding-right:  50px !important;}
		.u-pb50 { padding-bottom: 50px !important;}
		.u-pl50 { padding-left:   50px !important;}
	
	/*Negative margin*/
		.u-nmt5 {   margin-top:    -5px !important;}
		.u-nmr5 {   margin-right:  -5px !important;}
		.u-nmb5 {   margin-bottom: -5px !important;}
		.u-nml5 {   margin-left:   -5px !important;}
			 
		.u-nmt10 {   margin-top:    -10px !important;}
		.u-nmr10 {   margin-right:  -10px !important;}
		.u-nmb10 {   margin-bottom: -10px !important;}
		.u-nml10 {   margin-left:   -10px !important;}
		
		.u-nmt15 {   margin-top:    -15px !important;}
		.u-nmr15 {   margin-right:  -15px !important;}
		.u-nmb15 {   margin-bottom: -15px !important;}
		.u-nml15 {   margin-left:   -15px !important;}
		
		.u-nmt20 {   margin-top:    -20px !important;}
		.u-nmr20 {   margin-right:  -20px !important;}
		.u-nmb20 {   margin-bottom: -20px !important;}
		.u-nml20 {   margin-left:   -20px !important;}
		
		.u-nmt25 {   margin-top:    -25px !important;}
		.u-nmr25 {   margin-right:  -25px !important;}
		.u-nmb25 {   margin-bottom: -25px !important;}
		.u-nml25 {   margin-left:   -25px !important;}


	/* section (px) */
	@media print, screen and (min-width: 768px) {
		.sec-paddingL {
			padding-top: 100px;
			padding-bottom: 100px;
			}
      .sec-paddingL-top {
        padding-top: 100px;
        }
      .sec-paddingL-bottom {
        padding-bottom: 100px;
        }
		.sec-padding {
			padding-top: 60px;
			padding-bottom: 60px;
			}
      .sec-padding-top {
        padding-top: 60px;
        }
      .sec-padding-bottom {
        padding-bottom: 60px;
        }
		.sec-paddingS {
			padding-top: 30px;
			padding-bottom: 30px;
			}
      .sec-paddingS-top {
        padding-top: 30px;
        }
      .sec-paddingS-bottom {
        padding-bottom: 30px;
        }
	}
	@media (max-width: 767px) {
		.sec-paddingL {
			padding-top: 50px;
			padding-bottom: 50px;
			}
      .sec-paddingL-top {
        padding-top: 50px;
        }
      .sec-paddingL-bottom {
        padding-bottom: 50px;
        }
		.sec-padding {
			padding-top: 30px;
			padding-bottom: 30px;
			}
      .sec-padding-top {
        padding-top: 30px;
        }
      .sec-padding-bottom {
        padding-bottom: 30px;
        }
		.sec-paddingS {
			padding-top: 20px;
			padding-bottom: 20px;
			}
      .sec-paddingS-top {
        padding-top: 20px;
        }
      .sec-paddingS-bottom {
        padding-bottom: 20px;
        }
	}




/*	Border radius
===================================================== */

	.c-br-4 {
		-webkit-border-radius: 4px;
			 -moz-border-radius: 4px;
						border-radius: 4px;
				-ms-border-radius: 4px;
	}
	
	.c-br-8 {
		-webkit-border-radius: 8px;
			 -moz-border-radius: 8px;
						border-radius: 8px;
				-ms-border-radius: 8px;
	}
	
	.c-br-12 {
		-webkit-border-radius: 12px;
			 -moz-border-radius: 12px;
						border-radius: 12px;
				-ms-border-radius: 12px;
	}
	
	.c-br-16 {
		-webkit-border-radius: 16px;
			 -moz-border-radius: 16px;
						border-radius: 16px;
				-ms-border-radius: 16px;
	}