@charset "UTF-8";

/*
  line & unit
-----------------------------------------------------*/
.line:after {
  content: "";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.line {
 *zoom:1; clear: both; }

.unit {float: left;}

.lastunit {
  margin-right: 0px !important;
  float: right;
}

*html .lastunit { margin-left: -5px !important; } /* ie6 */

/*
  body settings
-----------------------------------------------------*/
html,
body {
  width: 100%;
  height: 100%;
}

body {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

/*
## Font
14px相当の場合[font-size: 1.4rem]と指定。ただしrem未対応ブラウザ用に左記指定の前に[font-size: 14px;]も併せて指定する。
Chromeにて初期サイズが反映されない場合があるため、bodyのみem指定。

----------------------------------------------*/
html body,
input,
select,
textarea { font-family: Verdana, Roboto, "Droid Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif; }

* html body { vertical-align: baseline; }

table { word-break: break-all; }

/*
## text
```
<p class="alignL">テキスト左寄せ</p>

```
```
<p class="alignR">テキスト右寄せ</p>

```
```
<p class="alignC">テキスト中央寄せ</p>

```
```
<p class="bold">テキストウェイトボールド</p>

```
```
<p class="normal">テキストウェイトノーマル</p>

```
----------------------------------------------*/
/* `alignL = text-align:left`*/
/* `alignR = text-align:right`*/
/* `alignC = text-align:center`*/


body { color: #535353; }

.alignL { text-align: left!important; }

.alignR { text-align: right!important; }

.alignC { text-align: center!important; }

.bold { font-weight: bold!important; }

.normal { font-weight: normal!important; }

.f_xxs {
  font-size: 10px;
  font-size: 1.0rem;
}

.f_xs {
  font-size: 11px;
  font-size: 1.1rem;
}

.f_ss {
  font-size: 12px;
  font-size: 1.2rem;
}

.f_s {
  font-size: 13px;
  font-size: 1.3rem;
}

.f_m {
  font-size: 1.4px;
  font-size: 1.4rem;
}

.fl_130 { line-height: 130%!important; }

.fl_160 { line-height: 160%!important; }

.fl_180 { line-height: 180%!important; }

.fl_200 { line-height: 200%!important; }

/*
## link
```
<a href="#">テキストリンク</a>

```
----------------------------------------------*/
a:link,
a:visited {
  text-decoration: none;
}

a:hover { text-decoration: underline; }

/*
  colmun
----------------------------------------------*/
.col_001 { }

.col_002 { }

.col_003 { }

/*
  margin
----------------------------------------------*/

/* margin-RIGHT */
.mr_5 { margin-right: 5px!important; }

.mr_10 { margin-right: 10px!important; }

.mr_15 { margin-right: 15px!important; }

.mr_20 { margin-right: 20px!important; }

.mr_30 { margin-right: 30px!important; }

.mr_40 { margin-right: 40px!important; }

.mr_50 { margin-right: 50px!important; }

.mr_60 { margin-right: 60px!important; }

.mr_70 { margin-right: 70px!important; }

.mr_80 { margin-right: 80px!important; }

/* margin-BOTTOM */
.mb_5 { margin-bottom: 5px!important; }

.mb_10 { margin-bottom: 10px!important; }

.mb_15 { margin-bottom: 15px!important; }

.mb_20 { margin-bottom: 20px!important; }

.mb_30 { margin-bottom: 30px!important; }

.mb_40 { margin-bottom: 40px!important; }

.mb_50 { margin-bottom: 50px!important; }

.mb_60 { margin-bottom: 60px!important; }

.mb_70 { margin-bottom: 70px!important; }

.mb_80 { margin-bottom: 80px!important; }

/* margin-LEFT */
.ml_5 { margin-left: 5px!important; }

.ml_10 { margin-left: 10px!important; }

.ml_15 { margin-left: 15px!important; }

.ml_20 { margin-left: 20px!important; }

.ml_30 { margin-left: 30px!important; }

.ml_40 { margin-left: 40px!important; }

.ml_50 { margin-left: 50px!important; }

.ml_60 { margin-left: 60px!important; }

.ml_70 { margin-left: 70px!important; }

.ml_80 { margin-left: 80px!important; }

.ml_200 { margin-left: 200px!important; }

/* margin-TOP */
.mt_1 { margin-top: 1px!important; }

.mt_5 { margin-top: 5px!important; }

.mt_10 { margin-top: 10px!important; }

.mt_15 { margin-top: 15px!important; }

.mt_20 { margin-top: 20px!important; }

.mt_30 { margin-top: 30px!important; }

.mt_40 { margin-top: 40px!important; }

.mt_50 { margin-top: 50px!important; }

.mt_60 { margin-top: 60px!important; }

.mt_70 { margin-top: 70px!important; }

.mt_80 { margin-top: 80px!important; }

/*
　width
----------------------------------------------*/
.w_auto { width: auto!important; }

.w_10per { width: 10%!important; }

.w_20per { width: 20%!important; }

.w_30per { width: 30%!important; }

.w_40per { width: 40%!important; }

.w_50per { width: 50%!important; }

.w_60per { width: 60%!important; }

.w_70per { width: 70%!important; }

.w_80per { width: 80%!important; }

.w_90per { width: 90%!important; }

.w_100per { width: 100%!important; }

.w_10 { width: 10px!important; }

.w_20 { width: 20px!important; }

.w_30 { width: 30px!important; }

.w_40 { width: 40px!important; }

.w_50 { width: 50px!important; }

.w_60 { width: 60px!important; }

.w_70 { width: 70px!important; }

.w_80 { width: 80px!important; }

.w_90 { width: 90px!important; }

.w_100 { width: 100px!important; }

.w_110 { width: 110px!important; }

.w_120 { width: 120px!important; }

.w_130 { width: 130px!important; }

.w_140 { width: 140px!important; }

.w_150 { width: 150px!important; }

.w_160 { width: 160px!important; }

.w_170 { width: 170px!important; }

.w_180 { width: 180px!important; }

.w_190 { width: 190px!important; }

.w_200 { width: 200px!important; }

.w_210 { width: 210px!important; }

.w_220 { width: 220px!important; }

.w_230 { width: 230px!important; }

.w_240 { width: 240px!important; }

.w_250 { width: 250px!important; }

.w_260 { width: 260px!important; }

.w_270 { width: 270px!important; }

.w_280 { width: 280px!important; }

.w_290 { width: 290px!important; }

.w_300 { width: 300px!important; }

.w_340 { width: 340px!important; }

.w_360 { width: 360px!important; }

.w_370 { width: 370px!important; }

.w_400 { width: 400px!important; }

.w_440 { width: 440px!important; }

.w_500 { width: 500px!important; }

.w_540 { width: 540px!important; }

.w_600 { width: 600px!important; }

.w_700 { width: 700px!important; }

.w_750 { width: 750px!important; }

.w_800 { width: 800px!important; }

/* ****************** [  default html  ] ****************** */
.list_horizon li {
  display: inline-block;
 *display: inline;
 *zoom:1;
  vertical-align: top;
  margin-right: 10px;
}

.list_001 li { list-style: inside; }

.list_001 li + li { margin-top: 10px; }

.list_col1 li { width: 87%; }

.list_col2 li { width: 44%; }

.list_col3 li { width: 28%; }

.list_col4 li { width: 20%; }

.list_col5 li { width: 15%; }



/* ****************** [  form  ] ****************** */