@charset "UTF-8";
/* --

 common.css - 共通スタイル

 ------------------------------------

 * normalize.......リセットCSS
 * base............ベースになるスタイル
 * header..........ヘッダー
 * nav     ........ナビゲーション
 * footer..........フッター

 ------------------------------------

 アイコンはアイコンフォント「Font Awesome」を使用。

 フォントサイズの指定は px と rem の2段指定（IE8対策）。

 テキスト使用フォント
 ・Noto Sans Japanese

 ブレイクポイントは以下の通り。
 ・タブレット：1023px（1024px未満をタブレットと設定）
 ・スマホ：639px（640px未満をタブレットと設定）

-- */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);
@import url(https://fonts.googleapis.com/css?family=Cantarell:400i);
@import url(https://fonts.googleapis.com/css?family=Playfair+Display);
@import url(https://fonts.googleapis.com/css?family=Titillium+Web);
/* --

 * clearfix............float解除
 * font-size...........フォントサイズ指定（px指定はIE8対策）
 * layout-baseSize.....基本のコンテンツサイズ
 * layout-posMiddle....天地中央配置
 * moving-base.........基本のアニメーション
 * FontAwesome.........アイコンフォント使用（FontAwesome）
 * opacity.............透明度設定（IE対応含む）
 * tablet..............ブレイクポイント設定（タブレット）
 * mobile..............ブレイクポイント設定（スマホ）

 ------------------------------------

 * scroll..............スクロールアイコンのスタイル
 * m-title.............タイトル共通のスタイル
 * flex................フレックスボックス


-- */
/* --

 keyframes - アニメーションキーフレーム集

 ------------------------------------

 * fade................フェードで順に表示するアニメーション
 * scroll..............スクロールアイコンに関するアニメーション
 * toggle-.............ハンバーガーアイコンに関するアニメーション

-- */
@-webkit-keyframes fade {
  100% {
    opacity: 1;
    padding: 0; } }

@keyframes fade {
  100% {
    opacity: 1;
    padding: 0; } }

@keyframes scroll {
  0% {
    opacity: 1; }
  100% {
    opacity: 0;
    -webkit-transform: translateY(33px);
    transform: translateY(33px); } }

@-webkit-keyframes scroll {
  0% {
    opacity: 1; }
  100% {
    opacity: 0;
    -webkit-transform: translateY(33px);
    transform: translateY(33px); } }

@-moz-keyframes scroll {
  0% {
    opacity: 1; }
  100% {
    opacity: 0;
    transform: translateY(33px); } }

@-webkit-keyframes toggle-top {
  0% {
    -webkit-transform: translateY(0px) rotate(-45deg);
    transform: translateY(0px) rotate(-45deg); }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  100% {
    -webkit-transform: translateY(-10px) rotate(0deg);
    transform: translateY(-10px) rotate(0deg); } }

@keyframes toggle-top {
  0% {
    -webkit-transform: translateY(0px) rotate(-45deg);
    transform: translateY(0px) rotate(-45deg); }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  100% {
    -webkit-transform: translateY(-10px) rotate(0deg);
    transform: translateY(-10px) rotate(0deg); } }

@-webkit-keyframes toggle-bottom {
  0% {
    -webkit-transform: translateY(-4px) rotate(45deg);
    transform: translateY(-4px) rotate(45deg); }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  100% {
    -webkit-transform: translateY(8px) rotate(0deg);
    transform: translateY(8px) rotate(0deg); } }

@keyframes toggle-bottom {
  0% {
    -webkit-transform: translateY(-4px) rotate(45deg);
    transform: translateY(-4px) rotate(45deg); }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  100% {
    -webkit-transform: translateY(8px) rotate(0deg);
    transform: translateY(8px) rotate(0deg); } }

@-webkit-keyframes toggle-top-close {
  0% {
    -webkit-transform: translateY(-17px) rotate(0deg);
    transform: translateY(-17px) rotate(0deg); }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  100% {
    -webkit-transform: translateY(0px) rotate(-45deg);
    transform: translateY(0px) rotate(-45deg); } }

@keyframes toggle-top-close {
  0% {
    -webkit-transform: translateY(-17px) rotate(0deg);
    transform: translateY(-17px) rotate(0deg); }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  100% {
    -webkit-transform: translateY(0px) rotate(-45deg);
    transform: translateY(0px) rotate(-45deg); } }

@-webkit-keyframes toggle-bottom-close {
  0% {
    -webkit-transform: translateY(15px) rotate(0deg);
    transform: translateY(15px) rotate(0deg); }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  100% {
    -webkit-transform: translateY(-4px) rotate(45deg);
    transform: translateY(-4px) rotate(45deg); } }

@keyframes toggle-bottom-close {
  0% {
    -webkit-transform: translateY(15px) rotate(0deg);
    transform: translateY(15px) rotate(0deg); }
  50% {
    -webkit-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg); }
  100% {
    -webkit-transform: translateY(-4px) rotate(45deg);
    transform: translateY(-4px) rotate(45deg); } }

/*-----------------------------------

	$normalize

	http://necolas.github.io/normalize.css/
	normalize ver 4.1.1 を元に改変

-----------------------------------*/
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

body {
  margin: 0; }

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

audio,
canvas,
progress,
video {
  display: inline-block; }

audio:not([controls]) {
  display: none;
  height: 0; }

progress {
  vertical-align: baseline; }

template,
[hidden] {
  display: none; }

a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  outline: none; }

a:active,
a:hover {
  outline-width: 0; }

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted; }

