@charset "UTF-8";
/****************************************************
 * Stylesheet
 *
 * 1.リセット
 * 2.共通設定
 * 3.レイアウト設定
 * 4.テンプレートスタイル
 * 5.コンテンツスタイル
 * 6.SP共通設定
 * 7.SPレイアウト設定
 * 8.SPテンプレートスタイル
 * 9.SPコンテンツスタイル
 * 10.装飾
 * 
 ****************************************************/
/****************************************************
 * 1.リセット
 ****************************************************/
/*
 YUI 3.18.1 (build f7e7bcb)
 Copyright 2014 Yahoo! Inc. All rights reserved.
 Licensed under the BSD License.
 http://yuilibrary.com/license/
 */
html {
  color: #000;
  background: #FFF;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

fieldset, img {
  border: 0;
}

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal;
}

ol, ul {
  list-style: none;
}

caption, th {
  text-align: left;
}

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}

q:before, q:after {
  content: '';
}

abbr, acronym {
  border: 0;
  font-variant: normal;
}

sup {
  vertical-align: text-top;
}

sub {
  vertical-align: text-bottom;
}

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  *font-size: 100%;
}

legend {
  color: #000;
}

/****************************************************
 * 2.共通
 ****************************************************/
html {
  background-image: none;
  background-color: transparent;
  font-family: "Lucida Grande", "Helvetica Neue", "メイリオ", meiryo, "Hiragino Kaku Gothic ProN", sans-serif;
}

html, body {
  font-size: 1em;
  color: #333333;
  background-color: #fff;
  line-height: 200%;
}

body {
  /*background-image: url("../images/bg02.jpg");*/
  background-repeat: repeat;
}

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.pcNone {
  display: none !important;
}

.imgCenter {
  display: block;
  margin: 1em auto;
}

.imgLeft {
  float: left;
  margin: 0 1em 1em 0;
}

.imgRight {
  float: right;
  margin: 0 0 1em 1em;
}

input {
  outline: none;
}
input:focus {
  outline: none;
}

a {
  color: #333333;
  text-decoration: none;
  outline: none;
}
a:focus {
  outline: none;
}
a:hover {
  text-decoration: underline;
}
a img {
  transition: opacity 0.8s;
}
a img:hover {
  opacity: 0.6;
}

.modal_overlay {
  width: 100%;
  height: 120%;
  overflow: hidden;
  background-color: #000000;
  opacity: 0.8;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 900;
}

/****************************************************
 * 3.レイアウト設定
 ****************************************************/
.container {
  width: 100%;
  min-width: 960px;
  margin: 0 auto;
}
.container .containerIn {
  width: 960px;
  margin: 0 auto;
}
.container .raw {
  width: 100%;
  *zoom: 1;
}
.container .raw:before, .container .raw:after {
  content: " ";
  display: table;
}
.container .raw:after {
  clear: both;
}
.container .raw > .column {
  float: left;
}
.container .raw > .column:last-chid {
  float: right;
}
.container .raw > .column > .colIn {
  padding: 0 10px;
}
.container .raw .col_1 {
  width: 8.33333%;
}
.container .raw .col_2 {
  width: 16.66667%;
}
.container .raw .col_3 {
  width: 25%;
}
.container .raw .col_4 {
  width: 33.33333%;
}
.container .raw .col_5 {
  width: 41.66667%;
}
.container .raw .col_6 {
  width: 50%;
}
.container .raw .col_7 {
  width: 58.33333%;
}
.container .raw .col_8 {
  width: 66.66667%;
}
.container .raw .col_9 {
  width: 75%;
}
.container .raw .col_10 {
  width: 83.33333%;
}
.container .raw .col_11 {
  width: 91.66667%;
}
.container .raw .col_12 {
  width: 100%;
}

/****************************************************
 * 4.テンプレートスタイル
 ****************************************************/
/*ヘッダーブロック*/
#header {
  width: 100%;
  min-width: 960px;
  margin: 0 auto;
  background-color: #112233;
}
#header h1 {
  width: 960px;
  margin: 0 auto;
}
#header h1 img {
  vertical-align: bottom;
}

/*フッターブロック*/
#footer {
  width: 100%;
  min-width: 960px;
  margin: 0 auto;
  background-color: #1542c4;
  color: #fff;
  padding-bottom: 20px;
}
#footer ul {
  background-color: #1542c4;
  text-align: center;
}
#footer ul li {
  height: 50px;
  padding: 0 10px;
  line-height: 312.5%;
  display: inline;
  border-right: solid 1px #ffffff;
  font-size: 0.875em;
}
#footer ul li:first-child {
  border-left: solid 1px #ffffff;
}
#footer ul li a {
  color: #ffffff;
}
#footer .footer_in {
  width: 960px;
  margin: 0 auto;
}
#footer .footer_in p {
  margin: 6px 0;
  font-size: 0.875em;
  line-height: 1.6;
  text-align: center;
}
#footer .copyright {
  height: 30px;
  color: #ffffff;
  background-color: #101322;
  text-align: center;
  font-size: 0.875em;
}

