@charset "utf-8";

/*
【目次】
* 初期設定
    - reset
    - resetへ上書き
    - clearfix
    - placeholder
    - oocss・全ページ共通設定
    - pタグ内span強制改行
    - コンテンツ包括

* header
    - 各ページ最上部の見出し（h1）
    - 左ブロック
    - 中央ブロック
    - 右ブロック
        - プライマリーナビ
        - フォームからお問い合わせのボタン
        - Googleカスタム検索

* グローバルナビ
    - 包括・共通設定
    - 各タブ個別指定
    - 画像置換

* メインエリア
    - パンくずリスト
    - ページ中段包括（main・sideMenu）
    - 各ページ共通下部バナー
    - ページ内リンク用アンカー引き上げ
    - アニメーション設定・定義

* 各ページ右サイドメニュー
    - サイドメニュー包括
    - サイドメニュー子テーブル共通
    - お問い合わせ
    - サイドメニュー詳細
        - 子リスト
        - アクセスマップ

* footer
    - 背景画像
    - copyright

* toTopボタン

* 404ページ
    - footerを最下部に固定
    - 404表示ブロック
    - 404ページ用Google検索
*/

/************************************************************************ RESET ***
    Eric Meyer’s CSS Reset v2.0 をベースにfont-familyを指定

    http://meyerweb.com/eric/tools/css/reset/
    v2.0 | 20110126
    License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", 'メイリオ', "Meiryo", sans-serif;
  vertical-align: baseline;
}

input {
  margin: 0;
}

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

body {
  line-height: 1;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

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

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


/* resetへ上書き *******************************************************************/
body {
  background-color: #fafbf7;
  background-image: url(../img/common-backGround.jpg);
  color: #231815;
  position: relative;
}

th {
  font-weight: normal;
}

/* テキスト等の反転時のカラー */
::-moz-selection {
  background-color: #33afcb;
  color: #fff;
}
::selection {
  background-color: #33afcb;
  color: #fff;
}
::-moz-selection {
  background-color: #33afcb;
  color: #fff;
}

p a {
  margin: 0 .2em;
}

a {
  color: #1196a8;
  -webkit-transition: .1s;
  transition: .1s;
}

input {
  padding: 0;
}

/* clearFix：一応IE8対応させておきます
********************************************************************* clearFix ***/
.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  /*　IE対策　*/
    *zoom: 1;
}


/* placeholder
****************************************************************** placeholder ***/
input::-webkit-input-placeholder {
  color: #999;
}
input:-ms-input-placeholder {
  color: #999;
}
input::-moz-placeholder {
  color: #999;
  opacity: 1;
}
textarea::-webkit-input-placeholder {
  color: #999;
}
textarea:-ms-input-placeholder {
  color: #ccc;
}
textarea::-moz-placeholder {
  color: #ccc;
  opacity: 1;
}


/* oocss・全ページ共通設定
*********************************************************** oocss・全ページ共通設定 ***/
/* 余白指定 */
.tMargin8 {
  margin-top: 8px;
}
.tMargin16 {
  margin-top: 16px;
}
.tMargin24 {
  margin-top: 24px;
}
.tMargin32 {
  margin-top: 32px;
}
.rMargin8 {
  margin-right: 8px;
}
.rMargin16 {
  margin-right: 16px;
}
.rMargin24 {
  margin-right: 24px;
}
.rMargin32 {
  margin-right: 32px;
}
.lMargin8 {
  margin-left: 8px;
}
.lMargin16 {
  margin-left: 16px;
}
.lMargin24 {
  margin-left: 24px;
}
.lMargin32 {
  margin-left: 32px;
}
.indent {
  margin-left: 1em;
}

/* pタグ内span強制改行 */
p span.br {
  display: block;
}

/* コンテンツ包括 */
#container {
  min-width: 960px;
  width: 100%;
}


/* header
*********************************************************************** header ***/
/* 各ページ最上部の見出し（h1） */
#menuSwitch {
  display: none;
}

