@charset "utf-8";

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
* ボックス関連
* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* @ フロート操作
----------------------------------------------------------------------------- */
.clearfix:before,
.clearfix:after{
  content: " ";
  display: table;
}
.clearfix:after{
  clear: both;
}
.clearfix {
  *zoom: 1;
}
.clear { clear: both; }
.floatL { float: left; }
.floatR { float: right; }

.alignleft { float: left; }
.alignright { float: right; }
.aligncenter {
  display: block;
  margin: auto;
}

/* @ 文字揃え
----------------------------------------------------------------------------- */

.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }

/* @ マージン指定
----------------------------------------------------------------------------- */
.mgn_none { margin: 0 !important; }
.mgnT_none { margin-top: 0 !important; }
.mgnR_none { margin-right: 0 !important; }
.mgnB_none { margin-bottom: 0 !important; }
.mgnL_none { margin-left: 0 !important; }
.mgnT_S { margin-top: 1em !important; }
.mgnR_S { margin-right: 1em !important; }
.mgnB_S { margin-bottom: 1em !important; }
.mgnL_S { margin-left: 1em !important; }
.mgnT_M { margin-top: 2em !important; }
.mgnR_M { margin-right: 2em !important; }
.mgnB_M { margin-bottom: 2em !important; }
.mgnL_M { margin-left: 2em !important; }
.mgnT_L { margin-top: 3em !important; }
.mgnR_L { margin-right: 3em !important; }
.mgnB_L { margin-bottom: 3em !important; }
.mgnL_L { margin-left: 3em !important; }

/* @ パディング指定
----------------------------------------------------------------------------- */
.pad_none { padding: 0 !important; }
.padT_none { padding-top: 0 !important; }
.padR_none { padding-right: 0 !important; }
.padB_none { padding-bottom: 0 !important; }
.padL_none { padding-left: 0 !important; }
.padT_S { padding-top: 1em !important; }
.padR_S { padding-right: 1em !important; }
.padB_S { padding-bottom: 1em !important; }
.padL_S { padding-left: 1em !important; }
.padT_M { padding-top: 2em !important; }
.padR_M { padding-right: 2em !important; }
.padB_M { padding-bottom: 2em !important; }
.padL_M { padding-left: 2em !important; }
.padT_L { padding-top: 3em !important; }
.padR_L { padding-right: 3em !important; }
.padB_L { padding-bottom: 3em !important; }
.padL_L { padding-left: 3em !important; }

/* @ 画像の回り込み（float）対応
----------------------------------------------------------------------------- */
img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
img.floatR,
img.alignright {
  margin: 0 0 2em 2em;
  display: inline;
}
img.floatL,
img.alignleft {
  margin: 0 2em 2em 0;
  display: inline;
}
@media only screen and (max-width: 640px) {
  img.floatR,
  img.alignright {
    float: none;
    display: block;
    margin: 0 auto 1em !important;
  }
  img.floatL,
  img.alignleft {
    float: none;
    display: block;
    margin: 0 auto 1em !important;
  }
  .alignright {
    float: none;
  }
  .alignleft {
    float: none;
  }
}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
* テキスト関連
* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* @ 文字装飾除去
----------------------------------------------------------------------------- */
.cleanfont {
  font-weight: normal;
  font-style: normal;
}

/* @ 明朝体指定
----------------------------------------------------------------------------- */
.serif {
  font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho Pro", "MS PMincho", serif;
}