/****************************************************
 * 5.コンテンツスタイル
 ****************************************************/
/*Indexページ*/
#index {
  width: 100%;
  min-width: 960px;
  margin: 0 auto;
  /*background-image: url("../images/bg01.jpg");*/
  background-position: 0 300px;
  background-repeat: repeat-x;
  /*ファーストビュー*/
  /*ブロック02*/
}
#index #firstvew {
  width: 100%;
  min-width: 960px;
  height: 300px;
  margin: 0 auto;
  /*background-image: url("../images/fv_pc.jpg");*/
  background-position: 50% 0;
}
/*追記*/
#index #block03 {
  width: 100%;
  min-width: 960px;
  height: 160px;
  margin: 0;
  text-align: center;
  background-color: #112233;
  border-top: solid 5px #ffffff;
}
#index #block03 p {
  width: 960px;
  margin: 0 auto;
  font-size: 2.5em;
  line-height: 190%;
  font-weight: bold;
  color: #ffcc00;
}
/*ここまで*/
#index #block02 {
  padding: 30px 0;
}
#index #block02 h1 {
  height: 80px;
  margin: -0px 0 30px 0;
}
#index #block02 h1.zenpen {
  /*background-image: url("../images/title01_pc.png");*/
}
#index #block02 h1.kouhen {
  /*background-image: url("../images/title02_pc.png");*/
}
#index #block02 ul {
  width: 100%;
  height: auto;
  margin: 0 auto 60px auto;
  background-color: #ffffff;
  border: solid 1px #cccccc;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}
#index #block02 ul li {
  padding: 15px 10px;
  border-bottom: solid 1px #cccccc;
  *zoom: 1;
}
#index #block02 ul li:before, #index #block02 ul li:after {
  content: " ";
  display: table;
}
#index #block02 ul li:after {
  clear: both;
}
#index #block02 ul li:last-child {
  border: none;
}
#index #block02 ul li div {
  width: 620px;
  float: right;
}
#index #block02 ul li div:first-child {
  width: 300px;
  float: left;
}
#index #block02 ul li div h2 {
  font-size: 1.5em;
  font-weight: bold;
  color: #ff9933;
}
#index #block02 ul li div p {
  font-size: 0.875em;
  line-height: 200%;
  letter-spacing: -0.05em;
}
#index #block02 ul li div .time {
  margin: 10px 0 0 0;
  font-size: 0.75em;
  line-height: 150%;
}
#index #block02 ul li div .time span {
  margin: 0 5px 0 0;
  padding: 0 2px;
  display: inline-block;
  border: solid 1px #cccccc;
}
#index #block02 .movie {
  width: 96%;
  max-width: 960px;
  padding: 30px;
  background-color: #ffffff;
  display: none;
  position: fixed;
  z-index: 910;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}
#index #block02 .movie h2 {
  margin: 0 0 20px 0;
  padding: 0 40px 0 10px;
  font-size: 1.125em;
  font-weight: bold;
  color: #ff9933;
  border-left: solid 5px #ff9933;
}
#index #block02 .movie .vimeo {
  position: relative;
  height: 0;
  padding: 30px 0 56.25%;
  overflow: hidden;
  background-color: #000000;
  border: solid 1px #ffffff;
}
#index #block02 .movie .vimeo iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#index #block02 .movie .modal_close {
  width: 30px;
  height: 30px;
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 920;
}
#index #block02 .movie .modal_close a {
  width: 30px;
  height: 30px;
  display: block;
}

/*サブページ*/
#sub {
  /*background-image: url("../images/bg01.jpg");*/
  background-repeat: repeat-x;
}
#sub .prv {
  width: 960px;
  margin: 30px auto;
  padding: 25px 10px;
  background-color: #ffffff;
}
#sub .prv h2{
  text-align: center;
  background-color: #4197c7;
  color: #fff;
  font-size: 1.2em;
  line-height: 2.4em;
  margin-bottom: 20px;
}
#sub .prv ol, ul {
  list-style: inside;
}
#sub .prv li {
  margin: 0 0 0 20px;
  /*padding: 0 0 15px 0;*/
  /*border-bottom: solid 1px #000000;*/
}
#sub .prv li:last-child {
  border: none;
  margin: 0;
  padding: 0;
}
#sub .tokusyou {
  width: 960px;
  margin: 0 auto;
  padding: 25px 10px;
}
#sub .tokusyou table {
  width: 100%;
  background-color: #ffffff;
  border: solid 1px #ccc;
}
#sub .tokusyou table tbody tr {
  border-bottom: solid 1px #ccc;
}
#sub .tokusyou table tbody tr:last-child {
  border: none;
}
#sub .tokusyou table tbody tr th {
  width: 33.3333%;
  padding: 10px;
  background-color: #4477e5;
  color: #ffffff;
}
#sub .tokusyou table tbody tr td {
  padding: 10px;
  border-left: solid 1px #ccc;
}