b,
strong {
  font-weight: inherit;
  font-weight: bolder; }

dfn {
  font-style: italic; }

h1 {
  font-size: 2em;
  margin: .67em 0; }

mark {
  background-color: #ff0;
  color: #000; }

small {
  font-size: 80%; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -.25em; }

sup {
  top: -.5em; }

img {
  border-style: none;
  height: auto;
  border: 0;
  vertical-align: middle; }

svg:not(:root) {
  overflow: hidden; }

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

ul, ol, dl, dt, dd, figure {
  padding: 0;
  margin: 0; }

hr {
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
  overflow: visible; }

button,
input,
select,
textarea {
  font: inherit;
  margin: 0; }

optgroup {
  font-weight: bold; }

button,
input {
  overflow: visible; }

button,
select {
  text-transform: none; }

button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: .35em .625em .75em; }

legend {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal; }

textarea {
  overflow: auto; }

[type="checkbox"],
[type="radio"] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0; }

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px; }

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-input-placeholder {
  color: inherit;
  opacity: .54; }

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit; }

address {
  font-style: normal; }

/*-----------------------------------

	$common

-----------------------------------*/
.container {
  padding: 3em 0; }

/*
    .lay-base
--------------------------*/
.lay-base {
  max-width: 1000px;
  margin: 0 auto 3em; }
  @media screen and (max-width: 1023px) {
    .lay-base {
      width: 96%;
      margin: 0 2% 3em; } }