#pageTitle {
  background-color: #33afcb;
  color: #fff;
  font-size: 10px;
  padding: 4px 0 4px 4px;
}
    /* h1内右寄せ */
    #pageTitle span {
      display: block;
      width: 960px;
      margin: 0 auto;
    }
    /* 横幅768pxの場合は隠す */
#headerContent {
  display: flex;
    justify-content: space-between;
  margin: 24px auto 0;
  width: 960px;
}

/**************************************** 右ブロック ***/
#headerRight {
  display: flex;
    flex-direction: column;
    justify-content: space-between;
  position: relative;  /*IEでのネガティブマージン対策*/
}
    /* プライマリーナビ */
    #headerRight #primaryNav {
      display: flex;
        gap: 16px;
    }
        #primaryNav li a,
        #primaryNav li a:link,
        #primaryNav li a:visited {
          background-image: url(../img/pointer-green.png);
          background-repeat: no-repeat;
          background-position: left 3px;
          color: #231815;
          display: block;
          font-size: 12px;
          text-decoration: none;
          padding-left: 10px;
        }
        #primaryNav li a:hover {
          color: #33afcb;
          text-decoration: underline;
        }

/* フォームからお問い合わせのボタン */
/* イメージを残してロールオーバーさせる為、擬似要素はaタグの物を使用 */
    #headerRight p a {
      display: block;
      margin: 0;
      position: relative;
    }
        #headerRight p a::after {
          background-image: url(../img/header-button_formLink_hover.png);
          content: "";
          display: none;
          height: 32px;
          position: absolute;
          left: 0;
          top: 0;
          width: 232px;
        }
            /* hoverで表示 */
            #headerRight p a:hover::after {
              display: block;
            }
                /* 余白対策 */
                #headerRight p a img{
                  display: block;
                }


/**************************************************** Googleカスタム検索 ***
 （google指定のdefault.cssが強いので上書きする場合はすべて「 !important」をつける事） */
.headerSearch {
  width: 232px;
}
.headerSearch td {
  border: none;
}

/* margin・padding初期化 */
.headerSearch .gsc-search-box,
.headerSearch .gsc-control-cse,
.headerSearch .gsc-control-cse-ja,
.headerSearch .gsib_a {
  background-color: transparent !important;
  border: 0;
  margin:0 !important;
  padding:0 !important;
}
.headerSearch .gsc-input-box{
  height: 20px;
  background-color: transparent !important;
}

/* テキスト入力フォームとボタンの位置 */
.headerSearch table.gsc-search-box td,
.headerSearch table.gsc-search-box input {
  vertical-align: top !important;
}

/* テキスト入力フォーム */
.headerSearch input[type="text"]{
  border: 1px solid #dddddd !important;
  box-shadow: none;
  height: 20px !important;
  font-size: 12px !important;
  margin-top: 100px;
}
.headerSearch input[type="text"]:focus {
  border: 2px solid #b2e0eb !important;
  box-shadow: none;
  outline: 0;  /*safariの自動フォーカスを切る */
}
/* テキスト入力フォームの影を消す */
.headerSearch #gsc-iw-id1{
  border:none !important;
}
/* テキスト入力フォームの背景画像位置調整 */
.headerSearch #gs_tti0 input{
  background-position: 5px 5px !important;
}
/* ボタンのカラー */
.headerSearch input.gsc-search-button {
  background-color: #33afcb !important;
}
/* ボタンの位置調整と角丸消し */
.headerSearch .gsc-search-button{
  margin: 0 0 0 -8px !important;
  border-radius: 0px !important;
}
/* ボタンのサイズ上書き */
.headerSearch input.gsc-search-button-v2 {
  padding: 3px 24px !important;
}
/* 入力時に出る「×」ボタンの位置調整 */
/* 入力時に出る×ボタン -- Firefox位置調整 -- */
.headerSearch .gsib_a {
    background-image: none;
}
.headerSearch .gsib_b span{
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  padding: 3px 0 0 4px;
}


