/*
    Theme Name: Okayamakensetsu
    Theme URI: 
    Author: NOUVELL MURACHI
*/

@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Montserrat);


section.section {
  padding: 90px 0 0;
}
section.section-subpage {
  padding: 30px 0 0;
}


@media (max-width: 768px) {
	section.section {
 	 padding: 60px 0 0;
	}
}


/*--------------
 header
 ------------ */
header {

}
#logo {
	padding: 40px 0;
}
header a {
	color: #333;
	text-decoration: none;
}
header a:hover, header a:focus {
	color: #eb6907;
	text-decoration: none;
}
#head-sns {
	margin: 20px 0 15px;
}
#head-sns img {
	margin-right: 5px !important;	
}
#search-form {
	
}
#search-field {
	margin: 0 !important;
	border: 1px solid #727071;
	line-height: 0;
	width:170px;
	height: 33px;
	padding: 0 10px;
	display: block;
	float: left;
	border-radius: none;
}
#search-submit {
	background: url(image/common/icon_head_search.gif) no-repeat #727071;
	border:0px;
	width:33px;
	height:33px;
	margin: 0 !important;
	padding: 0;
	display: block;
	float: right;
	border-radius: none;
}
#pc-navi {
	text-align: right;
	margin-top: 5px;
	margin-right: -20px;
}
#pc-navi a {
	padding: 8px 20px;
	font-size: 14px;
	font-weight: bold;
}
#pc-navi a:hover {
	color: #f0701a;
}
.pc-navi-line {
	border-right: 1px solid #727071;
}

@media (max-width: 1199px) {
	#logo {
		padding: 20px 0 0;
	}
	#head-sns {
		margin: 0 0 15px;
	}
}

@media (max-width: 991px) {
	#logo {
		text-align: center;
		padding: 20px 0;
	}
}


/*--------------
 footer
 ------------ */
footer {
	margin-top: 40px;
	padding: 0;	
}
#footer-img {
	background:url(image/common/img_footer_car.gif) no-repeat right top;
	height: 86px;
}
#footer-in {
	padding: 30px 0;
	background: #707070;
}
#footer-in p {
	color: #fff;
}
#footer-navi {
	margin-bottom: 50px;
	color: #fff;
	text-align: center;
}
#footer-navi a {
	color: #fff;
}
#footer-navi a:hover {
	color: #f0701a;
	text-decoration: none;
}
#footer-logo {
	text-align: left;
	border-bottom: 1px solid #fff;
	padding-bottom: 25px;
	margin-bottom: 25px;
}
#footer-dl {
	text-align: center;
}
#footer-dl a {
	background: #fff;
	color: #000;
	padding: 12px 0 10px;
	width: 100%;
	margin: 0 auto;
	display: block;
	font-weight: bold;
}
#footer-dl a img {
	margin-top: -2px;
}
#footer-dl a:hover {
	background: #ddd;
	text-decoration: none;
}
address span {
	font-weight: bold;
	font-size: 19px;
}
.footer-copyright {
	text-align: right;
	font-size: 13px;
	color: #fff;
}

@media (max-width: 400px) {
	#footer-navi {
	font-size: 13px;
	}
}

/*--------------
  back to top
 ------------ */
#pageTop {
  position: fixed;
  bottom: 0;
  right: 0;
}
#pageTop i {
  padding-top: 5px;
  padding-right: 7px;
}
#pageTop a {
  display: block;
  z-index: 999;
  padding: 8px 0 0 8px;
  width: 50px;
  height: 50px;
  background-color: #aaa;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  font-size: 17px;
  opacity: 0.9;
}
#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}


/*--------------
 common styles
 ------------ */
.mB20 {
	margin-bottom: 20px;
}
.mB30 {
	margin-bottom: 30px;
}
.mB40 {
	margin-bottom: 40px;
}
.mB50 {
	margin-bottom: 50px;
}
.mT20 {
	margin-top: 20px;
}
.mT40 {
	margin-top: 40px;
}
.text-emph {
	font-size: 21px;
	font-weight: bold;
}
.text-bigger {
	font-size: 17px;
}
.text-small {
	font-size: 13px;
}
.whitebox {
	display: block;
	padding: 30px;
	background-color: #fff;
}


/* opacity */
a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

@media (max-width: 768px) {
	.whitebox {
	  padding: 5%;
	}
}


/*--------------
 button variations
 ------------ */