/* @ 改行禁止
----------------------------------------------------------------------------- */
.nowrap { white-space: nowrap !important; }

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
* リスト関連
* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* @ リストなし
----------------------------------------------------------------------------- */
.list_none li {
  list-style: none outside !important;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
* テーブル関連
* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* @ 枠なし
----------------------------------------------------------------------------- */
table.table_none,
table.table_none th,
table.table_none td {
  border: none !important;
  background-color: transparent !important;
  padding: 0 !important;
}

/* @ 標準
----------------------------------------------------------------------------- */
table.table_default {
  background-color: #ccc;
  border-spacing: 1px;
  border-collapse: separate;
  border: none;
  width: 100%;
  max-width: 100%;
}
@media screen and (max-width: 480px) {
  table.table_default,
  table.table_default tbody,
  table.table_default tr {
    display: block;
    background: #fff;
  }
}
table.table_default th,
table.table_default td {
  border: 1px solid #fff;
  padding: 10px;
  text-align: left;
}
@media screen and (max-width: 480px) {
  table.table_default th,
  table.table_default td {
    display: block;
  }
}
table.table_default th {
  background-color: #f6f6f6;
  white-space: nowrap;
}
table.table_default td {
  background-color: #fff;
}

/* @ 交差
----------------------------------------------------------------------------- */
table.table_stripe {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
}
@media screen and (max-width: 480px) {
  table.table_stripe,
  table.table_stripe tbody,
  table.table_stripe tr {
    display: block;
    background: #fff;
  }
}
table.table_stripe thead th {
  background: #ddd !important;
}
table.table_stripe th,
table.table_stripe td {
  border: 1px solid #ccc;
  padding: 10px;
  text-align: left;
}
@media screen and (max-width: 480px) {
  table.table_stripe th,
  table.table_stripe td {
    display: block;
    border: none;
  }
  table.table_stripe th {
    background: #eee !important;
  }
  table.table_stripe td {
    background: #fff !important;
  }
}
table.table_stripe th {
  font-weight: bold;
  white-space: nowrap;
}
table.table_stripe tr:nth-of-type(even) th,
table.table_stripe tr:nth-of-type(even) td {
  background: #fff;
}
table.table_stripe tr:nth-of-type(odd) th,
table.table_stripe tr:nth-of-type(odd) td {
  background: #eee;
}

/* @ 横型
----------------------------------------------------------------------------- */
table.table_horizon {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
}
@media screen and (max-width: 640px) {
  table.table_horizon {
    display: block;
    position: relative;
  }
  table.table_horizon:before {
    content: '※ この表は横方向にスクロール可能です。';
    display: block;
    margin-bottom: 0.5em;
    color: #999;
  }
  table.table_horizon thead {
    display: block;
    float: left;
  }
  table.table_horizon thead tr {
    display: block;
    border-bottom: 1px solid #ccc;
  }
  table.table_horizon tbody {
    display: block;
    position: relative;
    overflow-x: auto;
  }
  table.table_horizon tbody tr {
    /* display: table-cell; */
    margin: 0;
    border-bottom: 1px solid #ccc;
  }
}
table.table_horizon th {
  background-color: #eee;
}
@media screen and (max-width: 640px) {
  table.table_horizon thead th {
    border-left: 1px solid #ccc;
  }
}
table.table_horizon th,
table.table_horizon td {
  border: 1px solid #ccc;
  padding: 10px;
  text-align: left;
}
@media screen and (max-width: 640px) {
  table.table_horizon th,
  table.table_horizon td {
    /*
    display: block;
    border-left: 0;
    */
    border-bottom: 0;
    white-space: nowrap;
  }
}

/* @ 枠線
----------------------------------------------------------------------------- */
.border_thin {
  padding: 1em;
  border: solid 1px #ccc;
}
.border_normal {
  padding: 1em;
  border: solid 3px #ccc;
}
.border_thick {
  padding: 1em;
  border: solid 5px #ccc;
}
.border_thin.red,
.border_normal.red,
.border_thick.red {
  border-color: #f00;
}

/* @ リンクボタン
----------------------------------------------------------------------------- */
.linkbtn_S {
  display: inline-block;
  background-color: #999;
  padding: .5em 1em;
  border: none;
  border-radius: 5px;
  color: #fff;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-decoration: none;
}
.linkbtn_M {
  display: inline-block;
  box-sizing: border-box;
  padding: 10px 20px;
  background-color: #999;
  border: none;
  border-radius: 5px;
  color: #FFF;
  font-size: 1rem;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-decoration: none;
}
.linkbtn_L {
  display: inline-block;
  box-sizing: border-box;
  min-width: 215px;
  padding: 18px 2em;
  border: none;
  outline: none;
  background-color: #999;
  border-radius: 4px;
  color: #fff;
  font-size: 1.143rem;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-decoration: none;
}
.linkbtn_S:hover,
.linkbtn_M:hover,
.linkbtn_L:hover {
  -ms-filter: "alpha(opacity=60)";
  filter: alpha(opacity=60);
  opacity: 0.6;
  color: #fff;
  text-decoration: none;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
* サイズ
* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.width-1per { width: 1%; }
.width-2per { width: 2%; }
.width-3per { width: 3%; }
.width-4per { width: 4%; }
.width-5per { width: 5%; }
.width-6per { width: 6%; }
.width-7per { width: 7%; }
.width-8per { width: 8%; }
.width-9per { width: 9%; }
.width-10per { width: 10%; }
.width-11per { width: 11%; }
.width-12per { width: 12%; }
.width-13per { width: 13%; }
.width-14per { width: 14%; }
.width-15per { width: 15%; }
.width-16per { width: 16%; }
.width-17per { width: 17%; }
.width-18per { width: 18%; }
.width-19per { width: 19%; }
.width-20per { width: 20%; }
.width-21per { width: 21%; }
.width-22per { width: 22%; }
.width-23per { width: 23%; }
.width-24per { width: 24%; }
.width-25per { width: 25%; }
.width-26per { width: 26%; }
.width-27per { width: 27%; }
.width-28per { width: 28%; }
.width-29per { width: 29%; }
.width-30per { width: 30%; }
.width-31per { width: 31%; }
.width-32per { width: 32%; }
.width-33per { width: 33%; }
.width-34per { width: 34%; }
.width-35per { width: 35%; }
.width-36per { width: 36%; }
.width-37per { width: 37%; }
.width-38per { width: 38%; }
.width-39per { width: 39%; }
.width-40per { width: 40%; }
.width-41per { width: 41%; }
.width-42per { width: 42%; }
.width-43per { width: 43%; }
.width-44per { width: 44%; }
.width-45per { width: 45%; }
.width-46per { width: 46%; }
.width-47per { width: 47%; }
.width-48per { width: 48%; }
.width-49per { width: 49%; }
.width-50per { width: 50%; }
.width-51per { width: 51%; }
.width-52per { width: 52%; }
.width-53per { width: 53%; }
.width-54per { width: 54%; }
.width-55per { width: 55%; }
.width-56per { width: 56%; }
.width-57per { width: 57%; }
.width-58per { width: 58%; }
.width-59per { width: 59%; }
.width-60per { width: 60%; }
.width-61per { width: 61%; }
.width-62per { width: 62%; }
.width-63per { width: 63%; }
.width-64per { width: 64%; }
.width-65per { width: 65%; }
.width-66per { width: 66%; }
.width-67per { width: 67%; }
.width-68per { width: 68%; }
.width-69per { width: 69%; }
.width-70per { width: 70%; }
.width-71per { width: 71%; }
.width-72per { width: 72%; }
.width-73per { width: 73%; }
.width-74per { width: 74%; }
.width-75per { width: 75%; }
.width-76per { width: 76%; }
.width-77per { width: 77%; }
.width-78per { width: 78%; }
.width-79per { width: 79%; }
.width-80per { width: 80%; }
.width-81per { width: 81%; }
.width-82per { width: 82%; }
.width-83per { width: 83%; }
.width-84per { width: 84%; }
.width-85per { width: 85%; }
.width-86per { width: 86%; }
.width-87per { width: 87%; }
.width-88per { width: 88%; }
.width-89per { width: 89%; }
.width-90per { width: 90%; }
.width-91per { width: 91%; }
.width-92per { width: 92%; }
.width-93per { width: 93%; }
.width-94per { width: 94%; }
.width-95per { width: 95%; }
.width-96per { width: 96%; }
.width-97per { width: 97%; }
.width-98per { width: 98%; }
.width-99per { width: 99%; }
.width-100per { width: 100%; }

.width-5em {width: .5em;}
.width-10em {width: 1.0em;}
.width-15em {width: 1.5em;}
.width-20em {width: 2.0em;}
.width-25em {width: 2.5em;}
.width-30em {width: 3.0em;}
.width-35em {width: 3.5em;}
.width-40em {width: 4.0em;}
.width-45em {width: 4.5em;}
.width-50em {width: 5.0em;}
.width-55em {width: 5.5em;}
.width-60em {width: 6.0em;}
.width-65em {width: 6.5em;}
.width-70em {width: 7.0em;}
.width-75em {width: 7.5em;}
.width-80em {width: 8.0em;}
.width-85em {width: 8.5em;}
.width-90em {width: 9.0em;}
.width-95em {width: 9.5em;}
.width-100em {width: 10.0em;}
.width-105em {width: 10.5em;}
.width-110em {width: 11.0em;}
.width-115em {width: 11.5em;}
.width-120em {width: 12.0em;}
.width-125em {width: 12.5em;}
.width-130em {width: 13.0em;}
.width-135em {width: 13.5em;}
.width-140em {width: 14.0em;}
.width-145em {width: 14.5em;}
.width-150em {width: 15.0em;}
.width-155em {width: 15.5em;}
.width-160em {width: 16.0em;}
.width-165em {width: 16.5em;}
.width-170em {width: 17.0em;}
.width-175em {width: 17.5em;}
.width-180em {width: 18.0em;}
.width-185em {width: 18.5em;}
.width-190em {width: 19.0em;}
.width-195em {width: 19.5em;}
.width-200em {width: 20.0em;}
.width-205em {width: 20.5em;}
.width-210em {width: 21.0em;}
.width-215em {width: 21.5em;}
.width-220em {width: 22.0em;}
.width-225em {width: 22.5em;}
.width-230em {width: 23.0em;}
.width-235em {width: 23.5em;}
.width-240em {width: 24.0em;}
.width-245em {width: 24.5em;}
.width-250em {width: 25.0em;}
.width-255em {width: 25.5em;}
.width-260em {width: 26.0em;}
.width-265em {width: 26.5em;}
.width-270em {width: 27.0em;}
.width-275em {width: 27.5em;}
.width-280em {width: 28.0em;}
.width-285em {width: 28.5em;}
.width-290em {width: 29.0em;}
.width-295em {width: 29.5em;}
.width-300em {width: 30.0em;}

[class*="width-"] {
	max-width: 100%;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
* その他
* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.disp_none {
  display: none;
}

/* @ 透過処理
----------------------------------------------------------------------------- */
.alpha:hover,
.alpha img:hover{
  -ms-filter: "alpha(opacity=60)";
  filter: alpha(opacity=60);
  opacity: 0.6;
}