@charset "utf-8";

/*========================================================================================================================


  ◇◆◇ レイアウト ◇◆◇
  
  1.  header
  2.  nav
  3.  contents
  4.  footer
  99. parts  
  
  
========================================================================================================================*/

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

  1. header
  
----------------------------------------------------------------------------------------------------*/

header {
  width:100%;
  background-color:#0f64b9;
  display:table;
  position:relative;
  color:#fff;
}

header a,
header a:hover,
header a:visited {
  color:#fff;
  text-decoration:none;
}

.hd-title,
.hd-tel,
.hd-contact,
.hd-sp-nav-btn {
  display:table-cell;
  vertical-align:middle;
  box-sizing:border-box;
  padding-top:8px;
  padding-bottom:8px;
  white-space:nowrap;
}

@media (min-width:360px) {
  header {
    min-width:320px;
  }
}

@media (max-width:400px) {
  .hd-title,
  .hd-tel,
  .hd-contact,
  .hd-sp-nav-btn {
    padding-top:5px;
    padding-bottom:5px;
  }
}


/*-----------------------------------------------------------------------------------
  タイトル
-----------------------------------------------------------------------------------*/

.hd-title {
  width:100%;
  padding-left:15px;
  padding-right:15px;
  text-align:left;
  font-size:105%;
}

.hd-title-s {
  font-weight:normal;
  margin-left:60px;
  display:block;
  font-size:68.8%;
}

.hd-title-cname {
  display:block;
  font-size:118.8%;
}

.hd-title-s,
.hd-title-cname {
  line-height:1.5;
}

.hd-title-s:after {
  content:"\A";
  white-space:pre;
}

.hd-title-cname:before {
  content:"";
  background-repeat:no-repeat;
  background-position:0 0;
  background-size:100% 100%;
  width:45px;
  height:38px;
  display:inline-block;
  float:left;
  margin-top:-0.8em;
  margin-right:15px;
}

.svg .hd-title-cname:before               { background-image:url(../image/icon/white/logo.svg); }
.no-svg .hd-title-cname:before            { background-image:url(../image/icon/white/logo.png); }
.no-backgroundsize .hd-title-cname:before { background:none; content:url(../image/icon/white/logo-s.png); }

.hd-title a {
  display:block;
  padding-top:0.15em;
}

@media (min-width:661px) and (max-width:680px) {
  .hd-title-s {
    font-size:1.5vw;
  }
}

@media (min-width:641px) and (max-width:660px) {
  .hd-title-s {
    font-size:1.4vw;
  }
}

@media (max-width:767px) {
  .hd-title-cname:before {
    width:40px;
    height:34px;
    margin-right:10px;
  }

  .hd-title-s {
    margin-left:50px;
    margin-bottom:0.15em;
  }
}

@media (max-width:500px) {
  .hd-title {
    padding-left:3%;
    padding-right:3%;
  }
  
  .hd-title-s {
    margin-left:0;
    margin-bottom:0.25em;
    font-size:2.2vw;
  }
  
  .hd-title-cname:before {
    width:24px;
    height:20px;
    margin-top:0;
    float:none;
    margin-right:0.5em;
    margin-top:0.05em;
    vertical-align:top;
  }
}

@media (max-width:400px) {
  .hd-title-cname {
    font-size:110%;
  }
  
  .hd-title-cname:before {
    width:22px;
    height:18px;
  }
}

/*
@media (min-width:401px) and (max-width:420px) {
  .hd-title-s {
    font-size:2.4vw;
  }
}

@media (min-width:320px) and (max-width:400px) {
  .hd-title-s {
    font-size:2.25vw;
  }
}

@media (min-width:320px) and (max-width:330px) {
  .hd-title-cname {
    font-size:4.8vw;
  }
}
*/

/*
@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width:400px) {
  .hd-title-s {
    width:100px;
    -webkit-transform:scale(0.9);
    -webkit-transform-origin:0 0;
  }
}

@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width:380px) {
  .hd-title-s {
    -webkit-transform:scale(0.85);
    -webkit-transform-origin:0 0;
  }
}

@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width:360px) {
  .hd-title-s {
    -webkit-transform:scale(0.8);
    -webkit-transform-origin:0 0;
  }
}

@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width:340px) {
  .hd-title-s {
    -webkit-transform:scale(0.7);
    -webkit-transform-origin:0 0;
  }
}
*/


/*-----------------------------------------------------------------------------------
  TEL
-----------------------------------------------------------------------------------*/

.hd-tel {
  text-align:center;
  line-height:1.3;
  border-left:1px solid rgba(255,255,255,0.2);
  padding-left:20px;
  padding-right:20px;
}

