
@charset "UTF-8";
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

reset.css

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* --HTML-- */
html {
  background: #fff;
  color: #333;
  overflow-y: scroll; }

/* --BODY-- */
body {
  margin: 0;
  padding: 0; }

/* --OTHER TAGS-- */
a img, img {
  border: 0;
  vertical-align: bottom; }

blockquote, dd, div, dl, dt,
h1, h2, h3, h4, h5, h6,
li, ol, p, pre, span, td, th, ul, menu, nav {
  margin: 0;
  padding: 0; }

abbr, acronym {
  border: 0; }

address, caption, cite, code, dfn, em, th, var {
  font-style: normal;
  font-weight: normal; }

caption, th {
  text-align: left; }

code, kbd, pre, samp, tt {
  font-family: monospace;
  line-height: 100%; }

/* for IE7 */
* + html code, kbd, pre, samp, tt {
  font-size: 108%; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: bold; }

ol, ul, menu, nav {
  list-style: none; }

menu, nav {
  display: block; }

q:before, q:after {
  content: ''; }

header, footer {
  display: block; }

/* form */
button, fieldset, form, input, label, legend, select, textarea {
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  padding: 0;
  vertical-align: baseline; }

/*tables still need 'cellspacing="0"' 
table {
border-collapse:collapse;
border-spacing:0;
}*/
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

basic

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
body, th, td, input, textarea {
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  font-size: 16px;
  line-height: 1.6;
  color: #333333; }

* html input {
  padding: 2px; }

li img {
  vertical-align: bottom; }

/* new clearfix */
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0; }

* html .clearfix {
  zoom: 1; }

/* IE6 */
*:first-child + html .clearfix {
  zoom: 1; }

/* IE7 */
.clear {
  clear: both; }

.nh {
  font-size: 0px;
  line-height: 0px;
  height: 0px;
  width: 0px;
  visibility: hidden; }

.n {
  text-decoration: none;
  text-indent: -9999px;
  display: block;
  font-size: 0; }

.nv {
  visibility: hidden; }

a.alpha:hover img {
  opacity: 0.70;
  filter: alpha(opacity=70); }

.alpha a:hover img {
  opacity: 0.70;
  filter: alpha(opacity=70); }

/* ----------------------------------------------
ブロックレベル要素の高さを揃えるheightLine.js
<script type="text/javascript" src="/common/js/heightLine.js"></script>
---------------------------------------------- */
/* ----------------------------------------------
背景の1pxずれ
---------------------------------------------- */
/* IE7でpadding指定 */
*:first-child + html div#container {
  padding-left: 1px; }

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

style

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* display */
@media print, screen and (min-width: 769px) {
  .pc {
    display: block !important; } }
@media only screen and (max-width: 768px) {
  .pc {
    display: none !important; } }

@media print, screen and (min-width: 769px) {
  .sp {
    display: none !important; } }
@media only screen and (max-width: 768px) {
  .sp {
    display: block !important; } }

/* font-size */
.f10 {
  font-size: 10px !important; }

.f12 {
  font-size: 12px !important; }

.f14 {
  font-size: 14px !important; }

.f16 {
  font-size: 16px !important; }

.f18 {
  font-size: 18px !important; }

.f10p {
  font-size: 83.3% !important; }

.f12p {
  font-size: 100% !important; }

.f14p {
  font-size: 116.7% !important; }

.f16p {
  font-size: 133.3% !important; }

.f18p {
  font-size: 150% !important; }

/* font-weight */
.ftWB {
  font-weight: bold; }

.ftNM {
  font-weight: normal; }

/* margin-top */
.mt00 {
  margin-top: 0px !important; }

.mt05 {
  margin-top: 5px !important; }

.mt08 {
  margin-top: 8px !important; }

.mt10 {
  margin-top: 10px !important; }

.mt15 {
  margin-top: 15px !important; }

.mt20 {
  margin-top: 20px !important; }

