@charset "shift_jis";

/* --------------------------------------------------
	SiteName : JSAN
	FileName : utility.css
	Description : utility styles
	
	== TOC =========================================
	1 : font-size setting
	2 : align & float & box-centaring setting
			: align
			: vertical-align
			: float
			: box-centaring
	3 : floatbox clearing
	4 : utility margin setting
			: margin-top
			: margin-right
			: margin-bottom
			: margin-left
	5 : utility padding setting
			: padding-top
			: padding-right
			: padding-bottom
			: padding-left
  6 : utility section setting
			
-------------------------------------------------- */


/* 1. font-size & color setting
================================================== */
/* size */
.small{font-size:x-small;}
.large{font-size:medium;}

/* color */
.clr_01{color:#598898;}


/* 2. align & float & box-centaring setting
================================================== */
/* align */
.alnC{text-align:center;}
.alnL{text-align:left;}
.alnR{text-align:right;}

/* vertical-align */
.valnT{vertical-align:top;}
.valnM{vertical-align:middle;}
.valnB{vertical-align:bottom;}

/* float */
.fltL{float:left;}
.fltR{float:right;}

/* box-centaring */
.cbox{
	margin-left:auto !important;
	margin-right:auto !important;
}


/* 3. floatbox clearing
================================================== */
.clearfix,
.section{
    zoom:1;
}
.clearfix:after,
.section:after{
	content:".";
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
}


/* 4. utility margin setting
================================================== */
/* margin-top */
.mt0{margin-top:0 !important;}
.mt5{margin-top:5px !important;}
.mt10{margin-top:10px !important;}
.mt12{margin-top:12px !important;}
.mt15{margin-top:15px !important;}
.mt20{margin-top:20px !important;}
.mt25{margin-top:25px !important;}
.mt30{margin-top:30px !important;}

/* margin-right */
.mr0{margin-right:0 !important;}
.mr5{margin-right:5px !important;}
.mr10{margin-right:10px !important;}
.mr15{margin-right:15px !important;}
.mr20{margin-right:20px !important;}
.mr25{margin-right:25px !important;}
.mr30{margin-right:30px !important;}
.mr40{margin-right:40px !important;}
.mr50{margin-right:50px !important;}

/* margin-bottom */
.mb0{margin-bottom:0 !important;}
.mb3{margin-bottom:3px !important;}
.mb5{margin-bottom:5px !important;}
.mb8{margin-bottom:8px !important;}
.mb10{margin-bottom:10px !important;}
.mb12{margin-bottom:12px !important;}
.mb15{margin-bottom:15px !important;}
.mb20{margin-bottom:20px !important;}
.mb25{margin-bottom:25px !important;}
.mb30{margin-bottom:30px !important;}
.mb40{margin-bottom:40px !important;}
.mb50{margin-bottom:50px !important;}

/* margin-left */
.ml0{margin-left:0 !important;}
.ml5{margin-left:5px !important;}
.ml10{margin-left:10px !important;}
.ml15{margin-left:15px !important;}
.ml20{margin-left:20px !important;}
.ml25{margin-left:25px !important;}
.ml30{margin-left:30px !important;}
.ml40{margin-left:40px !important;}
.ml50{margin-left:50px !important;}


/* 5. utility padding setting
================================================== */
/* padding-top */
.pt0{padding-top:0 !important;}
.pt5{padding-top:5px !important;}
.pt10{padding-top:10px !important;}
.pt12{padding-top:12px !important;}
.pt15{padding-top:15px !important;}
.pt20{padding-top:20px !important;}
.pt25{padding-top:25px !important;}
.pt30{padding-top:30px !important;
}
/* padding-right */
.pr0{padding-right:0 !important;}
.pr5{padding-right:5px !important;}
.pr10{padding-right:10px !important;}
.pr15{padding-right:15px !important;}
.pr20{padding-right:20px !important;}
.pr25{padding-right:25px !important;}
.pr30{padding-right:30px !important;}

/* padding-bottom */
.pb0{padding-bottom:0 !important;}
.pb5{padding-bottom:5px !important;}
.pb10{padding-bottom:10px !important;}
.pb12{padding-bottom:12px !important;}
.pb15{padding-bottom:15px !important;}
.pb20{padding-bottom:20px !important;}
.pb25{padding-bottom:25px !important;}
.pb30{padding-bottom:30px !important;}

/* padding-left */
.pl0{padding-left:0 !important;}
.pl5{padding-left:5px !important;}
.pl10{padding-left:10px !important;}
.pl15{padding-left:15px !important;}
.pl20{padding-left:20px !important;}
.pl25{padding-left:25px !important;}
.pl30{padding-left:30px !important;}