/* globalnav
******************************************************************* globalnav ***/
/* 包括・共通設定 */
nav {
  border-bottom: solid 4px #33afcb;
}
    nav #globalNav {
      display: flex;
        gap: 1px;
      margin: 24px auto 0;
      padding-inline: 8px;
      width: 960px;
    }
    #globalNav li:first-of-type {
      margin-right: auto;
    }

/* 各タブ個別指定 */
#globalNav li a {  /* 共通プロパティ一括設定 */
  background-repeat: no-repeat;
  background-position: left top;
  display: block;
  height: 32px;
  -webkit-transition: .1s;
  transition: .1s;
}
    /* 画像置換 */
    #globalNav li a span {
      display: block;
      overflow: hidden;
      text-indent: 100%;
      white-space: nowrap;
    }
        /* hover時・対象ページ時は画像差し替え */
        #globalNav_home a {
          background-image: url(../img/navMenu_home.png);
          width: 90px;
        }
        #globalNav_home a:hover,
        #index #globalNav_home a {
          background-image: url(../img/navMenu_home_hover.png);
        }
        #globalNav_typeA a {
          background-image: url(../img/navMenu_typeA.png);
          width: 184px;
        }
        #globalNav_typeA a:hover,
        #type-a #globalNav_typeA a{
          background-image: url(../img/navMenu_typeA_hover.png);
        }
        #globalNav_copan a {
          background-image: url(../img/navMenu_copan.png);
          width: 144px;
        }
        #globalNav_copan a:hover,
        #copan #globalNav_copan a{
          background-image: url(../img/navMenu_copan_hover.png);
        }
        #globalNav_work a {
          background-image: url(../img/navMenu_work.png);
          width: 104px;
        }
        #globalNav_work a:hover,
        #work #globalNav_work a{
          background-image: url(../img/navMenu_work_hover.png);
        }
        #globalNav_flow a {
          background-image: url(../img/navMenu_flow.png);
          width: 131px;
        }
        #globalNav_flow a:hover,
        #flow #globalNav_flow a{
          background-image: url(../img/navMenu_flow_hover.png);
        }
        #globalNav_faq a {
          background-image: url(../img/navMenu_faq.png);
          width: 76px;
        }
        #globalNav_faq a:hover,
        #faq #globalNav_faq a{
          background-image: url(../img/navMenu_faq_hover.png);
        }
        #globalNav_recruit a {
          background-image: url(../img/navMenu_recruit.png);
          width: 104px;
        }
        #globalNav_recruit a:hover,
        #recruit #globalNav_recruit a{
          background-image: url(../img/navMenu_recruit_hover.png);
        }

/* main
******************************************************************** main ***/
/* パンくずリスト */
main #breadCrumb {
  background-image: url(../img/common-dotPunctuation_horizontal.png);
  background-repeat: repeat-x;
  background-position: left bottom;
}
    #breadCrumb ul {
      box-sizing: border-box;
      margin: 0 auto;
      padding: 0 8px;
      width: 960px;
    }
        #breadCrumb ul li {
          float: left;
          font-size: 14px;
          padding: 10px 0;
        }
            #breadCrumb ul li a,
            #breadCrumb ul li a:link,
            #breadCrumb ul li a:visited{
              color: #1196a8;
              display: block;
              text-decoration: none;
            }
            #breadCrumb ul li a:hover span {
              text-decoration: underline;
            }
                #breadCrumb ul li a::after {
                  color: #3f3f3f;
                  content: "＞";
                  margin: 0 .5em 0 .8em;
                }
/* ページ中段包括（main・sideMenu） */
#contentWrap {
  width: 960px;
  margin: 0 auto;
}
    #contentWrap #main {
      box-sizing: border-box;
      float: left;
      margin-top: 40px;
      width: 680px;
    }