.mt25 {
  margin-top: 25px !important; }

.mt30 {
  margin-top: 30px !important; }

.mt40 {
  margin-top: 40px !important; }

.mt50 {
  margin-top: 50px !important; }

/* padding-top */
.pt00 {
  padding-top: 0px !important; }

.pt05 {
  padding-top: 5px !important; }

.pt10 {
  padding-top: 10px !important; }

.pt15 {
  padding-top: 15px !important; }

.pt20 {
  padding-top: 20px !important; }

.pt25 {
  padding-top: 25px !important; }

.pt30 {
  padding-top: 30px !important; }

.pt35 {
  padding-top: 35px !important; }

.pt40 {
  padding-top: 40px !important; }

.pt45 {
  padding-top: 45px !important; }

.pt50 {
  padding-top: 50px !important; }

/* margin-right */
.mr00 {
  margin-right: 0px !important; }

.mr05 {
  margin-right: 5px !important; }

.mr10 {
  margin-right: 10px !important; }

.mr11 {
  margin-right: 11px !important; }

.mr15 {
  margin-right: 15px !important; }

.mr20 {
  margin-right: 20px !important; }

.mr25 {
  margin-right: 25px !important; }

.mr30 {
  margin-right: 30px !important; }

/* padding-right */
.pr00 {
  padding-right: 0px !important; }

.pr05 {
  padding-right: 5px !important; }

.pr10 {
  padding-right: 10px !important; }

.pr15 {
  padding-right: 15px !important; }

.pr20 {
  padding-right: 20px !important; }

.pr25 {
  padding-right: 25px !important; }

.pr30 {
  padding-right: 30px !important; }

/* margin-bottom */
.mb00 {
  margin-bottom: 0px !important; }

.mb05 {
  margin-bottom: 5px !important; }

.mb08 {
  margin-bottom: 5px !important; }

.mb10 {
  margin-bottom: 10px !important; }

.mb15 {
  margin-bottom: 15px !important; }

.mb20 {
  margin-bottom: 20px !important; }

.mb25 {
  margin-bottom: 25px !important; }

.mb30 {
  margin-bottom: 30px !important; }

.mb40 {
  margin-bottom: 40px !important; }

.mb50 {
  margin-bottom: 50px !important; }

/* padding-bottom */
.pb00 {
  padding-bottom: 0px !important; }

.pb05 {
  padding-bottom: 5px !important; }

.pb10 {
  padding-bottom: 10px !important; }

.pb15 {
  padding-bottom: 15px !important; }

.pb20 {
  padding-bottom: 20px !important; }

.pb25 {
  padding-bottom: 25px !important; }

.pb30 {
  padding-bottom: 30px !important; }

/* margin-left */
.ml00 {
  margin-left: 0px  !important; }

.ml05 {
  margin-left: 5px !important; }

.ml10 {
  margin-left: 10px !important; }

.ml11 {
  margin-left: 11px !important; }

.ml15 {
  margin-left: 15px !important; }

.ml20 {
  margin-left: 20px !important; }

.ml25 {
  margin-left: 25px !important; }

.ml30 {
  margin-left: 30px !important; }

.ml80 {
  margin-left: 80px !important; }

/* padding-left */
.pl00 {
  padding-left: 0px !important; }

.pl05 {
  padding-left: 5px !important; }

.pl10 {
  padding-left: 10px !important; }

.pl15 {
  padding-left: 15px !important; }

.pl20 {
  padding-left: 20px !important; }

.pl25 {
  padding-left: 25px !important; }

.pl30 {
  padding-left: 30px !important; }

.w040 {
  width: 40px !important; }

.w050 {
  width: 50px !important; }

.w080 {
  width: 80px !important; }

.w100 {
  width: 100px !important; }
  @media only screen and (max-width: 768px) {
    .w100 {
      max-width: 100% !important; } }

.w150 {
  width: 150px !important; }
  @media only screen and (max-width: 768px) {
    .w150 {
      max-width: 100% !important; } }