@media screen and (max-width: 667px) {
  /****************************************************
   * 6.SP共通設定
   ****************************************************/
  html, body {
    height: 100%;
  }

  body {
    -webkit-text-size-adjust: 100%;
  }

  .pcNone {
    display: block !important;
  }

  .spNone {
    display: none !important;
  }

  img {
    max-width: 100%;
  }

  .imgCenter, .imgLeft, .imgRight {
    float: none;
    display: block;
    margin: 1em auto;
  }

  /****************************************************
   * 7.SPレイアウト設定
   ****************************************************/
  .container {
    min-width: 320px;
  }
  .container .containerIn {
    width: 100%;
    margin: 0 auto;
  }
  .container .raw > .column > .colIn {
    padding: 0 10%;
  }
  .container .raw .col_1, .container .raw .col_2, .container .raw .col_3, .container .raw .col_4, .container .raw .col_5, .container .raw .col_6, .container .raw .col_7, .container .raw .col_8, .container .raw .col_9, .container .raw .col_10, .container .raw .col_11, .container .raw .col_12 {
    width: 100%;
  }

  /****************************************************
   * 8.SPテンプレートスタイル
   ****************************************************/
  /*ヘッダーブロック　SP*/
  #header {
    min-width: 320px;
    margin: 0;
  }
  #header h1 {
    width: 100%;
    min-width: 320px;
  }

  /*フッターブロック　SP*/
  #footer {
    min-width: 320px;
    margin: 0;
  }
  #footer ul li {
    height: auto;
    padding: 0;
    font-size: 0.875em;
    line-height: 200%;
    display: block;
    border: none !important;
  }
  #footer .footer_in {
    width: 100%;
    min-width: 320px;
  }
  #footer .footer_in p {
    margin: 1em 0;
    font-size: 0.625em;
    line-height: 150%;
  }
  #footer .copyright {
    font-size: 0.625em;
  }

  /****************************************************
   * 9.SPコンテンツスタイル
   ****************************************************/
  /*Indexページ　SP*/
  /*Indexページ　SP*/
  #index {
    min-width: 320px;
    background-position: 0 280px;
    /*ファーストビュー　SP*/
    /*ブロック02　SP*/
  }
  #index #firstvew {
    min-width: 320px;
    height: auto;
    background: none;
  }
/*追記*/
  #index #block03 {
    min-width: 320px;
    height: auto;
    padding: 0.5em 0;
  }
  #index #block03 p {
    width: 100%;
    min-width: 320px;
    font-size: 1em;
    line-height: 150%;
  }
  #index #block03 p span {
    display: block;
  }
/*ここまで*/
  #index #block02 {
    padding: 1em 0.5em;
  }
  #index #block02 h1 {
    height: auto;
    background: none;
  }
  #index #block02 ul {
    margin: 0 auto 2em auto;
  }
  #index #block02 ul li {
    padding: 1em;
  }
  #index #block02 ul li div {
    width: 100% !important;
    float: none !important;
  }
  #index #block02 ul li div img {
    margin: 0 auto;
    display: block;
  }
  #index #block02 ul li div h2 {
    margin: 0.5em 0;
    font-size: 1.125em;
  }
  #index #block02 .movie {
    max-height: 80%;
    padding: 1em;
    overflow: auto;
  }
  #index #block02 .movie h2 {
    margin: 0 0 1em 0;
    font-size: 1em;
  }
  #index #block02 .movie .modal_close {
    width: 20px;
    height: 20px;
  }
  #index #block02 .movie .modal_close a {
    width: 20px;
    height: 20px;
  }

  /*サブページ　SP*/
  #sub {
    width: 100%;
    min-width: 320px;
    margin: 0;
    padding: 1em 0;
    border: none;
    font-size: 0.75em;
  }
  #sub .prv {
    width: 95%;
    margin: 0 auto;
    padding: 0 0.5em;
    -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
  }
  #sub .prv li {
    margin: 0 0 0.5em 0;
    padding: 0 0 0.5em 0;
  }
  #sub .tokusyou {
    width: 95%;
  }
}
/****************************************************
 * 10.装飾
 ****************************************************/
.underline {
  text-decoration: underline;
}

.bold {
  font-weight: bold;
}

.l01 {
  font-size: 1.125em;
}

.l02 {
  font-size: 1.25em;
}

.l03 {
  font-size: 1.5em;
}

.l04 {
  font-size: 1.6252em;
}

.l05 {
  font-size: 1.875em;
}

.l06 {
  font-size: 2.25em;
}

.s01 {
  font-size: 0.625em;
}

.s01 {
  font-size: 0.625em;
}

.s02 {
  font-size: 0.75em;
}

.s03 {
  font-size: 0.875em;
}

.colorRed {
  color: #ff0000;
}

.colorBlue {
  color: #0000cc;
}

.colorGreen {
  color: #00FF00;
}

.colorOrange {
  color: #ff9933;
}

.tokutei-ttl {
  text-align: center;
  font-size: 20px;
  padding: 0;
  margin: 0 auto;
  font-weight: bold;
  background-color: #fff;
}
.tokutei-ttl h1 {
  font-size: 24px;
  font-weight: bold;
  background-color: #fff;
  color: #1542c4;
  padding-top: 30px;
}