@charset "UTF-8";
/* SCSS Document */
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@font-face {
  font-family: 'marugo';
  src: url(marugo.ttf); }
/* Reset CSS */
html, body, h1, h2, h3, h4, ul, ol, dl, li, dt, dd, p, div, span, img, a, table, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: normal;
  font-size: 100%;
  vertical-align: baseline;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

article, header, footer, aside, figure, figcaption, nav, section {
  display: block; }

body {
  line-height: 1;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  margin: auto;
  font-family: "Noto Sans Japanese", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"; }

ol, ul {
  list-style: none;
  list-style-type: none; }

/* Reset CSS End */
h2 {
  padding: 16px;
  background-color: #074277;
  color: white;
  font-size: 1.2em; }

h3 {
  color: #515151;
  font-size: 1.4em;
  line-height: 2em; }

h5 {
  font-size: 1.1em;
  color: #515151;
  padding: 10px;
  border-top: 2px solid #074277;
  background: white;
  background: -moz-linear-gradient(180deg, white 0%, #bdbdbd 100%);
  background: -webkit-linear-gradient(180deg, white 0%, #bdbdbd 100%);
  background: linear-gradient(180deg, white 0%, #bdbdbd 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#bdbdbd",GradientType=1); }

p {
  color: #686868;
  font-size: 0.9em;
  line-height: 1.3em;
  text-align: justify; }

/* トップメニューレスポンシブ */
@media screen and (min-width: 800px) {
  #global-nav {
    background: #074277; }
    #global-nav ul.menu-width {
      max-width: 972px;
      margin: auto; }
      #global-nav ul.menu-width li {
        text-align: center;
        width: 20%;
        border-left: 1px solid white;
        border-bottom: 5px solid #074277;
        box-sizing: border-box; }
        #global-nav ul.menu-width li img {
          height: 26px;
          width: 26px;
          margin-left: 16px;
          margin-right: 8px;
          margin-bottom: -5px; }
        #global-nav ul.menu-width li a {
          color: white;
          padding-left: 10px;
          height: 64px;
          padding-top: 22px;
          display: block; }
      #global-nav ul.menu-width li.bd-last {
        border-right: 1px solid white; }
      #global-nav ul.menu-width li:hover {
        border-bottom: 5px solid red; } }
.inner {
  margin: 0 auto 0; }

.inner:after {
  content: "";
  clear: both;
  display: block; }

/* header */
#top-head {
  width: 100%;
  font-size: 14px;
  margin: 0 auto;
  line-height: 1;
  z-index: 999; }

#top-head a,
#top-head {
  text-decoration: none; }

#top-head .inner {
  position: relative; }

#global-nav ul, #under-nav ul {
  list-style: none;
  bottom: 0;
  font-size: 16px;
  max-width: 972px;
  margin: auto; }

#global-nav ul li, #under-nav ul li {
  float: left;
  position: relative; }

#global-nav ul li a, #under-nav ul li a {
  padding: 0 30px;
  white-space: nowrap; }

#global-nav ul li:hover {
  color: #0A65B6; }

/* Toggle Button */
#nav-toggle {
  display: none;
  position: absolute;
  right: 12px;
  top: 14px;
  width: 34px;
  height: 36px;
  cursor: pointer;
  z-index: 101; }

#nav-toggle div {
  position: relative; }

#nav-toggle span {
  display: block;
  position: absolute;
  height: 4px;
  width: 100%;
  background: #666;
  left: 0;
  -webkit-transition: .35s ease-in-out;
  -moz-transition: .35s ease-in-out;
  transition: .35s ease-in-out; }

#nav-toggle span:nth-child(1) {
  top: 0; }

#nav-toggle span:nth-child(2) {
  top: 11px; }

#nav-toggle span:nth-child(3) {
  top: 22px; }

/*　ナビゲーション設定　*/
@media screen and (max-width: 800px) {
  /* トップメニューレスポンシブ */
  #top-head,
  .inner {
    width: 100%;
    padding: 0; }

  #top-head {
    top: 0;
    margin-top: 0; }

  /* Fixed reset */
  #top-head.fixed {
    padding-top: 0;
    background: transparent; }

  #mobile-head {
    background: #fff;
    width: 100%;
    height: 56px;
    z-index: 999;
    position: relative; }

  #top-head.fixed .logo,
  #top-head .logo {
    position: absolute;
    left: 13px;
    top: 13px;
    color: #333;
    font-size: 26px; }

  #global-nav {
    position: absolute;
    /* 開いてないときは画面外に配置 */
    top: -550px;
    right: 5px;
    background: #4969B3;
    width: 60%;
    text-align: center;
    padding: 10px 0;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    opacity: 0.9; }
    #global-nav img {
      display: none; }

  #global-nav ul {
    list-style: none;
    position: static;
    right: 0;
    bottom: 0;
    font-size: 16px; }

  #global-nav ul li {
    float: none;
    position: static; }

  #global-nav ul li:after {
    display: none; }

  #top-head #global-nav ul li a,
  #top-head.fixed #global-nav ul li a {
    width: 100%;
    display: block;
    color: #fff;
    padding: 18px 0; }

  #nav-toggle {
    display: block; }

  /* #nav-toggle 切り替えアニメーション */
  .open #nav-toggle span:nth-child(1) {
    top: 11px;
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    transform: rotate(315deg); }

  .open #nav-toggle span:nth-child(2) {
    width: 0;
    left: 50%; }

  .open #nav-toggle span:nth-child(3) {
    top: 11px;
    -webkit-transform: rotate(-315deg);
    -moz-transform: rotate(-315deg);
    transform: rotate(-315deg); }

  /* #global-nav スライドアニメーション */
  .open #global-nav {
    /* #global-nav top + #mobile-head height */
    -moz-transform: translateY(556px);
    -webkit-transform: translateY(556px);
    transform: translateY(556px); }

  /*　以上トップメニューレスポンシブ　*/ }
