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

html {  min-height:100%; }
body { margin: 0px; padding: 0px; font-size: 13px; font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "游ゴシック", YuGothic, Meiryo, sans-serif; line-height: 180%; -webkit-text-size-adjust: none; color: #222}
.highlight a:hover *{ filter: alpha(opacity=75); -moz-opacity:0.75; opacity:0.75; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}  
.clearfix { display: inline-table; }  
/* Hides from IE-mac \*/  
* html .clearfix { height: 1%; }  
.clearfix { display: block; }  
/* End hide from IE-mac */  
img {
	max-width: 100%;
	height: auto;
	width /***/: auto;
	border: none;
	vertical-align: bottom;
}
img.miniimage { display: none; }
@media screen and (min-width: 1025px) {
   img.minispimage { display: none; } /* miniを表示 */
   img.miniimage { display: none; }  /* miniを非表示 */
   img.bigimage  { display: block; } /* bigを表示 */
}
@media screen and (max-width: 1024px) {
   img.minispimage { display: none; } /* miniを表示 */
   img.miniimage { display: block; } /* miniを表示 */
   img.bigimage  { display: none; }  /* bigを非表示 */
}
@media screen and (max-width: 736px) {
   img.minispimage { display: block; } /* miniを表示 */
   img.miniimage { display: none; } /* miniを表示 */
   img.bigimage  { display: none; }  /* bigを非表示 */
}
p { margin: 0; padding: 0; }
ul { margin: 0; padding:0; }
li { margin: 0; padding:0; }
h1 { font-size: 12px; font-weight: normal; margin:0; padding:0; }
a:link { color: #367F24; text-decoration: none; }
a:visited { color: #367F24; text-decoration: none; }
a:hover { color: #222222; text-decoration: none; }
a:active { color: #367F24; text-decoration: none; }
strong { font-weight: normal; }
.text_center { text-align:center; }
.text_right { text-align:right; }
.text_red { color: #EE0000; }
.text_bold { font-weight:bold; }
.text11 { font-size: 11px; line-height: 200%; }
.text13 { font-size: 13px; line-height: 200%; }
.text15 { font-size: 15px; line-height: 200%; }
.text17 { font-size: 17px; line-height: 200%; }
.text19 { font-size: 19px; line-height: 200%; }
.text21 { font-size:21px; line-height: 200%; }
.text25 { font-size:25px; line-height: 200%; }
.bottom5 { margin-bottom: 5px; }
.bottom10 { margin-bottom: 10px; }
.bottom15 { margin-bottom: 15px; }
.bottom20 { margin-bottom: 20px; }
.bottom30 { margin-bottom: 30px; }
.bottom40 { margin-bottom: 40px; }
.bottom50 { margin-bottom: 50px; }
.top20 { margin-top: 20px; }
.top50 { margin-top: 50px; }
.top80 { margin-top: 80px; }
.top100 { margin-top: 100px; }
.sb-slidebar { display: none; }
.space40 {margin: 60px 20px; }
.fixed { position: fixed; top: 0; width: 100%; z-index: 10000;}
#page-top {position: fixed; bottom: 20px; right: 20px; z-index: 999;}
#page-top a {text-decoration: none; width: 50px; padding: 10px; display: block;}
#page-top a:hover {text-decoration: none;}
.pcbr {display: block;}
.spbr {}
#spNav { display: none;}
.drawer-nav { display: none;}

#navigation { clear:both; margin: 0 15px;}
#navigation .alignleft { float:left;}
#navigation .alignright { float:right;}

.wp-pagenavi {clear: both; margin:0 15px; height:45px;}
.wp-pagenavi a, .wp-pagenavi span {text-decoration: none;	border: 1px solid #222;	padding: 10px 15px;	margin: 3px;	background: #222; color: #FFF; border-radius: 40px; line-height: 30px; }
.wp-pagenavi a:hover, .wp-pagenavi span.current { border-color: #222; background:#FFF; color:#222; }
.wp-pagenavi span.current { font-weight: bold; }

.btn {display: inline-block;text-align: center;text-decoration: none;line-height: 38px;outline: none; width:100%; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px;}
.btn::before,
.btn::after {position: absolute;z-index: -1;display: block;content: '';}
.btn,
.btn::before,
.btn::after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-transition: all .3s;transition: all .3s;}
.btn {position: relative;z-index: 2;background-color: #367F24;border: 1px solid #367F24;color: #FFF;line-height: 38px;overflow: hidden;}
.btn:hover {color: #367F24; border: 1px solid #367F24;}
.btn::after {top: -100%;width: 100%; height: 100%;}
.btn:hover::after {top: 0; background: #FFF; color: #367F24;}

.btn2 {display: inline-block;text-align: center;text-decoration: none;line-height: 38px;outline: none; width:100%; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px;}
.btn2::before,
.btn2::after {position: absolute;z-index: -1;display: block;content: '';}
.btn2,
.btn2::before,
.btn2::after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;-webkit-transition: all .3s;transition: all .3s;}
.btn2 {position: relative;z-index: 2;background-color: #FFF;border: 1px solid #FFF;color: #367F24;line-height: 38px;overflow: hidden;}
.btn2:hover {color: #FFF; border: 1px solid #367F24;}
.btn2::after {top: -100%;width: 100%; height: 100%;}
.btn2:hover::after {top: 0; background: #367F24; color: #FFF;}

.ratioBox {position: relative;width: 100%;height: auto;}
.ratioBoxtop {position: relative;width: 100%;height: auto;}
.ratioBox1-1:before {content: "";display: block;padding-top: 100%; /* 1:1 */}
.ratioBox2-1:before {content: "";display: block;padding-top: 50%; /* 2:1 */}
.ratioBox3-2:before {content: "";display: block;padding-top: 66%; /* 3:2 */}
.ratioBox4-3:before {content: "";display: block;padding-top: 75%; /* 4:3 */}
.ratioBoxTop:before {content: "";display: block;padding-top: 47%; /* 4:3 */}
.ratioBoxInner {position: absolute;top: 0; left: 0;width: 100%;height: 100%;}
.ratioBoxInnertop {position: absolute;top: 0; left: 0;width: 100%;height: 100%;}

#header {width: 100%; padding: 0; margin: 0 auto; z-index: 1; position: absolute;}
#headLogo {width: 200px; float: left; margin-left: 12.5%}
#headRight {float: right; margin-right: 3.5%; margin-top: 70px;}
#headTel {float: left; width: 200px; padding: 10px 25px; background: #FFF; border-radius: 25px;}
#naviArea {float: left;}
ul#navi li {list-style: none; width: 130px; display: inline-block; text-align: center; font-weight: bold; margin-right: 20px; margin-top: 5px; float: left;}
ul#navi li a {display: block; width: 130px; float: left; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; color: #222; font-size: 17px; line-height: 39px; border-bottom: 1px solid #222;}
ul#navi li a:hover {background: #FFF; color: #222; border-radius: 20px;}
@media screen and (max-width: 1260px) {
#headLogo {width: 200px; float: left; margin-left: 3.5%}
#headRight {float: right; margin-right: 1.5%; margin-top: 70px;}
#headTel {float: left; width: 200px; padding: 10px 10px; background: #FFF; border-radius: 25px;}
#naviArea {float: left;}
ul#navi li {list-style: none; width: 120px; display: inline-block; text-align: center; font-weight: bold; margin-right: 10px; margin-top: 5px;}
ul#navi li a {display: block; width: 120px; float: left; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; color: #222; font-size: 17px; line-height: 39px; border-bottom: 1px solid #222;}
ul#navi li a:hover {background: #FFF; color: #222; border-radius: 20px;}
}

#footer {width: 100%;padding: 60px 0; background: #367F24; color: #FFF;}
#naviFoot {width: 1000px; margin: 0 auto 45px;}
#naviFoot ul#navi li {list-style: none; width: 210px; display: inline-block; text-align: center; font-weight: bold; margin: 0 20px; font-family: 'Raleway', sans-serif; font-weight: 400; float: left;}
#naviFoot ul#navi li span {display: block; font-size: 13px; line-height: 20px; margin-bottom: 5px;}
#naviFoot ul#navi li a {display: block; width: 210px; float: left; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; color: #FFF; font-size: 16px; line-height: 30px; border-bottom: 1px solid #FFF; padding-top: 5px;}
#naviFoot ul#navi li a:hover {background: #FFF; color: #367F24; border-radius: 20px;}
#footArea {width: 1000px; margin: 0 auto;}
#footLogo {width: 160px; margin:0 20px 0 20px; float: left;}
#footLogo h2 {font-size: 13px; margin: 0; padding: 0; font-weight: normal;}
#footName h2 {font-size: 17px; line-height: 20px; margin-top: 23px; float: left; font-weight: normal;}
#foot {clear: both; margin: 0 20px;}
#footAddress {float: left;}
#footCopy { float: right;}

.container {width: 990px; margin: 0 auto 30px;}
.container2 {width: 990px; margin: 0 auto; padding: 50px 0;}
.container3 {width: 990px; margin: 80px auto 80px;}
.container700 {width: 700px; margin: 0 auto; padding: 80px 0;}
.containerMission {margin: 0 0 30px; background: url(image/bg_mission.jpg) no-repeat center; background-size: cover; text-shadow: 3px 3px 3px #FFF,-3px 3px 3px #FFF,3px -3px 3px #FFF,-3px -3px 3px #FFF;}

#mainArea {width: 100%; z-index: 0; position: relative;}
#mainHead {width: 100%; z-index: 0; position: relative; height: 360px; margin-bottom: 60px;}
#mainService {width: 100%; height: 300px; background: url(image/head_service.jpg) no-repeat; background-size: cover;}
#mainCompany {width: 100%; height: 300px; background: url(image/head_company.jpg) no-repeat; background-size: cover;}
#mainContact {width: 100%; height: 300px; background: url(image/head_contact.jpg) no-repeat; background-size: cover;}
#mainNews {width: 100%; height: 300px; background: url(image/head_news.jpg) no-repeat; background-size: cover;}
#mainTitle {margin: 0 auto; width: 300px; color: #FFF; padding-top: 300px;}
#mainTitleW {background: #AB8600; text-align: center;}
#mainTitle h2 {padding: 10px 30px; margin: 0; line-height: 50px; font-size: 30px;}

#topConcept {background: url(image/bg_concept.jpg) no-repeat center; background-size: cover; padding: 60px 0; text-align: center;}
#topService {background: url(image/bg_top.jpg) no-repeat center; background-size: cover; color: #FFF;}
#topServiceP {float: left; margin-left: 5%; width: 47.25%;}
#topServiceT {float: right; width: 37.25%; margin: 60px 5% 60px;}
#topServiceT h3 {font-size: 30px; font-weight: bold; margin: 0 0 20px; padding: 0; line-height: 150%;}
#topService2 {background: url(image/bg_top2.jpg) no-repeat center; background-size: cover; color: #FFF;}
#topServiceP2 {float: right; margin-left: 5%; width: 47.25%;}
#topServiceT2 {float: left; width: 37.25%; margin: 60px 5% 60px;}
#topServiceT2 h3 {font-size: 30px; font-weight: bold; margin: 0 0 20px; padding: 0; line-height: 150%;}
.topServiceBtn {width: 200px;}
.topServiceBtn a {color: #367F24;}
#topCompany {background: url(image/bg_company.jpg) no-repeat center; background-size: cover; padding: 60px 0;}
#topCompanyWrap {width: 700px; margin: 0 auto;}
#map {width: 100%;}
#map iframe {pointer-events: none; vertical-align: bottom;}
.infoFull {width: 100%; clear: both; padding: 10px 0;}
.infoName {width: 150px; float: left; border-bottom: 1px solid #367F24; text-align: center; padding: 10px 0;}
.infoText {float: left; width: 100%; margin-left: -150px; border-bottom: 1px dashed #367F24;}
.infoInner {padding: 10px 0 10px 170px;}

.title1 {font-size: 50px; color: #367F24; line-height: 1; margin-bottom: 40px; font-family: 'Lato', sans-serif; font-weight: 700;}
.midashi1 {font-size: 25px; font-weight: bold; margin-bottom: 30px;}
.midashiEN {font-size: 15px; font-family: 'Raleway', sans-serif; font-weight: 400; margin-bottom: 10px;}
.topText {font-size: 15px; line-height: 30px;}

#topNews {padding: 60px 0; width: 990px; margin: 0 auto;}
.newsMidashiEN {float: left; font-size: 40px; font-family: 'Tangerine', cursive; font-weight: 400; margin-right: 20px; margin-left: 15px; line-height: 40px;}
.newsMidashiJA {float: left; font-size: 13px; line-height: 20px; margin-top: 15px;}
.newsListBtn {width: 200px; float: right; margin-right: 15px; text-align: center; font-size: 15px;}
.newsListBtn a {color: #FFF;}
.newsSingle {width: 300px; margin-left: 15px; margin-right: 15px; float: left;}
.newsData {line-height: 20px; margin-top: 10px;}
.newsTitle h3 {line-height: 30px;font-size: 15px; margin: 0; padding: 0; font-weight: normal;}
.newsText {margin: 0 0 10px;}
.newsBtn {width: 200px; margin: 0 auto; text-align: center;}
.newsBtn a {color: #FFF;}

.newsData2 {width: 180px;text-align: center;line-height: 50px;background: #367F24;color:#FFF; margin-bottom: 10px;}
.newsTitle2 h3 {line-height: 50px;padding: 0 0 5px 0;margin: 0;font-size: 17px;}
.newsArea {clear: both;padding:30px 100px 50px;margin: 0 0 50px;border-bottom:1px solid #367F24; border-top:1px dotted #367F24;}
.newsArea img {max-width: 100%; margin: 0 auto;}
.newsArea p {margin: 10px 0;}

.rightPhotoF {width:450px; float:right; margin-top:50px; margin-right: 15px;}
.rightPhotoWrapF {margin-left:50px; width: 440px;}
.leftPhotoF {width:450px; float:left; margin-top:50px; margin-left: 15px;}
.leftPhotoWrapF {margin-right:50px; width: 440px; float: right;}
.leftPhotoWrapF2 {margin-right:50px; float:right;}
.leftTextF {width:480px; float:left;}
.leftTextWrapF {margin-left:15px; margin-top:50px;}
.rightTextF {width:480px; float:right;}
.rightTextWrapF {margin-right:15px; margin-top:50px;}
.textCopy {width:270px; background:url(image/line.png) no-repeat top left; padding-top:35px; margin-bottom:35px;}
.textCopy h2 { font-size: 12px; font-weight: normal; margin:0; padding:0;}
.mainCopy {background:url(image/line.png) no-repeat top left; padding-top:35px; margin-bottom:35px;}
.mainCopy h2 { font-size: 24px; font-weight: bold; margin:0; padding:0; line-height: 150%;}
.mainCopy2 {background:url(image/line.png) no-repeat top left; padding-top:35px; margin-bottom:35px;}
.mainCopy2 h2 { font-size: 28px; font-weight: bold; margin:0; padding:0; line-height: 150%;}
.mainText {line-height:200%;}

#question {background: url(image/bg_question.jpg) no-repeat center; background-size: cover; width: 100%; height: 300px; margin-bottom: 30px; margin-top: 50px;}
#question h2 {text-align: center; font-size: 30px; line-height: 50px; padding: 125px 0 0 0; margin: 0; color: #FFF; text-shadow:2px 2px 3px #000000;}
.questionWrap {margin: 0 15px 10px;}
.question {background: #006b00; width: 40px; line-height: 40px; text-align: center; font-size: 20px; color: #FFF; float: left; border-radius:20px;}
.questionText {float: left; width: 100%; margin-left: -40px;}
.questionInner {padding: 10px 20px;font-size: 17px;line-height: 20px;display: inline-block;font-weight: bold;margin-left: 40px;}
.answerWrap {margin: 0 15px 30px;}
.answer {background: #CC0000; width: 40px; line-height: 40px; text-align: center; font-size: 20px; color: #FFF; float: left; border-radius:20px;}
.answerText {float: left; width: 100%; margin-left: -40px; line-height: 20px;}
.answerInner {padding: 10px 0 10px 20px;margin-left: 40px;}

.halfLeft {width: 465px; float: left; margin-left: 15px; margin-bottom: 30px;}
.halfRight {width: 465px; float: right; margin-right: 15px; margin-bottom: 30px;}
.fullPhoto {width: 960px; clear: both; margin: 0 15px;}

.w60 {width: 56%; float: left;}
.w40 {width: 40%; float: right; margin-top: 20px;}

