@charset "UTF-8";

/* margin (1em is 14px on body) */

.mt00 { margin-top:0; }
.mt05 { margin-top:0.5em; }
.mt10 { margin-top:1em; }
.mt15 { margin-top:1.5em; }
.mt20 { margin-top:2em; }
.mt25 { margin-top:2.5em; }
.mt30 { margin-top:3em; }
.mt35 { margin-top:3.5em; }
.mt40 { margin-top:4em; }

.mb00 { margin-bottom:0; }
.mb05 { margin-bottom:0.5em; }
.mb10 { margin-bottom:1em; }
.mb15 { margin-bottom:1.5em; }
.mb20 { margin-bottom:2em; }
.mb25 { margin-bottom:2.5em; }
.mb30 { margin-bottom:3em; }
.mb35 { margin-bottom:3.5em; }
.mb40 { margin-bottom:4em; }

.ml00 { margin-left:0; }
.ml05 { margin-left:0.5em; }
.ml10 { margin-left:1em; }
.ml15 { margin-left:1.5em; }
.ml20 { margin-left:2em; }
.ml25 { margin-left:2.5em; }
.ml30 { margin-left:3em; }

.mr00 { margin-right:0; }
.mr05 { margin-right:0.5em; }
.mr10 { margin-right:1em; }
.mr15 { margin-right:1.5em; }
.mr20 { margin-right:2em; }
.mr25 { margin-right:2.5em; }
.mr30 { margin-right:3em; }

.ma { margin-left:auto; margin-right:auto; }

/* font size regular */

.fs01 { font-size:50%; }
.fs02 { font-size:66.66%; }
.fs03 { font-size:77.77%; }
.fs04 { font-size:100%; }
.fs05 { font-size:128.5%; }
.fs06 { font-size:150%; }
.fs07 { font-size:200%; }
.fs08 { font-size:228%; }
.fs09 { font-size:250%; }
.fs10 { font-size:285%; }
.fs11 { font-size:300%; }
.fs12 { font-size:320%; }

/* font size xs ( sp view ) */
@media screen and (max-width:480px) {
	
	.fs01 { font-size:50%; }
	.fs02 { font-size:66.66%; }
	.fs03 { font-size:66.66%; }
	.fs04 { font-size:77.77%; }
	.fs05 { font-size:100%; }
	.fs06 { font-size:128%; }
	.fs07 { font-size:150%; }
	.fs08 { font-size:200%; }
	.fs09 { font-size:200%; }
	.fs10 { font-size:200%; }
	.fs11 { font-size:200%; }
	.fs12 { font-size:200%; }
}

/* font size small ( tablet view ) */
@media screen and (min-width:481px) and (max-width:767px) {

	.fs01 { font-size:50%; }
	.fs02 { font-size:66.66%; }
	.fs03 { font-size:77.77%; }
	.fs04 { font-size:100%; }
	.fs05 { font-size:125%; }
	.fs06 { font-size:150%; }
	.fs07 { font-size:175%; }
	.fs08 { font-size:200%; }
	.fs09 { font-size:200%; }
	.fs10 { font-size:200%; }
	.fs11 { font-size:200%; }
	.fs12 { font-size:200%; }
}

/* font color */