.btn-simple {
	padding: 9px 20px;
	border: 1px solid #727071;
	line-height: 0;
	font-weight: bold;
}
.btn-simple:hover {
	background: #eee;
	color:#000;
}
.basic-btn-box {
	text-align: center;
	margin-top: 10px;
}
.basic-btn-box a {
	padding: 18px 0 15px 20px;
	width: 260px;
	letter-spacing: 0.1em;
	background: #707070;
	display: inline-block;
	color: #fff;
	line-height: 1;
	-webkit-transition: all .3s;
    transition: all .3s;
}
.basic-btn-box a:hover {
	background: #909090;
	text-decoration: none;
}
.basic-btn-box a img {
	vertical-align: middle;
	margin-bottom: 3px;
}

/* size */
.btn-large {
	font-size: 17px;
}
 

/*--------------
 top page
 ------------ */
.top-subtitle {
	text-align: center;
	margin-bottom: 40px;
}
.top-subtitle p {
	font-weight: bold;
	font-size: 26px;
	margin: 0;
	padding: 0;
	letter-spacing: 0.1em;
}
.top-subtitle h2 {
	font-weight: bold;
	font-size: 14px;
	display: inline;
	padding: 0 0 10px;
	margin: 0;
	border-bottom: 1px solid #727071; 
	letter-spacing: 0.1em;
}
.top-jirei {
	text-align: center;
}
.top-jirei p {
	padding: 10px 0;
}
.top-photobox {
    border: 1px solid #727071; 
    padding: 4px;
    width: 270px;
    height: 180px;
    display: inline-block;
}
.top-photobox p {
	overflow:hidden;
	width: 260px;
    height: 170px;
    padding: 0;
    margin: 0;
}
.top-jirei img {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
.top-jirei:hover img {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
}
.top-btn-insta {
	text-align: center;
	margin-top: 40px;
}
.top-btn-insta a {
	padding: 14px 0 11px 20px;
	width: 260px;
	letter-spacing: 0.1em;
	background: #707070;
	display: inline-block;
	color: #fff;
	line-height: 1;
	-webkit-transition: all .3s;
    transition: all .3s;
}
#top-company h1 {
	text-align: center;
	font-size: 20px;
	margin-bottom: 50px;
}
#top-company h1 span {
	border-bottom: 1px solid #f0701b;
	padding-bottom: 10px;
}
#top-company h3 {
	text-align: center;
	font-size: 20px;
	margin-bottom: 30px;
}
#top-company h3 span {
	border-bottom: 1px solid #f0701b;
	padding-bottom: 10px;
}
#top-company dl {
	width: 100%;
	margin-bottom: 12px;
}
#top-company dt {
	padding: 8px 0;
	margin: 0;
	background: #707070;
	width: 20%;
	text-align: center;
	color: #fff;
	float: left;
	font-weight: 500;
}
#top-company dd {
	padding: 8px 0 10px 20px;
	margin: 0;
	float: left;
	width: 70%;
}

@media (max-width: 440px) {
	#top-company dt {
		margin: 0;
		width: 30%;
		text-align: center;
		float: none;
	}
	#top-company dd {
		float: none;
		width: 100%;
	}	
}

/*--------------
 subpage common
 ------------ */
.subpage-main {
	width: 100%;
	height: 260px;
	text-align: center;
}
.subpage-main h1 {
	color: #fff;
	letter-spacing: 0.1em;
	padding: 94px 0 0;
	line-height: 1;
	font-size: 48px;
	margin-bottom: 0;
}
.subpage-main p {
	color: #fff;
	font-size: 20px;
}
.subpage-breadcrumb {
	text-align: left;
	margin: 0;
	padding: 30px 0 0;
}
.subpage-breadcrumb a {
	color: #000;
}
.subpage-breadcrumb a:hover {
	color: #f0701a;
}
.section-subpage-detail h2 {
	text-align: center;
	display: flex;
	align-items: center;
	font-size: 26px;
	margin: 30px 0 70px;
}
.section-subpage-detail h2:before,
.section-subpage-detail h2:after {
border-top: 1px solid;
content: "";
flex-grow: 1;
}
.section-subpage-detail h2:before {
margin-right: 1rem;
}
.section-subpage-detail h2:after {
margin-left: 1rem;
}
.section-subpage-detail h3 {
	text-align: center;
	font-size: 22px;
	line-height: 2.4em;
}
.section-subpage-detail h3 span {
	border-bottom: 1px solid #f0701b;
	padding-bottom: 10px;
}
.section-subpage-detail h4 {
	font-size: 20px;
	color: #f0701b;
	margin-top: 20px;
}
.section-subpage-detail h5 {
	font-size: 18px;
	margin-top: 20px;
}
.subpage-bannerbox {
	border: 1px solid #727071;
	text-align: center;
	width: 100%;
	margin-bottom: 30px;
	padding: 0 !important;
	line-height: 0 !important;
}
.subpage-bannerbox a {
	display:block;
	padding: 15px 15px 40px !important;
	font-size: 14px;
	color: #000;
	margin: 0 !important;
	font-weight: normal;
}
.subpage-bannerbox a img {
	margin: 0 !important;
}
.subpage-bannerbox a:hover {
	background: #eee;
	text-decoration: none;
}
.subpage-bannerbox a span {
	color: #000;
	font-weight: 400;
	padding: 20px 0 10px;
	line-height: 1.6em !important;
}
.subpage-bannerbox a span.bannerbox-ttl {
	display:block;
	font-weight: bold;
	font-size: 20px;
}
.subpage-explain {
	text-align: center;
	padding: 30px 0 50px;
}
.subpage-explain2 {
	text-align: center;
	padding: 20px 0;
}
.subpage-caption {
	text-align: center;
	padding: 0 0 10px;
}

