/* universal class */
.center, .tac { text-align:center; }
.tal { text-align:left; }
.tar { text-align:right; }
.cb {	clear: both; }
.cl  {	clear: left; }
.cr  { clear: right; }
.fr { float: right; }
.fl { float: left; }


/*** text  status ***/
.tac {text-align:center;}
.tal {text-align:left;}
.tar {text-align:right;}

.fix8 {font-size: 8px;}
.fix9 {font-size: 9px;}
.fix10 {font-size: 10px;}
.fix11 {font-size: 11px;}
.fix12 {font-size: 12px;}
.fix13 {font-size: 13px;}
.fix14 {font-size: 14px;}
.fix15 {font-size: 15px;}
.fix16 {font-size: 16px;}
.fix17 {font-size: 17px;}
.fix18 {font-size: 18px;}
.fix20 {font-size: 20px;}
.fix21 {font-size: 21px;}
.fix22 {font-size: 22px;}
.fix24 {font-size: 24px;}
.fix26 {font-size: 26px;}
.fix28 {font-size: 28px;}
.fix30 {font-size: 30px;}
.fix32 {font-size: 32px;}
.fix36 {font-size: 36px;}
.fix40 {font-size: 40px;}
.fix50 {font-size: 50px;}
.fix60 {font-size: 60px;}
.fix70 {font-size: 70px;}
.fix80 {font-size: 80px;}
.fix90 {font-size: 90px;}
.fix100 {font-size: 100px;}

.norm {font-weight: normal;}
.bold {font-weight: bold;}
.italic {font-style: italic;}
.oblique {font-style: oblique;}

.overline {text-decoration: overline;}
.underline {text-decoration: underline;}
.wline {text-decoration: overline underline;}
.blink {text-decoration: blink;}

.underdash {border-bottom: dotted 1px gray;}