/*
    .lay-title01
--------------------------*/
.lay-title01 {
  font-size: 2rem;
  font-weight: normal;
  color: #003aa0;
  position: relative;
  margin: 0 0 .5em 30px; }
  .lay-title01:before {
    content: '';
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 1px;
    margin: 0 0 0 -30px;
    background: #003aa0; }

/*
    .lay-fLeft
--------------------------*/
.lay-fLeft {
  float: left; }

/*
    .lay-fRight
--------------------------*/
.lay-fRight {
  float: right; }
  @media screen and (max-width: 639px) {
    .lay-fRight {
      float: none; } }

/*
    .lay-text
--------------------------*/
.lay-text {
  font-size: 1.5rem;
  margin: 0 0 1.8rem; }

/*
    .lay-btn
--------------------------*/
.lay-btn a {
  display: inline-block;
  background: #003aa0;
  font-size: 1.3rem;
  color: #fff;
  padding: .6em 1.1em .6em 1.8em;
  text-decoration: none;
  border-radius: 2px;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease; }
  .lay-btn a:after {
    display: inline-block;
    content: "\f0da";
    font-family: Fontawesome;
    margin: 0 .2em 0 .8em;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease; }
  .lay-btn a:hover {
    background: #00286d; }
    .lay-btn a:hover:after {
      margin: 0 0 0 1em; }

.lay-btn_b a {
  display: inline-block;
  background: #f29b4c;
  font-size: 1.3rem;
  color: #fff;
  padding: .6em 1.8em .6em 1.8em;
  text-decoration: none;
  border-radius: 2px;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease; }
  .lay-btn_b a:after {
    display: inline-block;
    content: "\f0da";
    font-family: Fontawesome;
    margin: 0 .2em 0 .8em;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease; }
  .lay-btn_b a:hover {
    background: #f2804c; }
    .lay-btn_b a:hover:after {
      margin: 0 0 0 1em; }
/*
    .lay-list
--------------------------*/
.lay-list li {
  margin: 0 0 1.5em;
  font-size: 1.3rem;
  line-height: 1.8; }
  .lay-list li span {
    font-size: 1.5rem;
    margin: 0 0 0 -8px; }
  .lay-list li:before {
    position: relative;
    top: -2px;
    left: -20px;
    display: inline-block;
    width: 8px;
    height: 8px;
    content: '';
    background: #003aa0; }

/*
    .lay-pcNone
--------------------------*/
.lay-pcNone {
  display: none; }
  @media screen and (max-width: 1023px) {
    .lay-pcNone {
      display: block; } }
  @media screen and (max-width: 639px) {
    .lay-pcNone {
      display: block; } }

/*
    .lay-pcOnly
--------------------------*/
.lay-pcOnly {
  display: block; }
  @media screen and (max-width: 1023px) {
    .lay-pcOnly {
      display: none; } }
  @media screen and (max-width: 639px) {
    .lay-pcOnly {
      display: none; } }

/*
    .lay-spNone
--------------------------*/
.lay-spNone {
  display: block; }
  @media screen and (max-width: 1023px) {
    .lay-spNone {
      display: block; } }
  @media screen and (max-width: 639px) {
    .lay-spNone {
      display: none; } }

/*
    .lay-spOnly
--------------------------*/
.lay-spOnly {
  display: none; }
  @media screen and (max-width: 1023px) {
    .lay-spOnly {
      display: none; } }
  @media screen and (max-width: 639px) {
    .lay-spOnly {
      display: block; } }

/*
    figcaption
--------------------------*/
figcaption {
  text-align: center; }

/*
    fixbody
--------------------------*/
@media screen and (max-width: 639px) {
  .fixbody {
    width: 100%;
    height: 100%;
    overflow: hidden; }
    .fixbody .header {
      height: 100%; } }

/*-----------------------------------

	$base

-----------------------------------*/
html {
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  font-size: 62.5%;
  min-width: 100%;
  min-height: 100%; }

[id="wrapper"] {
  overflow: hidden; }

body {
  color: #444;
  font-family: "Noto Sans Japanese", sans-serif;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.6;
  letter-spacing: .1em; }

a {
  color: inherit; }
  a:hover {
    text-decoration: none; }

li {
  list-style: none;
  line-height: 1.4; }

p {
  margin: 0; }

/*
    clearfix
--------------------------*/
.clearfix:after {
  content: "";
  display: table;
  clear: both; }

/*-----------------------------------

	$header

-----------------------------------*/
.header {
  width: 100%;
  height: 90px;
  position: fixed;
  top: 0;
  z-index: 999;
  background: #fff; }
  .header a {
    text-decoration: none; }
  .header__wrap {
    max-width: 1000px;
    margin: 0 auto;
    overflow: hidden;
    height: 100%; }
  .header__inner {
    height: 100%;
    display: table;
    float: left; }
  .header__company {
    display: table-cell;
    vertical-align: middle; }
  .header__logo {
    margin: 0;
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: normal;
    float: left; }
    .header__logo span {
      display: block;
      font-family: "Sawarabi Mincho";
      letter-spacing: normal;
      font-weight: 600; }
    .header__logo img {
      width: 175.5px;
      margin: 0 .6em 0 0; }
    .header__logo p {
      display: inline-block; }
  .header__name {
    letter-spacing: normal;
    float: left;
    margin: .5em 0 0; }
    .header__name span {
      font-size: 1.8rem;
      font-weight: 500;
      color: #0290bf; }
  .header__menu {
    height: 100%;
    position: absolute;
    top: 0;
    right: 0; }
    .header__menu:after {
      content: "";
      display: table;
      clear: both; }
    .header__menu p {
      display: table;
      height: 100%;
      float: left;
      padding: .8em;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      .header__menu p span {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        display: block;
        border: 1px solid #003aa0;
        color: #003aa0;
        padding: .2em 1em .3em; }
    .header__menu ul {
      height: 100%;
      float: right; }
    .header__menu li {
      width: 10em;
      height: 100%;
      display: table;
      background: #0290bf;
      text-align: center;
      float: left; }
      .header__menu li:first-child a {
        background: #003aa0; }
        .header__menu li:first-child a:hover {
          background: #00286d; }
          .header__menu li:first-child a:hover:after {
            margin: 0 0 0 1.2em; }
    .header__menu a {
      display: table-cell;
      vertical-align: middle;
      width: 100%;
      height: 100%;
      text-decoration: none;
      color: #fff;
      -o-transition: all 0.3s ease;
      transition: all 0.3s ease;
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease; }
      .header__menu a:after {
        display: inline-block;
        content: "";
        font-family: Fontawesome;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        margin: 0 .2em 0 1em; }
      .header__menu a:hover {
        background: #016a8d;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease; }
        .header__menu a:hover:after {
          margin: 0 0 0 1.2em; }

/*-----------------------------------

	$header - tablet

-----------------------------------*/
@media screen and (max-width: 1023px) {
  .header {
    height: 70px; }
    .header__inner {
      margin: 0 0 0 1em; } }

/*-----------------------------------

	$header - mobile

-----------------------------------*/
@media screen and (max-width: 639px) {
  .header {
    height: 50px; }
    .header__logo {
      margin: 0;
      font-size: 18px;
      font-size: 1.8rem; }
      .header__logo img {
        width: 117px; }
    .header__name {
      font-size: 12px;
      font-size: 1.2rem;
      margin: 0; }
      .header__name span {
        font-size: 13px;
        font-size: 1.3rem; } }

/*-----------------------------------

	$nav

-----------------------------------*/
.nav__globalnav {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: right;
  margin: 3.5em 0 0; }
  .nav__globalnav:after {
    content: "";
    display: table;
    clear: both; }
  .nav__globalnav > li {
    cursor: pointer;
    border-left: solid 1px #444;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    text-align: center;
    line-height: 1;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    padding: 0 1em; }
    .nav__globalnav > li:first-child {
      border-left: none; }
    .nav__globalnav > li:hover {
      color: #0290bf; }

.nav__accordion {
  border-top: solid 3px #0290bf;
  background: rgba(255, 255, 255, 0.96);
  position: absolute;
  width: 100%;
  top: 90px;
  left: 0; }
  .nav__accordion-open {
    max-width: 1000px;
    margin: 0 auto;
    padding: 3em 6%;
    position: relative; }
    .nav__accordion-open:before {
      content: '';
      display: block;
      width: 0;
      height: 0;
      border: 5px solid transparent;
      border-bottom: 5px solid #0290bf; }
  .nav__accordion figure {
    width: 26%;
    padding: 0 6% 0 0;
    float: left; }
  .nav__accordion ul {
    float: left;
    margin: 0 8% 0 0; }
  .nav__accordion li {
    line-height: 2;
    position: relative; }
    .nav__accordion li:before {
      content: '';
      position: absolute;
      top: 50%;
      display: block;
      width: 20px;
      height: 1px;
      background: #0290bf; }
    .nav__accordion li span {
      margin: 0 0 0 45px; }
  .nav__accordion a:hover {
    text-decoration: underline; }

/*
   .open-company
----------------------------------------------*/
.open-company .nav__accordion-open:before {
  position: absolute;
  top: -13px;
  left: 49.5%; }

/*
   .open-service
----------------------------------------------*/
.open-service .nav__accordion-open:before {
  position: absolute;
  top: -13px;
  left: 58%; }

/*-----------------------------------

	$nav - tablet

-----------------------------------*/
@media screen and (max-width: 1023px) {
  .nav__toggle {
    width: 50px;
    height: 50px;
    cursor: pointer;
    display: block;
    position: absolute;
    background: #499dde;
    right: 15px;
    top: 10px;
    z-index: 1000; }
  .nav__trigger {
    display: block;
    width: 50px;
    height: 50px; }
    .nav__trigger span {
      display: block;
      background: #fff;
      width: 32px;
      height: 2px;
      position: absolute;
      left: 9px;
      -o-transition: all 0.5s;
      transition: all 0.5s;
      -webkit-transition: all 0.5s;
      -moz-transition: all 0.5s; }
      .nav__trigger span:first-child {
        top: 12px; }
      .nav__trigger span:nth-child(2) {
        margin-top: -1px;
        top: 50%; }
      .nav__trigger span:last-child {
        bottom: 12px; }
    .nav__trigger.active span:first-child {
      -webkit-transform: translateY(12px) rotate(45deg);
      -moz-transform: translateY(12px) rotate(45deg);
      -ms-transform: translateY(12px) rotate(45deg);
      transform: translateY(12px) rotate(45deg); }
    .nav__trigger.active span:nth-child(2) {
      opacity: 0; }
    .nav__trigger.active span:last-child {
      -webkit-transform: translateY(-12px) rotate(-45deg);
      -moz-transform: translateY(-12px) rotate(-45deg);
      -ms-transform: translateY(-12px) rotate(-45deg);
      transform: translateY(-12px) rotate(-45deg); }
  .nav__globalnav {
    display: none;
    width: 100%;
    position: absolute;
    left: 0;
    top: 70px;
    background: #fff;
    border-top: solid 1px #0290bf;
    margin: 0;
    padding: 0 0 1em; }
    .nav__globalnav ul:last-of-type {
      margin: 0 0 4.5em; }
    .nav__globalnav ul li:first-child {
      padding: 1em 0;
      color: #0290bf; }
    .nav__globalnav ul li span {
      position: relative; }
      .nav__globalnav ul li span:before {
        display: inline-block;
        content: '';
        width: 30%;
        height: 1px;
        background: #0290bf;
        position: absolute;
        top: 50%;
        left: -50%; }
      .nav__globalnav ul li span:after {
        display: inline-block;
        content: '';
        width: 30%;
        height: 1px;
        background: #0290bf;
        position: absolute;
        top: 50%;
        right: -50%; }
    .nav__globalnav li {
      float: none;
      border-left: none;
      text-align: center;
      padding: 0; }
      .nav__globalnav li a {
        display: block;
        width: 60%;
        margin: .5em auto;
        padding: 1em 0;
        background: rgba(2, 144, 191, 0.2); } }

/*-----------------------------------

	$nav - mobile

-----------------------------------*/
@media screen and (max-width: 639px) {
  .nav__toggle {
    right: 0;
    top: 0; }
  .nav__globalnav {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 3em 0;
    overflow-y: scroll;
    border-top: none; }
    .nav__globalnav ul:last-of-type {
      margin: 0 0 3em; }
    .nav__globalnav li a {
      width: 70%;
      padding: .5em 0; } }

/*-----------------------------------

	$pagetitle

-----------------------------------*/
#particles {
  width: 100%;
  height: 200px;
  overflow: hidden;
  margin: 90px 0 0; }

.pagetitle {
  background: -webkit-gradient(linear, right top, left top, from(#007c9a), to(#2761c7));
  background: -webkit-linear-gradient(right, #007c9a, #2761c7);
  background: -o-linear-gradient(right, #007c9a, #2761c7);
  background: linear-gradient(-90deg, #007c9a, #2761c7);
  margin: 90px 0 0;
  position: relative; }
  .pagetitle__inner {
    text-align: center; }
  .pagetitle__title {
    display: inline-block;
    color: #fff;
    font-size: 2.6rem;
    font-weight: normal; }
    .pagetitle__title span {
      border-radius: 1px;
      background: #f29b4c;
      vertical-align: text-top;
      font-size: 1.4rem;
      padding: .1em .7em; }

.company01 .pagetitle__inner,
.company02 .pagetitle__inner,
.company03 .pagetitle__inner,
.company04 .pagetitle__inner,
.company05 .pagetitle__inner,
.service01 .pagetitle__inner,
.service02 .pagetitle__inner,
.service03 .pagetitle__inner,
.service04 .pagetitle__inner,
.service05 .pagetitle__inner {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -4em; }

.news .pagetitle__inner,
.terms .pagetitle__inner,
.contact .pagetitle__inner,
.example .pagetitle__inner {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -3em; }

/*
	会社案内　ごあいさつ
-----------------------------------*/
.company01 .pagetitle__inner {
  margin-left: -4em; }

/*
	会社案内　概要・沿革
-----------------------------------*/
.company02 .pagetitle span {
  background: #ed6464; }

.company02 .pagetitle__inner {
  margin-left: -4em; }

/*
	会社案内　組織図
-----------------------------------*/
.company03 .pagetitle span {
  background: #27ad50; }

.company03 .pagetitle__inner {
  margin-left: -9em; }

/*
	会社案内　行動計画
-----------------------------------*/
.company04 .pagetitle span {
  background: #af75bc; }

.company04 .pagetitle__inner {
  margin-left: -9em; }

/*
	会社案内　コーポレートステートメント
-----------------------------------*/
.company05 .pagetitle span {
  background: #143a7c; }

.company05 .pagetitle__inner {
  margin-left: -7.5em; }

/*
	製品サービス　研究開発
-----------------------------------*/
.service01 .pagetitle__inner {
  margin-left: -6em; }

/*
	製品サービス　プロダクト
-----------------------------------*/
.service02 .pagetitle span {
  background: #ed6464; }

.service02 .pagetitle__inner {
  margin-left: -6em; }

/*
	製品サービス　工事・保守
-----------------------------------*/
.service03 .pagetitle span {
  background: #143a7c; }

.service03 .pagetitle__inner {
  margin-left: -5em; }

/*
	製品サービス　ソフトウェア開発
-----------------------------------*/
.service04 .pagetitle span {
  background: #27ad50; }

.service04 .pagetitle__inner {
  margin-left: -7em; }

/*
	製品サービス　ネットワーク
-----------------------------------*/
.service05 .pagetitle span {
  background: #af75bc; }

.service05 .pagetitle__inner {
  margin-left: -7em; }

/*
	技報・カタログ、リンク・著作権
-----------------------------------*/
.news .pagetitle__inner, .terms .pagetitle__inner {
  margin-left: -8em; }

/*
	お問い合わせ
-----------------------------------*/
.contact .pagetitle__inner {
  margin-left: -6em; }

/*
	導入事例
-----------------------------------*/
.example .pagetitle__inner {
  margin-left: -4em; }

/*-----------------------------------

	$pagetitle - tablet

-----------------------------------*/
@media screen and (max-width: 1023px) {
  .pagetitle {
    margin: 70px 0 0; }
  #particles {
    margin: 70px 0 0; } }

/*-----------------------------------

	$pagetitle - mobile

-----------------------------------*/
@media screen and (max-width: 639px) {
  .pagetitle {
    margin: 50px 0 0; }
  #particles {
    margin: 50px 0 0; }
  /*
	一般事業主行動計画
-----------------------------------*/
  .company04 .pagetitle__inner {
    margin-left: -9.5em; }
  /*
	研究開発、工事・保守
-----------------------------------*/
  .service01 .pagetitle__inner,
  .service03 .pagetitle__inner {
    margin-left: -6em; }
  /*
	ネットワークソリューション
-----------------------------------*/
  .service05 .pagetitle__inner {
    margin-left: -8em; }
  .news .pagetitle__inner,
  .terms .pagetitle__inner {
    margin-left: -7em; } }

/*-----------------------------------

	$breadcrumb

-----------------------------------*/
.breadcrumb {
  background: -webkit-linear-gradient(left, #0081a0, #003aa0);
  background: -moz-linear-gradient(left, #0081a0, #003aa0);
  background: -o-linear-gradient(left, #0081a0, #003aa0);
  background: -webkit-gradient(linear, left top, right top, from(#0081a0), to(#003aa0));
  background: linear-gradient(to right, #0081a0, #003aa0);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#0081a0, endColorstr='#003aa0', GradientType=1)";
  padding: 0 0 1px 0; }
  .breadcrumb__inner {
    background: #fff;
    overflow: hidden;
    padding: .3em 0; }
  .breadcrumb ul {
    max-width: 1000px;
    margin: 0 auto; }
  .breadcrumb li {
    float: left; }
    .breadcrumb li:not(:first-child):before {
      content: "\f105";
      font-family: FontAwesome;
      margin: 0 .5em; }

/*-----------------------------------

	$breadcrumb - tablet

-----------------------------------*/
@media screen and (max-width: 1023px) {
  .breadcrumb ul {
    width: 96%;
    margin: 0 2%; } }

/*-----------------------------------

	$breadcrumb - mobile

-----------------------------------*/
@media screen and (max-width: 639px) {
  .breadcrumb__inner {
    letter-spacing: normal; } }

/*-----------------------------------

	$footer

-----------------------------------*/
.footer {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #555;
  color: #fff;
  font-size: 1.2rem; }
  .footer__pagetop {
    display: block;
    width: 100%;
    font-size: 14px;
    font-size: 1.4rem;
    text-align: center; }
    .footer__pagetop a {
      display: block;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      padding: .4em 0;
      background: #0290bf;
      color: #fff;
      -o-transition: all 0.3s ease;
      transition: all 0.3s ease;
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease; }
      .footer__pagetop a:hover {
        background: #016a8d; }
  .footer__map {
    width: 100%;
    height: 330px; }
    .footer__map a {
      color: #0290bf; }
  .footer__inner {
    display: table;
    width: 1000px;
    margin: 0 auto;
    padding: 4em 0; }
    .footer__inner:after {
      content: "";
      display: table;
      clear: both; }
  .footer__logo {
    display: block;
    font-size: 1.4rem;
    font-weight: normal;
    margin: 0 0 2.5em; }
    .footer__logo img {
      width: 175.5px;
      margin: 0 0 1em; }
    .footer__logo span {
      font-size: 1.8rem; }
  .footer__menu {
    display: table-cell;
    vertical-align: top;
    padding: 0 0 0 2.6em; }
    .footer__menu:first-child {
      margin: 0;
      border-right: dotted 1px #fff; }
    .footer__menu:last-child ul {
      margin: 2.6em 0 4em 2em; }
    .footer__menu a {
      text-decoration: none; }
      .footer__menu a:before {
        display: inline-block;
        content: "";
        font-family: Fontawesome;
        margin: 0 .4em 0 0; }
      .footer__menu a:hover {
        text-decoration: underline; }
    .footer__menu ul {
      font-size: .9em;
      margin: .6em 0 4em 2em; }
    .footer__menu li {
      line-height: 2; }
  .footer__category {
    font-size: 1.6rem;
    font-weight: bold;
    margin: 0 0 1em;
    line-height: .9;
    letter-spacing: normal; }
  .footer__btn {
    display: none; }
  .footer__copyright {
    width: 100%;
    background: #0290bf;
    padding: .8em 0;
    text-align: center;
    font-size: 12px;
    font-size: 1.2rem;
    color: #fff; }

/*-----------------------------------

	$footer - tablet

-----------------------------------*/
@media screen and (max-width: 1023px) {
  .footer__inner {
    width: 100%; }
  .footer__menu {
    padding: 0;
    text-align: center; }
    .footer__menu:first-child {
      border-right: none; }
    .footer__menu:not(:first-child) {
      display: none; } }

/*-----------------------------------

	$print

-----------------------------------*/
@media print {
  .header {
    position: static; } }