@charset "UTF-8";

/*========================================================================
	COMMON
/*======================================================================*/

/* elements
-------------------------------------*/
body {
  background: url(../images/body_bg.jpg)  repeat-x top;
  line-height: 1.7;
  -webkit-text-size-adjust: 100%;
}

h1, h2, h3, h4, h5, h6, input, button, textarea, select, p, blockquote, table, pre, address, ul, ol, dl {
  font-size: 140%;
}

strong {
  color: #008770;
  font-weight: bold;
}

img {
  height: auto;
  max-width: 100%;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
}

table {
  width: 100%;
}

th {
  background-color: #E5F3F1;
}

th, td {
  border: 1px solid #c2c2c2;
  color: #3f3f3f;
  font-weight: normal;
  text-align: left;
}

a {
  color: #1E90FF;
  text-decoration: none;
}

a:hover,
a:active { text-decoration: none; }
a:visited {
}

/* framework
-------------------------------------*/
#side {
  display: none;
}

#main, #content, #footer .footerConts, #footer .copyright address {
  width: 100%;
}

#main {
  margin: 0 auto;
  text-align: left;
}

#mainInner {
  margin: 0 9px 20px;
  padding: 14px;
  background: #fff url(../images/contents_bg.jpg) repeat-x bottom;
  border: 1px solid #DCDCDC;
}

#content {
  float: right;
}

.contsInner {
  width: auto;
  margin: 0;
}

/* location
-------------------------------------*/

.mt50 { margin-top: 50px; }

.mb5 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb35 { margin-bottom: 35px; }

.imgL {
  float: left;
  padding-right: 5%;
}

.imgR {
  float: none;
  padding: 0;
  text-align: center;
}

.marb20 {
  display: block;
  float: none;
  margin: 0 auto;
}

/* style
-------------------------------------*/

/* title ------------------*/
h1#pageName {
  height: auto;
  min-height: 30px;
  margin: 0;
  padding: 15px 10px;
  background: #ebe8de;
  color: #005b5b;
  font-size: 24px;
  font-weight: bold;
}

#content h2 {
  margin: 0 0 20px 0;
  padding: 10px 0 10px 10px;
  border-bottom: 5px solid #ddd;
  border-left: 5px solid #35A895;
  color: #008770;
  font-size: 1rem;
  font-weight: bold;
}

#content h3 {
  clear: both;
  margin: 40px 0 20px;
  padding: 0 0 5px 0;
  border-bottom: 1px dotted #bbb;
  color: #008770;
  font-size: 18px;
  font-weight: bold;
}

.ttlStyle01 {
  background: url(../images/bg04.png) no-repeat top #e5f3f1;
  color: #005151;
  font-size: 1.6em;
  font-weight: bold;
  line-height: 1.2;
}

.ttlStyle01 span {
  display: block;
  padding: 15px 0 13px 43px;
  background: url(../images/icon02.png) no-repeat 15px 11px;
}

.ttlStyle02 {
  margin-bottom: 5px;
  border-bottom: 1px solid #008770;
  font-weight: bold;
}

.boxStyle02Bottom .title {
  margin-bottom: 10px;
  color: #005151;
  font-size: 16px;
  font-weight: bold;
}


/* font ------------------*/
.color01 {
  color: #008770;
  font-weight: bold;
}

.catch {
  margin: 20px;
  text-align: center;
}

.fas, .far {
    margin: 0 5px 0 0;
}

/* box ------------------*/
.boxStyle01 {
  padding: 15px 30px;
  background: url(../images/bg05.png) no-repeat bottom;
}

.boxStyle02 {
  margin: 70px 0;
  background: #e9f5f3;
  border: 1px dotted #bbb;
  zoom: 1;
}

.boxStyle02Bottom {
  padding: 15px;
  background: #e7f5f1;
  border: 1px dotted #7cbaaa;
}

/* img ------------------*/
#content img {
  margin-bottom: 10px;
}

h2#pageName img {
  width: auto;
  margin: 30px 0;
}

dt img, dd img, li img {
  vertical-align: bottom;
}

#content img.svg {
	margin: 0;
	vertical-align: bottom;
}

/* list ------------------*/
.linkList li {
  padding-left: 11px;
  background: url(../images/icon03.png) no-repeat left 6px;
}

.listStyle01 li {
  padding-left: 11px;
  background: url(../images/icon04.png) no-repeat left 7px;
}

/* anchor ------------------*/
.pagetop {
  padding: 30px 0 10px;
  text-align: right;
}

.pagetop img {
    width: auto;
}

/* area parts
-------------------------------------*/

/* header ------------------*/
#header {
  position: relative;
  height: auto;
	width: 100%;
  margin: 0 auto 8px;
  text-align: left;
}

