/* ----- ClearFix ----- */
.clearfix:after {content: "."; display: block; height: 0; line-height: 0; clear: both; visibility: hidden;}
.clearfix { display: inline-block; }
*+html .clearfix { height: 1%; }
* html .clearfix { height: 1%; }
.clearfix {display: block;}

/* ----- FontSize ----- */
.font10 {font-size: 10px}
.font11 {font-size: 11px}
.font12 {font-size: 12px}
.font13 {font-size: 13px}
.font14 {font-size: 14px}
.font15 {font-size: 15px}
.font16 {font-size: 16px}
.font17 {font-size: 17px}
.font18 {font-size: 18px}
.font20 {font-size: 20px}
.font22 {font-size: 22px}
.font24 {font-size: 24px}
.font28 {font-size: 28px}
.font36 {font-size: 36px}
.font40 {font-size: 40px}
.font50 {font-size: 50px}
.font60 {font-size: 60px}
.font80 {font-size: 80px}
.font100 {font-size: 100px}

/* ----- FontWeight ----- */
.bold {font-weight: bold}
.normal {font-weight: normal}

/* ----- FontColor ----- */
.font-red {color: #e57c72}
.font-red2 {color: #ff0000}
.font-pink {color: #d16775}
.font-orange {color: #ffc114}
.font-purple {color: #99608c}
.font-blue {color: #3396b5}
.font-blue2 {color: #b5cedb}
.font-sky {color: #b0e0e1}
.font-tya {color: #706651}
.font-green {color: #339999}
.font-mosgreen {color: #00a84c}
.font-green2 {color: #009966}
.font-green3 {color: #b5dbc1}
.font-yellow {color: #ffcc33}
.font-gray {color: #999}
.font-gray2 {color: #bbb}
.font-gray3 {color: #ddd}
.font-gray6 {color: #666}
.font-black {color: #444}
.font-white {color: #fff}
.font-gold {color: #bd9e13}

/* ----- HorizontalAlign ----- */
.h_center {text-align: center; margin-left: auto; margin-right: auto;}
.h_left {text-align: left;}
.h_right {text-align: right;}

/* ----- VerticalAlign ----- */
.v_top {vertical-align: top}
.v_middle {vertical-align: middle}
.v_bottom {vertical-align: bottom}

/* ----- Float ----- */
.fl_l {float: left}
.fl_r {float: right}
.fl_clear {clear: both}

/* ----- Width ----- */
.w5 {width: 5%}
.w10 {width: 10%}
.w15 {width: 15%}
.w20 {width: 20%}
.w25 {width: 25%}
.w30 {width: 30%}
.w35 {width: 35%}
.w40 {width: 40%}
.w45 {width: 45%}
.w50 {width: 50%}
.w55 {width: 55%}
.w60 {width: 60%}
.w70 {width: 70%}
.w75 {width: 75%}
.w80 {width: 80%}
.w85 {width: 85%}
.w90 {width: 90%}
.w95 {width: 95%}
.w100 {width: 100%}

/* ----- Margin ----- */
.mg-5 {margin: 5px}
.mg-10 {margin: 10px}
.mg-15 {margin: 15px}
.mg-20 {margin: 20px}
.mg-30 {margin: 30px}

.mt-5 {margin-top: 5px}
.mt-10 {margin-top: 10px}
.mt-15 {margin-top: 15px}
.mt-20 {margin-top: 20px}
.mt-30 {margin-top: 30px}
.mt-40 {margin-top: 40px}
.mt-50 {margin-top: 50px}
.mt--10 {margin-top: -10px}
.mt--15 {margin-top: -15px}
.mt--30 {margin-top: -30px}

.mb-5 {margin-bottom: 5px}
.mb-10 {margin-bottom: 10px}
.mb-15 {margin-bottom: 15px}
.mb-20 {margin-bottom: 20px}
.mb-30 {margin-bottom: 30px}
.mb-40 {margin-bottom: 40px}
.mb-50 {margin-bottom: 50px}
.mb-60 {margin-bottom: 60px}
.mb-70 {margin-bottom: 70px}

.ml-10 {margin-left: 10px}
.ml-15 {margin-left: 15px}
.ml-20 {margin-left: 20px}
.ml-50 {margin-left: 50px}
.ml-60 {margin-left: 60px}

/* ----- Padding ----- */
.pd-5 {padding: 5px}
.pd-10 {padding: 10px}
.pd-15 {padding: 15px}
.pd-20 {padding: 20px}
.pd-30 {padding: 30px}
.pd-40 {padding: 40px}
.pd-50 {padding: 50px}

.pt-5 {padding-top: 5px}
.pt-10 {padding-top: 10px}
.pt-15 {padding-top: 15px}
.pt-20 {padding-top: 20px}
.pt-30 {padding-top: 30px}
.pt-40 {padding-top: 40px}
.pt-50 {padding-top: 50px}

.pb-5 {padding-bottom: 5px}
.pb-10 {padding-bottom: 10px}
.pb-15 {padding-bottom: 15px}
.pb-20 {padding-bottom: 20px}
.pb-30 {padding-bottom: 30px}
.pb-40 {padding-bottom: 40px}
.pb-50 {padding-bottom: 50px}
.pb-60 {padding-bottom: 60px}
.pb-70 {padding-bottom: 70px}

.pl-30 {padding-left: 30px}

.bt-thin {border-top-style: solid; border-top-width: thin;}
.bb-thin {border-bottom-style: solid; border-bottom-width: thin;}
.br-thin {border-right-style: solid; border-right-width: thin;}
.bg-white {background-color: #fff;}
.bg-black {background-color: #000;}
.bg-light-yellow {background-color: #ffffe0;}
.bg-radius-20 {border-radius: 20px;}

.lh-10 {line-height: 1.0}
.lh-15 {line-height: 1.5}
.lh-20 {line-height: 2.0}

.shadow {
	text-shadow: 2px 2px 2px #6E6E6E, 3px 3px 3px #E6E6E6;
}

a:hover {text-decoration:none;}

.pc-mode {
	display: block;
}

.sp-mode {
	display: none;
}