.left {
  float: left; }

.right {
  float: right; }

.none {
  display: none; }

.clearfix:after {
  content: " ";
  display: block;
  clear: both; }

header#top-head .inner .head {
  padding: 8px 0;
  max-width: 972px;
  margin: auto; }
  header#top-head .inner .head #main-head .right {
    padding-top: 10px; }
    header#top-head .inner .head #main-head .right .first {
      margin-right: 10px; }
header#top-head .top-image {
  background: url("../img/top-image.jpg") no-repeat;
  background-size: cover;
  background-position: bottom;
  height: 360px; }
  header#top-head .top-image .top-message {
    padding-top: 50px;
    max-width: 900px;
    margin: auto;
    border-bottom: 1px solid #3F2828; }
    header#top-head .top-image .top-message h1 {
      padding: 20px;
      font-size: 2.3em;
      font-weight: bold;
      color: #3F2828;
      line-height: 1.6em; }
    header#top-head .top-image .top-message .right {
      width: 46%;
      padding: 6px; }
      header#top-head .top-image .top-message .right h2 {
        font-size: 1.3em;
        line-height: 2em;
        color: #747474;
        background: none;
        text-align: justify; }

@media screen and (min-width: 801px) {
  body #main-clm {
    width: 972px; } }
#main-clm {
  padding-top: 50px;
  margin: auto; }
  #main-clm .left-clm {
    float: left;
    text-align: center;
    width: 22%; }
    #main-clm .left-clm .left-menu {
      margin-bottom: 30px; }
    #main-clm .left-clm .tori h1 {
      font-size: 1.1em;
      color: #676767;
      font-weight: 400;
      text-align: center;
      padding: 16px;
      border-bottom: 2px solid #555555; }
    #main-clm .left-clm .tori a {
      display: block;
      padding: 30px 0;
      border-bottom: 1px dotted #555555; }
    #main-clm .left-clm .other a {
      display: block;
      margin: 20px 0 0; }
  #main-clm .right-clm {
    float: right;
    width: 70%; }
    #main-clm .right-clm a {
      display: block;
      margin-bottom: 60px; }
    #main-clm .right-clm #company .daihyo {
      margin: 30px 0; }
      #main-clm .right-clm #company .daihyo .left {
        float: left; }
      #main-clm .right-clm #company .daihyo .right {
        float: right;
        width: 68%; }
        #main-clm .right-clm #company .daihyo .right h3 span {
          color: #1DBBBB;
          font-size: 70%;
          margin-left: 10px; }
    #main-clm .right-clm #company .what-company .left {
      float: left;
      width: 36%; }
    #main-clm .right-clm #company .what-company .right {
      float: right; }
    #main-clm .right-clm #company .company-detail {
      margin: 30px 0 50px; }
      #main-clm .right-clm #company .company-detail table {
        color: #686868;
        font-size: 90%; }
        #main-clm .right-clm #company .company-detail table tr th {
          text-align: left;
          font-weight: 500;
          color: #353535;
          padding: 45px 0;
          width: 7em;
          border-bottom: 1px dotted #686868; }
        #main-clm .right-clm #company .company-detail table tr td {
          line-height: 2em;
          vertical-align: middle;
          border-bottom: 1px dotted #686868; }
          #main-clm .right-clm #company .company-detail table tr td strong {
            margin-right: 10px; }
    #main-clm .right-clm #kanyu h1, #main-clm .right-clm #pp h1, #main-clm .right-clm #user h1 {
      margin-bottom: 30px; }
    #main-clm .right-clm #kanyu h2, #main-clm .right-clm #pp h2, #main-clm .right-clm #user h2 {
      margin: 30px 0; }
    #main-clm .right-clm #kanyu h4, #main-clm .right-clm #pp h4, #main-clm .right-clm #user h4 {
      margin: 20px 0; }
    #main-clm .right-clm #kanyu p, #main-clm .right-clm #pp p, #main-clm .right-clm #user p {
      width: 96%;
      margin: 20px auto;
      line-height: 1.6em; }
      #main-clm .right-clm #kanyu p a, #main-clm .right-clm #pp p a, #main-clm .right-clm #user p a {
        margin: 0;
        text-decoration: none; }
    #main-clm .right-clm #kanyu p.kanyu-company, #main-clm .right-clm #pp p.kanyu-company, #main-clm .right-clm #user p.kanyu-company {
      text-align: right; }
    #main-clm .right-clm #kanyu ul li, #main-clm .right-clm #pp ul li, #main-clm .right-clm #user ul li {
      color: #686868;
      font-size: 0.8em;
      padding: 10px; }
    #main-clm .right-clm #kanyu .style01, #main-clm .right-clm #pp .style01, #main-clm .right-clm #user .style01 {
      margin: 30px auto; }
    #main-clm .right-clm #kanyu .user-panel, #main-clm .right-clm #pp .user-panel, #main-clm .right-clm #user .user-panel {
      text-align: center;
      margin: 30px auto; }
      #main-clm .right-clm #kanyu .user-panel a, #main-clm .right-clm #pp .user-panel a, #main-clm .right-clm #user .user-panel a {
        float: left;
        width: 48%;
        margin: 1%; }
        #main-clm .right-clm #kanyu .user-panel a img, #main-clm .right-clm #pp .user-panel a img, #main-clm .right-clm #user .user-panel a img {
          width: 100%; }
    #main-clm .right-clm #pp ul li a {
      color: #686868;
      margin: 0;
      display: inline-block; }
    #main-clm .right-clm #accident-call {
      text-align: center; }
      #main-clm .right-clm #accident-call p {
        margin: 20px 0;
        font-size: 0.8em; }
      #main-clm .right-clm #accident-call h2 {
        font-size: 1.4em;
        padding: 20px;
        color: #2C2F42;
        background-color: white; }
      #main-clm .right-clm #accident-call table {
        border-collapse: collapse;
        margin-bottom: 30px; }
        #main-clm .right-clm #accident-call table th, #main-clm .right-clm #accident-call table td {
          border: 1px solid #81828F;
          padding: 20px; }
          #main-clm .right-clm #accident-call table th a, #main-clm .right-clm #accident-call table td a {
            text-decoration: none;
            color: #4F4F4F;
            margin-bottom: 0 !important; }