#header .logo img {
	width: 85%;
}

#header h1 {
  position: relative;
  right: 9px;
  color: #B2DBD4;
  font-size: 1em;
  line-height: 1.4;
}

#header .logo {
	position: relative;
	top: 0;
	left: 0;
	padding: 5px 0 0 10px;
	max-width: 300px;
}

#nav {
  position: relative;
  top: 0;
  left: 0;
}

#nav-content #nav h2 {
  margin: 0 -10px;
  padding: 15px;
  background: #0a8974;
  color: #fff;
  font-weight: bold;
  letter-spacing: .5rem;
  text-align: center;
}

#nav-content #nav li {
  float: none;
  max-width: 330px;
  margin: 10px 0;
  border: 1px solid #ddd;
  font-size: 16px;
  text-align: center;
}

#nav-content #nav a {
  display: inline-block;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  color: #0a8974;
  text-decoration: none;
}

#nav-drawer {
  position: absolute;
  top: 40%;
  right: 2%;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  height: 22px;
  width: 30px;
  vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  background: #fff;
  border-radius: 3px;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  right: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999;/*最前面に*/
  box-sizing: border-box;
  width: 80%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 330px;/*最大幅（調整してください）*/
  height: 100%;
  padding: 0 10px;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(105%);
  transform: translateX(105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%); /*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}

/* breadcrumb ------------------*/
.breadcrumbs {
    padding: 5px 0 0 10px;
    background: #eeeae2;
}
.current-item {
    font-weight: bold;
    color: #008770;
}

/* footer ------------------*/
#footer {
  clear: both;
  background-color: #f8f8f8;
  border-top: 1px solid #dcdcdc;
  text-align: center;
}

.footerConts {
  margin: 0 auto;
  padding: 20px 10px;
  box-sizing: border-box;
  text-align: left;
}

.footerContact {
  float: none;
  position: relative;
  width: 100%;
  height: 128px;
}

.footerContact .company {
  position: absolute;
  top: 0;
  left: 4px;
}

.footerContact .tel {
  position: absolute;
  bottom: 8px;
  left: 4px;
}

.footerContact .contact {
  position: absolute;
  bottom: 0;
  right: 1%
}

.footerNav {
  float: none;
  width: 100%;
  padding: 20px 0;
  border: none;
}

.footerNav ul {
  float: none;
  padding: 0 5px;
}

.footerNav li {
  padding-left: 12px;
  background: url(../images/icon01.png) no-repeat left 11px;
  line-height: 2;
}

.footer_recaptcha {
	color: #fff;
}

.footer_recaptcha a {
	color: #fff;
}

.grecaptcha-badge { visibility: hidden; }

.footerNav li a {
  color: #3F3F3F;
  font-size: 0.85em;
}

#footer .copyright {
  background-color: #474240;
  border-top: 3px solid #008770;
}

#footer .copyright address {
  margin: 0 auto;
  padding: 15px 0;
  color: #fff;
  font-size: 11px;
  font-weight: bold;
  text-align: center;
}

/*========================================================================
  INDEX
/*======================================================================*/
body#index {
	background: url(../images/index_body_bg.jpg) repeat-x top;
}

#index #mainVisual {
  position: relative;
  margin-bottom: 7px;
}

#index #mainVisual ul.mainVisualNav {
	display: none;
}

.index_about {
  margin: 0 0 20px;
  padding: 0 20px 20px;
  border: dotted 1px #58a593;
  background: #e6f4f1;
}

#content .index_about h2 {
  margin: 30px 0 10px;
  padding: 0 0 5px;
  border-bottom: dotted 1px #58a593;
  border-left: none;
  color: #005150;
  font-size: 1.4rem;
  font-weight: bold;
}

#index p {
  line-height: 2.0;
}

#index h3 {
  margin: 10px 0 20px 20px;
  padding: 0 0 5px 0;
  border-bottom: 1px dotted #bbb;
  color: #008770;
  font-size: 15px;
  font-weight: bold;
  text-indent: -10px;
}

#index .pickup {
  margin-bottom: 20px;
  padding-top: 9px;
  background: url(../images/line02.png) repeat-x bottom;
}

#index .pickupConts {

}

#index .pickupConts dt {
  position: relative;
  height: 16px;
  margin-bottom: 15px;
  padding-bottom: 11px;
}

#index .pickupConts dt a {
  display: block;
  position: absolute;
  top: 22px;
  right: 0;
  font-size: 12px;
}

#index .pickupConts dd {
  height: 50px;
  margin-bottom: 25px;
  font-size: 12px;
}

#index .building {
  margin-bottom: 23px;
  background: url(../images/index_bg02.png) repeat-y;
}