.fc_gray   { color: #9d9d9d; }
.fc_red    { color: #f00000; }
.fc_pink   { color: #f5596c; }
.fc_blue   { color: #0c7dc1; }
.fc_orange { color: #FF660B; }
.fc_green  { color: #44AD03; }

/* font weight */

fw_l { font-weight: lighter; }
fw_b { font-weight: bold; }

/* text-decoration */

.td_u { text-decoration:underline; }

/* custom align */

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

.vat { vertical-align:top !important; }
.vam { vertical-align:middle !important; }
.vab { vertical-align:bottom !important; }

/* custom width relative */

.w24 { width: 100%; }
.w23 { width: 95.83333333%; }
.w22 { width: 91.66666667%; }
.w21 { width: 87.5%; }
.w20 { width: 83.33333333%; }
.w19 { width: 79.16666667%; }
.w18 { width: 75%; }
.w17 { width: 70.83333333%; }
.w16 { width: 66.66666667%; }
.w15 { width: 62.5%; }
.w14 { width: 58.33333333%; }
.w13 { width: 54.16666667%; }
.w12 { width: 50%; }
.w11 { width: 45.83333333%; }
.w10 { width: 41.66666667%; }
.w09 { width: 37.5%; }
.w08 { width: 33.33333333%; }
.w07 { width: 29.16666667%; }
.w06 { width: 25%; }
.w05 { width: 20.83333333%; }
.w04 { width: 16.66666667%; }
.w03 { width: 12.5%; }
.w02 { width: 8.33333333%; }
.w01 { width: 4.16666667%; }

/* custom width relative void */
/* xs ( sp view ) */
@media screen and (max-width:480px) {
	
	.not_xs.w24, .not_xs.w23, .not_xs.w22, .not_xs.w21, .not_xs.w20, .not_xs.w19, .not_xs.w18, .not_xs.w17,
	.not_xs.w16, .not_xs.w15, .not_xs.w14, .not_xs.w13, .not_xs.w12, .not_xs.w11, .not_xs.w10, .not_xs.w09,
	.not_xs.w08, .not_xs.w07, .not_xs.w06, .not_xs.w05, .not_xs.w04, .not_xs.w03, .not_xs.w02, .not_xs.w01 { width: 100%; }
}
/* small ( tablet view ) */
@media screen and (max-width:767px) {
	
	.not_sm.w24, .not_sm.w23, .not_sm.w22, .not_sm.w21, .not_sm.w20, .not_sm.w19, .not_sm.w18, .not_sm.w17,
	.not_sm.w16, .not_sm.w15, .not_sm.w14, .not_sm.w13, .not_sm.w12, .not_sm.w11, .not_sm.w10, .not_sm.w09,
	.not_sm.w08, .not_sm.w07, .not_sm.w06, .not_sm.w05, .not_sm.w04, .not_sm.w03, .not_sm.w02, .not_sm.w01 { width: 100%; }
}
/* middle ( out of pc view ) */
@media screen and (max-width:991px) {
	
	.not_md.w24, .not_md.w23, .not_md.w22, .not_md.w21, .not_md.w20, .not_md.w19, .not_md.w18, .not_md.w17,
	.not_md.w16, .not_md.w15, .not_md.w14, .not_md.w13, .not_md.w12, .not_md.w11, .not_md.w10, .not_md.w09,
	.not_md.w08, .not_md.w07, .not_md.w06, .not_md.w05, .not_md.w04, .not_md.w03, .not_md.w02, .not_md.w01 { width: 100%; }
}

/* custom width absolute by font size */

.w01em { width: 1em; }
.w02em { width: 2em; }
.w03em { width: 3em; }
.w04em { width: 4em; }
.w05em { width: 5em; }
.w06em { width: 6em; }
.w07em { width: 7em; }
.w08em { width: 8em; }
.w09em { width: 9em; }
.w10em { width: 10em; }
.w11em { width: 11em; }
.w12em { width: 12em; }


/* custom width absolute */

.w50  { width: 50px; }
.w100 { width: 100px; }
.w150 { width: 150px; }
.w200 { width: 200px; }
.w250 { width: 250px; }
.w300 { width: 300px; }
.w350 { width: 350px; }
.w400 { width: 400px; }
.w450 { width: 450px; }
.w500 { width: 500px; }


/* custom height relative */

.h_max { height: 100%; }


/* custom height absolute */

.h50  { height: 50px; }
.h100 { height: 100px; }
.h150 { height: 150px; }
.h200 { height: 200px; }
.h250 { height: 250px; }
.h300 { height: 300px; }
.h350 { height: 350px; }
.h400 { height: 400px; }
.h450 { height: 450px; }
.h500 { height: 500px; }


/* custom display */

.d_ib { display:inline-block; }
.d_tb { display:table; }
.d_td { display:table-cell; }
.d_bk { display:block; }


/* display none */

.hide_xs { display:none; }

@media screen and (min-width: 768px)  {
	.hide_xs { display:block; }
	.hide_s  { display:none; }
}
@media screen and (min-width: 992px)  {
	.hide_s  { display:block; }
	.hide_m  { display:none; }
}
@media screen and (min-width: 1200px) {
	.hide_m  { display:block; }
	.hide_l  { display:none; }
}


/* display block */

.block_only_s,
.block_only_xs {}

@media screen and (max-width:767px) {
	.block_only_s,
	.block_only_xs { display:block; }
}

@media screen and (max-width:767px) {
	.pc { display:none; }
}
@media screen and (min-width:768px) {
	.sp { display:none; }
}

/* float */

.fl{ float:left; }
.fr{ float:right; }

.pull-right {float: right}
.pull-left {float: left}


/* clearfix */
.cf:before,
.cf:after { content: " "; display: table; }
.cf:after { clear: both; }
.cf { *zoom: 1; }