@charset "utf-8";
@import "clear.css";
@import "utill.css";
@import "hamburger.css";
@import "font-awesome.min.css";
@import "glyphicons.css";

/* 基本設定 ---------------------------------------------*/


/* ヴィジョン一旦停止 ---------------------------------------------*/
#companyVisionWrapper {
display: none;
}


* {
margin: 0;
padding: 0;
font-size: 100%;
font-weight: normal;
list-style: none;
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}

body {
text-align: center;
font-size: 100%;
font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
line-height: 1.42857143;
color: #333;
letter-spacing:0.1em;
}

img{ border:none; vertical-align:middle; max-width:100%;}
img{ width:auto\9; height:auto\9;}

a{text-decoration: none; color:#333;}
a:hover{text-decoration: underline;}

.pt08 { padding-top:  8px; }

header{
	position: fixed; right: 0; left: 0; z-index: 300;
	background-color: rgba(255, 255, 255, 0.8);
	border-bottom:1px solid #e7e7e7;
	height:140px;
}

#headerWrapper{ width:1000px; margin:0 auto; position:relative;}

#logo{ position:absolute; top:20px; left:40px; font-size:85%; color: #777;}
#logo img{ margin-right: 10px; width:110px; height:auto;} 
#catch{ position:absolute; top:80px; right:40px;}

nav#gNav{ position:absolute; top:60px; right:40px;}
nav#gNav > ul > li { display:inline-block; padding-left:15px; font-size:85%; position:relative; padding-bottom:40px;}
nav#gNav > ul > li > a{ line-height:1; color: #777;}
nav#gNav > ul > li > a:hover{ line-height:1; color: #000;text-decoration: none;}
nav#gNav > ul > li > a.current{ line-height:1; color: #000;text-decoration: none;}

nav#gNav > ul > li > ul{ position:absolute; top:2em; right:-40px; width:14em; text-align: left; background:#fff; border:1px solid #eee; box-sizing:border-box; padding:5px 0 5px; line-height:1;
box-shadow:rgba(0, 0, 0, 0.3) 0px 0px 10px 0px;
-webkit-box-shadow:rgba(0, 0, 0, 0.3) 0px 0px 10px 0px;
-moz-box-shadow:rgba(0, 0, 0, 0.3) 0px 0px 10px 0px;
background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #b2d996), color-stop(0.00, #63c152));
background: -webkit-linear-gradient(#63c152, #b2d996);
background: -moz-linear-gradient(#63c152, #b2d996);
background: -o-linear-gradient(#63c152, #b2d996);
background: -ms-linear-gradient(#63c152, #b2d996);
background: linear-gradient(#63c152, #b2d996);
}
nav#gNav > ul > li > ul li a{display:block;padding:5px 15px 5px; color:#fff;}
nav#gNav > ul > li > ul li a:hover{ background:#efefef; text-decoration: none; color:#000;}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    margin-top:-2px;
    vertical-align: middle;
    border-top: 4px solid;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

.dropdown-menu{ display:none;}


#home{ padding-top:140px; margin-bottom:0;}
#main{ padding-top:140px; margin-bottom:0;}
#sliderWrapper{ width:100%; margin:0 auto; height:560px;}
.bxslider{width:100%; height:500px; overflow:hidden;}
.slideBox{width:100%; height:500px; overflow:hidden;}
#slide1{ background:url(../img/slide/image1.jpg) center center no-repeat;background-size:cover;}
#slide2{ background:url(../img/slide/image2.jpg) center top no-repeat;background-size:cover;}
#slide3{ background:url(../img/slide/image3.jpg) center top no-repeat;background-size:cover;}


.title {
    font-family: Century gothic, Tahoma, Geneva, sans-serif;
    font-weight: bold;
    font-size: 240%; font-size: 36px;
    text-align: center;
    padding-bottom: 1em;
    padding-top: 1em;
    line-height: 1;
    letter-spacing:0;
}

.titleP2em {
    font-family: Century gothic, Tahoma, Geneva, sans-serif;
    font-weight: bold;
    font-size: 240%; font-size: 36px;
    text-align: center;
    padding-bottom: 1.5em;
    padding-top: 2em;
    line-height: 1;
    letter-spacing:0;
}

.title_jp {
    font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-weight: bold;
    font-size: 36px;
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
}

.row{ width:100%;}
.w50{ width:50%;}

#service1{background:url(../img/index/column1.jpg) left bottom no-repeat;background-size:52%;}
#service2{background:url(../img/index/column3.jpg) right top no-repeat;background-size:52%;}
#service3{background:url(../img/index/column2.jpg) left bottom no-repeat;background-size:52%;}

.slide{right: 20px; opacity: 0; position: relative;}

.colorG1{ background:#4da4db;}
.colorG2{ background:#41bfe8;}
.colorO1{ background:#f5b621;}
.colorO2{ background:#f7c14c;}
.colorw1{ background:#e0e0e0;}
.colorw2{ background:#fff;}

.serviceList li.colorw1 div{ color:#000;}
.serviceList li.colorw2 div{ color:#000;}
.serviceList li.colorw1 div a button{ color:#000; border: solid 1px #000;}
.serviceList li.colorw2 div a button{ color:#000; border: solid 1px #000;}
.serviceList li.colorw1 div a button:hover{ color:#666; border: solid 1px #666;}
.serviceList li.colorw2 div a button:hover{ color:#666; border: solid 1px #666;}

.serviceList li{ position:relative; width:100%; text-align: right;}
.serviceList li div{ text-align: left; color:#fff; padding:30px 0 0 30px; position:relative; height:150px; width: 500px; box-sizing:border-box;letter-spacing:0;}
.serviceList li div.rightBase{ display:inline-block; width: 500px; margin-right:30px;}
.serviceList li div h3{ font-size:160%;font-size: 24px; font-weight:bold; margin-bottom:10px;}
.serviceList li div p{ font-size:90%;} 
.serviceList li div a button{
    width: 95px;
    height: 35px;
    border: solid 1px #fff;
    border-radius: 0;
    background: none;
    color: #fff;
    text-align: center;
    padding: 3px 0;
    font-family: Century gothic, Tahoma, Geneva, sans-serif;
    font-size: 100%;
    position: absolute;
    top: 40px;
    right: 0;
    margin-top:0;
    transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	-ms-transition: all 0.5s;
	cursor:pointer;
}
.serviceList li div a:hover{ text-decoration: none;}
.serviceList li div a:hover button{
	background:#fff; color:#333;
}

#topics{ padding: 0 0 10px;}
#topics.pb80{ padding-bottom: 80px;}
.topicsList{ width:720px; margin:0 auto; text-align: left; border-top: 1px solid #333; font-size:85%;}
.topicsList th{ width:20%; padding:20px 0 20px 20px; border-bottom: 1px solid #333;}
.topicsList td{ padding:20px 20px 20px 0; border-bottom: 1px solid #333;}
.topicsList td a{ color:#339933;}

.baseBtn a{ display:block; line-height: 1; background:#41bfe8; width:500px; padding:20px 0; margin:40px auto 40px; color:#fff; font-size:85%;font-size: 18px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
transition: all 0.5s;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
-ms-transition: all 0.5s;
}
.baseBtn a:hover{ background:#f5b621; text-decoration: none;}

#contact{ background:#f7f7f7; padding: 0 0 10px;}
.tel{
    font-family: Century gothic, Tahoma, Geneva, sans-serif; text-decoration: none;
    font-size: 200%;
    font-weight: bold;
}
.tel a{
    font-family: Century gothic, Tahoma, Geneva, sans-serif; text-decoration: none;
    font-weight: bold;
}


.baseInput{ background:#fff; padding:10px 10px; width:80%; border:none; border:1px solid #ccc;}
.baseTextarea{ background:#fff; padding:10px; width:80%; height:70px; border:none; border:1px solid #ccc;}
.baseSubmit{ display:block; line-height: 1; background:#f7c14c; width:500px; padding:20px 0; margin:40px auto 40px; color:#fff; font-size:85%;font-size: 18px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
transition: all 0.5s;
border:none;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
-ms-transition: all 0.5s;
}
.baseSubmit:hover{  background:#f5b621; text-decoration: none;}
#submitWrapper{ margin:0 0 40px;}

.halfSubmit{ display:inline-block; line-height: 1; background:#4da4db; width:280px; padding:20px 0; margin:40px auto 40px; color:#fff; font-size:85%;font-size: 18px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
transition: all 0.5s;
border:none;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
-ms-transition: all 0.5s;
}
.halfSubmit:hover{  background:#f5b621; text-decoration: none;}


#footerBannerWrapper{ padding-bottom: 10px;}


footer{ background:#333333; padding:40px 0 40px; color:#fff; text-align: right;}
#footerWrapper{ width:1000px; margin:0 auto; position:relative;}
#footerWrapper h2{ position: absolute; top:0px; left:40px; text-align: left;}
#footerWrapper h2 img{ height:60px; width:auto;}
#footerWrapper h2 span{ display:block; font-size: 75%;}

nav#fNav{ margin:0 40px 20px 0;}
nav#fNav > ul > li { display:inline-block; padding-left:15px; font-size:85%; position:relative;}
nav#fNav > ul > li > a{ line-height:1; color: #fff;}

nav#fNav > ul > li > ul{ position:absolute; top:2em; right:-40px; width:14em; text-align: left; background:#fff; border:1px solid #eee; box-sizing:border-box; padding:5px 0 5px; line-height:1;
box-shadow:rgba(0, 0, 0, 0.3) 0px 0px 10px 0px;
-webkit-box-shadow:rgba(0, 0, 0, 0.3) 0px 0px 10px 0px;
-moz-box-shadow:rgba(0, 0, 0, 0.3) 0px 0px 10px 0px;
background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #b2d996), color-stop(0.00, #63c152));
background: -webkit-linear-gradient(#63c152, #b2d996);
background: -moz-linear-gradient(#63c152, #b2d996);
background: -o-linear-gradient(#63c152, #b2d996);
background: -ms-linear-gradient(#63c152, #b2d996);
background: linear-gradient(#63c152, #b2d996);
}
nav#fNav > ul > li > ul li a{display:block;padding:5px 15px 5px; color:#fff;}
nav#fNav > ul > li > ul li a:hover{ background:#efefef; text-decoration: none; color:#000;}

#copyRight{ margin:0 40px 0 0; font-size:65%;}




.lowerMain{ width:100%; height:250px; overflow:hidden;}

.section{margin: 0 auto 80px;}

.baseList{ width:720px; margin:0 auto; text-align: left; border-top: 2px solid #fff; font-size:85%;}
.baseList th{ width:30%; padding:20px 0 20px 20px; border-bottom: 2px solid #fff; background:#41bfe8; color:#fff;}
.baseList td{ padding:20px 20px 20px 20px; border-bottom: 2px solid #eee;}
.baseList td a{ color:#339933;}

#moveUp{ position:fixed; bottom:60px; right:20px; display:none; width:70px; line-height: 70px; color: #fff; background:#03324e; cursor:pointer; display:none;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;}
#moveUp:hover{ background:#666;}


/*ハンバーガー非表示*/
#hamburger{display:none;}
a.top { position: fixed; right: 2%; bottom: 115px; display: none;}


/*下層ページ*/
#lowerTitleWrapper{ padding:140px 0 40px;}
#lowerTitleBpNoWrapper{ padding:140px 0 0;}
#lowerImagePhoto{ margin-bottom:40px;}

#recruitImagePhoto{ margin-bottom:40px; background:url(../img/recruit/image.jpg) center bottom no-repeat; background-size: cover; height:400px;}
#recruitCopy{ font-size:14px; margin:0 0 0;}

#contactImagePhoto{ margin-bottom:40px; background:url(../img/contact/image.jpg) center bottom no-repeat; background-size: cover; height:400px;}

#srv01{ background:#4da4db; padding: 60px 0 60px 0; color: #fff;}
#srv02{ background:url(../img/service/bgPhoto_02.jpg) center 0 no-repeat; background-size: cover; padding: 60px 0 60px 0; color: #000;}
#srv03{ background:url(../img/service/bgPhoto_03.jpg) center 0 no-repeat; background-size: cover; padding: 60px 0 60px 0; color: #000;}
#srv04{ background:url(../img/service/bgPhoto_04.jpg) center 0 no-repeat; background-size: cover; padding: 60px 0 60px 0; color: #000; background:#f7c14c;}
#srv05{ background:url(../img/service/bgPhoto_05.jpg) center 0 no-repeat; background-size: cover; padding: 60px 0 60px 0; color: #000;}
#srv06{ background:url(../img/service/bgPhoto_06.jpg) center 0 no-repeat; background-size: cover; padding: 60px 0 60px 0; color: #000;}
#srv07{ background:url(../img/service/bgPhoto_07.jpg) center 0 no-repeat; background-size: cover; padding: 60px 0 60px 0; color: #000; background:#41bfe8;}
#srv08{ background:url(../img/service/bgPhoto_08.jpg) center 0 no-repeat; background-size: cover; padding: 60px 0 60px 0; color: #000;}
#srv09{ background:url(../img/service/bgPhoto_09.jpg) center 0 no-repeat; background-size: cover; padding: 60px 0 60px 0; color: #000;}
#srv10{ background:url(../img/service/bgPhoto_10.jpg) center 0 no-repeat; background-size: cover; padding: 60px 0 60px 0; color: #000;}

.lowerBaseContent{ width:960px; margin:0 auto;}
.fl30{ width:30%; float: left; box-sizing:border-box;}
.fr70{ width:70%; float: right; box-sizing:border-box; text-align: left; line-height: 1.4;}
.fl70{ width:70%; float: left; box-sizing:border-box; text-align: left;}
.fr30{ width:30%; float: right; box-sizing:border-box; text-align: right;}
.serviceMainList h3{font-size: 24px;font-weight: 700; padding:0; margin-bottom: 10px;}

#serviceIcon01{ width:200px; height:auto;}
#serviceIcon02{ width:200px; height:auto;}
#serviceIcon03{ width:260px; height:auto;}
#serviceIcon04{ width:200px; height:auto;}
#serviceIcon05{ width:200px; height:auto;}
#serviceIcon06{ width:200px; height:auto;}
#serviceIcon07{ width:200px; height:auto;}
#serviceIcon08{ width:200px; height:auto;}
#serviceIcon09{ width:200px; height:auto;}
#serviceIcon10{ width:200px; height:auto;}

#serviceTwoColumnWrapper{ }
#serviceTwoColumn1{background:#f5b621 url(../img/service/bgPhoto_11.jpg) left center no-repeat;background-size:50%; padding: 60px 0 60px 0; color: #fff;}
#serviceTwoColumn2{background:#f7c14c url(../img/service/bgPhoto_12.jpg) right center no-repeat;background-size:50%; padding: 60px 0 60px 0; color: #fff;}

.serviceTwoColumnWidth{ text-align: left; color:#fff; padding:0; position:relative; height:auto; width: 50%; box-sizing:border-box;letter-spacing:0;}
.serviceTwoColumnLeft{display:inline-block; width:460px; margin-left:-540px;}

.serviceTwoColumnWidth h3{font-size: 24px;font-weight: 700; padding:0 20px; margin-bottom: 10px; width:440px;}
.serviceTwoColumnWidth p{padding:0 20px; width:440px;}

.bannerList{ margin-top: 20px;}
.bannerList li{ display:inline-block; margin:0 10px 10px 0;}

#companyProfileWrapper{ text-align: left; text-align: center; margin:0 auto; width:320px; width:auto;}
#companyProfileWrapper .companyTbl{
    box-sizing: border-box;
    width: 100%;
    max-width: 960px;
    margin:  0 auto;
}
#companyProfileWrapper .companyTbl tr{
    border-bottom:  1px solid #dddddd;
}
#companyProfileWrapper .companyTbl th{
    box-sizing: border-box;
    width:  15%;
    padding:  0.5em 30px 0.5em 0;
    font-weight: bold;
    text-align: right;
}
#companyProfileWrapper .companyTbl td{
    box-sizing: border-box;
    width:  85%;
    padding:  0.5em 0;
    text-align: left;
}
#companyProfileWrapper .companyTbl td ul li{
    display: inline-block;
    width:  49%;
    font-size: 12px;
}
#companyProfileWrapper .companyTbl .spBr{
    display: none;
}
#companyImageWrapper{
    height: 500px;
    background: url(../img/company/company.jpg) center bottom no-repeat;
    background-size: contain;
    margin: 0;
    background-color: #fff;
    background-repeat: no-repeat;
}
#companyInfoWrapper{
    width: 100%;
    height: auto;
    margin: 0;
    padding-top: 0px;
    padding-bottom: 30px;
    background-color: #f8f8f8;
    text-align: center;
    font-size: 14px;
}
#companyInfoWrapper p{ line-height: 180%; margin:10px auto 20px;}
#companyInfoWrapper p strong{ font-weight: 700;}
.mapContents{
    width: 960px;
    height: auto;
    margin: 0 auto 30px auto;
    text-align: left;
    font-size: 14px;
}
.mapContents strong{font-weight: 700;}
#map01,#map02,#map03,#map04{width:100%; height:300px;}

#companyCustomerWrapper{
    width: 100%;
    height: auto;
    margin: 0;
    padding-top: 0px;
    padding-bottom: 60px;
    background-color: #f8f8f8;
    text-align: center;
    font-size: 14px;
}
#customerList{ width:960px; margin:0 auto;}
#customerList li{ width:33%; float:left; text-align: left; font-size:12px; margin-bottom: 5px;}


#companyVisionWrapper{ margin:20px auto 20px; padding-bottom:40px; width:960px;}
#companyVisionWrapper p{ margin-bottom:20px; text-align: left; font-size:14px;}

#visionImg{ position:relative;}
#visionImg img#visionMessage{width:960px; height:auto;}
#visionImg img#visionMessage2{width:960px; height:auto; position:absolute; top:0; left:0;}

#visionObjWrapper{ position:relative;}
#visionImg img#visionObj{width:160px; height:auto; margin-top:-40px;}
#visionImg img#visionObj2{width:160px; height:auto; top:-40px; position:absolute; right:0;}


#contactFormWrapper{ width:800px; margin:0 auto 80px; font-size:14px;}
#contactFormWrapper dt{ float:left; width:25%; clear:both; line-height: 36px; text-align: right; margin-bottom: 40px;}
#contactFormWrapper dt label,#contactFormWrapper dt label span{ font-weight: bold;}
#contactFormWrapper dd{ margin-left:30%; margin-bottom: 40px; text-align: left;}

#contactFormWrapper dd.checkPage,#contactFormWrapper dd.checkText{ line-height: 36px; margin-bottom: 40px; height:36px;}
#contactFormWrapper dt.checkDtHeight{ margin-bottom: 0;}
#contactFormWrapper dd.checkDdHeight{ padding-top:8px;}

.form-control {
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.form-input{ display: block; width: 80%; height: 24px;}
.form-tel{ display: inline-block; width: 4em; height: 24px;}
.form-area { display: block; width: 80%; height: 10em;}
.form-radio{ line-height: 36px; margin-bottom:10px;}
.form-birth{ display: inline-block; width: 4em; height: 24px;}

h3.lineTitle{ text-align: left; width:710px; margin:0 auto 40px; font-size:120%; border-left: 3px solid #4da4db; padding-left:5px; font-size: 20px; font-weight: bold;}

.checkFormTitle{ margin: 0 auto 40px;}
.checkFormSubmitWrapper{clear:both;}

.pcOnly{ display:inline-block;}
.spOnly{ display:none;}

.popup {
    overflow: auto;
    padding: 0 40px 40px;
    text-align: left;
    display: none;
    font-size:85%;
}
.popup h3 { font-weight:bold; margin:20px 0;}
.popup p { margin-bottom:40px;}
.popup ol {
    margin: 20px 20px 40px;
}
.popup ol li {
    list-style-type: decimal;
    list-style-position: outside;
    margin-bottom: 10px;
}
#signBox {
    text-align: right;
}

.button_privacy {
    font-size:14px;
    border: 1px solid #ffad41;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-family: arial, helvetica, sans-serif;
    padding: 12px 40px 10px 40px;
    text-decoration: none;
    display: inline-block;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #ffc579;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ffc579), to(#fb9d23));
    background-image: -webkit-linear-gradient(top, #ffc579, #fb9d23);
    background-image: -moz-linear-gradient(top, #ffc579, #fb9d23);
    background-image: -ms-linear-gradient(top, #ffc579, #fb9d23);
    background-image: -o-linear-gradient(top, #ffc579, #fb9d23);
    background-image: linear-gradient(to bottom, #ffc579, #fb9d23);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffc579, endColorstr=#fb9d23);
}

.button_privacy:hover{
 border:1px solid #ff9913; text-decoration: none;
 background-color: #ffaf46; background-image: -webkit-gradient(linear, left top, left bottom, from(#ffaf46), to(#e78404));
 background-image: -webkit-linear-gradient(top, #ffaf46, #e78404);
 background-image: -moz-linear-gradient(top, #ffaf46, #e78404);
 background-image: -ms-linear-gradient(top, #ffaf46, #e78404);
 background-image: -o-linear-gradient(top, #ffaf46, #e78404);
 background-image: linear-gradient(to bottom, #ffaf46, #e78404);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffaf46, endColorstr=#e78404);
}


#contactFormWrapper .form_wrap{text-align:left;
width: 100%;
height: auto;
margin: 0 auto;
}

#contactFormWrapper p.form-ex{}
#contactFormWrapper p.form-attent{margin: 30px 0 60px 0;
font-size: 12px;
line-height: 1.5em;}

.sub_menu{
    width: 720px;
    height: auto;
    margin: 20px auto 80px auto;
    background:#e0e0e0;
    padding-right:1px;
    box-sizing:border-box;
}
.sub_menu_cell{
    width: 50%;
    height: auto;
    float: left;
    padding: 15px 20px 10px 20px;
    border-top: solid 1px #e0e0e0;
    border-bottom: solid 1px #e0e0e0;
    border-left: solid 1px #e0e0e0;
    border-right: none;
    background-color: #fff;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
    box-sizing:border-box;
    border-collapse: collapse;
}
.sub_menu_cell:hover{ background:#e0e0e0;}

.glyphicon {
    float: right;
    color: #41bfe8;
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.glyphicon-menu-right:before {
    content: "\e258";
}


/* スマホ ---------------------------------------------*/
@media only screen and (max-width : 768px) {
.pcOnly{ display:none;}
.spOnly{ display:inline-block;}


#logo{ top:10px;left:20px;}
#logo img{ width:80px; height:auto;} 
#headerWrapper{ width:100%;}
#catch{ display:none;}
header{ height:90px;}
#home{ padding-top:90px;}
#main{ padding-top:90px;}

#sliderWrapper{ width:100%; margin:0 auto; height:420px;}
.bxslider{width:100%; height:400px;}
.slideBox{width:100%; height:400px;}

nav#gNav{ display:none; position:absolute; top:90px; right:0; width:100%; text-align: center; background-color: rgba(255, 255, 255, 1); border-top:1px solid #eee; border-bottom:1px solid #eee;}
nav#gNav > ul > li { display:block; padding-left:0; font-size:85%; position:relative; padding-bottom:10px; padding-top:10px;}

nav#gNav > ul > li > ul{ position:static; width:100%; text-align: center; border:none; box-sizing:border-box; padding:10px 0 10px; line-height:1;
box-shadow:rgba(0, 0, 0, 0) 0px 0px 10px 0px;
-webkit-box-shadow:rgba(0, 0, 0, 0) 0px 0px 10px 0px;
-moz-box-shadow:rgba(0, 0, 0, 0) 0px 0px 10px 0px;
}
nav#gNav > ul > li > ul li a{display:block;padding:10px 15px 10px;}
nav#gNav > ul > li > ul li a:hover{ background:#efefef; text-decoration: none;}


#service1{background:url(../img/index/column1.jpg) left -180px no-repeat;background-size:100%; padding-top:300px;}
#service2{background:url(../img/index/column3.jpg) left 0 no-repeat;background-size:100%; padding-top:300px;}
#service3{background:url(../img/index/column2.jpg) left -160px no-repeat;background-size:100%; padding-top:300px;}
.w50{ width:100%;}
.serviceList li div{ width: 100%; padding:20px 20px; height:auto;}
.serviceList li div.rightBase{ width: 100%; margin-right:0; padding:20px 20px; height:auto;}
.serviceList li div a button{ position: static; margin-top:20px;}

.topicsList{ width:100%;}
.baseBtn a{ width:70%; font-size: 14px;}

.topicsList th{ width:auto; padding:20px 20px 0 20px; display:block; border-bottom:none;}
.topicsList td{ padding:20px 20px 20px 20px; display:block;}

#contact p{ padding: 0 20px 0;}
.tel{font-size: 160%; margin-top: 10px;}


#footerWrapper{ width:100%;}

.baseContentWrapper{ padding:0 20px 0;}
.baseList{ width:auto; margin:30px auto 0;}
.baseList th{ display:block; width:100%; padding: 0.6em 0 0.3em 1.2em; border-bottom: none; box-sizing:border-box; line-height: 1;}
.baseList td{ display:block; width:100%; padding: 15px; border-bottom: none; box-sizing:border-box;}

.baseContentWrapper h3{ text-align: left; width:100%; margin:0 auto 40px; font-size:120%; border-left: 5px solid #4da4db; padding-left:5px;}


/*ハンバーガー表示*/
#hamburger{display:block; position:absolute; top:20px; right:20px; border:1px solid #eee; padding:10px 10px 5px; background:#fff;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}


/*下層ページ*/
#lowerTitleWrapper{ padding:90px 0 20px;}
#lowerTitleBpNoWrapper{ padding:90px 0 0;}

#recruitImagePhoto{ margin-bottom:40px; background:url(../img/recruit/image_sp.jpg) center bottom no-repeat; background-size: cover; height:200px;}
#contactImagePhoto{ margin-bottom:40px; background:url(../img/contact/image.jpg) center bottom no-repeat; background-size: cover; height:200px;}

.lowerBaseContent{ width:100%;}
.fl30{ width:100%; float: none; padding:0 20px 20px; text-align: center;}
.fr70{ width:100%; float: none; padding:0 20px;}
.fl70{ width:100%; float: none; padding:0 20px 20px;}
.fr30{ width:100%; float: none; padding:0 20px; text-align: center;}

.title { font-size: 26px;}




#serviceTwoColumn1{background:#f5b621; padding: 60px 0 60px 0; color: #fff;}
#serviceTwoColumn2{background:#f7c14c; padding: 60px 0 60px 0; color: #fff;}

.serviceTwoColumnWidth{ width: 100%;}
.serviceTwoColumnLeft{width:100%; margin-left:0;}

.serviceTwoColumnWidth h3{width:auto;}
.serviceTwoColumnWidth p{width:auto;}


#companyImageWrapper{
    height: 300px;
}
.mapContents{
    width: 100%;
}
.mapContents p{ margin:0 10px;}
.mapContents strong{font-weight: 700;}

#customerList{ width:100%; box-sizing:border-box; padding:0 20px;}
#customerList li{ width:100%; float:none;}

#companyVisionWrapper{ margin:20px auto 60px; padding-bottom:0; width:100%;}
#companyVisionWrapper p{ margin:0 20px 20px;}
#visionImg{width:auto; margin:0 10px; height:auto;}


#contactFormWrapper{ width:100%;}

#formItemList{ width:90%; margin:0 auto;}
#contactFormWrapper p.form-ex{ width:75%; margin:0 auto;}
#contactFormWrapper p.form-attent{margin: 30px auto 60px auto; width:85%;}

#contactFormWrapper dt{ float:none; width:auto; text-align: left; margin-left: 20px; margin-bottom:0;}
#contactFormWrapper dt label,#contactFormWrapper dt label span{ font-weight: bold;}
#contactFormWrapper dd{ margin-left:20px; margin-bottom: 20px; margin-right:20px; text-align: left;}



.form-input{ display: block; width: 90%; height: 24px;}
.form-tel{ display: inline-block; width: 4em; height: 24px;}
.form-area { display: block; width: 90%; height: 10em;}
.form-birth{ display: inline-block; width: 4em; height: 24px;}

.baseSubmit{ width:80%; padding:20px; box-sizing:border-box; margin:40px auto 0; -webkit-appearance:none;}
.halfSubmit{ width:80%; padding:20px; box-sizing:border-box; margin:0 auto 0; -webkit-appearance:none; display:block;}

h3.lineTitle{ width:auto; margin:0 20px 20px; }

.checkFormTitle{ margin: 0 20px 40px; text-align: left;}
.checkFormSubmitWrapper{margin-top:40px;}

#privacyWrapper{padding-top:20px;}

.sub_menu{
    width: auto;
    margin: 20px 20px 80px 20px;
    padding-right:0;
    padding-bottom:1px;
}
.sub_menu_cell{
    width: 100%;
    float: none;
    padding: 15px 20px 10px 20px;
    border-top: solid 1px #e0e0e0;
    border-right: solid 1px #e0e0e0;
    border-left: solid 1px #e0e0e0;
    border-bottom:none;
    background-color: #fff;
    text-align: left;
}

/*add 170721*/
#companyProfileWrapper .companyTbl{
    box-sizing: border-box;
    width: 80%;
    max-width: 640px;
    margin:  0 auto;
    line-height: 1.5;
}
#companyProfileWrapper .companyTbl th{
    display: block;
    box-sizing: border-box;
    width:  100%;
    padding:  0.5em 0 0;
    font-weight: bold;
    font-size: 16px;
    text-align: left;
}
#companyProfileWrapper .companyTbl td{
    display: block;
    box-sizing: border-box;
    width:  100%;
    padding:  0 0 1em;
    text-align: left;
}
#companyProfileWrapper .companyTbl td ul li{
    display: block;
    width:  100%;
    font-size: 12px;
}
#companyProfileWrapper .companyTbl .spBr{
    display: block;
}



}

@media only screen and (max-width : 767px) {
#sliderWrapper{ width:100%; margin:0 auto; height:280px;}
.bxslider{width:100%; height:250px;}
.slideBox{width:100%; height:250px;}
#slide1{ background:url(../img/slide/image1sp.jpg) center center no-repeat;background-size:cover;}

#service1{background:url() left center no-repeat; padding-top:0;}
#service3{background:url() right center no-repeat; padding-top:0;}
#service2{background:url() right center no-repeat; padding-top:0;}

#service1{background:url(../img/index/column1.jpg) left -50px no-repeat;background-size:100%; padding-top:200px;}
#service2{background:url(../img/index/column3.jpg) left 0 no-repeat;background-size:100%; padding-top:200px;}
#service3{background:url(../img/index/column2.jpg) left -30px no-repeat;background-size:100%; padding-top:200px;}


.baseList{ width:auto; margin:30px 20px 0;}



#formItemList{ width:100%; margin:0 auto;}
#contactFormWrapper p.form-ex{ width:75%; margin:10px auto 0; font-size:12px;}
#contactFormWrapper p.form-attent{margin: 30px auto 40px auto; width:85%; font-size:11px;}

footer{ padding:20px 0 20px; text-align: center;}
#footerWrapper h2{ position: static; text-align:center; margin:0 auto;}
nav#fNav{ margin:20px 20px 20px 20px;}
nav#fNav > ul > li { display:block; padding:10px 0; position:relative;}
nav#fNav > ul > li > ul{ position:absolute; z-index: 200; right:0; width:100%; text-align: center; padding:5px 0 5px;}

}