#index .buildingTop {
    background: url(../images/index_bg01.png) no-repeat top;
}
#index .buildingBottom {
  padding: 20px;
  background: #e7f5f1!important;
  border: 1px dotted #7cbaaa;
}

#index .buildingImg {
  float: none;
  margin-bottom: 7px;
  padding-left: 5px;
  text-align: center;
}

#index .buildingConts {
  float: right;
  width: auto;
  margin: 0 4px 12px 0;
  padding: 5px;
  background-color: #fff;
  line-height: 1.5;
}

#index .message {
  padding: 10px 12px;
}

#index .message p {
  margin-bottom: 25px;
}

/*========================================================================
  ABOUT01
/*======================================================================*/
#about ol, #about01 ol, #about02 ol {
  margin: 5px 0;
}

#about ol li, #about01 ol li, #about02 ol li {
  padding: 1px 0 1px 21px;
  font-weight: bold;
}

#about ol li.num01, #about01 ol li.num01, #about02 ol li.num01 {
  background: url(../images/icon05.png) no-repeat left 3px;
}

#about ol li.num02, #about01 ol li.num02, #about02 ol li.num02 {
  background: url(../images/icon06.png) no-repeat left 3px;
}

#about ol li.num03, #about01 ol li.num03, #about02 ol li.num03 {
  background: url(../images/icon07.png) no-repeat left 3px;
}

#about ol li.num04, #about01 ol li.num04, #about02 ol li.num04 {
  background: url(../images/icon08.png) no-repeat left 3px;
}

#about ol li.num05, #about01 ol li.num05, #about02 ol li.num05 {
  background: url(../images/icon09.png) no-repeat left 3px;
}

#about ol li p, #about01 ol li p, #about02 ol li p {
  font-weight: normal;
}

#about ol span, #about01 ol span, #about02 ol span {
  display: block;
  margin-bottom: 10px;
  margin-left: -21px;
  font-weight: normal;
}

#about table, #about01 table, #about02 table {
  font-size: .5rem;
  margin: 10px 0 5px;
}

#about table th, #about table td, #about01 table th, #about01 table td, #about02 table th, #about02 table td {
  text-align: center;
    width: 20%;
}

#about01 table th, #about01 table td {

}

.gallery li, .gallery li.lastitem {
  float: none;
  margin: 30px auto;
}

/*========================================================================
  ABOUT02
/*======================================================================*/
#about ol span, #about01 ol span, #about02 ol span {
  margin-left: 0;
}

#about02 ol .imgR {
  padding-bottom: 30px;
}

/*========================================================================
  ENTRUST
/*======================================================================*/
#entrust .supportList {
  margin-bottom: 30px;
  text-align: center;
}

#entrust .supportList li {
  float: none;
  margin-bottom: 10px;
}

#entrust .support {
  margin: 50px 0;
  padding: 20px 30px 30px;
  background: url(../images/bg06.jpg) no-repeat top;
}

#entrust .support h3 {
    margin: 10px 0;
}

#entrust .support p:first-child {
  display: inline-block;
  margin: 0;
  padding: 0px 5px;
  background: #008770;
  color: #fff;
  font-size: 10px;
}

#entrust .support p {
  margin-bottom: 20px;
}

#entrust .support img {
  width: auto;
  height: 30px;
}

#entrust .support p.pagetop {
  margin: 0;
  padding: 0;
}

#entrust .support p.pagetop a {
  padding-left: 15px;
  background: url(../images/icon11.png) no-repeat left 1px;
}

#entrust #support04 .listStyle01 {
  margin: 5px 0;
}

/*========================================================================
  FAQ
/*======================================================================*/
#faq h3 {
  margin: 40px 15px 0px;
  padding: 0 4px;
}

#faq .ttlStyle01 span {
  display: block;
  background: url(../images/faq_icon01.png) no-repeat 5px 8px;
  padding: 15px 0 13px 43px;
}

#faq .boxStyle01 {
  margin-bottom: 20px;
  padding: 0 15px;
  background: url(../images/bg05.png) no-repeat bottom;
}

#faq .boxStyle01 .inner {
  padding: 15px 15px 15px 45px;
  background: url(../images/faq_icon02.png) no-repeat 9px 10px;
}

#faq .boxStyle01 table {
  width: 120%;
  margin: 20px 0 20px -15%;
  font-size: .5rem;
}

#faq .boxStyle01 table th, #faq .boxStyle01 table td {
  text-align: center;
}

/*========================================================================
  RISK
/*======================================================================*/
#risk .about {
    margin: 20px;
}

#risk .listStyle01 {
  margin: 7px 0;
  padding: 5px 10px;
  background-color: #fff;
}