@media (max-width: 768px) {
	.subpage-main {
		background-size: 100%;
		width: 100%;
		height: 180px;
		text-align: center;
	}
	.subpage-main h1 {
		padding: 70px 0 0;
		font-size: 32px;
		margin-bottom: 0;
	}
	.section-subpage-detail h2 {
		font-size: 22px;
	}
	.section-subpage-detail h3 {
		text-align: left;
		font-size: 20px;
	}
	.section-subpage-detail h4 {
		font-size: 18px;
	}
	.section-subpage-detail h5 {
		font-size: 16px;
	}
	.subpage-main p {
		color: #fff;
		font-size: 16px;
	}
	.subpage-explain {
		text-align: left;
		padding: 30px 0;
	}
	.subpage-explain2 {
		text-align: left;
		padding:15px 0;
	}
}

/*-- aboutus -- */
#aboutus .subpage-main {
	background: url(image/aboutus/aboutus_img_main.jpg) center center repeat-x;
}

/*-- recruit -- */
#recruit .subpage-main {
	background: url(image/recruit/recruit_img_main.jpg) center center repeat-x;
}
.recruit-banner {
	display: block;
	border:1px solid #707070;
	margin-bottom: 30px;
	padding: 5px;
	width:100%;
	text-align:center;
}
.recruit-banner img {
	max-width: 90%;
}
.recruit-banner:hover {
	background: #eee;
	text-decoration: none;
}
.recruit-table {
	width: 90%;
	margin: 0 auto;
	border-bottom:1px solid #ddd;
}
.recruit-table th {
	background:#f8f8f8;
	padding-left: 3%;
	padding-right: 3%;
}
.recruit-table td {
	padding-left: 3%;
	padding-right: 3%;
}

@media (max-width: 768px) {
	.recruit-table {
	width: 100%;
	}
}

/*-- works -- */
#works .subpage-main {
	background: url(image/works/works_img_main.jpg) center center repeat-x;
}
.works-bannerbox {
	text-align: center;
	width: 100%;
	margin-bottom: 30px;
}
.works-bannerbox h2 a {
	color: #000;
}
.works-bannerbox h2 a:hover {
	color: #666;
	text-decoration: none;
}
.works-bannerbox-ttl {
	font-size: 22px;
	background: #fff;
	opacity: 0.7;
	filter: alpha(opacity=70);
	height: 60px;
	margin-top: -60px;
	padding-top: 18px;
	display: block;
}

@media (max-width: 440px) {
	.works-bannerbox-ttl {
	font-size: 18px;
	background: #fff;
	opacity: 0.7;
	filter: alpha(opacity=70);
	height: 40px;
	margin-top: -40px;
	padding-top: 12px;
	display: block;
	}
}

/*-- access -- */

.access-table {
	width: 100%;
	margin: 0 auto 30px;
	border-bottom:1px solid #ddd;
}
.access-table th {
	background:#f8f8f8;
	padding-left: 3%;
	padding-right: 3%;
}
.access-table td {
	padding-left: 3%;
	padding-right: 3%;
}

/*-- SDGs -- */ 
.sdgs-table {
	width: 100%;
	margin: 0 auto;
	border: 1px solid #ddd;
}
.sdgs-table th {
	background:#666;
	border: 1px solid #ddd;
	color: #fff;
	text-align:center;
}
.sdgs-table td {
	border: 1px solid #ddd;
	vertical-align: middle;
}
.sdgs-table-icon {
	width: 40%;
}
.sdgs-table-icon img {
	float: left;
	width: 20%;
}
.sdgs-table-icon p {
	float: right;
	width: 75%;
	margin: 0;
} 
.sdgs-table-icon p span {
	display: block;
	font-weight: bold;
	margin-bottom: 5px;
}
.sdgs-table-target {
	text-align: center;
	min-width: 100px;
}