/* 各ページ共通下部バナー */
#bottomBanner {
  text-align: center;
  margin-top: 32px;
  padding-left: 40px;
}

/* ページ内リンク用アンカー引き上げ */
#content2ndLink,
#content3rdLink {
  margin-top: -20px;
  position: absolute;
}

/* アニメーション設定・定義 */
.fadeInUp {
  /*  */
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
  /* アニメーションの0%～100%にかける時間 */
    -webkit-animation-duration: 1.2s;
  animation-duration: 1.2s;;
  /* 下記で定義したアニメーションを呼び出し */
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    visibility: visible !important;
}
        /* アニメーションを定義 */
          @-webkit-keyframes fadeInUp {
            0% { opacity: 0;
              -webkit-transform: translateY(20px);
            }
            100% { opacity: 1;
              -webkit-transform: translateY(0);
            }
          }
          @keyframes fadeInUp {
            0% {
              opacity: 0;
              -webkit-transform: translateY(20px);
              transform: translateY(20px);
            }
            100% { opacity: 1;
              -webkit-transform: translateY(0);
              transform: translateY(0);
            }
          }


/**************************************************** 各ページ右サイドメニュー ***/
/* サイドメニュー包括 */
#contentWrap #sideMenu {
  background-image: url(../img/common-sideMenuBack.png);
  border-radius: 4px;
  box-sizing: border-box;
  float: left;
  margin: 40px 0 0 40px;
  padding: 8px 6px;
  width: 240px;
}
    /* サイドメニュー子テーブル共通 */
    #sideMenu .sideMenuInner {
      background-color: #f5f9fb;
      border: solid 4px #e6f2f6;
      border-radius: 4px;
      padding: 10px;
    }
    #sideMenu .sideMenuInner:not(:first-of-type){
      margin-top: 8px;
    }

/* お問い合わせ */
#sideMenuInquiry {
  text-align: center;
}
    #sideMenuInquiry #sideMenuInquiryButton {
      background-image: url(../img/common-dotPunctuation_horizontal.png);
      background-repeat: repeat-x;
      background-position: left top;
      margin-top: 10px;
      padding-top: 14px;
    }
        #sideMenuInquiryButton a {
          display: block;
          position: relative;
        }
            #sideMenuInquiryButton a::after {
              background-image: url(../img/common-sideMenuButton_formLink_hover.png);
              content: "";
              display: none;
              height: 32px;
              position: absolute;
              left: 0;
              top: 0;
              width: 194px;
            }
            /* hoverで表示 */
            #sideMenuInquiryButton a:hover::after {
              display: block;
            }
                /* 余白対策 */
                #sideMenuInquiryButton a img {
                  display: block;
                }
/* サイドメニュー詳細 */
#sideMenuMenu {
  text-align: left;
}
#sideMenuMenu ul li {
  background-image: url(../img/common-dotPunctuation_horizontal.png);
  background-repeat: repeat-x;
  background-position: left bottom;
}
        #sideMenuMenu > ul > li:first-of-type {
          margin-top: 8px;
        }
        #sideMenuMenu > ul > li:last-of-type {
          background-image: none;
        }
    #sideMenuMenu ul li a,
    #sideMenuMenu ul li a:link,
    #sideMenuMenu ul li a:visited {
      background-image: url(../img/pointer-green.png);
      background-repeat: no-repeat;
      background-position: 12px center;
      color: #231815;
      display: block;
      font-size: 12px;
      font-weight: bold;
      text-decoration: none;
      padding: 12px 0 10px 28px;
    }
    #sideMenuMenu ul li a:hover {
      color: #1196a8;
      text-decoration: underline;
    }
    /* 子リスト */
    #sideMenuMenu ul li ul {
      margin-left: 1.3em;
    }
        #sideMenuMenu ul li ul li {
          background-image: url(../img/common-dotPunctuation_horizontal.png);
          background-repeat: repeat-x;
          background-position: left top;
        }