footer#fot {
  background: #074277;
  margin-top: 100px; }
  footer#fot .fot {
    max-width: 972px;
    margin: auto;
    padding: 30px 0;
    position: relative; }
    footer#fot .fot .pagetop {
      position: absolute;
      right: 0;
      top: -30px;
      width: 140px;
      background: #074277;
      text-align: center;
      padding: 10px 0;
      border-radius: 6px 6px 0 0; }
      footer#fot .fot .pagetop a {
        color: #E3E3E3;
        text-decoration: none; }
    footer#fot .fot .right {
      width: 55%; }
      footer#fot .fot .right nav ul li {
        float: left;
        padding: 5px 20px;
        border-left: 1px solid #E3E3E3;
        margin: 3px 0; }
        footer#fot .fot .right nav ul li a {
          font-size: 0.9em;
          text-decoration: none;
          color: #E3E3E3; }
  footer#fot .copyright {
    color: #E3E3E3;
    max-width: 972px;
    margin: auto;
    text-align: right;
    padding-bottom: 8px; }

img {
  max-width: 100%; }

/* レスポンシブ */
@media screen and (max-width: 800px) {
  header#top-head .top-image {
    background-size: cover;
    background-position: top;
    height: 210px; }
    header#top-head .top-image .top-message {
      padding-top: 0;
      border: none; }
      header#top-head .top-image .top-message h1 {
        font-size: 1.8em; }
      header#top-head .top-image .top-message .right {
        display: none; }

  #main-clm {
    max-width: 100%;
    padding-top: 0; }
    #main-clm img {
      max-width: 96%; }
    #main-clm .mobile-margin20px {
      margin-top: 20px; }

  .left, .right, .left-clm, .right-clm {
    float: none !important;
    width: 100% !important; }

  .right-clm {
    display: block;
    text-align: center; }
    .right-clm h1 img {
      width: 100%; }
    .right-clm a {
      margin-bottom: 30px !important; }
      .right-clm a img {
        width: 100%; }
    .right-clm .company-detail table {
      width: 96%;
      margin: auto; }
      .right-clm .company-detail table tr td {
        text-align: left; }
    .right-clm #company p {
      width: 90%;
      margin: auto; }
    .right-clm #company p.mobile-center {
      text-align: center; }
    .right-clm #company .what-company img {
      margin-top: 10px; }
    .right-clm #accident-call p {
      padding: 10px; }
    .right-clm #accident-call table th, .right-clm #accident-call table td {
      padding: 6px !important; }

  .left-clm .other a {
    display: inline-block !important;
    max-width: 49%; }

  #main-head {
    text-align: center; }

  form#mail_form dl {
    text-align: left; }

  footer#fot .fot .left img {
    max-width: 329px;
    width: 100%; }
  footer#fot .fot .right {
    margin-top: 20px;
    width: 96% !important;
    margin: auto; }
  footer#fot .copyright {
    font-size: 0.8em; } }
@media screen and (max-width: 416px) {
  #top-head .inner .head .left img {
    max-width: 220px; }
  #top-head .inner .head .right img {
    max-width: 47%; } }