.wh {color: #fff;}
.bk {color: #000;}
.bk2 {color: #222;}
.bk3 {color: #333;}
.bk4 {color: #444;}
.bk5 {color: #555;}
.bk6 {color: #666;}
.pink {color: pink;}
.hpink {color: hotpink;}
.red {color: red;}
.dred {color: crimson;}
.tred {color: #C04641;}
.ered {color: #965755;}
.sred {color:#E95513;}
.orange {color: orange;}
.yellow {color: yellow;}
.gold {color: gold;}
.green {color: green;}
.lgreen {color: limegreen;}
.msgreen {color: mediumseagreen;}
.ngreen {color:#009146;}
.egreen { color:#225A4B; }/**/
.edbrown { color:#534741; }/**/
.elbrown { color:#736357; }/**/
.teal {color: teal;}
.lime {color: lime;}
.silver {color: silver;}
.gray {color: gray;}
.dsgray {color: darkslategray;}
.cyan {color: cyan;}
.blue {color: blue;}
.dblue {color: darkblue;}
.dsblue {color: darkslateblue;}
.eblue {color: #476582;}


/*** background ***/
.bgw1 {	background:rgba(255,255,255,0.1);}
.bgw2 {	background:rgba(255,255,255,0.2);}
.bgw3 {	background:rgba(255,255,255,0.3);}
.bgw4 {	background:rgba(255,255,255,0.4);}
.bgw5 {	background:rgba(255,255,255,0.5);}
.bgw6 {	background:rgba(255,255,255,0.6);}
.bgw7 {	background:rgba(255,255,255,0.7);}
.bgw8 {	background:rgba(255,255,255,0.8);}
.bgw9 {	background:rgba(255,255,255,0.9);}
.bgw10 { background:rgba(255,255,255,1);}

.bgk0 {	background:rgba(0,0,0,0.05);}
.bgk1 {	background:rgba(0,0,0,0.1);}
.bgk2 {	background:rgba(0,0,0,0.2);}
.bgk3 {	background:rgba(0,0,0,0.3);}
.bgk4 {	background:rgba(0,0,0,0.4);}
.bgk5 {	background:rgba(0,0,0,0.5);}

.bgs0 {	background:rgba(68,22,10,0.05);}
.bgs1 {	background:rgba(68,22,10,0.1);}
.bgs2 {	background:rgba(68,22,10,0.2);}
.bgs3 {	background:rgba(68,22,10,0.3);}
.bgs4 {	background:rgba(68,22,10,0.4);}
.bgs5 {	background:rgba(68,22,10,0.5);}

/*** boxsha-border ***/
.bdr-0-1 {border:1px solid #000; box-shadow: 0 0 1px #000 inset;}
.bdr-1-1 {border:1px solid #111; box-shadow: 0 0 1px #111 inset;}
.bdr-2-1 {border:1px solid #222; box-shadow: 0 0 1px #222 inset;}
.bdr-3-1 {border:1px solid #333; box-shadow: 0 0 1px #333 inset;}
.bdr-4-1 {border:1px solid #444; box-shadow: 0 0 1px #444 inset;}
.bdr-8-1 {border:1px solid #888; box-shadow: 0 0 1px #888 inset;}
.bdr-a-1 {border:1px solid #aaa; box-shadow: 0 0 1px #aaa inset;}
.bdr-b-1 {border:1px solid #bbb; box-shadow: 0 0 1px #bbb inset;}
.bdr-d-1 {border:1px solid #ddd; box-shadow: 0 0 1px #ddd inset;}
.bdr-f-1 {border:1px solid #fff; box-shadow: 0 0 1px #fff inset;}
/**/
.bdr-0-2 {border:1px solid #000; box-shadow: 0 0 2px #000 inset;}
.bdr-1-2 {border:1px solid #111; box-shadow: 0 0 2px #111 inset;}
.bdr-2-2 {border:1px solid #222; box-shadow: 0 0 2px #222 inset;}
.bdr-3-2 {border:1px solid #333; box-shadow: 0 0 2px #333 inset;}
.bdr-4-2 {border:1px solid #444; box-shadow: 0 0 2px #444 inset;}
.bdr-8-2 {border:1px solid #888; box-shadow: 0 0 2px #888 inset;}
.bdr-a-2 {border:1px solid #aaa; box-shadow: 0 0 2px #aaa inset;}
.bdr-b-2 {border:1px solid #bbb; box-shadow: 0 0 2px #bbb inset;}
.bdr-d-2 {border:1px solid #ddd; box-shadow: 0 0 2px #ddd inset;}
.bdr-f-2 {border:1px solid #fff; box-shadow: 0 0 2px #fff inset;}

/*** border-radius ***/
.br2 {border-radius:2px;}
.br3 {border-radius:3px;}
.br4 {border-radius:4px;}
.br5 {border-radius:5px;}
.br6 {border-radius:6px;}
.br8 {border-radius:8px;}
.br10 {border-radius:10px;}
.br12 {border-radius:12px;}
.br16 {border-radius:16px;}


/*** margin  ***/
.mg36 {margin:3px 6px;}
.mg48 {margin:4px 8px;} /*default*/
.mg510 {margin:5px 10px;}
.mg612 {margin:6px 12px;}
.mg816 {margin:8px 16px;}
.mg1020 {margin:10px 20px;}
.mg0 {margin:0px;}
.mg2 {margin:2px;}
.mg4 {margin:4px;}
.mg5 {margin:5px;}
.mg6 {margin:6px;}
.mg8 {margin:8px;}
.mg10 {margin:10px;}
.mg12 {margin:12px;}
.mg16 {margin:16px;}
.mg20 {margin:20px;}

/*** padding  ***/
.pd36 {padding:3px 6px;}
.pd48 {padding:4px 8px;} /*default*/
.pd510 {padding:5px 10px;}
.pd612 {padding:6px 12px;}
.pd816 {padding:8px 16px;}
.pd1020 {padding:10px 20px;}
.pd0 {padding:0px;}
.pd2 {padding:2px;}
.pd4 {padding:4px;}
.pd5 {padding:5px;}
.pd6 {padding:6px;}
.pd8 {padding:8px;}
.pd10 {padding:10px;}
.pd12 {padding:12px;}
.pd16 {padding:16px;}
.pd20 {padding:20px;}


/*** box-sizing ***/
.sizing {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


/*** box-shadow ***/
.boxshadow1 { box-shadow: 0 3px 5px rgba(20, 20, 20, 0.3);}
.boxshadow2 { box-shadow: 0 3px 5px rgba(20, 20, 20, 0.8);}
.boxshadow3 { box-shadow: 2px 3px 6px 2px rgba(20, 20, 20, 0.6);}


/*** flex box width ***/
.w100p, .w100p-pc{ width:100%; }
.w90p, .w90p-pc { width:90%; }
.w80p, .w80p-pc { width:80%; }
.w75p, .w75p-pc { width:75%; }
.w70p, .w70p-pc { width:70%; }
.w60p, .w60p-pc  { width:60%; }
.w55p, .w55p-pc  { width:55%; }
.w50p, .w50p-pc { width:50%; }
.w45p, .w45p-pc  { width:45%; }
.w40p, .w40p-pc  { width:40%; }
.w33p, .w33p-pc  { width:33%; }
.w30p, .w30p-pc  { width:30%; }

/* percentage */


/*** overfllow ***/
.ofh { overflow:hidden; }


/* Tablet Portrait size to Base 996px */
@media only screen and (min-width: 768px) and (max-width: 995px) {
	
	
}

/* All Mobile Sizes */
@media only screen and (max-width: 767px) {

	.w100p-pc, .w90p-pc, .w80p-pc, .w75p-pc, .w70p-pc, .w60p-pc, .w55p-pc,
	.w50p-pc, .w45p-pc, .w40p-pc, .w33p-pc, .w30p-pc { width:100%; }
	
}

/* Mobile Landscape Size to Tablet Portrait */
@media only screen and (min-width: 480px) and (max-width: 767px) {


}

/* Mobile Portrait Size to Mobile Landscape Size */
@media only screen and (max-width: 479px) {
	
	body {
		background-size: contain;
	}

	.mg36 {margin:3px 1px;}
	.mg48 {margin:4px 1px;} 
	.mg510 {margin:5px 1px;}
	.mg612 {margin:6px 2px;}
	.mg816 {margin:8px 2px;}
	.mg1020 {margin:10px 8px;}
	.mg4 {margin:4px 1px;}
	.mg5 {margin:5px 1px;}
	.mg6 {margin:6px 2px;}
	.mg8 {margin:8px 2px;}
	.mg10 {margin:10px 3px;}
	.mg12 {margin:12px 3px;}
	.mg16 {margin:16px 4px;}
	.mg20 {margin:20px 5px;}

	.w100p, .w90p, .w80p, .w75p, .w70p, .w60p, .w55p,
	.w50p, .w45p, .w40p, .w33p, .w30p { width:100%; }

	/*+*/
	.smp-tac {
		text-align: center;
	}

	.container section p, .container section br,  
	.container section ul, .container section ol,
	.container article p, .container article br,  
	.container article ul, .container article ol {
		clear: both;
	}

	.container section img.fr, .container section img.fl,
	.container article img.fr, .container article img.fl {
		float: none;
	}

}