/* アクセス */
#sideMenuAccess {
  text-align: center;
}
    #sideMenuAccess .sideMenuAppearanceImg {
      margin-top: 8px;
    }
    #sideMenuAccess .sideMenuAppearanceImg img {
      max-width: 100%;
    }
    #sideMenuAccessAddress {
      font-size: 14px;
      font-weight: bold;
      letter-spacing: -.05em;;
      text-align: left;
      margin: 0 2px;
    }
        #sideMenuAccessAddress li {
          margin-top: 6px;
          line-height: 1.5em;
        }
        #sideMenuAccess li p span {
          display: block;
          margin-left: 2.8em;
        }

        /* アクセスマップ */
        #sideMenuAccess #sideMenuAccessButton {
          cursor: pointer;
          display: inline-block;
          position: relative;
        }
            #sideMenuAccessButton::after {
              background-image: url(../img/common-sideMenuButton_Map_hover.png);
              content: "";
              display: none;
              height: 32px;
              position: absolute;
              left: 0;
              top: 0;
              width: 194px;
            }
            /* hoverで表示 */
            #sideMenuAccessButton:hover::after {
              display: block;
            }
            /* 余白対策 */
                #sideMenuAccessButton img {
                  display: block;
                  margin: 0 auto;
                }

/* footer
******************************************************************** footer ***/
footer {
  position: relative;
  width: 100%;
}
/* 背景画像 */
footer #footerLawn {
  background-image: url(../img/footer-background.png);
  background-repeat: repeat-x;
  background-position: left bottom;
  margin: 40px auto 0;
  height: 36px;
  min-width: 960px;
}
/* copyright */
footer #footerInner {
  background-color: #1196a8;
  color: #fff;
  margin: 0 auto ;
  padding: 24px 0;
  position: relative;
  text-align: center;
  min-width: 960px;
}

/* toTopボタン
******************************************************************** toTopボタン ***/
#toTop {
  position: absolute;
  top: 4px;
  left: 50%;
  margin-left: 304px;
  z-index: 9999;
}

/* 404
******************************************************************** 404 ***/
/* footerを最下部に固定 */
#error_wrap,
#error {
  height: 100%;
}
#error #container {
  position: relative;
  height:auto !important; /*IE6対策*/
  height: 100%; /*IE6対策*/
  min-height: 100%;
}
#error #main {
  padding-bottom: 176px;
}
#error footer {
  position: absolute;
  bottom: 0;
}
#error #toTop {
  position: absolute;
  top: 44px;
}
/* 404表示ブロック */
#error404 {
  border: 2px dashed #338ecb;
  margin: 4em auto 0;
  padding: 40px;
  text-align: center;
  width: 50em;
}
#error404-title {
  font-size: 24px;
  font-weight: bold;
}
#error404-body {
  color: #332420;
  font-size: 18px;
  margin: 1em 0 0 .5em;  /* leftは「。」の妙な余白を調節 */
  text-align: center;
}
/* 404ページ用Google検索 */
#errorSearch {
  background-color: rgba(51,203,101,.1);
  border-radius: 4px;
  display: inline-block;
  margin-top: 40px;
  padding: 32px 48px;
}
#errorSearch p {
  font-size: 14px;
  text-align: center;
  line-height: 1.5em;
}
#errorSearch .headerSearch {
  position: static;
  margin: 16px auto 0;
}
/* margin・padding初期化 */
#errorSearch .headerSearch .gsc-search-box,
#errorSearch .headerSearch .gsc-control-cse,
#errorSearch .headerSearch .gsc-control-cse-ja,
#errorSearch .headerSearch .gsib_a {
  background-color: transparent !important;
  border: 0;
  margin:0 !important;
  padding:0 !important;
}

#errorSearch .headerSearch #gsc-iw-id2 {
  border: 0;
  height: 20px;
  background-color: transparent !important;
  position: relative;
}