.w200 {
  width: 200px !important; }
  @media only screen and (max-width: 768px) {
    .w200 {
      max-width: 100% !important; } }

.w250 {
  width: 250px !important; }
  @media only screen and (max-width: 768px) {
    .w250 {
      max-width: 100% !important; } }

.w300 {
  width: 300px !important; }
  @media only screen and (max-width: 768px) {
    .w300 {
      max-width: 100% !important; } }

.w350 {
  width: 350px !important; }
  @media only screen and (max-width: 768px) {
    .w350 {
      max-width: 100% !important; } }

.w390 {
  width: 390px !important; }
  @media only screen and (max-width: 768px) {
    .w390 {
      max-width: 100% !important; } }

.w400 {
  width: 400px !important; }
  @media only screen and (max-width: 768px) {
    .w400 {
      max-width: 100% !important; } }

.w500 {
  width: 500px !important; }
  @media only screen and (max-width: 768px) {
    .w500 {
      max-width: 100% !important; } }

.w600 {
  width: 600px !important; }
  @media only screen and (max-width: 768px) {
    .w600 {
      max-width: 100% !important; } }

@media only screen and (max-width: 768px) {
  .sp-w100 {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important; } }

/* float */
.fL {
  float: left !important; }

.fR {
  float: right !important; }

@media only screen and (max-width: 768px) {
  .sp-fNone {
    float: none !important;
    max-width: 100%; } }

/* text-align */
.taC {
  text-align: center !important; }

.taL {
  text-align: left !important; }

.taR {
  text-align: right !important; }

@media only screen and (max-width: 768px) {
  .sp-taL {
    text-align: left !important; } }

@media only screen and (max-width: 768px) {
  .sp-taC {
    text-align: center !important; } }

@media only screen and (max-width: 768px) {
  .sp-taR {
    text-align: right !important; } }

/* color */
.c_red {
  color: #CC0000 !important; }

.c_org {
  color: #F87501 !important; }

.c_blk {
  color: #333333 !important; }

.c_blu {
  color: #0C68A8 !important; }

.c_gry {
  color: #999999 !important; }

.c_grn {
  color: #70B42B !important; }

/* line */
.line01 {
  border-bottom: 1px dotted #CCCCCC;
  margin-bottom: 10px;
  padding-bottom: 10px; }

.rollover {
  vertical-align: bottom; }

.rollover a img {
  opacity: 1;
  filter: alpha(opacity=100); }

.hidden {
  display: none; }

* html .ipn img {
  behavior: expression(IEPNGFIX.fix(this)); }

#cf dl dt {
  background-color: #3879c5;
  color: #fff;
  padding: 3px; }

/* movie */
.movie_box {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; }

.movie_box iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important; }

/* flex */
.flex-box {
  display: flex;
  justify-content: space-between;
  text-align: center;
  margin-bottom: 15px; }
  @media only screen and (max-width: 768px) {
    .flex-box {
      margin-bottom: 4vw; } }
  .flex-box__item.col2 {
    width: calc((100% - 10px) / 2); }
    @media only screen and (max-width: 768px) {
      .flex-box__item.col2 {
        width: 44.5333333333vw; } }
  .flex-box__item.col3 {
    width: calc((100% - 16px) / 3); }
    @media only screen and (max-width: 768px) {
      .flex-box__item.col3 {
        width: 29.0666666667vw; } }

.numberListA {
  counter-reset: numberListA; }
  .numberListA li {
    padding-left: 1.5em;
    text-indent: -1.5em; }
    .numberListA li::before {
      content: counter(numberListA) ". ";
      counter-increment: numberListA; }

.numberListB {
  counter-reset: numberListB; }
  .numberListB li {
    padding-left: 2em;
    text-indent: -2em; }
    .numberListB li::before {
      content: "(" counter(numberListB) ") ";
      counter-increment: numberListB; }