/*========================================================================
  RESULT
/*======================================================================*/
#results th, #results td {
  width: 15%;
  font-size: .5rem;
  text-align: center;
}

#results td:not(:first-of-type) {
  text-align: right;
}

/*========================================================================
  CASE
/*======================================================================*/
#case .about {
  margin: 0 15px 30px;
}

/*========================================================================
  VOICE
/*======================================================================*/
#voice .ttlStyle01 {
  margin: 40px 15px 0px;
  padding: 0 4px;
}

/*========================================================================
  FLOW
/*======================================================================*/
#flow .flowLink {
  margin-bottom: 23px;
}

#flow .flowLink li {
  display: inline-block;
  float: left;
  width: 20%;
  padding: 0;
  background: none;
  text-align: center;
}

#flow .step {
  margin-bottom: 10px;
  padding-bottom: 20px;
  background: url(../images/flow_icon01.png) no-repeat center bottom;
}

#flow .step.last {
	 background: none;
}

#flow .ttlStyle02 {
  width: auto;
}

/*========================================================================
  COMPANY
/*======================================================================*/
#company table {
  font-size: .7rem;
}

#company th {
  text-align: center;
}

#company p {
  font-size: .7rem;
}

#company .privacyPolicy {
  margin: 10px 0 30px;
  font-size: .7rem;
}

#company .privacyPolicy dt {
  margin-bottom: 5px;
  border-bottom: 1px solid #008770;
}

#company .privacyPolicy dd {
  margin-bottom: 20px;
}

#company .contactTop {
  background: url(../images/privacy_bg01.png) no-repeat top;
}

#company .contactBottom {
  padding: 15px 0 10px;
}

#company ul.companyUl {
	margin-left: 15px;
	font-size: 100%;
}

#company ul.companyUl  li {
	list-style-type: disc;
}

/*========================================================================
  CONTACT
/*======================================================================*/
.require {
  color: #cc0000;
  font-size: 12px;
  font-weight: bold;
}

.form-contact {
  margin: 30px 0 20px;
  font-size: .7rem;
}

.form-contact tr {
  padding: 0.5em;
}

.form-contact tr:nth-child(2n+1) th, .form-contact tr:nth-child(2n+1) td {
  background: #fcfcfc;
}

.form-contact th, .form-contact td{
  display: block;
  background: #f0f0f0;
  border: none;
}

.form-contact th {
  padding: 10px 10px 5px;
  color: #008770;
  font-weight: bold;
}

.form-contact td {
  padding: 5px 10px 10px;
}

.form-contact tr:nth-last-child(2) td, .form-contact tr:last-child td {
  padding-top: 20px;
  background: #f7f7f7;
}

.form-contact input[type="text"], .form-contact input[type="email"], .form-contact input[type="tel"], .form-contact textarea {
  width: 90%;
  padding: 0.5em;
}

.form-contact .col_1 {
  text-align: center;
}

.form-contact .accept {
  color: #00937b;
  font-size: 16px;
  font-weight: bold;
  vertical-align: bottom;
}

span.wpcf7-list-item {
  display: inline-block;
  margin: 0 0 0 1em;
}

.form-contact input[type="submit"] {
  padding: 0.5em 4em;
  background: #028870;
  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.5);
  border: 1px #028870 solid;
  border-radius: 5px;
  color: #fff;
  font-weight: bold;
}

.form-contact input[type="submit"]:hover {
  background: #186867;
  box-shadow: none;
}

/* Chrome, Safari */
.form-contact input::-webkit-input-placeholder{
  color: #ddd;
}

/* Firefox */
.form-contact input::-moz-placeholder{
  color: #ddd;
}

/* Firefox 18以前 */
.form-contact input:-moz-placeholder{
  color: #ddd;
}

/* IE */
.form-contact input:-ms-input-placeholder{
  color: #ddd;
}

div.wpcf7-response-output {
  font-size: 16px;
  font-weight: bold;
}

div.wpcf7-validation-errors {
  padding: 1em;
  background: #fd7505;
  border: none;
  color: #fff;
  text-align: center;
}

div.wpcf7-mail-sent-ok {
  background: #398f14;
  border: 2px solid #398f14;
  color: #fff;
}

div.wpcf7-mail-sent-ng {
  background: #ff0000;
  border: 2px solid #ff0000;
  color: #fff;
}

div.wpcf7-spam-blocked {
  background: #ffa500;
  border: 2px solid #ffa500;
}

div.wpcf7-validation-errors {
  background: #f7e700;
  border: 2px solid #f7e700;
}

.form-contact .wpcf7-recaptcha div {
  margin: 0 auto;
}