@media (max-width: 648px) {
	.sdgs-table-icon img {
	float: none;
	width: 70px;
	margin-bottom: 5px;
	}
	.sdgs-table-icon p {
	float: none;
	width: 100%;
	margin: 0;
	} 
}

/*-- contact -- */
#contact .subpage-main {
	background: url(image/contact/contact_img_main.jpg) center center repeat-x;
}
span.form-hissu {
	color: #cc3300;
}
.form-group {
	margin-bottom: 30px;
}
.wpcf7-list-item-label {
}
.wpcf7-submit {
	background: #f0701b;
	color: #fff !important;
	margin-left: 4px;
	padding: 10px 50px;
	margin-bottom: 0;
	font-weight: normal !important;
	text-decoration: none !important;
}

/*-- news -- */
#news .subpage-main {
	background: url(image/news/news_img_main.jpg) center center repeat-x;
}
.news-toplist {
	border-top: 1px solid #eee;
}
.news-toplist div {
	padding: 15px 0;
	border-bottom: 1px solid #eee;
}
.news-toplist span {
	color: #999;
}

/*-- blog -- */
#blogtop {
	border-top: 1px solid #727071;
}
.section-blog h1 {
	font-size: 26px;
	text-align: center;
	margin-top: 40px;
}
.section-blog h2 {
	font-size: 22px;
	background:#f8f8f8;
	padding: 10px 20px;
	margin: 30px 0 20px;
}
.section-blog h3 {
	font-size: 20px;
	border-bottom: 1px solid #727071;
	margin: 30px 0 20px;
	padding-bottom: 10px;
}
.section-blog h4 {
	font-size: 20px;
	color: #f0701b;
	margin: 30px 0 20px;
}
.section-blog h5 {
	font-size: 18px;
	margin: 20px 0 10px;
}

.section-blog table {
	width: 100%;
	margin: 30px auto;
	border-bottom:1px solid #ddd;
}
.section-blog table th {
	background:#f8f8f8;
	border-top:1px solid #ddd;
	padding-left: 3%;
	padding-right: 3%;
}
.section-blog table td {
	border-top:1px solid #ddd;
	padding-left: 3%;
	padding-right: 3%;
}
.blog-eyecatch {
	text-align: center;
}
.blog-eyecatch img {
	width: 100%;
}
.blog-date {
	font-size: 14px;
	text-align: right;
	margin-bottom: 30px;
}
.bloglist-box {
	padding: 25px 0;
	border-bottom: 1px solid #eee;
}
.bloglist-box h3 a {
	color: #f0701b;
}
.bloglist-box h3 a:hover {
	color: #000;
}
.bloglist-box-img (
	text-align: center;
)
.bloglist-box-img img {
	width:auto;
	height:auto;
	max-width:100%;
	max-height:100%;
}
.search-pager {
	text-align: center;
}
.search-pager a {
	color: #f0701b;
}
.alignleft {
	display: inline;
	float: left;
}
.alignright {
	display: inline;
	float: right;
}
.aligncenter {
	display: block;
	margin-right: auto;
	margin-left: auto;
}
blockquote.alignleft,
.wp-caption.alignleft,
img.alignleft {
	margin: 0.4em 1.6em 1.6em 0;
}
blockquote.alignright,
.wp-caption.alignright,
img.alignright {
	margin: 0.4em 0 1.6em 1.6em;
}
blockquote.aligncenter,
.wp-caption.aligncenter,
img.aligncenter {
	clear: both;
	margin-top: 0.4em;
	margin-bottom: 1.6em;
}

@media (max-width: 648px) {
	.section-blog h1 {
	text-align: left;
	font-size: 22px;
	}
	.section-blog h2 {
	font-size: 20px;
	}
	.section-blog h3 {
		font-size: 18px;
	}
	.section-subpage-detail h4 {
		font-size: 16px;
	}
	.section-subpage-detail h5 {
		font-size: 15px;
	}
	.alignleft {
		display: block;
		margin-right: auto;
		margin-left: auto;
		float: none;
	}
	.alignright {
		display: block;
		margin-right: auto;
		margin-left: auto;
		float: none;
	}
	.section-blog img {
		width: 100%;
		height: auto;
	}
}