﻿@charset "utf-8"; 

@media screen and (min-width: 640px) {}
.imgChange{}

@font-face {
font-family: DIN;
src: url(../font/ufonts.com_dinmittelschriftstd-1-opentype.woff);
}

/* scroll */
.animated{ opacity: 0;}

@media screen and (min-width: 480px) {
/*=============================================================
 contents
=============================================================*/
#wrapper{ width: 100%; min-width: 1120px; margin: 0px auto; overflow: hidden;}

/* middle promo */
body#middle #promo{ padding: 145px 0 40px; position: relative; width: 100%; min-width: 1120px;}
h2.middlePromo{ width: 1120px; margin: 0px auto; font-size: 4.0em; line-height: 1.1; text-align: center; font-family: DIN; color: #FFF;}
h2.middlePromo span{ display: block; font-size: 1.5rem; line-height: 1.1; text-align: center; font-family: "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro," メイリオ", Meiryo, Osaka," ＭＳ Ｐゴシック", MS PGothic," sans-serif";}
h2.middlePromo span em{ font-style: normal; display: inline-block; padding: 0 3.0em; position: relative;}
h2.middlePromo span em:before{ content: ""; width: 2.0em; height: 1px; background: rgba(255,255,255,0.3); position: absolute; top: 50%; left: 0px;}
h2.middlePromo span em:after{ content: ""; width: 2.0em; height: 1px; background: rgba(255,255,255,0.3); position: absolute; top: 50%; right: 0px;}

/* color */
body.basic #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #E9A52C; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.basic #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #EA5A1D; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}

/* breadcrumb */
.breadcrumb{ width: 1120px; margin: 50px auto 25px; padding: 0.75em 0; border-bottom: solid 1px #EEE;}
.breadcrumb ul{ letter-spacing: -0.4em;}
.breadcrumb ul li{ display: inline-block; vertical-align: top; letter-spacing: 0; font-size: 1.1rem; line-height: 1.1; padding-left: 1.25em; position: relative; margin-right: 1.0em; color: #999;}
.breadcrumb ul li:before{ content: "\f105"; font-family: FontAwesome; color: #EA5A1D; position: absolute; top: 50%; left: 0px; transform: translateY(-50%);}
.breadcrumb ul li:first-child:before{ content: "\f015";}
.breadcrumb ul li a{ color: #333; text-decoration: none;}
.breadcrumb ul li a:hover{ color: #999;}

/* heading */
h3.heading{ text-align: center; position: relative; margin-bottom: 1.5em; padding-bottom: 1.0em;}
h3.heading span{ display: inline-block; font-size: 4.0rem; line-height: 1.1; color: #EA5A1D;}
h3.heading:before{ content: ""; width: 2.5em; height: 2px; background: #EA5A1D; position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%);}

h3.midashi{ font-size: 3.0rem; line-height: 1.1; font-weight: 600; padding: 0.5em 0;}
h4.midashi{ background: url(../../image/common/h4.png) repeat center top; border: solid 1px rgba(0,0,0,0.05); border-left: solid 2px #EA5B1E; padding: 0.5em; font-size: 2.3rem; line-height: 1.1; margin: 50px 0 15px;}
h5.midashi{ font-size: 1.7rem; line-height: 1.1; font-weight: 600; margin: 30px 0 15px; color: #EA5B1E; padding: 0.5em 0; border-bottom: dotted 1px #E4E4E4;}

/* link button */
.linkBtn{ text-align: center; margin-top: 1.5em;}
.linkBtn a{ display: inline-block; background: #333; border: solid 1px #333; font-weight: 600; color: #FFF; text-decoration: none; padding: 0.25em 3.0em; border-radius: 50px; position: relative;}
.linkBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.linkBtn a:hover:after{ right: 0.75em;}
.linkBtn a:hover{ background: #FFF; color: #333;}

/* image resize */
.imgFit img{ width: 100%; height: auto;}

/* section width */
.full{ width: 100% !important; min-width: 1120px; margin: 0px auto;}
.full .divInr{ width: 1120px; margin: 0px auto;}

/* HOME
-------------------------------------------------------------*/
.bxslider{}
.bxslider li{ padding: 272px 0 167px; position: relative;}
.bxslider li:before{ content: ""; width: 100%; height: 100%; background: rgba(255,255,255,0.7); position: absolute; top: 0px; left: 0px; z-index: 0; }
.bxslider li h2{ width: 1120px; margin: 0px auto; position: relative; z-index: 10;}
.bxslider li.slide01{ background: url(../../image/slider/slide_bg_01.png) no-repeat center center; background-size: 100%;}
.bxslider li.slide02{ background: url(../../image/slider/slide_bg_02.png) no-repeat center center; background-size: 100%;}
.bxslider li.slide03{ background: url(../../image/slider/slide_bg_03.png) no-repeat center center; background-size: 100%;}
.bxslider li.slide04{ padding: 0px; text-align: center;}

body.home #container{ padding-bottom: 0px !important;}

/* menu */
.enpmenu{ display: none;}

/* menu2 */
.enpmenu{ width: 100% !important; background: #FFF; padding: 0px !important;}
.enpmenu h1{ text-align: center; margin-bottom: 1.5em; position: relative; z-index: 10;}
.enpmenu h1 .text{ font-size: 1.9rem; line-height: 1.5; color: #FFF; position: relative; z-index: 10;}
#panel{ width: 100%; margin: 0px auto;}
#panel dt{ background: #DA551C; cursor: pointer; font-weight: 600; color: #FFF; padding: 1.0em; position: relative; border-bottom: solid 1px rgba(255,255,255,0.1);}
#panel dt:before{ content: "\f055"; font-family: FontAwesome; position: absolute; top: 1.0em; right: 1.0em;}
#panel dd{}
#panel dd ul{ letter-spacing: -0.4em; border: solid 2px #FFF; border-style: solid none none solid;}
#panel dd ul li{ width: 25%; display: inline-block; vertical-align: top; letter-spacing: 0; border: solid 2px #FFF; border-style: none solid solid none;}
#panel dd ul li a{ display: block; padding: 1.0em 0; text-decoration: none; color: rgba(51,51,51,0.8);}
#panel dd ul li span.icon{ display: block; width: 40%; margin: 0px auto;}
#panel dd ul li span.icon img{ width: 100%; height: auto;}
#panel dd ul li em{ display: block; font-style: normal; font-weight: 600; font-size: 1.1rem; line-height: 1.1; text-align: center; margin-top: 0.5em;}
#panel dd ul li:nth-child(1){ background: #eaf4fc;}
#panel dd ul li:nth-child(2){ background: #eaedf7;}
#panel dd ul li:nth-child(3){ background: #e8ecef;}
#panel dd ul li:nth-child(4){ background: #ebf6f7;}
#panel dd ul li:nth-child(5){ background: #c1e4e9;}
#panel dd ul li:nth-child(6){ background: #bce2e8;}
#panel dd ul li:nth-child(7){ background: #a2d7dd;}
#panel dd ul li:nth-child(8){ background: #abced8;}
#panel dd ul li:nth-child(9){ background: #e0ffff;}
#panel dd ul li:nth-child(10){ background: #eaf4fc;}
#panel dd ul li:nth-child(11){ background: #eaedf7;}
#panel dd ul li:nth-child(12){ background: #e8ecef;}

.midashi {
position: relative;
font-size: 40px;
border-bottom: 2px solid #000;
margin: 1.0em;
}

.after {
font-size: 15px;
margin-left: 15px;
}

/* 新着情報 */
.newsList{ padding: 0 0 100px !important; position: relative;}
.newsList:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 250px; margin: -150px -10% 0; background: #E9A52C; transform-origin: left top; transform: rotate(3deg); z-index: -1;}
.newsList:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 250px; margin: -150px -10% 0; background: #EA5A1D; transform-origin: right top; transform: rotate(-3deg); z-index: -1;}
.newsList h3{ font-size: 4.0rem; line-height: 1.1; text-align: center; font-weight: 600; color: #FFF; padding: 1.5em 0;}
.newsList h3 span{ display: block; font-family: DIN; font-size: 2.3rem; line-height: 1.1; font-weight: normal; text-align: center; opacity: 0.5;}
.newsList table{ width: 70%; margin: 0px auto;}
.newsList table tr{ border-bottom: dashed 2px #DDD;}
.newsList table th{ width: 20%; color: #EA591D; padding: 1.0em 0.5em; position: relative;}
.newsList table th span{ display: inline-block; width: 45%; text-align: center; font-size: 1.1rem; line-height: 1.1; border: solid 1px #DDD; color: #999; padding: 0.2em 1.0em; position: absolute; top: 50%; right: 0px; transform: translateY(-50%);}
.newsList table td{ width: 80%; padding: 1.0em;}
.newsList table td a{ color: rgba(51,51,51,1.0); text-decoration: none;}
.newsList table td a:hover{ color: rgba(51,51,51,0.6);}

/* ABOUT INSTANCE */
.homeAbout{ background: url(../../image/home/bg_01.png) no-repeat center center #F6F6F6;}
.homeAbout h3{ text-align: center; margin-bottom: 1.5em;}
.homeAbout .text{ font-size: 1.9rem; line-height: 1.5;}
.homeAbout ul{ text-align: center; letter-spacing: -0.4em; width: 1120px; margin: 2.0em auto 0px auto;}
.homeAbout ul li{ width: 17.6%; display: inline-block; vertical-align: middle; letter-spacing: 0; margin-right: 3%; border-radius: 300px; overflow: hidden; background: #FFF; box-shadow: 0px 0px 6px rgba(0,0,0,0.1);}
.homeAbout ul li:nth-child(2){ animation-delay:0.3s;}
.homeAbout ul li:nth-child(3){ animation-delay:0.6s;}
.homeAbout ul li:nth-child(4){ animation-delay:0.9s;}
.homeAbout ul li:nth-child(5){ animation-delay:1.2s;}
.homeAbout ul li:nth-child(5){ margin-right: 0px;}
.homeAbout .homeBtn{ text-align: center; margin-top: 2.0em;}
.homeAbout .homeBtn a{ display: inline-block; border: solid 2px #EA5A1D; font-size: 1.4rem; line-height: 1.1; font-weight: 600; color: #EA5A1D; text-decoration: none; padding: 0.75em 4.0em; position: relative; border-radius: 50px;}
.homeAbout .homeBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.homeAbout .homeBtn a:hover:after{ right: 0.75em;}
.homeAbout .homeBtn a:hover{ background: #EA5A1D; color: #FFF; border-color: #EE7B4A;}

/* STAFF VOICE */
.homeVoice{ background: url(../../image/home/bg_02.png) no-repeat center center; background-size: 100%; position: relative;}
.homeVoice:before{ content: ""; width: 100%; height: 100%; background: rgba(0,0,0,0.7); position: absolute; top: 0px; left: 0px; z-index: 0;}
.homeVoice h3{ text-align: center; margin-bottom: 1.5em; position: relative; z-index: 10;}
.homeVoice .text{ font-size: 1.9rem; line-height: 1.5; color: #FFF; position: relative; z-index: 10;}
.homeVoice .clm{ width: 1120px; margin: 2.0em auto 0px auto; position: relative; z-index: 10; letter-spacing: -0.4em;}
.homeVoice .clm .inner{ width: 33.333333%; display: inline-block; vertical-align: top; letter-spacing: 0; position: relative; padding-bottom: 6.0em;}
.homeVoice .clm .inner:nth-child(2){ animation-delay:0.3s;}
.homeVoice .clm .inner:nth-child(3){ animation-delay:0.6s;}
.homeVoice .clm .inner .image{ width: 60%; margin-left: 40%; position: relative;}
.homeVoice .clm .inner .image img{ width: 100%; height: auto;}
.homeVoice .clm .inner .image span{ width: 30%; height: 70px; border: solid 2px #333; position: absolute; top: 1.0em; right: 1.0em; z-index: 10; padding: 0.5em; text-align: right; font-family: DIN; font-size: 1.0rem; line-height: 1.2;}
.homeVoice .clm .inner .image span strong{ display: block; text-align: right; font-weight: normal; font-size: 2.5rem; line-height: 1.1;}
.homeVoice .clm .inner .box{ width: 60%; background: rgba(255,255,255,0.9); padding: 1.5em 1.0em; position: absolute; bottom: 0px; left: 5px;}
.homeVoice .clm .inner .box h4{ border-bottom: solid 1px rgba(0,0,0,0.05); margin-bottom: 0.75em; padding-bottom: 0.75em;}
.homeVoice .clm .inner .box h4 span{ display: block; font-size: 1.1rem; line-height: 1.1; margin-bottom: 0.25em;}
.homeVoice .clm .inner .box h4 strong{ display: block; font-size: 2.9rem; line-height: 1.1; font-weight: 600;}
.homeVoice .clm .inner .box h4 strong:first-letter{ color: #EA591D;}
.homeVoice .clm .inner .box .text{ font-size: 1.3rem; line-height: 1.2; color: #333;}
.homeVoice .clm .inner .box .button{ margin-top: 1.0em;}
.homeVoice .clm .inner .box .button a{ display: inline-block; font-size: 1.1rem; line-height: 1.1; color: #FFF; text-decoration: none; font-weight: 600; padding: 0.25em 2.0em; border: solid 1px #333; background: #333; border-radius: 50px; position: relative;}
.homeVoice .clm .inner .box .button a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.homeVoice .clm .inner .box .button a:hover:after{ right: 0.75em;}
.homeVoice .clm .inner .box .button a:hover{ background: none; color: #333;}
.homeVoice .homeBtn{ text-align: center; margin-top: 2.0em;}
.homeVoice .homeBtn a{ display: inline-block; border: solid 2px #FFF; font-size: 1.4rem; line-height: 1.1; font-weight: 600; color: #FFF; text-decoration: none; padding: 0.75em 4.0em; position: relative; border-radius: 50px;}
.homeVoice .homeBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.homeVoice .homeBtn a:hover:after{ right: 0.75em;}
.homeVoice .homeBtn a:hover{ background: #FFF; color: #333; border-color: rgba(51,51,51,0.3);}

/* INHOUSE SYSTEM */
.homeService{ background: url(../../image/home/bg_03.png) no-repeat center center; background-size: 100%; position: relative; overflow: hidden;}
.homeService:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 200px; margin: -185px -10% 0; background: rgba(255,255,255,0.3); transform-origin: left top; transform: rotate(5deg); z-index: 0;}
.homeService:after { content: ''; position: absolute; width: 120%; height: 200px; background: rgba(255,255,255,0.3); transform-origin: left bottom; transform: rotate(5deg); z-index: 0; bottom: 0px; left: -10%;}
.homeService h3{ text-align: center; margin-bottom: 1.5em; position: relative; z-index: 10;}
.homeService .text{ font-size: 1.9rem; line-height: 1.5; color: #FFF; position: relative; z-index: 10;}
.homeService ul{ text-align: center; width: 800px; margin: 2.0em auto 0px auto; letter-spacing: -0.4em; position: relative; z-index: 10;}
.homeService ul li{ width: 30.666666%; display: inline-block; vertical-align: top; letter-spacing: 0; margin-right: 4%; box-shadow: 0px 0px 6px rgba(0,0,0,0.1); background: #FFF; border-radius: 300px; overflow: hidden;}
.homeService ul li:nth-child(3n){ margin-right: 0px;}
.homeService ul li:nth-child(2){ animation-delay:0.3s;}
.homeService ul li:nth-child(3){ animation-delay:0.6s;}
.homeService ul li img{ width: 100%; height: auto;}
.homeService ul li a{ opacity: 1.0;}
.homeService ul li a:hover{ opacity: 0.6;}

/*  */
.homeCont{ background: url(../../image/home/graph.png) repeat center top;}
.homeCont h3{ text-align: center; margin-bottom: 1.5em; position: relative; z-index: 10;}
.homeCont .text{ font-size: 1.9rem; line-height: 1.5; position: relative; z-index: 10;}
.homeCont .homeBtn{ text-align: center; margin-top: 2.0em;}
.homeCont .homeBtn a{ display: inline-block; border: solid 2px #EA5A1D; font-size: 1.4rem; line-height: 1.1; font-weight: 600; color: #EA5A1D; text-decoration: none; padding: 0.75em 5.0em; position: relative; border-radius: 50px;}
.homeCont .homeBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.homeCont .homeBtn a:hover:after{ right: 0.75em;}
.homeCont .homeBtn a:hover{ background: #EA5A1D; color: #FFF; border-color: #EE7B4A;}

.homeCont .phone a{ padding-left: 0px;}
.homeCont .phone a:before{ content: "";}

/*  */
.homeMap{ padding: 0px !important;}
.homeMap iframe{ width: 100%; vertical-align: top;}

/* TOPICS
-------------------------------------------------------------*/
.topicsList{}
.topicsList li{ letter-spacing: -0.4em; padding: 1.5em 0; border-bottom: solid 1px #EEE;}
.topicsList li span{ width: 12%; display: inline-block; vertical-align: top; letter-spacing: 0; color: #999;}
.topicsList li em{ font-style: normal; width: 10%; display: inline-block; vertical-align: middle; letter-spacing: 0; font-size: 1.1rem; line-height: 1.1; text-align: center; border: solid 1px #DDD; color: #999; padding: 0.2em 0;}
.topicsList li a{ width: 74%; display: inline-block; vertical-align: top; letter-spacing: 0; color: rgba(51,51,51,1.0); text-decoration: none; margin-left: 4%; position: relative;}
.topicsList li a:before{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.5em; transform: translateY(-50%); transition: all 0.2s ease 0s; color: #999;}
.topicsList li a:hover:before{ right: 1.0em; color: #EA5B1E;}
.topicsList li a:hover{ color: rgba(51,51,51,0.6);}

.pager{ text-align: center; letter-spacing: -0.4em;}
.pager li{ display: inline-block; vertical-align: top; letter-spacing: 0; line-height: 1.0; width: 3%; border: solid 1px #E4E4E4; margin: 0 2px; border-radius: 3px;}
.pager li a{ color: rgba(51,51,51,1.0); text-decoration: none; display: block; padding: 0.75em 0;}
.pager li.active a,
.pager li a:hover{ background: #666; color: #FFF;}

.update{ letter-spacing: -0.4em; border-top: solid 1px #EEE; margin-bottom: 1.5em;}
.update li{ display: inline-block; vertical-align: middle; letter-spacing: 0; font-size: 1.1rem; line-height: 1.1; padding: 1.5em 0;}
.update li.date{ margin-right: 2.0em;}
.update li.cate span{ display: inline-block; background: #EA5B1E; color: #FFF; padding: 0.25em 1.5em; border-radius: 5px;}

/* ABOUT US
-------------------------------------------------------------*/
/* color */
body.about #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #F55797; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.about #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #F22D7D; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.about h3.heading span,
body.about .breadcrumb ul li:before{ color: #F22D7D;}
body.about h3.heading:before,
body.about footer{ background: #F22D7D;}
body.about footer .footNavi li a:hover{ background: #FFF; color: #F22D7D; border-color: rgba(242,45,125,0.3);}

/* インスタンスは4つのキーワードを企業ポリシーとして行動しています */
.idea01{ position: relative; width: 60%; margin: 0px auto; padding: 2.0em 0;}
.idea01 h4{ float: left;}
.idea01 .inner{ width: 47.5%; position: absolute; top: 50%; right: 0px; transform: translateY(-50%);}
.idea01 .inner p{ color: #2695B9; font-weight: 600;}
.idea01:before{ content: ""; width: 70px; height: 70px; background: url(../../image/about/cross.png); background-size: contain; position: absolute; bottom: -35px; left: 40%; transform: translateX(-50%);}
.idea02{ position: relative; width: 60%; margin: 0px auto; padding: 2.0em 0;}
.idea02 h4{ float: right;}
.idea02 .inner{ width: 50%; position: absolute; top: 50%; left: 0px; transform: translateY(-50%);}
.idea02 .inner p{ color: #174D97; font-weight: 600;}
.idea02:before{ content: ""; width: 70px; height: 70px; background: url(../../image/about/cross.png); background-size: contain; position: absolute; bottom: -35px; left: 60%; transform: translateX(-50%);}
.idea03{ position: relative; width: 50%; margin: 0px auto; padding: 2.0em 0;}
.idea03 h4{ float: left;}
.idea03 .inner{ width: 60%; position: absolute; top: 50% !important; right: 0px; transform: translateY(-50%);}
.idea03 .inner p{ color: #E9A52C; font-weight: 600;}
.idea03:before{ content: ""; width: 70px; height: 70px; background: url(../../image/about/cross.png); background-size: contain; position: absolute; bottom: -15px; left: 40%; transform: translateX(-50%);}
.idea04{ position: relative; width: 70%; margin: 0px auto; padding: 2.0em 0;}
.idea04 h4{ float: right;}
.idea04 .inner{ width: 60%; position: absolute; top: 50% !important; left: 0px; transform: translateY(-50%);}
.idea04 .inner p{ color: #D41A19; font-weight: 600;}

/* インスタンスについて */
.aboutus{ width: 100% !important; min-width: 1120px; background: url(../../image/about/stripe_01.png) repeat center top;}
.aboutClm{ letter-spacing: -0.4em; width: 1120px; margin: 0px auto;}
.aboutClm .inner{ width: 48%; min-height: 190px; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 1.0em 4% 1.0em 0; border: solid 4px #FEEAF2; background: #FFF; padding: 1.0em; border-radius: 5px;}
.aboutClm .inner:nth-child(2n){ margin-right: 0px;}
.aboutClm .inner:nth-child(2){ animation-delay:0.3s;}
.aboutClm .inner:nth-child(3){ animation-delay:0.6s;}
.aboutClm .inner:nth-child(4){ animation-delay:0.9s;}
.aboutClm .inner h4{ font-size: 2.1rem; text-align: center; line-height: 1.1; font-weight: 600; color: #F22D7D; border-bottom: solid 1px #FEEAF2; padding: 0.5em 0 0.75em 0; margin-bottom: 0.75em;}

/* 会社概要 */
.companyTable{ width: 100%; border-top: dotted 1px #E4E4E4; margin-top: 2.0em;}
.companyTable tr{ letter-spacing: -0.4em; display: block; padding: 1.0em 0; border-bottom: dotted 1px #E4E4E4;}
.companyTable tr th{ width: 20%; display: inline-block; vertical-align: top; letter-spacing: 0; padding: 0 1.0em; color: #F22D7D;}
.companyTable tr td{ width: 80%; display: inline-block; vertical-align: top; letter-spacing: 0; padding: 0 1.0em; border-left: solid 2px #F22D7D;}

/* 会社沿革 */
.historyTable{ width: 100%; border-top: solid 1px #EEE; margin-top: 2.0em;}
.historyTable tr{ border-bottom: solid 1px #EEE;}
.historyTable tr:nth-child(even){ background: rgba(0,0,0,0.015);}
.historyTable tr th{ width: 20%; padding: 1.0em; background: rgba(0,0,0,0.015);}
.historyTable tr td{ width: 80%;padding: 1.0em;}

/* EXECUTIVE
-------------------------------------------------------------*/
.executive01{ background: url(../../image/about/executive_01.png) no-repeat top left; background-size: 110%; position: relative; padding: 7.0vw 5% 7.0vw 45%;}
.executive01 h3{ font-size: 3.0rem; line-height: 1.2; font-weight: 600; color: #F22D7D; margin-bottom: 0.5em;}
.executive01 h4.name{ font-family: "游明朝体", "Yu Mincho", YuMincho, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif; font-size: 3.0rem; line-height: 1.1; position: absolute; bottom: 3.5vw; left: 1.0em; color: #FFF; text-shadow: 0px 0px 5px rgba(0,0,0,0.6);}
.executive01 h4.name span{ display: inline-block; font-size: 1.3rem; margin-right: 1.0em;}
.executive01 h4.name em{ font-style: normal; display: block; font-size: 1.1rem; line-height: 1.1; margin-top: 0.25em; padding-left: 7.25em;}
.executive01 ul{ margin-top: 2.0em; letter-spacing: -0.4em; text-align: right;}
.executive01 ul li{ font-family: DIN; line-height: 1.1; width: 20%; display: inline-block; vertical-align: top; letter-spacing: 0; margin-left: 1.5%;}
.executive01 ul li a{ display: block; text-decoration: none; color: #FFF; background: #F22D7D; text-align: center; padding: 45px 0; cursor: pointer;}
.executive01 ul li a:hover{ background: #F55797;}

p.d03{ animation-delay:0.3s;}

.executive02{ background: url(../../image/about/executive_02.png) no-repeat top right; background-size: 110%; position: relative; padding: 7.5vw 45% 7.5vw 5%;}
.executive02 h3{ font-size: 3.0rem; line-height: 1.2; font-weight: 600; color: #F22D7D; margin-bottom: 0.5em;}
.executive02 h4.name{ font-family: "游明朝体", "Yu Mincho", YuMincho, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif; font-size: 3.0rem; line-height: 1.1; position: absolute; bottom: 3.5vw; right: 1.0em; color: #FFF; text-shadow: 0px 0px 5px rgba(0,0,0,0.6);}
.executive02 h4.name span{ display: inline-block; font-size: 1.3rem; margin-right: 1.0em;}
.executive02 h4.name em{ font-style: normal; display: block; font-size: 1.1rem; line-height: 1.1; margin-top: 0.25em; padding-left: 7.25em;}
.executive02 ul{ margin-top: 2.0em; letter-spacing: -0.4em; text-align: left;}
.executive02 ul li{ font-family: DIN; line-height: 1.1; width: 20%; display: inline-block; vertical-align: top; letter-spacing: 0; margin-right: 1.5%;}
.executive02 ul li a{ display: block; text-decoration: none; color: #FFF; background: #F22D7D; text-align: center; padding: 45px 0; cursor: pointer;}
.executive02 ul li a:hover{ background: #F55797;}

.modal-content h3{ font-size: 2.5rem; line-height: 1.2; font-weight: 600; color: #F22D7D; margin-bottom: 0.75em; border-bottom: solid 1px #EEE; padding-bottom: 0.75em; text-align: left;}
.modal-content .text{ text-align: left;}

/* SERVICE
-------------------------------------------------------------*/
/* color */
body.service #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #E9A52C; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.service #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #EA5A1D; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.service h3.heading span,
body.service .breadcrumb ul li:before{ color: #EA5A1D;}
body.service h3.heading:before,
body.service footer{ background: #EA5A1D;}

.serviceFigure{ width: 60%; margin: 0px auto;}
.serviceTable{ width: 100%; border: solid 1px #E4E4E4;}
.serviceTable th{ background: rgba(234,90,29,0.7); color: #FFF; border: solid 1px #E4E4E4; border-collapse: collapse; padding: 1.0em; width: 30%; line-height: 1.3;}
.serviceTable td{ background: #FFF; border: solid 1px #E4E4E4; border-collapse: collapse; padding: 1.0em; width: 35%; line-height: 1.3; word-break: break-all;}

/* 派遣事業 */
.serviceClm{ letter-spacing: -0.4em;}
.serviceClm .inner{ width: 74%; display: inline-block; vertical-align: top; letter-spacing: 0;}
.serviceClm ul{ width: 22%; display: inline-block; vertical-align: top; margin-left: 4%;}
.serviceClm ul li{ width: 30.666666%; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 0 4% 1.0em 0;}
.serviceClm ul li:nth-child(3n){ margin-right: 0px;}
.serviceClm ul li:nth-child(1){ animation-delay:0.3s;}
.serviceClm ul li:nth-child(2){ animation-delay:0.6s;}
.serviceClm ul li:nth-child(3){ animation-delay:0.9s;}
.serviceClm ul li a{ font-size: 6.0rem; line-height: 1.1; display: block; text-align: center; color: rgba(212,26,25,1);}
.serviceClm ul li a:hover{ color: rgba(212,26,25,0.6);}
.serviceClm ul li span{ display: block; font-size: 1.3rem; line-height: 1.1; margin-top: 0.5em; text-align: center;}

.getPdf{ border: dotted 1px #E4E4E4; background: #F9F9F9; margin-top: 5.0em; letter-spacing: -0.4em; padding: 0.5em;}
.getPdf a{ display: inline-block; width: 15%; vertical-align: middle; letter-spacing: 0;}
.getPdf img{ width: 100%; height: auto;}
.getPdf p{ width: 71%; display: inline-block; vertical-align: middle; letter-spacing: 0; margin-left: 4%; font-size: 1.3rem; line-height: 1.2;}

/* MEMBER
-------------------------------------------------------------*/
/* color */
body.member #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #FAC067; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.member #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #F9B041; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.member h3.heading span,
body.member .breadcrumb ul li:before{ color: #F9B041;}
body.member h3.heading:before,
body.member footer{ background: #F9B041;}
body.member footer .footNavi li a:hover{ background: #FFF; color: #F9B041; border-color: rgba(249,176,65,0.3);}

/* STAFF VOICE */
.voice{ letter-spacing: -0.4em;}
.voice .inner{ width: 32%; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 0 2% 2.0em 0;}
.voice .inner:nth-child(3n){ margin-right: 0px;}
.voice .inner .image{ position: relative;}
.voice .inner .image img{ width: 100%; height: auto;}
.voice .inner .image span{ width: 30%; height: 100px; border: solid 2px #333; position: absolute; top: 1.0em; right: 1.0em; z-index: 10; padding: 0.5em; text-align: right; font-family: DIN; font-size: 1.0rem; line-height: 1.2;}
.voice .inner .image span strong{ display: block; text-align: right; font-weight: normal; font-size: 2.5rem; line-height: 1.1;}
.voice .inner h4{ font-size: 2.9rem; line-height: 1.1; font-weight: 600; padding: 1.0em 0.5em 0.5em 0.5em; position: relative; color: #FFF;}
.voice .inner h4 span{ font-size: 1.3rem; line-height: 1.1; position: absolute; top: 1.0em; left: 1.0em;}
.voice .inner a{ color: #333; text-decoration: none; display: block; background: #F9B041;}
.voice .inner a:hover{ background: #000;}

/* ALL STAFF */
.allStaff{ position: relative;}

/* voice */
.voiceHead{ position: relative;}
.voiceHead .image img{ width: 100%; height: auto;}
.voiceHead h3{ display: inline-block; background: rgba(255,255,255,0.9); padding: 0.25em 0.5em; position: absolute; bottom: 50px; right: 0px; z-index: 10; font-size: 7.5rem; line-height: 1.1; color: #F9B041; font-weight: 600;}
.voiceHead h3 span{ display: block; font-size: 1.5rem; line-height: 1.1; margin-bottom: 0.25em;}
.voiceHead h3 em{ display: block; font-size: 1.3rem; line-height: 1.1; font-weight: normal; text-align: right; color: #333; letter-spacing: 0.1em; margin-top: 0.5em; border-top: solid 1px rgba(0,0,0,0.1); padding-top: 0.5em;}

.voiceConts{ position: relative;}
.voiceConts .image{ width: 50%;}
.voiceConts .image img{ width: 100%; height: auto;}
.voiceConts .inner{ width: 60%; position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,0.8); padding: 1.5em;}
.voiceConts .inner.left{ left: 0px;}
.voiceConts .inner.right{ right: 0px;}
.voiceConts.profile .inner{ width: 50%; position: relative; transform: translateY(0); float: left;}
.voiceConts .inner h4{ font-size: 2.3rem; line-height: 1.1; font-weight: 600; color: #F9B041; padding-bottom: 0.5em; margin-top: 2.0em; margin-bottom: 0.5em; border-bottom: solid 1px rgba(0,0,0,0.05);}
.voiceConts .inner h4:first-child{ margin-top: 0px;}
.voiceConts .inner table { width: 100%; border-top: solid 1px rgba(0,0,0,0.05); margin-top: 2.0em;}
.voiceConts .inner table tr{ border-bottom: solid 1px rgba(0,0,0,0.05);}
.voiceConts .inner table tr th{ padding: 0.75em 0.5em; width: 30%; color: #F9B041;}
.voiceConts .inner table tr td{ padding: 0.75em 0.5em; width: 70%;}

.voiceTxt{ padding: 0px !important; margin-top: -25px !important;}
.voiceTxt p{ padding: 1.5em;}

.linkBtns{ letter-spacing: -0.4em; text-align: center;}
.linkBtns li{ width: 35%; display: inline-block; vertical-align: middle; letter-spacing: 0; margin: 0 2%;}
.linkBtns li a{ display: block; border: solid 2px #F9B041; color: #F9B041; text-decoration: none; font-weight: 600; font-size: 1.7rem; line-height: 1.1; padding: 1.0em 0; text-align: center; border-radius: 5px; position: relative;}
.linkBtns li a:hover{ background: #F9B041; color: #FFF; border-color: #FAC067;}
.linkBtns li:nth-child(1) a:before{ content: "\f104"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; left: 1.5em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.linkBtns li:nth-child(1) a:hover:before{ left: 0.75em;}
.linkBtns li:nth-child(2) a:before{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.5em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.linkBtns li:nth-child(2) a:hover:before{ right: 0.75em;}

/* SYSTEM
-------------------------------------------------------------*/
/* color */
body.system #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #65C967; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.system #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #3EBC41; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.system .breadcrumb{ border-bottom: none;}
body.system h3.heading span,
body.system .breadcrumb ul li:before{ color: #3EBC41;}
body.system h3.heading:before,
body.system footer{ background: #3EBC41;}
body.system footer .footNavi li a:hover{ background: #FFF; color: #3EBC41; border-color: rgba(62,188,65,0.3);}
body.system #container{ border-top: solid 1px #EEE; background: #F9F9F9;}

.listCover{ letter-spacing: -0.4em;}
.listCover li.listItem{ width: 33.333333%; display: inline-block; vertical-align: top; letter-spacing: 0; padding: 0.5em; cursor: pointer;}
.listCover li.listItem h3{ box-shadow: 0px 0px 6px rgba(0,0,0,0); border: solid 2px #EEE; transition: all 0.2s ease 0s; position: relative; background: #FFF; padding: 2.0em;}
.listCover li.listItem h3 span{ font-size: 1.9rem; line-height: 1.1; font-weight: 600; text-align: center; display: block; height: 2.5em;}
.listCover li.listItem h3 em{ display: block; font-size: 1.5rem; font-weight: normal; text-align: center; font-style: normal;}
.listCover li.listItem h3:after{ content: ""; width: 80px; height: 80px; display: block; background: #f6f6f6; margin: 0px auto;}
.listCover .listItem .selfRep{ display: none;}
.listCover .active { background: url(../../image/system/arrow.png) no-repeat bottom center;}
.listCover .listItem.active h3{ color: #3EBC41; border-color: #3EBC41;}
.listCover li.listItem h3:hover{ color: #3EBC41; border-color: #3EBC41; box-shadow: 0px 0px 6px rgba(0,0,0,0.1);}
.listCover h3.heading{ letter-spacing: 0; display: block; margin-top: 3.0em; clear: both;}

.expandField { width: 100%; text-align: left; display: block; background: #333; float: left; position: relative; overflow: hidden; border-radius: 5px;}
.expandField .btnClose { top: 0.5em; right: 0.5em; width: 2.0em; height: 2.0em; position: absolute; overflow: hidden; cursor: pointer;}
.expandField .btnClose:before{ content: "\f00d"; font-family: FontAwesome; color: #FFF; font-size: 3.0rem; line-height: 1.1;}
.expandField p { padding: 2.5em; position: relative; letter-spacing: 0; color: #FFF; line-height: 1.3;}

/* ACTIVITY
-------------------------------------------------------------*/

/* color */
body.activity #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #4B90CA; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.activity #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #1E74BD; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.activity h3.heading span,
body.activity .breadcrumb ul li:before{ color: #1E74BD;}
body.activity h3.heading:before,
body.activity footer{ background: #1E74BD;}
body.activity footer .footNavi li a:hover{ background: #FFF; color: #1E74BD; border-color: rgba(30,116,189,0.3);}
body.activity #container{ padding-bottom: 0px !important;}

.activityLead{ background: #fff1c4; background-size: auto 100%; background-position: right center; background-repeat: no-repeat;}
.activityLead .inner{ width: 67.5%; margin: 0 30% 0 2.5%; padding: 3.0em 0;}
.activityLead .inner h3{ font-size: 3.1rem; line-height: 1.2; margin-bottom: 0.5em;}
.activityLead .inner .box{ background: rgba(255,255,255,0.7); box-shadow: 0px 0px 6px rgba(0,0,0,0.1); padding: 1.0em; margin-top: 1.5em; border-radius: 5px; width: 70%;}
.activityLead .inner .box h4{ font-size: 1.7rem; line-height: 1.1; color: #EA5B1E; padding-bottom: 0.75em; margin-bottom: 0.75em; border-bottom: solid 1px rgba(0,0,0,0.05);}
.activityLead .inner .box p{ font-size: 1.3rem; line-height: 1.5;}

/* 社内／イベント */
.gallery{ letter-spacing: -0.4em;}
.gallery li{ width: 25%; display: inline-block; vertical-align: top; letter-spacing: 0;}
.gallery li img{ width: 100%; height: auto;}
.gallery li:nth-child(1){ animation-delay:0.3s;}
.gallery li:nth-child(2){ animation-delay:0.6s;}
.gallery li:nth-child(3){ animation-delay:0.9s;}
.gallery li:nth-child(4){ animation-delay:1.2s;}
.gallery li:nth-child(5){ animation-delay:1.5s;}
.gallery li:nth-child(6){ animation-delay:1.8s;}
.gallery li:nth-child(7){ animation-delay:2.1s;}
.gallery li:nth-child(8){ animation-delay:2.4s;}

/* インフォグラフィックス */
.graphic{ background: url(../../image/activity/infographics_bg.png) no-repeat right center; background-size: 150%; position: relative;}
.graphic:before{ content: ""; width: 100%; height: 100%; background: rgba(30,116,189,0.7); position: absolute; top: 0px; left: 0px; z-index: 0;}
.graphic h3.heading span{ color: #FFF !important;}
.graphic h3.heading:before{ background: #FFF !important;}

.infographics{ letter-spacing: -0.4em; width: 1120px; margin: 0px auto;}
.infographics .inner{ width: 49%; display: inline-block; vertical-align: top; letter-spacing: 0; margin-right: 2%;}
.infographics .inner:nth-child(2n){ margin-right: 0px;}
.infographics .inner ul{ letter-spacing: -0.4em;}
.infographics .inner ul > li{ display: inline-block; vertical-align: top; letter-spacing: 0; width: 48%; margin-right: 4%; margin-bottom: 1.75em;}
.infographics .inner ul > li:nth-child(2n){ margin-right: 0px;}

.infographics .box{ background: rgba(255,255,255,0.3); padding: 1.5em 1.0em; box-shadow: 0px 0px 6px rgba(0,0,0,0.05); position: relative;}
.infographics h4{ font-size: 2.1rem; line-height: 1.1; text-align: center; color: #FFF; font-weight: 600;}

.infographics .large{ min-height: 500px;}
.infographics .middle,
.infographics .small{ min-height: 237px;}
.infographics.clm02 .small{ min-height: 500px;}
.infographics.clm04 .small{ min-height: 400px;}
.infographics.clm03 .clm{ width: 100%;}
.infographics.clm04 .large{ min-height: 400px;}

/* animation */
.d01{ animation-delay: 0.3s;}
.d02{ animation-delay: 0.6s;}
.d03{ animation-delay: 0.9s;}
.d04{ animation-delay: 1.2s;}
.d05{ animation-delay: 1.5s;}
.d06{ animation-delay: 1.8s;}
.d07{ animation-delay: 2.1s;}
.d08{ animation-delay: 2.4s;}
.d09{ animation-delay: 2.7s;}
.d10{ animation-delay: 3.0s;}

/* RECRUIT
-------------------------------------------------------------*/
.recruitIntro{ background: url(../../image/recruit/image_01.png) no-repeat center top; background-size: 100%; padding: 2.5em 0 2.5em; border-radius: 10px;}
.recruitIntro ul{ width: 100%; margin: 0px auto; position: relative; padding-bottom: 30.0em;}
.recruitIntro ul li{ display: inline-block; font-size: 2.5rem; line-height: 1.1; text-align: center; font-weight: 600; color: #FFF; background: rgba(42,59,141,0.8); border: solid 2px rgba(42,59,141,0.2); padding: 0.75em 2.0em; border-radius: 5px; box-shadow: 0px 0px 6px rgba(0,0,0,0.1);}
.recruitIntro ul li:nth-child(1){ position: absolute; top: 2.0em; left: 5.0em; animation-delay:0.3s;}
.recruitIntro ul li:nth-child(2){ position: absolute; top: 3.0em; right: 5.0em; animation-delay:0.6s;}
.recruitIntro ul li:nth-child(3){ position: absolute; top: 10.0em; left: 1.5em; animation-delay:0.9s;}
.recruitIntro ul li:nth-child(4){ position: absolute; top: 9.0em; right: 1.5em; animation-delay:1.2s;}
.recruitIntro p{ width: 80%; margin: 0px auto; background: rgba(255,255,255,0.8); padding: 1.5em; text-align: center; border: solid 2px rgba(255,255,255,0.3); border-radius: 5px; font-weight: 600; color: #2A3B8D; font-size: 1.7rem; line-height: 1.5; box-shadow: 0px 0px 6px rgba(0,0,0,0.1); animation-delay:1.5s;}

.outlineTable{ width: 100%; border: solid 1px #E4E4E4;}
.outlineTable th{ background: #2A3B8D; vertical-align: middle; color: #FFF; text-align: center; width: 20%; padding: 1.0em; border: solid 1px #E4E4E4;}
.outlineTable td{ padding: 1.0em; border: solid 1px #E4E4E4;}

.model{ letter-spacing: -0.4em;}
.model li{ width: 23.5%; min-height: 145px; display: inline-block; vertical-align: top; letter-spacing: 0; margin-right: 2%; border: solid 2px #EEE; border-radius: 5px; padding: 1.0em;}
.model li:nth-child(4n){ margin-right: 0px;}
.model li h5{ font-size: 1.7rem; line-height: 1.1; text-align: center; font-weight: 600; color: #2A3B8D; padding: 0.25em 0 0.75em; margin-bottom: 0.75em; border-bottom: solid 1px #EEE;}
.model li p{ text-align: center; line-height: 1.3;}

.clmLink{ letter-spacing: -0.4em; margin-top: 2.0em; margin-bottom: 1.5em;}
.clmLink li{ width: 32%; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 0 2% 0.5em 0;}
.clmLink li:nth-child(3n){ margin-right: 0px;}
.clmLink li a{ display: block; border: solid 2px #333; border-radius: 5px; color: #333; font-weight: 600; text-decoration: none; text-align: center; padding: 1.0em 0; position: relative;}
.clmLink li a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 2.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.clmLink li a:hover:after{ right: 1.5em;}
.clmLink li a:hover{ color: #FFF; background: #333; border-color: #999;}

.rectBtn{ background: url(../../image/recruit/image_02.png) no-repeat center center; background-size: 100%; padding: 17.5vw 0 7.5vw !important; margin-bottom: -50px !important; text-align: center;}
.rectBtn a{ display: inline-block; font-size: 2.1rem; line-height: 1.1; text-decoration: none; font-weight: 600; color: #FFF; background: #EA5B1E; padding: 1.25em 4.0em; border-radius: 5px; border: solid 2px #FFF; position: relative;}
.rectBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 2.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.rectBtn a:hover:after{ right: 1.5em;}
.rectBtn a:hover{ background: #EE7B4A; color: #FFF;}

#anc01,
#anc02,
#anc03{ margin-top: -150px; padding-top: 150px;}

/* ENTRY FORM
-------------------------------------------------------------*/
.textSmall{ font-size: 1.1rem; line-height: 1.1; margin-top: 0.5em;}

/* color */
body.recruit #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #5562A4; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.recruit #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #2A3B8D; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.recruit h3.heading span,
body.recruit .breadcrumb ul li:before{ color: #2A3B8D;}
body.recruit h3.heading:before,
body.recruit footer{ background: #2A3B8D;}
body.recruit footer .footNavi li a:hover{ background: #FFF; color: #2A3B8D; border-color: rgba(42,59,141,0.3);}
body.recruit h4.midashi{ border-left-color: #2A3B8D;}

section.form{ border: solid 5px #EEE; padding: 1.5em 1.5em 2.5em 1.5em !important;}
.require span{ display: inline-block; font-size: 1.1rem; color: #FFF; line-height: 1.1; background: #F22D7D; padding: 0.2em 1.0em; border-radius: 5px; margin-left: 1.0em;}

/* Table */
.zeromail table,
.zeromail th,
.zeromail td {}
.zeromail table { width:100%; margin-bottom:1.5em;}
.zeromail table tr{ border-bottom: dotted 1px #EEE;}
.zeromail caption { margin:10px 0; padding:0.5em; background-color:#c9d9f0; color:#3762a8; font-weight:bold;}
.zeromail thead th,
.zeromail tfoot th { padding: 1.5em 1.0em;}
.zeromail thead td,
.zeromail tfoot td { background-color:#dbe5f3; text-align:center;}
.zeromail tbody th { width:25%; padding: 1.0em;}
.zeromail td { padding: 1.5em 1.0em; text-align:left;}

/* Form */
.zeromail legend { display:none;}
.zeromail label{ margin:0 3px;}

.zeromail input[type=radio],
.zeromail input[type=checkbox] { margin-right:0.3em;}

.zeromail button,
.zeromail input[type=checkbox],
.zeromail input[type=radio],
.zeromail input[type=reset],
.zeromail input[type=submit] { padding:1px;}

.zeromail [type=check],
.zeromail [type=radio],
.zeromail [type=submit] { cursor: pointer;}

.zeromail [type=check] + label,
.zeromail [type=radio] + label { display: inline-block; cursor: pointer;}

.zeromail [type=text],
.zeromail [type=password],
.zeromail textarea { padding: 0.5em; border: 1px solid #DDD; border-radius: 2px;}

.zeromail input[type=text]:hover,
.zeromail [type=password]:hover,
.zeromail textarea:hover,
.zeromail input[type=text]:focus,
.zeromail [type=password]:focus,
.zeromail textarea:focus { background-color: #ECFBFF;}

/* Button */
.zeromail .button { text-align:center; margin-top:20px;}
.zeromail .button button { min-width:100px; _width:100px;}

.zeromail button[type],
.zeromail button[id]{ background: #2A3B8D; border: solid 2px #5562A4; cursor:pointer; color: #FFF; font-size: 2.1rem; line-height: 1.1; padding: 0.5em 4.0em; border-radius: 5px; margin: 0 10px;}

body.contact .zeromail button[type],
body.contact .zeromail button[id]{ background: #632E96; border: solid 2px #8258AB; cursor:pointer; color: #FFF; font-size: 2.1rem; line-height: 1.1; padding: 0.5em 4.0em; border-radius: 5px; margin: 0 10px;}

.zeromail button[type]:hover,
.zeromail button[id]:hover{}
.zeromail button[id=submit] {}
.zeromail button[id=submit]:hover {}

.zeromail button[id=myreset],
.zeromail button[id=close]{}

/* 確認・エラー画面(check,error) */
.zeromail #confirm td  { padding:1em;}

/*入力エラー*/
.zeromail strong.error { display:inline; padding:0; margin:0; border:0; background:none; color:#A82B2B;}

/* Message()のメッセージ */
.message { text-align:center;}

/*エラー*/
.zeromail span.error{ display:block; margin:1.5em 0; padding:1.5em 0; background: #FEEAF2; border: dotted 1px #F55797; text-align:center; color:#F22D7D;}

/*エラーなし*/
.zeromail span.confirm{ display:block; color:#339933; border:solid 1px; border-color:#D9F4C4; padding:10px;}

/* 送信完了(completion.html) */
#completion .success { margin:1.5em 50px; padding:1.5em 0; background-color:#e8f198; border:solid 1px #c6e148; text-align:center; color:#4e4c35;}

/* copyright */
.wtn_copyright { display: none !important;}

/* ACCESS
-------------------------------------------------------------*/
.street_address{ text-align: center; font-size: 1.7rem; line-height: 1.1;}

.googlemap{ border: solid 5px #F6F6F6; margin-top: 2.5em;}
.googlemap iframe{ width: 100%; vertical-align: top;}

.station{ letter-spacing: -0.4em; width: 60%; margin: 2.5em auto 0px;}
.station h4{ width: 25%; display: inline-block; vertical-align: middle; letter-spacing: 0; font-size: 2.5rem; line-height: 1.1; font-weight: 600;}
.station ul{ width: 20%; display: inline-block; vertical-align: middle; letter-spacing: 0;}
.station ul li{ background: #FDEEE8; color: #EA5B1E; border: solid 1px #FCE7DD; font-size: 1.3rem; line-height: 1.1; text-align: center; padding: 0.25em 0; margin: 5px 0; border-radius: 3px;}
.station p{ width: 55%; display: inline-block; vertical-align: middle; letter-spacing: 0; padding-left: 3%;}

.direction{ letter-spacing: -0.4em;}
.direction li{ width: 30.666666%; display: inline-block; vertical-align: top; letter-spacing: 0; margin-right: 4%; position: relative;}
.direction li img{ width: 100%; height: auto;}
.direction li:last-child{ margin-right: 0px;}
.direction li span{ display: block; font-size: 1.3rem; line-height: 1.3; margin-top: 1.0em;}

/* CONTACT US
-------------------------------------------------------------*/
/* color */
body.contact #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #8258AB; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.contact #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 130%; margin: -115px -10% 0; background: #632E96; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.contact h3.heading span,
body.contact .breadcrumb ul li:before{ color: #632E96;}
body.contact h3.heading:before,
body.contact footer{ background: #632E96;}
body.contact footer .footNavi li a:hover{ background: #FFF; color: #632E96; border-color: rgba(99,46,150,0.3);}

p.phone{ text-align: center; margin-top: 1.5em;}
p.phone a{ display: inline-block; font-size: 3.5rem; font-family: DIN; text-decoration: none; padding-left: 1.0em; color: rgba(51,51,51,1.0); position: relative;}
p.phone a:before{ content: "\f098"; font-family: FontAwesome; position: absolute; top: 50%; left: 0px; transform: translateY(-50%);}
p.phone a:hover{ color: rgba(51,51,51,0.6);}
p.phone span{ display: block; text-align: center;}

/* PRIVACY POLICY
-------------------------------------------------------------*/
.responsible{ text-align: right; margin-top: 2.0em;}
.responsible p{ display: inline-block; border: solid 3px #EEE; padding: 1.0em 3.0em; line-height: 1.3;}
.responsible2{ text-align: right; margin-top: 2.0em;}
.responsible2 p{ display: inline-block; border: none; padding: 1.0em 3.0em; line-height: 1.3;}

.policyBox{ border: solid 1px #E4E4E4;}
.policyBox h3{ text-align: center; font-size: 3.0rem; line-height: 1.1; color: #FFF; background: #EA5B1E; border-bottom: solid 1px #E4E4E4; padding: 0.75em 0;}
.policyBox .inner{ padding: 1.5em; margin: 10px auto; width:500px;}
.policyBox .inner p{ text-align: left;}
.policyBox .inner h4{ font-size: 1.7rem; line-height: 1.1; font-weight: 600; margin: 1.0em 0 0.5em; text-align: center;}
.policyBox .inner p.address a{ display: inline-block; margin-left: 0.5em;}

/* SITE POLICY
-------------------------------------------------------------*/
.listStyle{ padding-left: 20px; margin-bottom: 1.0em;}
.listStyle li{ list-style-position: outside; position: relative; padding: 1.0em 0; line-height: 1.2;}
.listStyle li:before{ content: ""; width: 1120px; height: 1px; border-bottom: dotted 1px #E4E4E4; position: absolute; bottom: 0px; left: -20px;}
.listStyle.alphabet li{ list-style-type: decimal;}
.listStyle.number li{ list-style-type: decimal;}
.listStyle.disc li{ list-style-type: disc;}
.listStyle.check li:after{ content: "\f046"; font-family: FontAwesome; position: absolute; top: 1.1em; left: -20px; color: #F55797;}

/*=============================================================
 common
=============================================================*/

body{ margin:0; padding:0; text-align:center; font-size:1.5rem; line-height:1.7em; font-family: "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro," メイリオ", Meiryo, Osaka," ＭＳ Ｐゴシック", MS PGothic," sans-serif"; color:#333; height:100%; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background: #FFF;}
a{color:#EA5B1E; text-decoration:underline; transition: all 0.2s ease 0s;}
a:hover{color:#F08D62; text-decoration:none;}

/*-------- clearfix ---------*/
.clearfix { zoom:1;}
.clearfix:after{ content: ""; display: block; clear: both;}
.clearfloat { clear: both; height: 0; font-size: 1px; line-height: 0px;}

/*---------- margin ----------*/
.mt-none{ margin-top:0px !important}
.mt-05{ margin-top:5px !important}
.mt-1em{ margin-top:1.0em !important}
.mt-2em{ margin-top:2.0em !important}
.mt-3em{ margin-top:3.0em !important}
.mt-4em{ margin-top:4.0em !important}
.mt-5em{ margin-top:5.0em !important}
.mt-6em{ margin-top:6.0em !important}
.mt-7em{ margin-top:7.0em !important}
.mt-8em{ margin-top:8.0em !important}
.mt-9em{ margin-top:9.0em !important}
.mt-10em{ margin-top:10.0em !important}
.mt-11em{ margin-top:10.0em !important}

/*---------- textmargin ----------*/
.mt-ptext{ margin-left:4.5em; text-indent:-1.4em; }

/*---------- align ----------*/
.align-left{ text-align: left;}
.align-right{ text-align: right;}
.align-center{ text-align: center;}

/*---------- float ----------*/
.float-left{ float:left;}
.float-right{ float:right;}

/*---------- image ----------*/
.img-left{ float:left; margin: 1.0em 4% 0 0;}
.img-right{ float:right; margin: 1.0em 0 0 4%;}

/*----- clearfix -----*/
.clearfix { zoom:1;}
.clearfix:after{ content: ""; display: block; clear: both;}
.clearfloat { clear: both; height: 0; font-size: 1px; line-height: 0px;}

/*=============================================================
 layout
=============================================================*/

/* Header
-------------------------------------------------------------*/
header{ width: 1120px; margin: 0px auto; background: #FFF; position: fixed; top: 0px; left: 50%; transform: translateX(-50%); border-radius: 0 0 10px 10px; z-index: 100; letter-spacing: -0.4em;}
header h1{ width: 244px; display: inline-block; vertical-align: top; letter-spacing: 0; padding: 10px 30px 20px;}
header h1 img{ width: 100%; height: auto;}
header nav#navigation{ width: 876px; display: inline-block; vertical-align: top;}
header nav#navigation > li{ display: inline-block; vertical-align: top; letter-spacing: 0; position: relative; transition: all 0.2s ease 0s;}
header nav#navigation > li:before{ content: ""; width: 1px; height: 100%; background: #EEE; position: absolute; top: 0px; left: 0px;}
header nav#navigation li span{ display: none;}
header nav#navigation li.nav07{ border-radius: 0 0 10px 0;}
header nav#navigation li.nav01:hover{ background: #FEEAF2;}
header nav#navigation li.nav02:hover{ background: #FDEEE8;}
header nav#navigation li.nav03:hover{ background: #FEF7EC;}
header nav#navigation li.nav04:hover{ background: #EBF8EC;}
header nav#navigation li.nav05:hover{ background: #E8F1F8;}
header nav#navigation li.nav06:hover{ background: #E9EBF3;}
header nav#navigation li.nav07:hover{ background: #EFEAF4; border-radius: 0 0 10px 0;}
header nav#navigation > li:after{ content: ""; width: 30px; height: 28px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-125%); transition: all 0.2s ease 0s;}
header nav#navigation li.nav01:after{ background: url(../../image/common/navi_icon_01.png); background-size: contain; opacity: 0.4;}
header nav#navigation li.nav02:after{ background: url(../../image/common/navi_icon_02.png); background-size: contain; opacity: 0.4;}
header nav#navigation li.nav03:after{ background: url(../../image/common/navi_icon_03.png); background-size: contain; opacity: 0.4;}
header nav#navigation li.nav04:after{ background: url(../../image/common/navi_icon_04.png); background-size: contain; opacity: 0.4;}
header nav#navigation li.nav05:after{ background: url(../../image/common/navi_icon_05.png); background-size: contain; opacity: 0.4;}
header nav#navigation li.nav06:after{ background: url(../../image/common/navi_icon_06.png); background-size: contain; opacity: 0.4;}
header nav#navigation li.nav07:after{ background: url(../../image/common/navi_icon_07.png); background-size: contain; opacity: 0.4;}
header nav#navigation li.nav01:hover:after,
header nav#navigation li.nav02:hover:after,
header nav#navigation li.nav03:hover:after,
header nav#navigation li.nav04:hover:after,
header nav#navigation li.nav05:hover:after,
header nav#navigation li.nav06:hover:after,
header nav#navigation li.nav07:hover:after{ top: 45%; opacity: 1.0;}
header nav#navigation li ul{ width: 120%; position: absolute; top: 110%; left: -10%; display: block; transition: all 0.2s ease 0s; visibility: hidden; opacity: 0; z-index: 100;}
header nav#navigation li:hover ul{ display: block; opacity: 1.0; top: 100%; visibility: visible;}
header nav#navigation li ul li{ font-size: 1.3rem; line-height: 1.1; text-align: center;}
header nav#navigation li ul li:first-child a{ border-top: solid 1px rgba(0,0,0,0.1);}
header nav#navigation li ul li a{ display: block; text-decoration: none; padding: 1.0em 0; background: #FFF; border: solid 1px rgba(0,0,0,0.1); border-top: none;}
header nav#navigation li.nav01 ul li a{ background: #F22D7D; color: #FFF;}
header nav#navigation li.nav01 ul li a:hover{ background: #FFF; color: #F22D7D;}
header nav#navigation li.nav04 ul li a{ background: #3EBC41; color: #FFF;}
header nav#navigation li.nav04 ul li a:hover{ background: #FFF; color: #3EBC41;}
header nav#navigation li.nav05 ul li a{ background: #1E74BD; color: #FFF;}
header nav#navigation li.nav05 ul li a:hover{ background: #FFF; color: #1E74BD;}
header nav#navigation li.nav06 ul li a{ background: #2A3B8D; color: #FFF;}
header nav#navigation li.nav06 ul li a:hover{ background: #FFF; color: #2A3B8D;}

.drawer-toggle,
.drawer-nav{ display: none !important;}





/* container
-------------------------------------------------------------*/
#container{ width: 100%; min-width: 1120px; margin: 0px auto; padding-bottom: 50px;}
#container section{ width: 1120px; margin: 0px auto; padding: 50px 0; position: relative;}

/* Footer
-------------------------------------------------------------*/
footer{ width: 100%; min-width: 1120px; margin: 0px auto; background: #EA5B1E; padding: 50px 0 15px 0;}
footer h2{ width: 160px; margin: 0px auto;}
footer h2 img{ width: 100%; height: auto;}
footer .footSns{ width: 1120px; margin: 30px auto; text-align: center; letter-spacing: -0.4em;}
footer .footSns li{ width: 80px; display: inline-block; vertical-align: top; letter-spacing: 0;}
footer .footSns li:nth-child(2n+1){ margin: 0 30px;}
footer .footSns li img{ width: 100%; height: auto;}
footer .footSns li a{ opacity: 1.0;}
footer .footSns li a:hover{ opacity: 0.6;}
footer .footNavi{ width: 1120px; margin: 0px auto; text-align: center; border-top: solid 1px rgba(255,255,255,0.1); padding: 30px 0; letter-spacing: -0.4em;}
footer .footNavi li{ width: 200px; margin: 0px 15px; display: inline-block; vertical-align: top; letter-spacing: 0;}
footer .footNavi li a{ display: block; font-size: 1.1rem; line-height: 1.1; font-weight: 600; text-decoration: none; color: #FFF; border: solid 2px #FFF; border-radius: 50px; padding: 1.0em 0; text-align: center; position: relative;}
footer .footNavi li a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.5em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
footer .footNavi li a:hover:after{ right: 1.0em;}
footer .footNavi li a:hover{ background: #FFF; color: rgba(234,91,30,1); border-color: rgba(234,91,30,0.3);}
footer .copyright{ text-align: center; font-size: 1.1rem; line-height: 1.1; color: #FFF;}

/* modal */
.modal-content { position:fixed; display:none; z-index:102; width:50%; margin:0; padding:1.5em; background:#fff; border-radius: 10px; box-shadow: 0px 0px 5px rgba(0,0,0,0.1);}
.modal-content p { text-align: center;}
.modal-overlay { z-index:101; display:none; position:fixed; top:0; left:0; width:100%; height:120%; background-color:rgba(0,0,0,0.75);}
.modal-open { cursor: pointer;}
.modal-close { margin-top: 1.5em; display: inline-block; border: solid 1px #333; color: #333; text-decoration: none; padding: 0.25em 1.5em; line-height: 1.1; border-radius: 50px; cursor: pointer;}
.modal-close:hover{ color: #FFF; background: #333; border-color: #333;}
}

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

#PageTop{ position:fixed; bottom:60px; right:100px; z-index:100;}
@media screen and (max-width: 1250px) {#PageTop{ position:fixed; bottom:50px; right:50px;}
}
@media screen and (max-width: 1150px) {#PageTop{ position:fixed; bottom:50px; right:10px;}
}
@media screen and (max-width: 1080px) {#PageTop{ display:none;}
}

