@charset "UTF-8";
/*--HRSdesignCSS -- 2015,11,10 Rel-ish yuki--*/
/* cf */
footer:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
}

/* FF Scrolbar */
html {
  overflow-y: scroll;
}

/* Base Font */
body {
  background: #fff;
  font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif;
  font-size: 16px;
  *font-size: small;
  *font: x-small;
  line-height: 160%;
  color: #666;
}

table {
  font-size: inherit;
  font: 100%;
}

html > body {
  font-size: 1em;
}

/* Alink */
a:link {
  color: #00B2E5;
}

a:visited {
  color: #666;
}

a:active {
  color: #8b0000;
}

a:hover {
  color: #006adf;
}

/* device */
.mobileN {
  display: none;
}

/* header */
.header {
  background: #1C2469;
  color: #fff;
  border-top: solid 4px #777;
}
.header header {
  position: relative;
  max-width: 1000px;
  margin: -4px auto 0;
  padding: 13% 3% 0;
  background: #1c2469;
  background: url(../img/bg_header.png) no-repeat left top, -moz-linear-gradient(left, #1c2469 0%, #406398 50%, #1c2469 100%);
  background: url(../img/bg_header.png) no-repeat left top, -webkit-gradient(linear, left top, right top, color-stop(0%, #1c2469), color-stop(50%, #406398), color-stop(100%, #1c2469));
  background: url(../img/bg_header.png) no-repeat left top, -webkit-linear-gradient(left, #1c2469 0%, #406398 50%, #1c2469 100%);
  background: url(../img/bg_header.png) no-repeat left top, -o-linear-gradient(left, #1c2469 0%, #406398 50%, #1c2469 100%);
  background: url(../img/bg_header.png) no-repeat left top, -ms-linear-gradient(left, #1c2469 0%, #406398 50%, #1c2469 100%);
  background: url(../img/bg_header.png) no-repeat left top, linear-gradient(to right, #1c2469 0%, #406398 50%, #1c2469 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c2469', endColorstr='#1c2469',GradientType=1 );
}
.header header h1 {
  height: 30px;
  padding: 65px 0 0;
  background: url(../img/img_siteLogo.png) no-repeat center top;
  text-align: center;
  font-weight: normal;
  font-size: 112.5%;
}
.header header h1 a {
  color: #fff;
  text-decoration: none;
}
.header header h1 a:hover {
  text-decoration: underline;
}
.header header p {
  position: absolute;
  padding: 3%;
  top: 0;
  left: 0;
  line-height: 110%;
  font-size: 75%;
}

/* visual */
.visual {
  position: relative;
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 3%;
}
.visual h1 {
  position: absolute;
  top: 28%;
  left: 5%;
  font-size: 75%;
  font-weight: normal;
  color: #fff;
  text-align: center;
  text-shadow: 0 0 5px #000;
  z-index: 5;
}
.visual div.movie {
  z-index: 1;
}

/* navi */
#mobile-header {
  display: block;
  width: 100%;
  padding: 2% 5%;
  background: #1C2469;
}
#mobile-header a {
  color: #fff;
  text-decoration: none;
}

.navi {
  display: none;
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 3%;
}
.navi ul {
  width: 1000px;
  margin: 0 auto;
  display: table;
  text-align: center;
  table-layout: fixed;
}
.navi li {
  display: table-cell;
}

/* topicpath */
.topicpath {
  overflow: hidden;
  width: 100%;
}
.topicpath ol {
  display: table;
}
.topicpath li {
  display: table-cell;
  white-space: nowrap;
  font-size: 75%;
}
.topicpath a {
  padding: 5px 0 5px 15px;
  text-decoration: none;
  color: #333;
  position: relative;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  background-color: #ddd;
  background-image: linear-gradient(to right, #f5f5f5, #ddd);
}

.topicpath li:first-child a {
  padding-left: 5px;
  border-radius: 5px 0 0 5px;
}

.topicpath a:hover {
  background: #fff;
}

.topicpath a::after,
.topicpath a::before {
  content: "";
  position: absolute;
  top: 50%;
  margin-top: -1.5em;
  border-top: 1.5em solid transparent;
  border-bottom: 1.5em solid transparent;
  border-left: 1em solid;
  right: -1em;
  padding-left: 1px;
}

.topicpath a::after {
  z-index: 2;
  border-left-color: #ddd;
}

.topicpath a::before {
  border-left-color: #ccc;
  right: -1.1em;
  z-index: 1;
}

.topicpath a:hover::after {
  border-left-color: #fff;
}

.topicpath .current,
.topicpath .current:hover {
  font-weight: bold;
  background: none;
}

.topicpath .current::after,
.topicpath .current::before {
  content: normal;
}

.topicpath li:last-child {
  padding: 0 15px;
}

.topicpath li.last {
  padding-left: 13px;
}

.topicpath div {
  display: none;
}

/* footer */
.footerBg {
  background: #1C2469;
}

footer {
  max-width: 1000px;
  margin: 0 auto;
  padding: 5% 3%;
  background: #1C2469;
  color: #fff;
}
footer .companyInfo {
  font-size: 87.5%;
  /* httpLink */
}
footer .companyInfo h1 {
  font-weight: normal;
}
footer .companyInfo a {
  color: #fff;
  text-decoration: none;
}
footer .companyInfo a:hover {
  text-decoration: underline;
}
footer .companyInfo a[href^="http://"]:after {
  font-family: serif;
  content: '';
  color: #ff7600;
  margin: 0;
}
footer .companyInfo ul {
  margin: 0 0 .5em;
}
footer .companyInfo li:before {
  content: '●';
}
footer .companyInfo address {
  font-style: normal;
}

/* PAGE TOP */
#page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
}
#page-top a {
  display: block;
  background: url(../img/icon_Ptop.png) no-repeat left top;
  width: 72px;
  height: 72px;
  padding: 0;
  text-indent: 110%;
  white-space: nowrap;
  overflow: hidden;
}

/* = MEDIA = */
@media only screen and (min-width: 769px) {
  /* device */
  .mobileN {
    display: block;
  }

  /* header */
  .header header {
    padding: 2.5em 0 0;
  }
  .header header h1 {
    height: 30px;
    padding: 65px 0 0;
  }
  .header header p {
    padding: 0;
    top: 7px;
    left: 9px;
    line-height: 160%;
  }

  /* contents */
  .contents {
    margin: 0px 0 180px;
  }

  /* visual */
  .visual {
    padding: 0;
  }
  .visual h1 {
    top: 30px;
    left: 35px;
    padding: 0 10px;
    font-size: 150%;
    line-height: 200%;
    color: #000;
    text-align: left;
    text-shadow: 1px 1px 3px #fff;
    background: rgba(255, 255, 255, 0.5);
  }

  /* navi */
  #mobile-header {
    display: none;
  }

  .navi {
    display: block;
    padding: 0;
  }
  .navi .nav li a {
    display: block;
    padding: 20px 0;
    background: url(../img/nav_bgGray.png) repeat-x left bottom;
  }
  .navi .nav li a:link {
    color: #333;
    text-decoration: none;
  }
  .navi .nav li a:active, .navi .nav li a.active {
    background: url(../img/nav_bgBlue.png) repeat-x left bottom;
  }
  .navi .nav li a:hover {
    background: url(../img/nav_bgBlue.png) repeat-x left bottom;
  }

  /* topicpath */
  .topicpath {
    max-width: 1000px;
    margin: 10px auto;
    padding: 0;
  }
  .topicpath ol {
    margin: 0 0 0 20px;
  }
  .topicpath a {
    padding: 5px 0;
    position: static;
    text-shadow: none;
    background: none;
    color: #00B2E5;
  }
  .topicpath a:visited {
    color: #00B2E5;
  }

  .topicpath li:first-child a {
    border-radius: 0;
  }

  .topicpath a:hover {
    background: none;
    color: #006adf;
  }

  .topicpath a::after,
  .topicpath a::before {
    content: normal;
    position: static;
    margin: 0;
    padding: 0;
  }

  .topicpath a::after {
    margin: 0 15px;
    content: '>';
    border: none;
  }

  .topicpath a::before {
    border: none;
  }

  .topicpath a:hover::after {
    border: none;
  }

  .topicpath .current,
  .topicpath .current:hover {
    font-weight: normal;
  }

  .topicpath .current::after,
  .topicpath .current::before {
    content: normal;
  }

  .topicpath li:last-child {
    padding: 0;
  }

  .topicpath li.last {
    padding: 0;
  }

  .topicpath div {
    display: none;
  }

  /* footerLink */
  .footerLink {
    background: #919295;
    padding: 28px 0;
  }
  .footerLink ul {
    width: 1000px;
    margin: 0 auto;
    display: table;
    text-align: center;
    table-layout: fixed;
  }
  .footerLink li {
    display: table-cell;
    text-align: left;
  }
  .footerLink li a {
    padding: 0 0 0 22px;
    background: url(../img/icon_waku.png) no-repeat left center;
    color: #fff;
    text-decoration: none;
  }
  .footerLink li a:hover {
    text-decoration: underline;
  }

  /* footer */
  footer {
    padding: 0;
  }
  footer .companyInfo {
    float: left;
    width: 500px;
    margin: 20px;
  }
  footer .companyInfo p {
    line-height: 130%;
  }
  footer .footerLogo {
    float: right;
    width: 150px;
    margin: 20px 30px 0 0;
  }
  footer .footerLogo img {
    display: block;
    margin: 0 auto;
  }
  footer .footerLogo p {
    width: 150px;
    margin: 10px 0 0;
    font-size: 62.5%;
    line-height: 130%;
    text-align: center;
  }

  /* PAGE TOP */
  #page-top {
    bottom: 100px;
    right: 60px;
  }
}