.no-rgba .hd-tel { border-left:1px solid #3f83c7; }

.hd-tel-no {
  letter-spacing:-0.5px;
  font-size:170%;
}

.hd-tel-no:before {
  content:"";
  background-repeat:no-repeat;
  background-position:center center;
  background-size:auto 26px;
  width:26px;
  height:28px;
  display:inline-block;
  vertical-align:middle;
  margin-right:5px;
  margin-top:-0.25em;
}

.svg .hd-tel-no:before               { background-image:url(../image/icon/white/tel.svg); }
.no-svg .hd-tel-no:before            { background-image:url(../image/icon/white/tel.png); }
.no-backgroundsize .hd-tel-no:before { background:none; content:url(../image/icon/white/tel-s.png); }

.hd-tel-time-wrap {
  line-height:1.3;
  font-size:68.8%;
  display:inline-block;
  text-align:left;
  margin-left:0.75em;
  margin-top:0.25em;
}

.hd-tel-time--day:after {
  content:"\A";
  white-space:pre;
}

@media (min-width:641px) and (max-width:767px) {
  .hd-tel {
    position:relative;
  }

  .hd-tel-no:before {
    background-size:auto 24px;
    width:21px;
    height:24px;
    margin-top:-0.15em;
  }
  
  .hd-tel a:after {
    content:"\A";
    white-space:pre;
  }

  .hd-tel-time-wrap {
    display:block;
    text-align:center;
    margin-top:-0.15em;
  }
  
  .hd-tel-time--day {
    display:inline-block;
    margin-right:0.5em;
  }
}

@media (max-width:640px) {
  .hd-tel {
    padding-left:0.5em;
    padding-right:0.5em;
    position:relative;
  }
  
  .hd-tel-time--day,
  .hd-tel-no,
  .hd-tel a span {
    display:none;
  }

  .hd-tel a:before {
    content:"";
    background-repeat:no-repeat;
    background-position:center center;
    background-size:auto 22px;
    width:100%;
    height:22px;
    display:inline-block;
    vertical-align:middle;
  }
  
  .svg .hd-tel a:before               { background-image:url(../image/icon/white/tel.svg); }
  .no-svg .hd-tel a:before            { background-image:url(../image/icon/white/tel.png); }
  .no-backgroundsize .hd-tel a:before { background:none; content:url(../image/icon/white/tel-s.png); }

  .hd-tel-time-wrap {
    display:block;
    text-align:center;
    margin-left:0;
    margin-top:0.75em;
  }
}

@media (max-width:500px) {
  .hd-tel a:before {
    background-size:auto 20px;
    height:20px;
  }
}

@media (max-width:360px) {
  .hd-tel a:before {
    background-size:auto 16px;
    height:16px;
  }
  
  .hd-tel-time-wrap:before {
    bottom:1px;
  }
}


/*-----------------------------------------------------------------------------------
  問い合わせ
-----------------------------------------------------------------------------------*/

.hd-contact {
  text-align:center;
  -webkit-transition:background-color ease 0.5s;
  -moz-transition:background-color ease 0.5s;
  -ms-transition:background-color ease 0.5s;
  -o-transition:background-color ease 0.5s;
  transition:background-color ease 0.5s;
  background-color:#093b6c;
  padding-left:22px;
  padding-right:20px;
}

.hd-contact a:before {
  content:"";
  background-repeat:no-repeat;
  background-position:0 0;
  background-size:100% 100%;
  width:26px;
  height:20px;
  display:inline-block;
  vertical-align:middle;
  margin-right:12px;
  margin-top:-0.25em;
}

.svg .hd-contact a:before               { background-image:url(../image/icon/white/mail.svg); }
.no-svg .hd-contact a:before            { background-image:url(../image/icon/white/mail.png); }
.no-backgroundsize .hd-contact a:before { background:none; content:url(../image/icon/white/mail-s.png); }

.lte-ie8 .hd-contact:hover {
  background-color:#00a08c;
}

@media screen and (min-width:1024px) {
  .hd-contact:hover {
    background-color:#00a08c;
  }
}

@media (max-width:767px) {
  .hd-contact {
    display:none;
  }
}


/*-----------------------------------------------------------------------------------
  スマホ用ナビボタン
-----------------------------------------------------------------------------------*/

@media screen and (min-width:1024px) {
  .hd-sp-nav-btn {
    display:none;
  }
}

@media (max-width:767px) {
  .hd-sp-nav-btn span {
    content:"";
    display:inline-block;
    padding-top:0.15em;
  }
  
  .hd-sp-nav-btn span:after {
    font-size:70%;
    content:"MENU";
    display:block;
    text-align:center;
  }

  .hd-sp-nav-btn {
    cursor:pointer;
    line-height:1.6;
    display:table-cell;
    background-color:#093b6c;
    padding-left:15px;
    padding-right:15px;
    -webkit-transition:all ease 0.3s;
    -moz-transition:all ease 0.3s;
    -ms-transition:all ease 0.3s;
    -o-transition:all ease 0.3s;
    transition:all ease 0.3s;
  }
  
  .hd-sp-nav-btn span:before {
    content:"";
    background-repeat:no-repeat;
    background-position:center center;
    background-size:auto 16px;
    width:100%;
    height:16px;
    display:inline-block;
    vertical-align:middle;
  }

  .svg .hd-sp-nav-btn span:before               { background-image:url(../image/icon/white/nav-btn.svg); }
  .no-svg .hd-sp-nav-btn span:before            { background-image:url(../image/icon/white/nav-btn.png); }
  .no-backgroundsize .hd-sp-nav-btn span:before { background:none; content:url(../image/icon/white/nav-btn-s.png); }

  .hd-sp-nav-btn span:after {
    padding-top:0.15em;
  }
}

@media (max-width:640px) {
  .hd-sp-nav-btn {
    padding-left:1em;
    padding-right:1em;
  }

  .hd-sp-nav-btn span:before {
    height:22px;
  }
  
  .hd-sp-nav-btn span:after {
    padding-top:0.5em;
  }
}

@media (max-width:500px) {
  .hd-sp-nav-btn span:before {
    background-size:auto 14px;
    height:20px;
  }
}

@media (max-width:400px) {
  .hd-sp-nav-btn {
    padding-left:0.75em;
    padding-right:0.75em;
  }
  
  .hd-sp-nav-btn span:after {
    padding-top:0.4em;
  }
}

@media (max-width:360px) {
  .hd-sp-nav-btn span:before {
    background-size:auto 12px;
    height:16px;
  }
  
  .hd-sp-nav-btn span:after {
    padding-top:0.3em;
  }
}


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

  2. nav
  
----------------------------------------------------------------------------------------------------*/

.first-preload .pc--gl-nav,
.first-preload .sp--gl-nav {
}

.preload .pc--gl-nav,
.preload .pc--gl-nav *,
.preload .sp--gl-nav,
.preload .sp--gl-nav * {
  -webkit-transition:none !important;
  -moz-transition:none !important;
  -ms-transition:none !important;
  -o-transition:none !important;
  transition:none !important;
  animation:none !important;
}

.pc--gl-nav {
  width:100%;
  min-width:1160px;
  z-index:99;
}

.pc--gl-nav nav {
  background-color:#fff;
  -webkit-transition:all ease 0.3s;
  -moz-transition:all ease 0.3s;
  -ms-transition:all ease 0.3s;
  -o-transition:all ease 0.3s;
  transition:all ease 0.3s;
}

@media only screen {
  .pc--gl-nav.fixed {
    width:100%;
    min-width:1160px;
    position:fixed;
    top:0;
    left:0;
  }
  
  .pc--gl-nav.fixed nav {
    background-color:#0f64b9;
    color:#fff;
  }
}

.pc--gl-nav ul {
  width:100%;
  max-width:1132px;
  margin-left:auto;
  margin-right:auto;
  text-align:center;
  display:table;
  padding-left:1em;
  padding-right:1em;
  box-sizing:border-box;
}
      
.pc--gl-nav .gl-nav_item {
  display:table-cell;
}
      
.pc--gl-nav .gl-nav_item > a {
  font-size:93.8%; /* 15px */
  display:block;
  text-decoration:none;
  color:#1e1e1e;
  padding:25px 1em 17px 1em;
  box-sizing:border-box;
  position:relative;
  -webkit-transition:padding ease 0.3s;
  -moz-transition:padding ease 0.3s;
  -ms-transition:padding ease 0.3s;
  -o-transition:padding ease 0.3s;
  transition:padding ease 0.3s;
}

@media only screen {
  .csstransitions .pc--gl-nav.fixed .gl-nav_item > a {
    padding-top:15px;
    padding-bottom:12px;
  }
}

.sp--gl-nav-warp {
  display:none;
}


/* スマホ ----------------------------------------*/

@media print {
  .sp--gl-nav-warp {
    display:none !important;
  }
}

@media (max-width:767px) {
  .pc--gl-nav-warp {
    display:none;
  }

  .sp--gl-nav-warp {
    display:block;
    text-align:left;
  }
  
  .sp--gl-nav {
    height:100%;
  }
  
  .sp--gl-nav.active {
    right:0;
  }
  
  .sp--gl-nav {
    background-color:#fff;
    position:fixed;
    top:0;
    right:-420px;
    z-index:102;
    width:420px;
    min-height:100%;
    -webkit-transition:right ease 0.4s, width ease 0.4s;
    -moz-transition:right ease 0.4s, width ease 0.4s;
    -ms-transition:right ease 0.4s, width ease 0.4s;
    -o-transition:right ease 0.4s, width ease 0.4s;
    transition:right ease 0.4s, width ease 0.4s;
  }

  .sp--gl-nav-head {
    width:100%;
    text-align:right;
    display:block;
    box-sizing:border-box;
    z-index:2;
    font-size:0;
    line-height:0;
  }
  
  .sp--gl-nav-close-btn {
    background-repeat:no-repeat;
    background-position:center center;
    background-size:auto 22px;
    width:28px;
    height:22px;
    display:inline-block;
    cursor:pointer;
    padding:20px 15px;
    font-size:0;
    line-height:0;
  }

  .svg .sp--gl-nav-close-btn    { background-image:url(../image/icon/gray/close.svg); }
  .no-svg .sp--gl-nav-close-btn { background-image:url(../image/icon/gray/close.png); }

  .sp--gl-nav .gl-nav_item > a {
    display:block;
    padding-top:0.8em;
    padding-bottom:0.8em;
    border-top:1px solid #dcdcdc;
    position:relative;
  }
  
  .sp--gl-nav .gl-nav_item:last-child > a {
    border-bottom:1px solid #dcdcdc;
  }

  .sp--gl-nav .gl-nav_item > a,
  .sp--gl-nav .gl-nav_item > a:visited,
  .sp--gl-nav .gl-nav_item > a:hover {
    color:inherit;
    text-decoration:none;
  }

  .csstransforms .sp--gl-nav .gl-nav_item > a:after {
    content:"";
    display:inline-block;
    width:7px;
    height:7px;
    position:absolute;
    right:5%;
    top:1.5em;
    border-right:1px solid #969696;
    border-bottom:1px solid #969696;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
  }
}

@media (max-width:500px) {
  .sp--gl-nav .gl-nav_item > a {
    padding-top:1em;
    padding-bottom:1em;
  }
  
  .sp--gl-nav {
    width:100%;
    right:-100%;
  }
}

@media (max-width:400px) {
  .sp--gl-nav-close-btn {
    padding:15px 10px;
    background-size:auto 20px;
    width:25px;
    height:20px;
  }
}


/* ページビューNo ----------------------------------------*/

.gl-nav_item .viewNo {
  font-size:62.5%;
  line-height:1;
  box-sizing:border-box;
  display:inline-block;
  /*
  background-color:#f09614;
  border:1px solid #f09614;
  */
  background-color:#f0554b;
  border:1px solid #f0554b;
  color:#fff;
  text-align:center;
  width:2em;
  height:2em;
  padding-top:0.45em;
  border-radius:100%;
  -moz-border-radius:100%;
  -webkit-border-radius:100%;
  position:absolute;
  right:0;
  top:2em;
}

.gl-nav_item--hp .viewNo {
  right:3em;
}

.gl-nav_item .viewNo-hide {
  display:none;
}

@media (max-width:767px) {
  .gl-nav_item .viewNo {
    position:inherit;
    right:inherit;
    top:inherit;
    vertical-align:middle;
    margin-left:1em;
  }
}


/*-----------------------------------------------------------------------------------
  アイコン
-----------------------------------------------------------------------------------*/

.gl-nav_item > a:before {
  content:"";
  background-repeat:no-repeat;
  background-position:center center;
  background-size:contain;
  display:block;
  margin-bottom:0.5em;
  width:100%;
  height:35px;
}
  
.no-backgroundsize .gl-nav_item > a:before {
  width:100%;
  height:35px;
  text-align:center;
}

.svg .gl-nav_item--home > a:before               { background-image:url(../image/icon/glNav/blue/home.svg); }
.no-svg .gl-nav_item--home > a:before            { background-image:url(../image/icon/glNav/blue/home.png); }
.no-backgroundsize .gl-nav_item--home > a:before { background:none; content:url(../image/icon/glNav/blue/home-s.png); }
        
.svg .gl-nav_item--nav > a:before               { background-image:url(../image/icon/glNav/blue/nav.svg); }
.no-svg .gl-nav_item--nav > a:before            { background-image:url(../image/icon/glNav/blue/nav.png); }
.no-backgroundsize .gl-nav_item--nav > a:before { background:none; content:url(../image/icon/glNav/blue/nav-s.png); }
        
.svg .gl-nav_item--hp > a:before               { background-image:url(../image/icon/glNav/blue/hp.svg); }
.no-svg .gl-nav_item--hp > a:before            { background-image:url(../image/icon/glNav/blue/hp.png); }
.no-backgroundsize .gl-nav_item--hp > a:before { background:none; content:url(../image/icon/glNav/blue/hp-s.png); }
        
.svg .gl-nav_item--works > a:before               { background-image:url(../image/icon/glNav/blue/works.svg); }
.no-svg .gl-nav_item--works > a:before            { background-image:url(../image/icon/glNav/blue/works.png); }
.no-backgroundsize .gl-nav_item--works > a:before { background:none; content:url(../image/icon/glNav/blue/works-s.png); }
        
.svg .gl-nav_item--ad > a:before               { background-image:url(../image/icon/glNav/blue/ad.svg); }
.no-svg .gl-nav_item--ad > a:before            { background-image:url(../image/icon/glNav/blue/ad.png); }
.no-backgroundsize .gl-nav_item--ad > a:before { background:none; content:url(../image/icon/glNav/blue/ad-s.png); }
        
.svg .gl-nav_item--server > a:before               { background-image:url(../image/icon/glNav/blue/server.svg); }
.no-svg .gl-nav_item--server > a:before            { background-image:url(../image/icon/glNav/blue/server.png); }
.no-backgroundsize .gl-nav_item--server > a:before { background:none; content:url(../image/icon/glNav/blue/server-s.png); }
        
.svg .gl-nav_item--company > a:before               { background-image:url(../image/icon/glNav/blue/company.svg); }
.no-svg .gl-nav_item--company > a:before            { background-image:url(../image/icon/glNav/blue/company.png); }
.no-backgroundsize .gl-nav_item--company > a:before { background:none; content:url(../image/icon/glNav/blue/company-s.png); }
        
.svg .gl-nav_item--mail > a:before               { background-image:url(../image/icon/glNav/blue/mail.svg); }
.no-svg .gl-nav_item--mail > a:before            { background-image:url(../image/icon/glNav/blue/mail.png); }
.no-backgroundsize .gl-nav_item--mail > a:before { background:none; content:url(../image/icon/glNav/blue/mail-s.png); }

/* hover・stay */
.svg .pc--gl-nav .gl-nav_item--home:hover > a:before,
.svg .pc--gl-nav .gl-nav_item--home.stay > a:before   { background-image:url(../image/icon/glNav/blue/home.svg); }
.no-svg .gl-nav_item--home:hover > a:before,
.no-svg .gl-nav_item--home.stay > a:before            { background-image:url(../image/icon/glNav/blue/home.png); }
.no-backgroundsize .gl-nav_item--home:hover > a:before,
.no-backgroundsize .gl-nav_item--home.stay > a:before { background:none; content:url(../image/icon/glNav/blue/home-s.png); }
        
.svg .pc--gl-nav .gl-nav_item--nav:hover > a:before,
.svg .pc--gl-nav .gl-nav_item--nav.stay > a:before   { background-image:url(../image/icon/glNav/blue/nav.svg); }
.no-svg .gl-nav_item--nav:hover > a:before,
.no-svg .gl-nav_item--nav.stay > a:before            { background-image:url(../image/icon/glNav/blue/nav.png); }
.no-backgroundsize .gl-nav_item--nav:hover > a:before,
.no-backgroundsize .gl-nav_item--nav.stay > a:before { background:none; content:url(../image/icon/glNav/blue/nav-s.png); }
        
.svg .pc--gl-nav .gl-nav_item--hp:hover > a:before,
.svg .pc--gl-nav .gl-nav_item--hp.stay > a:before   { background-image:url(../image/icon/glNav/blue/hp.svg); }
.no-svg .gl-nav_item--hp:hover > a:before,
.no-svg .gl-nav_item--hp.stay > a:before            { background-image:url(../image/icon/glNav/blue/hp.png); }
.no-backgroundsize .gl-nav_item--hp:hover > a:before,
.no-backgroundsize .gl-nav_item--hp.stay > a:before { background:none; content:url(../image/icon/glNav/blue/hp-s.png); }
        
.svg .pc--gl-nav .gl-nav_item--works:hover > a:before,
.svg .pc--gl-nav .gl-nav_item--works.stay > a:before   { background-image:url(../image/icon/glNav/blue/works.svg); }
.no-svg .gl-nav_item--works:hover > a:before,
.no-svg .gl-nav_item--works.stay > a:before            { background-image:url(../image/icon/glNav/blue/works.png); }
.no-backgroundsize .gl-nav_item--works:hover > a:before,
.no-backgroundsize .gl-nav_item--works.stay > a:before { background:none; content:url(../image/icon/glNav/blue/works-s.png); }
        
.svg .pc--gl-nav .gl-nav_item--ad:hover > a:before,
.svg .pc--gl-nav .gl-nav_item--ad.stay > a:before   { background-image:url(../image/icon/glNav/blue/ad.svg); }
.no-svg .gl-nav_item--ad:hover > a:before,
.no-svg .gl-nav_item--ad.stay > a:before            { background-image:url(../image/icon/glNav/blue/ad.png); }
.no-backgroundsize .gl-nav_item--ad:hover > a:before,
.no-backgroundsize .gl-nav_item--ad.stay > a:before { background:none; content:url(../image/icon/glNav/blue/ad-s.png); }
        
.svg .pc--gl-nav .gl-nav_item--server:hover > a:before,
.svg .pc--gl-nav .gl-nav_item--server.stay > a:before   { background-image:url(../image/icon/glNav/blue/server.svg); }
.no-svg .gl-nav_item--server:hover > a:before,
.no-svg .gl-nav_item--server.stay > a:before            { background-image:url(../image/icon/glNav/blue/server.png); }
.no-backgroundsize .gl-nav_item--server:hover > a:before,
.no-backgroundsize .gl-nav_item--server.stay > a:before { background:none; content:url(../image/icon/glNav/blue/server-s.png); }
        
.svg .pc--gl-nav .gl-nav_item--company:hover > a:before,
.svg .pc--gl-nav .gl-nav_item--company.stay > a:before   { background-image:url(../image/icon/glNav/blue/company.svg); }
.no-svg .gl-nav_item--company:hover > a:before,
.no-svg .gl-nav_item--company.stay > a:before            { background-image:url(../image/icon/glNav/blue/company.png); }
.no-backgroundsize .gl-nav_item--company:hover > a:before,
.no-backgroundsize .gl-nav_item--company.stay > a:before { background:none; content:url(../image/icon/glNav/blue/company-s.png); }
        
.svg .pc--gl-nav .gl-nav_item--mail:hover > a:before,
.svg .pc--gl-nav .gl-nav_item--mail.stay > a:before   { background-image:url(../image/icon/glNav/blue/mail.svg); }
.no-svg .gl-nav_item--mail:hover > a:before,
.no-svg .gl-nav_item--mail.stay > a:before            { background-image:url(../image/icon/glNav/blue/mail.png); }
.no-backgroundsize .gl-nav_item--mail:hover > a:before,
.no-backgroundsize .gl-nav_item--mail.stay > a:before { background:none; content:url(../image/icon/glNav/blue/mail-s.png); }

/* fixed */
@media only screen {
  .svg .pc--gl-nav.fixed .gl-nav_item--home > a:before,
  .svg .pc--gl-nav.fixed .gl-nav_item--home.stay > a:before              { background-image:url(../image/icon/glNav/white/home.svg); }
  .no-svg .pc--gl-nav.fixed .gl-nav_item--home > a:before,
  .no-svg .pc--gl-nav.fixed .gl-nav_item--home.stay > a:before            { background-image:url(../image/icon/glNav/white/home.png); }
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--home > a:before,
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--home.stay > a:before { background:none; content:url(../image/icon/glNav/white/home-s.png); }
          
  .svg .pc--gl-nav.fixed .gl-nav_item--nav > a:before,
  .svg .pc--gl-nav.fixed .gl-nav_item--nav.stay > a:before              { background-image:url(../image/icon/glNav/white/nav.svg); }
  .no-svg .pc--gl-nav.fixed .gl-nav_item--nav > a:before,
  .no-svg .pc--gl-nav.fixed .gl-nav_item--nav.stay > a:before            { background-image:url(../image/icon/glNav/white/nav.png); }
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--nav > a:before,
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--nav.stay > a:before { background:none; content:url(../image/icon/glNav/white/nav-s.png); }
          
  .svg .pc--gl-nav.fixed .gl-nav_item--hp > a:before,
  .svg .pc--gl-nav.fixed .gl-nav_item--hp.stay > a:before              { background-image:url(../image/icon/glNav/white/hp.svg); }
  .no-svg .pc--gl-nav.fixed .gl-nav_item--hp > a:before,
  .no-svg .pc--gl-nav.fixed .gl-nav_item--hp.stay > a:before            { background-image:url(../image/icon/glNav/white/hp.png); }
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--hp > a:before,
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--hp.stay > a:before { background:none; content:url(../image/icon/glNav/white/hp-s.png); }
          
  .svg .pc--gl-nav.fixed .gl-nav_item--works > a:before,
  .svg .pc--gl-nav.fixed .gl-nav_item--works.stay > a:before              { background-image:url(../image/icon/glNav/white/works.svg); }
  .no-svg .pc--gl-nav.fixed .gl-nav_item--works > a:before,
  .no-svg .pc--gl-nav.fixed .gl-nav_item--works.stay > a:before            { background-image:url(../image/icon/glNav/white/works.png); }
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--works > a:before,
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--works.stay > a:before { background:none; content:url(../image/icon/glNav/white/works-s.png); }
          
  .svg .pc--gl-nav.fixed .gl-nav_item--ad > a:before,
  .svg .pc--gl-nav.fixed .gl-nav_item--ad.stay > a:before              { background-image:url(../image/icon/glNav/white/ad.svg); }
  .no-svg .pc--gl-nav.fixed .gl-nav_item--ad > a:before,
  .no-svg .pc--gl-nav.fixed .gl-nav_item--ad.stay > a:before            { background-image:url(../image/icon/glNav/white/ad.png); }
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--ad > a:before,
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--ad.stay > a:before { background:none; content:url(../image/icon/glNav/white/ad-s.png); }
          
  .svg .pc--gl-nav.fixed .gl-nav_item--server > a:before,
  .svg .pc--gl-nav.fixed .gl-nav_item--server.stay > a:before              { background-image:url(../image/icon/glNav/white/server.svg); }
  .no-svg .pc--gl-nav.fixed .gl-nav_item--server > a:before,
  .no-svg .pc--gl-nav.fixed .gl-nav_item--server.stay > a:before            { background-image:url(../image/icon/glNav/white/server.png); }
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--server > a:before,
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--server.stay > a:before { background:none; content:url(../image/icon/glNav/white/server-s.png); }
          
  .svg .pc--gl-nav.fixed .gl-nav_item--company > a:before,
  .svg .pc--gl-nav.fixed .gl-nav_item--company.stay > a:before              { background-image:url(../image/icon/glNav/white/company.svg); }
  .no-svg .pc--gl-nav.fixed .gl-nav_item--company > a:before,
  .no-svg .pc--gl-nav.fixed .gl-nav_item--company.stay > a:before            { background-image:url(../image/icon/glNav/white/company.png); }
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--company > a:before,
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--company.stay > a:before { background:none; content:url(../image/icon/glNav/white/company-s.png); }
          
  .svg .pc--gl-nav.fixed .gl-nav_item--mail > a:before,
  .svg .pc--gl-nav.fixed .gl-nav_item--mail.stay > a:before              { background-image:url(../image/icon/glNav/white/mail.svg); }
  .no-svg .pc--gl-nav.fixed .gl-nav_item--mail > a:before,
  .no-svg .pc--gl-nav.fixed .gl-nav_item--mail.stay > a:before            { background-image:url(../image/icon/glNav/white/mail.png); }
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--mail > a:before,
  .no-backgroundsize .pc--gl-nav.fixed .gl-nav_item--mail.stay > a:before { background:none; content:url(../image/icon/glNav/white/mail-s.png); }
}

.csstransitions .pc--gl-nav.js__load-fixed .gl-nav_item > a:before {
  -webkit-transition:none;
  -moz-transition:none;
  -ms-transition:none;
  -o-transition:none;
  transition:none;
}

.csstransitions .pc--gl-nav .gl-nav_item > a:before {
  -webkit-transform:scale(1);
  -moz-transform:scale(1);
  -ms-transform:scale(1);
  -o-transform:scale(1);
  transform:scale(1);
  
  -webkit-transition:all ease 0.3s;
  -moz-transition:all ease 0.3s;
  -ms-transition:all ease 0.3s;
  -o-transition:all ease 0.3s;
  transition:all ease 0.3s;
}

@media only screen {
  .csstransitions .pc--gl-nav.fixed .gl-nav_item > a:before {
    margin-bottom:0.15em;
    -webkit-transform:scale(0.8);
    -moz-transform:scale(0.8);
    -ms-transform:scale(0.8);
    -o-transform:scale(0.8);
    transform:scale(0.8);
  }
}

@media (max-width:767px) {
  .gl-nav_item > a:before {
    content:"";
    background-repeat:no-repeat;
    background-position:center center;
    background-size:35px 27px;
    width:35px;
    height:27px;
    display:inline-block;
    float:left;
    margin-left:5%;
    margin-right:1em;
    margin-top:0.15em;
  }
  
  .no-backgroundsize .gl-nav_item > a:before {
    width:35px;
    height:27px;
    text-align:center;
  }

  .svg .gl-nav_item--home > a:before               { background-image:url(../image/icon/glNav/blue/home.svg); }
  .no-svg .gl-nav_item--home > a:before            { background-image:url(../image/icon/glNav/blue/home.png); }
  .no-backgroundsize .gl-nav_item--home > a:before { background:none; content:url(../image/icon/glNav/blue/home-s.png); }
          
  .svg .gl-nav_item--nav > a:before               { background-image:url(../image/icon/glNav/blue/nav.svg); }
  .no-svg .gl-nav_item--nav > a:before            { background-image:url(../image/icon/glNav/blue/nav.png); }
  .no-backgroundsize .gl-nav_item--nav > a:before { background:none; content:url(../image/icon/glNav/blue/nav-s.png); }
          
  .svg .gl-nav_item--hp > a:before               { background-image:url(../image/icon/glNav/blue/hp.svg); }
  .no-svg .gl-nav_item--hp > a:before            { background-image:url(../image/icon/glNav/blue/hp.png); }
  .no-backgroundsize .gl-nav_item--hp > a:before { background:none; content:url(../image/icon/glNav/blue/hp-s.png); }
          
  .svg .gl-nav_item--works > a:before               { background-image:url(../image/icon/glNav/blue/works.svg); }
  .no-svg .gl-nav_item--works > a:before            { background-image:url(../image/icon/glNav/blue/works.png); }
  .no-backgroundsize .gl-nav_item--works > a:before { background:none; content:url(../image/icon/glNav/blue/works-s.png); }
          
  .svg .gl-nav_item--ad > a:before               { background-image:url(../image/icon/glNav/blue/ad.svg); }
  .no-svg .gl-nav_item--ad > a:before            { background-image:url(../image/icon/glNav/blue/ad.png); }
  .no-backgroundsize .gl-nav_item--ad > a:before { background:none; content:url(../image/icon/glNav/blue/ad-s.png); }
          
  .svg .gl-nav_item--server > a:before               { background-image:url(../image/icon/glNav/blue/server.svg); }
  .no-svg .gl-nav_item--server > a:before            { background-image:url(../image/icon/glNav/blue/server.png); }
  .no-backgroundsize .gl-nav_item--server > a:before { background:none; content:url(../image/icon/glNav/blue/server-s.png); }
          
  .svg .gl-nav_item--company > a:before               { background-image:url(../image/icon/glNav/blue/company.svg); }
  .no-svg .gl-nav_item--company > a:before            { background-image:url(../image/icon/glNav/blue/company.png); }
  .no-backgroundsize .gl-nav_item--company > a:before { background:none; content:url(../image/icon/glNav/blue/company-s.png); }
          
  .svg .gl-nav_item--mail > a:before               { background-image:url(../image/icon/glNav/blue/mail.svg); }
  .no-svg .gl-nav_item--mail > a:before            { background-image:url(../image/icon/glNav/blue/mail.png); }
  .no-backgroundsize .gl-nav_item--mail > a:before { background:none; content:url(../image/icon/glNav/blue/mail-s.png); }
}

@media (max-width:500px) {
  .gl-nav_item > a:before {
    margin-top:-0.1em;
  }

  .gl-nav_item > a:before {
    margin-left:4%;
  }
}


/*-----------------------------------------------------------------------------------
  hoverアニメ
-----------------------------------------------------------------------------------*/

/* テキスト ----------------------------------------*/

.pc--gl-nav .gl-nav_item .snip * {
  -webkit-transition:all ease 0.3s;
  -moz-transition:all ease 0.3s;
  -ms-transition:all ease 0.3s;
  -o-transition:all ease 0.3s;
  transition:all ease 0.3s;
}
      
.pc--gl-nav .gl-nav_item .snip {
  overflow:hidden;
}

.pc--gl-nav .gl-nav_item .snip span {
  position:relative;
  display:block;
}

.pc--gl-nav .gl-nav_item .snip span:before,
.pc--gl-nav .gl-nav_item .snip span:after {
  position:absolute;
  -webkit-transition:all ease 0.3s;
  -moz-transition:all ease 0.3s;
  -ms-transition:all ease 0.3s;
  -o-transition:all ease 0.3s;
  transition:all ease 0.3s;
}

.pc--gl-nav .gl-nav_item .snip span:before {
  bottom:100%;
  display:block;
  width:100%;
  content:"";
}

.pc--gl-nav .gl-nav_item .snip span:after {
  width:100%;
  position:absolute;
  bottom:100%;
  left:0;
  color:#0f64b9;
  content:attr(data-hover);
  white-space:nowrap;
}

.no-csstransforms .pc--gl-nav .gl-nav_item:hover .snip span,
.no-csstransforms .pc--gl-nav .gl-nav_item.stay .snip span {
  color:#0f64b9;
}

.pc--gl-nav .gl-nav_item:hover .snip span,
.pc--gl-nav .gl-nav_item.stay .snip span {
  transform:translateY(100%);
  color:#fff;
}

@media only screen {
  .pc--gl-nav.fixed .gl-nav_item > a,
  .no-csstransforms .pc--gl-nav.fixed .gl-nav_item .snip span,
  .pc--gl-nav.fixed .gl-nav_item .snip span:after {
    color:#fff;
  }
}

.pc--gl-nav .gl-nav_item > a {
  -webkit-transition:opacity ease 0.3s !important;
  -moz-transition:opacity ease 0.3s !important;
  -ms-transition:opacity ease 0.3s !important;
  -o-transition:opacity ease 0.3s !important;
  transition:opacity ease 0.3s !important;
}

.pc--gl-nav ul:hover .gl-nav_item > a {
  filter:alpha(opacity=30);
  opacity:0.3;
  -moz-opacity:0.3;
}

.pc--gl-nav ul:hover .gl-nav_item:hover > a,
.pc--gl-nav ul:hover .gl-nav_item > a.stay {
  filter:alpha(opacity=100);
  opacity:1;
  -moz-opacity:1;
}
  

/* ライン ----------------------------------------*/

.pc--gl-nav .gl-nav_item > a {
  -webkit-transition:height ease 0.3s;
  -moz-transition:height ease 0.3s;
  -ms-transition:height ease 0.3s;
  -o-transition:height ease 0.3s;
  transition:height ease 0.3s;
}

.pc--gl-nav .gl-nav_item > a:after {
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:0;
  -webkit-transition:height ease 0.2s;
  -moz-transition:height ease 0.2s;
  -ms-transition:height ease 0.2s;
  -o-transition:height ease 0.2s;
  transition:height ease 0.2s;
}

.pc--gl-nav .gl-nav_item > a:hover:after,
.pc--gl-nav .gl-nav_item.stay > a:after {
  background-color:#0f64b9;
}

@media only screen {
  .pc--gl-nav.fixed .gl-nav_item > a:hover:after,
  .pc--gl-nav.fixed .gl-nav_item.stay > a:after {
    background-color:#fff;
  }
}

.pc--gl-nav .gl-nav_item > a:hover:after,
.pc--gl-nav .gl-nav_item.stay > a:after {
  height:3px;
  z-index:101;
}


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

  3. contents
  
----------------------------------------------------------------------------------------------------*/

.rgba .ct-ov {
  display:none;
  position:fixed;
  top:0;
  left:0;
  z-index:99;
  width:100%;
  height:100%;
  background-color:rgba(0,0,0,0.3);
}

.ct-ov--gray {
  display:none;
  position:fixed;
  top:0;
  left:0;
  z-index:99;
  width:100%;
  height:100%;
  background-color:#f2f2f2;
}

@media print {
  .ct-ov,
  .ct-ov--gray {
    display:none !important;
  }
}


/*-----------------------------------------------------------------------------------
  ページ見出し
-----------------------------------------------------------------------------------*/

.pgHeadline-warp {
  width:100%;
  height:220px;
  background-position:center bottom;
  background-repeat:no-repeat;
  background-size:100% auto;
  text-align:center;
  position:relative;
}

.csstransforms .pgHeadline-warp {
  overflow:hidden;
}

.pgHeadline {
  display:inline-block;
  position:absolute;
  top:50%;
  left:50%;
  -webkit-transform:translate(-50%, -50%);
  transform:translate(-50%, -50%);
  color:#fff;
  text-align:center;
  white-space:nowrap;
}

.pgHeadline h2 {
  font-size:250%;
  line-height:1.65;
  font-weight:normal;
}

.pgHeadline small {
  font-size:118.8%;
}

.no-csstransforms .pgHeadline {
  width:1100px;
  height:220px;
  margin-left:-550px;
  margin-top:-2.5em;
}

@media only screen {
  .cssanimations .pgHeadline h2 {
    white-space:nowrap;
    letter-spacing:3em;
    filter:alpha(opacity=0);
    opacity:0;
    -moz-opacity:0;
    animation:pgHeadline-animation 1s forwards !important;
    -webkit-animation:pgHeadline-animation 1s forwards !important;
  }
  
  .cssanimations .pgHeadline small {
    filter:alpha(opacity=0);
    opacity:0;
    -moz-opacity:0;
    animation:pgHeadline-small-animation 2s forwards !important;
    -webkit-animation:pgHeadline-small-animation 2s forwards !important;
    animation-delay:0.25s !important;
    -webkit-animation-delay:0.25s !important;
  }
}

@-webkit-keyframes pgHeadline-animation {
  0% {
    letter-spacing:2em;
    filter:alpha(opacity=0);
    opacity:0;
    -moz-opacity:0;
  }
  
  100% {
    letter-spacing:0;
    filter:alpha(opacity=100);
    opacity:1;
    -moz-opacity:1;
  }
}

@keyframes pgHeadline-animation {
  0% {
    letter-spacing:2em;
    filter:alpha(opacity=0);
    opacity:0;
    -moz-opacity:0;
  }
  
  100% {
    letter-spacing:0;
    filter:alpha(opacity=100);
    opacity:1;
    -moz-opacity:1;
  }
}

@-webkit-keyframes pgHeadline-small-animation {
  0% {
    filter:alpha(opacity=0);
    opacity:0;
    -moz-opacity:0;
  }
  
  100% {
    filter:alpha(opacity=100);
    opacity:1;
    -moz-opacity:1;
  }
}

@keyframes pgHeadline-small-animation {
  0% {
    filter:alpha(opacity=0);
    opacity:0;
    -moz-opacity:0;
  }
  
  100% {
    filter:alpha(opacity=100);
    opacity:1;
    -moz-opacity:1;
  }
}

@media (max-width:1620px) {
  .pgHeadline-warp {
    background-size:cover;
  }
}

@media (max-width:767px) {
  .pgHeadline-warp {
    height:180px;
  }
}

@media (max-width:640px) {
  .pgHeadline-warp {
    height:160px;
  }
  
  .pgHeadline {
    font-size:90%;
  }
}

@media (max-width:500px) {
  .pgHeadline-warp {
    height:140px;
  }
  
  .pgHeadline {
    font-size:85%;
  }
}

@media (max-width:360px) {
  .pgHeadline-warp {
    height:120px;
  }
  
  .pgHeadline {
    font-size:80%;
  }
}

.pgHeadline-nav           { background-image:url(../image/pgHeadline/nav.jpg); }
.pgHeadline-hp            { background-image:url(../image/pgHeadline/hp.jpg); }
.pgHeadline-works         { background-image:url(../image/pgHeadline/works.jpg); }
.pgHeadline-ad            { background-image:url(../image/pgHeadline/ad.jpg); }
.pgHeadline-server        { background-image:url(../image/pgHeadline/server.jpg); }
.pgHeadline-company       { background-image:url(../image/pgHeadline/company.jpg); }
.pgHeadline-contact       { background-image:url(../image/pgHeadline/contact.jpg); }
.pgHeadline-info          { background-image:url(../image/pgHeadline/info.jpg); }
.pgHeadline-streetview    { background-image:url(../image/pgHeadline/streetview.jpg); }
.pgHeadline-privacypolicy { background-image:url(../image/pgHeadline/privacypolicy.jpg); }


/*-----------------------------------------------------------------------------------
  パンくず
-----------------------------------------------------------------------------------*/

.pan {
  width:100%;
  margin-bottom:40px;
  background-color:#f2f2f2;
}

.pan ul {
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
  font-size:81.3%;
  line-height:1.7;
  padding-top:1em;
  padding-bottom:1em;
  box-sizing:border-box;
}

.pan li {
  display:inline-block;
}

.pan li:after {
  content:"";
  display:inline-block;
  vertical-align:middle;
  margin-left:0.5em;
  margin-right:0.3em;
  margin-top:-1.5px;
}

.csstransforms .pan li:after {
  width:5px;
  height:5px;
  border-right:1px solid #666;
  border-bottom:1px solid #666;
  -webkit-transform:rotate(-45deg);
  transform:rotate(-45deg);
}

.no-csstransforms .pan li:after {
  content:">";
}

.pan li:last-child:after {
  display:none;
}

.pan li.pan-now:after {
  content:"";
}

@media (max-width:767px) {
  .pan {
    display:none;
  }
}


/*-----------------------------------------------------------------------------------
  サブページナビ
-----------------------------------------------------------------------------------*/

.preload .sub-nav li,
.preload .sub-nav li * {
  -webkit-transition:none !important;
  -moz-transition:none !important;
  -ms-transition:none !important;
  -o-transition:none !important;
  transition:none !important;
  animation:none !important;
}

.sub-nav {
  width:100%;
  max-width:1160px;
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
}

.sub-nav--bottom  {
  padding-top:40px;
  padding-bottom:30px;
}

.sub-nav ul {
  width:100%;
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
  letter-spacing:-0.5em;
}

.sub-nav li {
  position:relative;
  display:inline-block;
  text-align:center;
  box-sizing:border-box;
  letter-spacing:normal;
  cursor:pointer;
  vertical-align:middle;
  line-height:1.45;
  margin:10px 5px 0 5px;
  padding:0.8em 2.5em;
  color:#00a08c;
  background-color:#fff;
  border:1px solid rgba(0,160,140,0.60);
  border-radius:3px;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  -webkit-transition:background ease 0.3s, font-size ease 0.3s;
  -moz-transition:background ease 0.3s, font-size ease 0.3s;
  -ms-transition:background ease 0.3s, font-size ease 0.3s;
  -o-transition:background ease 0.3s, font-size ease 0.3s;
  transition:background ease 0.3s, font-size ease 0.3s;
}

.lte-ie8 .sub-nav li {
  border:1px solid #67c6ba;
}
  
.lte-ie8 .sub-nav li:hover {
  color:#fff;
  background-color:#28c3aa;
  border:1px solid #28c3aa;
}

@media all and (min-width:768px) {
  .sub-nav li:hover {
    color:#fff;
    border-color:#28c3aa;
    background-color:#28c3aa;
  }
    
  .no-rgba .sub-nav li:hover {
    border-color:#28c3aa;
  }
}

.sub-nav li.stay,
.sub-nav li.stay:hover {
  color:#fff;
  background-color:#00a08c;
  border-color:#00a08c;
  cursor:inherit;
}

.sub-nav li.stay a {
  cursor:inherit;
}

.sub-nav li a,
.sub-nav li a:visited,
.sub-nav li a:hover {
  color:inherit;
  text-decoration:none;
}

.sub-nav li a {
  display:table;
  width:100%;
  height:100%;
}

.sub-nav li span {
  display:table-cell;
  vertical-align:middle;
  text-align:center;
}


/* 今ココ */
.sub-nav li .ic-now {
  font-size:75.0%;
  display:block;
  padding:0.25em 0.8em;
  border-radius:2px;
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
  background-color:#f1c40f;
  box-sizing:border-box;
  position:absolute;
  left:50%;
  top:-2.75em;
  margin-left:-2.25em;
}

.sub-nav li .ic-now:before {
  width:0;
  height:0;
  content:"";
  border-top:8px solid #f1c40f;
  border-bottom:8px solid transparent;
  border-right:8px solid transparent;
  border-left:8px solid transparent;
  margin-left:-8px;
  position:absolute;
  left:50%;
  bottom:-13px;
}

@media only screen {
  .cssanimations .sub-nav li .ic-now {
    filter:alpha(opacity=0);
    opacity:0;
    -moz-opacity:0;
  }
  
  .cssanimations .sub-nav li.active .ic-now {
    filter:alpha(opacity=0);
    opacity:0;
    -moz-opacity:0;
    animation:sub-nav-now-animation 0.6s forwards !important;
    -webkit-animation:sub-nav-now-animation 0.6s forwards !important;
  }
}

@-webkit-keyframes sub-nav-now-animation {
  0% {
    filter:alpha(opacity=0);
    opacity:0;
    -moz-opacity:0;
    top:-6.75em;
  }
  
  100% {
    filter:alpha(opacity=100);
    opacity:1;
    -moz-opacity:1;
    top:-2.75em;
  }
}

@keyframes sub-nav-now-animation {
  0% {
    filter:alpha(opacity=0);
    opacity:0;
    -moz-opacity:0;
    top:-6.75em;
  }
  
  100% {
    filter:alpha(opacity=100);
    opacity:1;
    -moz-opacity:1;
    top:-2.75em;
  }
}

@media (max-width:767px) {
  .sub-nav {
    padding:3% 3% 0 3%;
    margin-top:1em;
  }

  .sub-nav--bottom {
    padding-top:0;
    padding-bottom:1.5em;
  }
}

@media (max-width:640px) {
  .sub-nav--bottom {
    padding-top:1em;
    padding-bottom:1.5em;
  }
  
  .sub-nav--bottom .sub-nav {
    margin-top:0;
  }
  
  .sub-nav {
    margin-top:1em;
    padding-left:2.21875%;
    padding-right:2.21875%;
    font-size:96%;
  }
  
  .sub-nav li {
    float:left;
    padding-top:0.65em;
    padding-bottom:0.65em;
    padding-left:0.75em;
    padding-right:0.75em;
    margin-left:0.78125%;
    margin-right:0.78125%;
  }
  
  .sub-nav--cols2 li {
    width:48.4375%;
  }
  
  .sub-nav--cols3 li {
    width:31.770833%;
  }
}

@media (max-width:400px) {
  .sub-nav--bottom {
    padding-top:0;
    padding-bottom:1.5em;
  }

  .sub-nav {
    margin-top:0;
  }
}

@media (max-width:360px) {
  .sub-nav {
    font-size:92%;
  }
}


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

  4. footer
  
----------------------------------------------------------------------------------------------------*/

footer {
  width:100%;
  border-top:1px solid #dcdcdc;
}


/*-----------------------------------------------------------------------------------
  pagetop
-----------------------------------------------------------------------------------*/

.page-top {
	position:fixed;
  right:15px;
  bottom:15px;
  display:inline-block;
  border-radius:3px;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  z-index:90;
}

.page-top a {
  display:block;
  background-color:rgba(0,0,0,0.3);
  text-align:center;
  padding:1em;
  -webkit-transition:background ease 0.3s;
  -moz-transition:background ease 0.3s;
  -ms-transition:background ease 0.3s;
  -o-transition:background ease 0.3s;
  transition:background ease 0.3s;
  border-radius:2px;
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
}

.page-top a,
.page-top a:visited,
.page-top a:hover {
  text-decoration:none;
}

.page-top a,
.page-top a:visited,
.page-top a:hover {
  color:#fff;
}

.page-top:hover a {
  background-color:#00a08c;
}

.no-rgba .page-top a {
  background-color:#00a08c;
  color:#fff;
}

.no-rgba .page-top a:hover {
  background-color:#28c3aa;
}

.page-top span {
  display:block;
  height:26px;
  font-size:0;
  background-position:center center;
  background-repeat:no-repeat;
  background-size:auto 22px;
}

.svg .page-top span    { background-image:url(../image/icon/white/up.svg); }
.no-svg .page-top span { background-image:url(../image/icon/white/up-s.png); }

.no-csstransforms .page-top span {
  margin-right:0.5em;
}

@media (max-width:767px) {
  .page-top {
    width:100%;
    text-align:center;
    background-color:#fff;
    position:inherit;
    right:inherit;
    bottom:inherit;
    display:inline-block;
    border-radius:none;
    -moz-border-radius:none;
    -webkit-border-radius:none;
  }
  
  .page-top a {
    display:block;
    padding:1em 20px;
    box-sizing:border-box;
    background:none;
    text-align:center;
    -webkit-transition:none;
    -moz-transition:none;
    -ms-transition:none;
    -o-transition:none;
    transition:none;
    border-radius:none;
    -moz-border-radius:none;
    -webkit-border-radius:none;
  }
  
  .page-top a,
  .page-top a:visited,
  .page-top a:hover {
    color:#093b6c;
    text-decoration:none;
    background:none;
  }
  
  .page-top span {
    height:22px;
    background-size:auto 18px;
  }
  
  .svg .page-top span    { background-image:url(../image/icon/dblue/up.svg); }
  .no-svg .page-top span { background-image:url(../image/icon/dblue/up-s.png); }
}

@media print {
  .page-top {
    display:none !important;
  }
}


/*-----------------------------------------------------------------------------------
  アクセス・お問い合わせ
-----------------------------------------------------------------------------------*/

.ft-cols2 {
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
}

.ft-cols2 .block {
  padding-top:45px;
  padding-bottom:45px;
  box-sizing:border-box;
}

.ft-cols2--col {
  width:50%;
  float:left;
}

.ft-cols2--col h5 {
  font-weight:normal;
  line-height:1;
  padding-bottom:0.5em;
}

.ft-cols2--col p:last-child {
  padding-bottom:1.5em;
}

@media (max-width:767px) {
  .ft-cols2 .block {
    padding-top:3em;
    padding-bottom:3em;
  }
}

@media (min-width:641px) and (max-width:767px) {
  .ft-cols2--col .btn {
    width:100%;
  }
}

@media (max-width:640px) {
  .ft-cols2 .block {
    padding-top:2em;
    padding-bottom:2em;
    text-align:center;
  }
  
  .ft-cols2--col {
    width:100%;
    float:none;
  }
  
  .ft-cols2--col .btn {
    width:360px;
  }
}

@media (max-width:500px) {
  .ft-cols2 .block {
    text-align:left;
  }
  
  .ft-cols2--col .btn {
    width:100%;
    padding-left:1.5em;
    padding-right:1.5em;
  }
  
  .ft-cols2--col {
    text-align:left;
  }
}


/* 会社案内 ----------------------------------------*/

.company .cmpName {
  font-weight:normal;
  display:inline-block;
  margin-bottom:0.5em;
  line-height:1.6;
}

.company small {
  display:inline-block;
}


/* お問い合わせ ----------------------------------------*/

.ft-contact .tel-link {
  display:inline-block;
}

.ft-tel {
  color:#00a08c;
  padding-top:0.5em;
}

.ft-tel-no:before {
  content:"";
  background-repeat:no-repeat;
  background-position:0 0;
  background-size:100% 100%;
  width:22px;
  height:26px;
  display:inline-block;
  vertical-align:middle;
  margin-right:0.25em;
  margin-top:-0.25em;
}
  
.svg .ft-tel-no:before               { background-image:url(../image/icon/green/tel.svg); }
.no-svg .ft-tel-no:before            { background-image:url(../image/icon/green/tel.png); }
.no-backgroundsize .ft-tel-no:before { background:none; content:url(../image/icon/green/tel-s.png); }

.ft-tel-time {
  display:inline-block;
  margin-left:0.5em;
  line-height:1.3;
}
  
.ft-tel-time small {
  display:inline-block;
  margin-right:0.5em;
}
  
.ft-tel:hover,
.ft-tel a:hover {
  color:#00a08c;
}

.preload .ft-tel,
.preload .ft-tel * {
  -webkit-transition:none !important;
  -moz-transition:none !important;
  -ms-transition:none !important;
  -o-transition:none !important;
  transition:none !important;
  animation:none !important;
}

@media (max-width:767px) {
  .ft-contact p:first-child {
    padding-bottom:1.5em;
  }
  
  .ft-contact p:first-child br:first-child {
    display:none;
  }
  
  .ft-contact p:last-child {
    padding:0;
  }

  .ft-tel {
    width:100%;
    padding:0.5em !important;
    margin-top:0.25em;
    margin-bottom:1.25em;
    display:inline-block;
    margin-left:auto;
    margin-right:auto;
    box-sizing:border-box;
    outline:none;
    text-align:center;
    text-decoration:none;
    font-size:inherit;
    cursor:pointer;
    border:1px solid rgba(0,160,140,0.60);
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    -webkit-transition:all ease 0.3s;
    -moz-transition:all ease 0.3s;
    -ms-transition:all ease 0.3s;
    -o-transition:all ease 0.3s;
    transition:all ease 0.3s;
    line-height:1.3;
  }
  
  .no-rgba .ft-tel {
    border:1px solid #67c6ba;
  }

  .ft-tel-time {
    display:block;
    text-align:center;
    margin-left:0;
    margin-top:-0.5em;
    margin-bottom:0.5em;
  }
}

@media (max-width:640px) {
  .ft-tel {
    width:360px;
  }
  
  .ft-contact p:first-child br:first-child {
    display:inherit;
  }

  .ft-contact {
    border-top:1px solid #dcdcdc;
  }
}

@media (max-width:500px) {
  .ft-contact p:first-child br:first-child {
    display:none;
  }
  
  .ft-tel {
    width:100%;
  }

  .ft-tel-no:before {
    width:20px;
    height:23px;
  }
}


/*-----------------------------------------------------------------------------------
  nav
-----------------------------------------------------------------------------------*/

.ft-nav {
  text-align:left;
  background-color:#093b6c;
  color:#fff;
  padding-left:3%;
  padding-right:3%;
  box-sizing:border-box;
}

.ft-nav a,
.ft-nav a:visited  { color:inherit; text-decoration:none; }
.ft-nav a:hover    { color:inherit; text-decoration:underline; }
.ft-nav_item--title a:hover { text-decoration:none; }

.ft-nav nav {
  width:1100px;
  margin-left:auto;
  margin-right:auto;
  padding-top:10px;
  padding-bottom:50px;
}

.ft-nav_col {
  /*width:252px;*/
  width:346.666666px;
  float:left;
  margin-left:30px;
}

.ft-nav .ft-nav_col--first {
  margin-left:0;
}

.ft-nav_item--title {
  margin-top:40px;
}

.ft-nav_item--title a {
  display:block;
  line-height:1.6;
  font-size:112.5%;
  padding-bottom:0.5em;
  border-bottom:1px solid rgba(255,255,255,0.2);
}

.no-rgba .ft-nav_item--title a {
  border-bottom:1px solid #315980;
}

.ft-nav_subitem {
  padding-top:1em;
}

.ft-nav_subitem li {
  padding-top:0.25em;
  font-size:81.3%;
}

.ft-nav_subitem a,
.ft-nav_subitem a:visited,
.ft-nav_subitem a:hover { color:#9db1c4; }


@media (max-width:767px) {
  .ft-nav {
    background-color:#f2f2f2;
    box-sizing:border-box;
    color:inherit;
    padding:3%;
  }
  
  .ft-nav nav {
    width:100%;
    margin:0;
    padding:0;
  }
  
  .ft-nav_col {
    width:inherit;
    float:none;
    margin-left:0;
  }
  
  .ft-nav .ft-nav_col--first {
    margin-left:0;
  }
  
  .ft-nav_item--title {
    width:50%;
    float:left;
    text-align:center;
    box-sizing:border-box;
    border:2px solid #f2f2f2;
    background-color:#fff;
    font-size:93.8%;
    margin-top:0;
  }
  
  .ft-nav_item--title a {
    display:block;
    line-height:inherit;
    font-size:100%;
    border-bottom:0;
    padding:0.8em 1em;
  }

  .ft-nav_item--home,
  .ft-nav_item--hp,
  .ft-nav_item--ad,
  .ft-nav_item--company,
  .ft-nav_item--privacypolicy {
    border-left:0;
  }
    
  .ft-nav_subitem {
    display:none;
  }
}

@media (max-width:500px) {
  .ft-nav_item--title {
    font-size:87.5%;
  }
}


/*-----------------------------------------------------------------------------------
  スマホ固定nav
-----------------------------------------------------------------------------------*/

.ft-nav--sp-fixed {
  display:none;
}

@media (max-width:767px) {
  .ft-nav--sp-fixed {
    width:100%;
    display:inherit;
    position:fixed;
    left:0;
    bottom:0;
    z-index:50;
  }
  
  .ft-nav--sp-fixed a,
  .ft-nav--sp-fixed a:visited,
  .ft-nav--sp-fixed:hover {
    color:#fff;
    text-decoration:none;
  }
  
  .ft-nav--sp-fixed ul {
    width:100%;
    background-color:#093b6c;
    display:table;
  }
  
  .ft-nav--sp-fixed li {
    width:20%;
    display:table-cell;
    text-align:center;
    vertical-align:middle;
    border-left:1px solid rgba(255,255,255,0.2);
    font-size:87.5%;
    white-space:nowrap;
  }

  .no-rgba .ft-nav--sp-fixed li { border-left:1px solid #315980; }
  
  .ft-nav--sp-fixed li:first-child {
    border-left:0;
  }
  
  .ft-nav--sp-fixed li a {
    display:block;
    padding:1em 1em 0.5em 1em;
    box-sizing:border-box;
  }
  
  .ft-nav--sp-fixed li a:before {
    content:"";
    width:100%;
    height:28px;
    background-size:auto 28px;
    background-repeat:no-repeat;
    background-position:center center;
    display:block;
    margin-bottom:0.25em;
  }

  .svg .sp-nav_item--home a:before    { background-image:url(../image/icon/white/home.svg); }
  .no-svg .sp-nav_item--home a:before { background-image:url(../image/icon/white/home.png); }
  
  .svg .sp-nav_item--company a:before    { background-image:url(../image/icon/white/company.svg); }
  .no-svg .sp-nav_item--company a:before { background-image:url(../image/icon/white/company.png); }
  
  .svg .sp-nav_item--mail a:before    { background-image:url(../image/icon/white/mail.svg); }
  .no-svg .sp-nav_item--mail a:before { background-image:url(../image/icon/white/mail.png); }
  
  .svg .sp-nav_item--tel a:before    { background-image:url(../image/icon/white/tel.svg); }
  .no-svg .sp-nav_item--tel a:before { background-image:url(../image/icon/white/tel.png); }
  
  .svg .sp-nav_item--nav-btn a:before    { background-image:url(../image/icon/white/nav-btn.svg); }
  .no-svg .sp-nav_item--nav-btn a:before { background-image:url(../image/icon/white/nav-btn.png); }
  
  .sp-nav_item--company a:before { background-size:auto 26px !important; }
  .sp-nav_item--mail a:before    { background-size:auto 20px !important; }
  .sp-nav_item--tel a:before     { background-size:auto 24px !important; }
  .sp-nav_item--nav-btn a:before { background-size:auto 19px !important; }
}

@media (max-width:500px) {
  .ft-nav--sp-fixed li {
    font-size:81.3%;
  }
  
  .ft-nav--sp-fixed li a:before {
    content:"";


    height:24px;
    background-size:auto 24px;
  }
  
  .sp-nav_item--company a:before { background-size:auto 22px !important; }
  .sp-nav_item--mail a:before    { background-size:auto 16px !important; }
  .sp-nav_item--tel a:before     { background-size:auto 20px !important; }
  .sp-nav_item--nav-btn a:before { background-size:auto 14px !important; }
}

@media (max-width:400px) {
  .ft-nav--sp-fixed li {
    font-size:75.0%;
  }
}

@media (max-width:360px) {
  .ft-nav--sp-fixed li a:before {
    content:"";
    height:20px;
    background-size:auto 20px;
  }
  
  .sp-nav_item--company a:before { background-size:auto 18px !important; }
  .sp-nav_item--mail a:before    { background-size:auto 14px !important; }
  .sp-nav_item--tel a:before     { background-size:auto 16px !important; }
  .sp-nav_item--nav-btn a:before { background-size:auto 12px !important; }
}

@media print and (max-width:767px) {
  .ft-nav--sp-fixed {
    position:relative;
    left:inherit;
    bottom:inherit;
  }
}


/*-----------------------------------------------------------------------------------
  SSL
-----------------------------------------------------------------------------------*/

footer .ssl-warp {
  background-color:#093b6c;
  color:#fff;
  padding-bottom:45px;
}

footer .ssl {
  display:inline-block;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
}

footer .ssl .siteseal {
  display:inline-block;
  float:left;
  margin-right:1.25rem;
}

footer .ssl p {
  display:inline-block;
  line-height:1.6;
  padding-top:0.75em;
}

@media (max-width:767px) {
  footer .ssl-warp {
    background:none;
    color:inherit;
    border-top:1px solid #dcdcdc;
    padding-top:2rem;
    padding-bottom:1.5rem;
  }

	footer .ssl {
    display:block;
    text-align:center;
  }
  
  footer .ssl .siteseal {
    margin-right:0;
    margin-bottom:0.5rem;
    float:none;
  }
  
  footer .ssl p {
    display:block;
    padding-top:0;
  }
}


/*-----------------------------------------------------------------------------------
  copyright
-----------------------------------------------------------------------------------*/

.copy {
  width:100%;
  box-sizing:border-box;
  display:block;
  text-align:center;
  padding:1em 20px;
  color:#fff;
  background-color:#06294b;
}

@media (max-width:767px) {
  .copy {
    display:none;
  }
}


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

  99. parts
  
----------------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------
  ボタン
-----------------------------------------------------------------------------------*/

.preload .btn,
.preload .btn * {
  -webkit-transition:none !important;
  -moz-transition:none !important;
  -ms-transition:none !important;
  -o-transition:none !important;
  transition:none !important;
  animation:none !important;
}

.btn {
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  display:inline-block;
  box-sizing:border-box;
  border:none;
  margin:0;
  outline:none;
  text-align:center;
  text-decoration:none;
  font-size:inherit;
  cursor:pointer;
  border-radius:3px;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
  -webkit-transition:background ease 0.5, border-color ease 0.5s;
  -moz-transition:background ease 0.5s, border-color ease 0.5s;
  -ms-transition:background ease 0.5s, border-color ease 0.5s;
  -o-transition:background ease 0.5s, border-color ease 0.5s;
  transition:background ease 0.5s, border-color ease 0.5s;
}

.btnM { padding:0.75em 3em; font-size:125%; }
.btnB { padding:0.6em 3em; font-size:115%; }
.btnN { padding:0.6em 2em; font-size:110%; }
.btnS { padding:0.6em 1.5em; }

@media (max-width:767px) {
  .btnM { padding:0.75em 1.5em; }
  .btnB { padding:0.6em 1.5em; }
  .btnN { padding:0.6em 1.5em; }
}

.btnLeft {
  text-align:left;
  padding-right:2em;
}

.btn span {
  display:inline-block;
  position:relative;
  -webkit-transition:all ease 0.3s;
  -moz-transition:all ease 0.3s;
  -ms-transition:all ease 0.3s;
  -o-transition:all ease 0.3s;
  transition:all ease 0.3s;
}

.csstransforms .btn span {
  padding-left:1.5em;
  padding-right:0.5em;
}

.csstransforms .btn span:before {
  content:"";
  display:inline-block;
  width:7px;
  height:7px;
  position:absolute;
  left:0;
  top:50%;
  margin-top:-0.3em;
  border-right-style:solid;
  border-bottom-style:solid;
  border-right-width:1px;
  border-bottom-width:1px;
  -webkit-transform:rotate(-45deg);
  transform:rotate(-45deg);
  -webkit-transition:all ease 0.3s;
  -moz-transition:all ease 0.3s;
  -ms-transition:all ease 0.3s;
  -o-transition:all ease 0.3s;
  transition:all ease 0.3s;
}

.csstransforms .btnM span:before {
  margin-top:-0.25em;
}

@media (max-width:500px) {
  .csstransforms .btnM span:before {
    margin-top:-0.275em;
  }
}

@media all and (min-width:768px) {
  .csstransitions .btn:hover span {
    padding-left:0.5em;
    padding-right:1.5em;
  }
  
  .csstransitions .btn:hover span:before {
    left:96%;
  }
}


/* 次のページへ進む ----------------------------------------*/

.csstransforms .btn--next span:before {
  left:inherit;
  right:0;
}

.csstransitions .btn--next span {
  padding-left:0;
  padding-right:1em;
}

@media all and (min-width:768px) {
  .csstransitions .btn--next:hover span {
    padding-left:0;
    padding-right:1em;
  }
  
  .csstransitions .btn--next:hover span:before {
    left:inherit;
    right:-1em;
  }

  .csstransitions .btn--next:disabled:hover span {
    padding-left:0;
    padding-right:0;
  }
  
  .csstransitions .btn--next:disabled:hover span:before {
    left:inherit;
    right:0;
  }
}


/* 前のページへ戻る ----------------------------------------*/

.csstransforms .btn--prev span:before {
  border-top-style:solid;
  border-left-style:solid;
  border-top-width:1px;
  border-left-width:1px;
  border-right:0;
  border-bottom:0;
}

.csstransforms .btn--prev span:before {
  left:0;
}

.csstransitions .btn--prev span {
  padding-left:1em;
  padding-right:0;
}

@media all and (min-width:768px) {
  .csstransitions .btn--prev:hover span {
    padding-left:1em;
    padding-right:0;
  }
  
  .csstransitions .btn--prev:hover span:before {
    left:-1em;
  }
  
  .csstransitions .btn--prev:disabled:hover span {
    padding-left:0;
    padding-right:0;
  }
  
  .csstransitions .btn--prev:disabled:hover span:before {
    left:0;
  }
}


/* more ----------------------------------------*/

.csstransforms .btn--down span:before {
  content:"▼";
  border:0;
  -webkit-transform:none;
  transform:none;
  width:1em;
  height:1em;
  margin-top:-0.9em;
}

.csstransforms .btn--down span:before {
  left:0;
}

.csstransitions .btn--down span {
  padding-left:1.25em;
  padding-right:0;
}

@media all and (min-width:768px) {
  .csstransitions .btn--down:hover span {
    padding-left:1.25em;
    padding-right:0;
  }
  
  .csstransitions .btn--down:hover span:before {
    left:0;
  }
}


/* カラー ----------------------------------------*/

.csstransforms .btn:disabled span:before,
.csstransforms .btn.disabled span:before {
  border-right-color:#fff;
  border-bottom-color:#fff;
}
.btn:disabled,
.btn:disabled:visited,
.btn:disabled:hover,
.btn.disabled,
.btn.disabled:visited,
.btn.disabled:hover { color:#fff !important; border:1px solid #c8c8c8 !important; background-color:#c8c8c8 !important; }
.btn:disabled span,
.btn.disabled span {
  padding-left:0;
  padding-right:0;
}
.csstransitions .btn:disabled span:before,
.csstransitions .btn.disabled span:before {
  display:none;
}

.btn.disabled {
  cursor:inherit;
}

.csstransforms .btn--default span:before {
  border-right-color:#fff;
  border-bottom-color:#fff;
}
.btn--default,
.btn--default:visited,
.btn--default:hover { color:#fff; border:1px solid #093b6c; background-color:#093b6c; }
.lte-ie8 .btn--default:hover   { color:#fff; border:1px solid #0f9bd7; background-color:#0f9bd7; }
@media all and (min-width:768px) {
  .btn--default:hover   { color:#fff; border:1px solid #00a08c; background-color:#00a08c; }
}


.csstransforms .btn--blue span:before {
  border-right-color:#fff;
  border-bottom-color:#fff;
}
.btn--blue,
.btn--blue:visited,
.btn--blue:hover { color:#fff; border:1px solid #2c77c2; background-color:#2c77c2; }
.lte-ie8 .btn--blue:hover   { color:#fff; border:1px solid #3fafdf; background-color:#3fafdf; }
@media all and (min-width:768px) {
  .btn--blue:hover   { color:#fff; border:1px solid #0f9bd7; background-color:#0f9bd7; }
}


.csstransforms .btn--green span:before {
  border-right-color:#fff;
  border-bottom-color:#fff;
}
.btn--green,
.btn--green:visited,
.btn--green:hover { color:#fff; border:1px solid #00a08c; background-color:#00a08c; }
.lte-ie8 .btn--green:hover   { color:#fff; border:1px solid #28c3aa; background-color:#28c3aa; }
@media all and (min-width:768px) {
  .btn--green:hover   { color:#fff; border:1px solid #28c3aa; background-color:#28c3aa; }
}


.csstransforms .btn--gray span:before {
  border-right-color:#fff;
  border-bottom-color:#fff;
}
.btn--gray,
.btn--gray:visited,
.btn--gray:hover { color:#fff; border:1px solid #969696; background-color:#969696; }
.lte-ie8 .btn--gray:hover   { color:#fff; border:1px solid #c8c8c8; background-color:#c8c8c8; }
@media all and (min-width:768px) {
  .btn--gray:hover   { color:#fff; border:1px solid #c8c8c8; background-color:#c8c8c8; }
}


.csstransforms .btn--grayLine span:before {
  border-right-color:#fff;
  border-bottom-color:#fff;
}
.btn--grayLine,
.btn--grayLine:visited,
.btn--grayLine:hover { color:inherit; border:1px solid #d2d2d2; background-color:#fff; }
.lte-ie8 .btn--grayLine:hover   { color:#fff; border:1px solid #2c77c2; background-color:#2c77c2; }
@media all and (min-width:768px) {
  .btn--grayLine:hover   { color:#fff; border:1px solid #2c77c2; background-color:#2c77c2; }
}


.csstransforms .btn--blueLine span:before {
  border-right-color:#fff;
  border-bottom-color:#fff;
}
.btn--blueLine,
.btn--blueLine:visited,
.btn--blueLine:hover { color:#0f64b9; border:1px solid rgba(15,100,185,0.60); background-color:#fff; }
.lte-ie8 .btn--blueLine { border:1px solid #6fa2d5; }
.lte-ie8 .btn--blueLine:hover   { color:#fff; border:1px solid #2c77c2; background-color:#2c77c2; }
@media all and (min-width:768px) {
  .btn--blueLine:hover   { color:#fff; border:1px solid #2c77c2; background-color:#2c77c2; }
}


/*-----------------------------------------------------------------------------------
  見出し
-----------------------------------------------------------------------------------*/

.headline {
  color:#093b6c;
  font-weight:normal;
  text-align:center;
  margin-bottom:1em;
  font-size:200.0%;
  line-height:1em;
}

.headline-cst {
  font-weight:normal;
  text-align:center;
  line-height:1em;
}

@media (max-width:767px) {
  .headline {
    font-size:187.5%;
  }
}

@media (max-width:500px) {
  .headline {
    font-size:175.0%;
    margin-bottom:0.75em;
  }
}


/*-----------------------------------------------------------------------------------
  block
-----------------------------------------------------------------------------------*/

.block {
  padding-top:50px;
  padding-bottom:50px;
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
}

@media (max-width:767px) {
  .block {
    padding-top:3em;
    padding-bottom:3em;
    padding-left:3%;
    padding-right:3%;
    box-sizing:border-box;
  }
}

@media (max-width:640px) {
  .block {
    padding-top:2.5em;
    padding-bottom:2.5em;
  }
}


/*-----------------------------------------------------------------------------------
  フォーム部品
-----------------------------------------------------------------------------------*/

form textarea    { resize:vertical; }
form textarea,
.ip-l       { width:100%; }
.ip-ss      { width:20%; }
.ip-s       { width:40%; }
.ip-m       { width:60%; }

form input[type="text"],
form select,
form textarea {
	padding:6px;
  border:none;
  box-sizing:border-box;
  border:1px solid #d2d2d2;
	background-color:#fff;
  
  -moz-transition:background-color ease-in-out  0.15s, border-color ease-in-out  0.15s;
  -o-transition:background-color ease-in-out  0.15s, border-color ease-in-out  0.15s;
  -webkit-transition:background-color ease-in-out  0.15s, border-color ease-in-out  0.15s;
  transition:background-color ease-in-out  0.15s, border-color ease-in-out  0.15s;
}

form input[type="text"]:focus,
form select:focus,
form textarea:focus {
  border-color:#646464;
}

form option {
	padding-right:0.5em;
}

form label { cursor:pointer; }
form label input { margin-right:0.5em; }
form label:hover { color:#0f64b9; }

form .error input[type=text], 
form .error textarea,
form .error select {
  border-color:#e64b3c;
  background-color:#fce4e4;
}

form .error .m-ckbox+label:before,
form .error .m-radio+label:before {
}

form .error p {
  padding-top:0.3em;
	padding-bottom:0.5em;
  color:#e64b3c;
}

.ic-required {
  font-size:62.5%;
  display:inline-block;
	background-color:#e64b3c;
  color:#fff;
  padding:0.15em 0.75em;
  box-sizing:border-box;
	font-weight:normal;
  border-radius:2px;
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
}

.ic-optional {
  font-size:62.5%;
  display:inline-block;
	background-color:#969696;
  color:#fff;
  padding:0.15em 0.75em;
  box-sizing:border-box;
	font-weight:normal;
  border-radius:2px;
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
}

form .fm-btn {
  padding-top:1.5em;
}

@media (max-width:767px) {
  form textarea,
  .ip-l,
  .ip-m { width:100%; }
}

@media (max-width:500px) {
  .ip-s,
  .ip-ss { width:100%; }
}


/*-----------------------------------------------------------------------------------
  テキストリンク
-----------------------------------------------------------------------------------*/

.txtlink-url {
  word-wrap:break-word;
}

.txtlink-url[target="_blank"]:after {
  content:"";
  width:11px;
  height:11px;
  display:inline-block;
  margin-left:0.5em;
  vertical-align:middle;
  background-image:url(../image/icon/blue/blank.png);
  background-repeat:no-repeat;
  background-position:right center;
}


/*-----------------------------------------------------------------------------------
  column
-----------------------------------------------------------------------------------*/

.cols {
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
  margin-top:-40px;
}

.cols .col {
  float:left;
  margin-top:40px;
  line-height:1.5;
}

.cols .col:first-child {
  margin-left:0;
}

.cols:after {
  content:"";
  display:block;
  height:0;
  clear:both;
}

.cols-3 .col {
  width:31.81818%;
  margin-left:2.27272%;
}

.cols-3 .col:nth-child(3n+1) {
  clear:both;
  margin-left:0;
}

.cols-4 .col {
  width:23.29545%;
  margin-left:2.27272%;
}

.cols-4 .col:nth-child(4n+1) {
  clear:both;
  margin-left:0;
}

.cols-5 .col {
  width:18.18181%;
  margin-left:2.27272%;
}

.cols-5 .col:nth-child(5n+1) {
  clear:both;
  margin-left:0;
}

@media (max-width:767px) {
  .cols {
    margin-top:-2.5em;
  }
  
  .cols .col {
    margin-top:2.5em;
  }
  
  .cols-3 .col,
  .cols-3 .col:nth-child(3n+1) {
    width:48.5%;
    margin-left:3%;
    clear:none;
  }

  .cols-3 .col:nth-child(2n+1) {
    clear:both;
    margin-left:0;
  }
  
  .cols-4 .col,
  .cols-4 .col:nth-child(4n+1) {
    width:31.333333%;
    margin-left:3%;
    clear:none;
  }
  
  .cols-4 .col:nth-child(3n+1) {
    clear:both;
    margin-left:0;
  }
  
  .cols-5 .col,
  .cols-5 .col:nth-child(5n+1) {
    width:22.75%;
    margin-left:3%;
    clear:none;
  }
  
  .cols-5 .col:nth-child(4n+1) {
    clear:both;
    margin-left:0;
  }
}


@media (max-width:640px) {
  .cols {
    margin-top:-2em;
  }
  .cols .col {
    margin-top:2em;
  }
  
  .cols-3 .col,
  .cols-3 .col:nth-child(3n+1) {
    width:48%;
    margin-left:4%;
  }
  
  .cols-3 .col:nth-child(2n+1) {
    margin-left:0;
  }
  
  .cols-4 .col,
  .cols-4 .col:nth-child(4n+1),
  .cols-4 .col:nth-child(3n+1) {
    width:48%;
    margin-left:4%;
    clear:none;
  }
  
  .cols-4 .col:nth-child(2n+1) {
    clear:both;
    margin-left:0;
  }
  
  .cols-5 .col,
  .cols-5 .col:nth-child(5n+1),
  .cols-5 .col:nth-child(4n+1) {
    width:30.666666%;
    margin-left:4%;
    clear:none;
  }
  
  .cols-5 .col:nth-child(3n+1) {
    clear:both;
    margin-left:0;
  }
}

@media (max-width:500px) {
  .cols-5 .col,
  .cols-5 .col:nth-child(5n+1),
  .cols-5 .col:nth-child(4n+1),
  .cols-5 .col:nth-child(3n+1) {
    width:48%;
    margin-left:4%;
    clear:none;
  }
  
  .cols-5 .col:nth-child(2n+1) {
    clear:both;
    margin-left:0;
  }
}


/*-----------------------------------------------------------------------------------
  Loading
-----------------------------------------------------------------------------------*/

.loading, .loading:after {
  display:inline-block;
  width:80px;
  height:80px;
  background-repeat:no-repeat;
  background-image:
  -webkit-gradient(radial,7 center,0,7 center,7,from(#b2b2b2),color-stop(0.5,#b2b2b2),color-stop(0.9,transparent),to(transparent)),
  -webkit-gradient(radial,center 7,0,center 7,7,from(#b2b2b2),color-stop(0.5,#b2b2b2),color-stop(0.9,transparent),to(transparent)),
  -webkit-gradient(radial,73 center,0,73 center,7,from(#b2b2b2),color-stop(0.5,#b2b2b2),color-stop(0.9,transparent),to(transparent)),
  -webkit-gradient(radial,center 73,0,center 73,7,from(#b2b2b2),color-stop(0.5,#b2b2b2),color-stop(0.9,transparent),to(transparent));
  background-image:
  -webkit-radial-gradient(10% 50%, 7px 7px, #b2b2b2, #b2b2b2 95%, #b2b2b2 95%, transparent),
  -webkit-radial-gradient(50% 10%, 7px 7px, #b2b2b2, #b2b2b2 95%, #b2b2b2 95%, transparent),
  -webkit-radial-gradient(90% 50%, 7px 7px, #b2b2b2, #b2b2b2 95%, #b2b2b2 95%, transparent),
  -webkit-radial-gradient(50% 90%, 7px 7px, #b2b2b2, #b2b2b2 95%, #b2b2b2 95%, transparent);
  background-image:
  radial-gradient(7px 7px at 10% 50%, #b2b2b2, #b2b2b2 95%, transparent),
  radial-gradient(7px 7px at 50% 10%, #b2b2b2, #b2b2b2 95%, transparent),
  radial-gradient(7px 7px at 90% 50%, #b2b2b2, #b2b2b2 95%, transparent),
  radial-gradient(7px 7px at 50% 90%, #b2b2b2, #b2b2b2 95%, transparent);
}
.loading {
  position:relative;
  margin:0 10px;
  vertical-align:middle;
  -webkit-animation:loading_animation 3s linear infinite;
  animation:loading_animation 3s linear infinite;
}
.loading:after {
  position:absolute;
  content:" ";
  left:0;
  top:0;
  margin:0;
  -webkit-transform:rotate(45deg);
  transform:rotate(45deg);
}

@-webkit-keyframes loading_animation {
  0% {
    -webkit-transform:rotate(0deg);
  }
  100% {
    -webkit-transform:rotate(360deg);
  }
}
@keyframes loading_animation {
  0% {
    transform:rotate(0deg);
  }
  100% {
    transform:rotate(360deg);
  }
}

.lte-ie8 .loading:after {
  display: inline-block;
  content: "loading";
  left: 0;
  right: 0;
  top: 50%;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  background-color: transparent;
  border: none;
  text-align: center;
  line-height: 0;
  -webkit-transform: rotate(0);
  transform: rotate(0);
}

.lte-ie8 .loading:before, .loading span {
  display: none !important;
}


/*-----------------------------------------------------------------------------------
  Pagination
-----------------------------------------------------------------------------------*/

.pagination {
  padding-top:40px;
  text-align:center;
}

.pagination ul {
  display:inline-block;
  margin-left:auto;
  margin-right:auto;
}

.pagination li {
  display:inline-block;
  border-radius:2px;
  box-sizing:border-box;
  transition:border-color 0.3s ease, background-color 0.3s ease;
  text-align:center;
  cursor:pointer;
  padding:0.75em 0.9em;
  background-color:#d2d2d2;
  border:1px solid #d2d2d2;
  color:#fff;
  margin:0 4px;
  line-height:1;
  vertical-align:top;
}

.pagination li a,
.pagination li a:hover {
  text-decoration:none;
}

.pagination li a {
  display:block;
  color:#fff;
  box-sizing:border-box;
}

.lte-ie8 .pagination li:hover,
.pagination li.active {
  background-color:#2c77c2;
  border-color:#2c77c2;
  color:#fff;
}

.pagination li.active {
  cursor:inherit;
}

.lte-ie8 .pagination li:hover a,
.pagination li.active a {
  color:#fff;
}

.pagination li.prev span,
.pagination li.next span {
  font-size:0;
  text-indent:-9999px;
}

.svg .pagination li.prev a    { background-image:url(../image/icon/white/pager-prev.svg); }
.no-svg .pagination li.prev a { background-image:url(../image/icon/white/pager-prev-s.png); }
.svg .pagination li.next a    { background-image:url(../image/icon/white/pager-next.svg); }
.no-svg .pagination li.next a { background-image:url(../image/icon/white/pager-next-s.png); }

.pagination li.prev a,
.pagination li.next a {
  width:1em;
  height:1em;
  width:10px;
  content:"";
  display:block;
  background-repeat:no-repeat;
  background-position:center center;
  background-size:auto 10px;
}

@media (min-width:768px) {
  .pagination li:hover {
    background-color:#2c77c2;
    border-color:#2c77c2;
  }
  
  .pagination li:hover a {
    color:#fff;
  }
}

@media (max-width:767px) {
  .pagination {
    padding-top:3em;
  }
}

@media (max-width:640px) {
  .pagination {
    padding-top:2.5em;
  }
}

@media (max-width:500px) {
  .pagination li.prev a,
  .pagination li.next a {
    background-size:auto 9px;
  }
}


/*-----------------------------------------------------------------------------------
  ブログパターン
-----------------------------------------------------------------------------------*/

.glog {
  margin-top:40px;
}

.glog:after {
  content:"";
  display:block;
  height:0;
  clear:both;
}

.glog ul,
.glog ol {
  list-style:inherit;
  margin-left:1.5em;
}
.glog ol {
  list-style:decimal;
}

.glog-txt {
  box-sizing:border-box;
  word-break:break-all;
}

.glog-image-left .glog-txt {
  float:right;
}

.glog-image-right .glog-txt {
  float:left;
}

.glog-image-left .glog-img,
.glog-image-right .glog-img {
  display:inline-block;
  margin-bottom:0.5em;
  box-sizing:border-box;
}

.glog-image-left .glog-img {
  float:left;
}

.glog-image-right .glog-img {
  float:right;
}

.glog-image-center .glog-img {
  display:block;
  text-align:center;
  margin-bottom:30px;
}

.glog .datafile {
  margin-bottom:20px;
  display:inline-block;
}

.glog .datafile img {
  vertical-align:middle;
  margin-right:0.75em;
}

.glog-md1 {
  border-left:3px solid #fff;
  line-height:1.5;
  font-size:24px;
  padding-left:0.75em;
  margin-bottom:1em;
  font-weight:normal;
}

.glog-ind {
  padding-left:1.25em;
}

@media (max-width:767px) {
  .glog {
    margin-top:3em;
  }
}

@media (max-width:640px) {
  .glog {
    margin-top:2.5em;
  }
  
  .glog-txt {
    width:inherit !important;
  }
  
  .glog-image-left .glog-img,
  .glog-image-right .glog-img {
    float:none;
    display:block;
    text-align:center;
    margin-bottom:30px;
    width:inherit !important;
  }
}


/* pager ----------------------------------------*/

.glog-pager {
  border-top:1px solid #dcdcdc;
  margin-top:40px;
  padding-top:1.5em;
}

.glog-pager:after {
  content:"";
  display:block;
  height:0;
  clear:both;
}

.glog-pager a,
.glog-pager a:hover {
  color:inherit;
  text-decoration:none;
}

.lte-ie8 .glog-pager a:hover {
  color:inherit;
  text-decoration:underline;
}
  
.glog-pager__list {
  display:inline-block;
  float:left;
}

.glog-pager__list a:before {
  content:"";
  display:inline-block;
  vertical-align:middle;
  margin-right:0.75em;
  width:15px;
  height:1em;
  background:url(../image/icon/black/pager-list.png) no-repeat left center;
}

.glog-pager ul {
  display:inline-block;
  float:right;
}

.glog-pager li {
  display:inline-block;
}

.glog-pager__prev a:before {
  content:"";
  display:inline-block;
  vertical-align:middle;
  margin-right:0.75em;
  width:7px;
  height:1em;
  background:url(../image/icon/black/pager-prev.png) no-repeat left center;
}

.glog-pager__next a:after {
  content:"";
  display:inline-block;
  vertical-align:middle;
  margin-left:0.75em;
  width:7px;
  height:1em;
  background:url(../image/icon/black/pager-next.png) no-repeat left center;
}

.glog-pager__and {
  width:0.75em;
  line-height:1;
  border-left:1px solid #dcdcdc;
  margin-left:0.75em;
}

@media (min-width:768px) {
  .glog-pager a:hover {
    color:inherit;
    text-decoration:underline;
  }
}

@media (max-width:767px) {
  .glog-pager {
    margin-top:3em;
  }
  
  .glog-pager__and {
    display:none !important;
  }
  
  .glog-pager li,
  .glog-pager__list {
    padding-top:0.5em;
  }
  
  .glog-pager li a,
  .glog-pager__list a {
    border:1px solid #d2d2d2;
    border-radius:3px;
    padding:0.5em 1em;
  }
  
  .glog-pager li {
    margin-left:5px;
  }
}

@media (max-width:640px) {
  .glog-pager {
    margin-top:2.5em;
  }
}

@media (max-width:400px) {
  .glog-pager li span {
    display:none;
  }
  
  .glog-pager__prev a:before {
    margin-right:0;
  }
  
  .glog-pager__next a:after {
    margin-left:0;
  }
}


/* 非公開 ----------------------------------------*/

.hnone-box {
  max-width:1100px;
  text-align:center;
  box-sizing:border-box;
  margin:2.5em auto 40px auto;
  padding:0.75em 1em;
  color:#e64b3c;
  border:1px solid #e64b3c;
}

.hnone-box b {
  font-size:146.2%;
}

@media (max-width:767px) {
  .hnone-box {
    margin:2em 3%;
    padding:0.75em;
  }
}