@charset "utf-8";

/* company */
.company-wrap {
	background-image:url("../images/top/main_bg.jpg");
	background-size:cover;
	padding-bottom:150px;
}
.company-wrap article {
	float:left;
	width:33.3333%;
	padding-right:15px;
	padding-left:15px;
}
.company-wrap .company-main {
	text-align: center;
	background-size:cover;
	padding-top:100px;
	padding-bottom:100px;
}
.company-wrap .company-main h2 {
	font-size:2.0em;
	color:#58a82f;
	font-weight: 700;
  text-shadow: 2px 2px 0px #fff;
}
.company-wrap .company-main p {
	font-size:1.4rem;
	margin-top:20px;

}
.company-wrap .company-menu {
	background-color: #fff;
	padding:30px 30px 0 30px;
	box-shadow: 0 0 8px #ccc;
}
.company-wrap .company-menu h2.main-title {
	margin-top:-60px;
}
.company-wrap .company-menu h2.main-title span {
	color:#fff;
	font-size:1.8rem;
	background-color: #58a82f;
	display:inline-block;
	padding:8px 40px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}
.company-wrap .company-menu .main-title {
	color:#58a82f;
	font-size:1.4rem;
	text-align: center;
	margin-bottom:30px;
}
.company-wrap .company-menu article {
	margin-bottom:30px;
}
.company-wrap .company-menu article a {
	border:solid 1px #dfff;
	display: block;
}
.company-wrap .company-menu article a:hover {
	border:solid 1px #58a82f;

}
.company-wrap .company-menu article h1 {
	background-color: #009cde;
	color:#fff;
	text-align: center;
	font-size:1.2rem;
	padding:10px 0;
}
.company-wrap .company-menu article a:hover h1 {
	background-color: #58a82f;
}
.company-wrap .company-menu h1:after {
	font-family: FontAwesome;
	content: '\f138';
	margin-left:15px;		
}
.company-wrap .company-menu article p {
	background-color: #fffac6;
	padding:10px;
}

@media screen and (min-width:768px) and ( max-width:991px) {
.company-wrap .company-main {
	padding-bottom:50px;
}
.company-wrap .company-main h2 {
	font-size:1.8em;
}	
.company-wrap .company-menu article h1 {
	font-size:1.0rem;
}
.company-wrap .voice-wrap .voice-txt {
	width:380px;
}
}
@media (max-width: 767px) {
.company-wrap .company-main h2 {
	font-size:1.0em;
}    
	.company-wrap .company-main {
	padding:15px 15px 60px 15px;
	}
	.company-wrap .company-main br {
		display: none;
	}
.company-wrap .company-menu {
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}
.company-wrap article {
    width: 100%;
	float:none;
}

.company-wrap .company-menu h2.main-title span {
	font-size:1.2rem;
	padding:8px 20px;
}
.company-wrap .voice-wrap img {
	float:none;
}
.company-wrap .voice-wrap .voice-txt {
	width:100%;
	margin-top:10px;
}
}
/* policy */
.company-policy {

}
.company-policy .history-wrap,
.company-policy .info-wrap{
	padding-bottom:20px;
	padding-top:60px;
	margin-bottom:60px;
	    border-bottom: dotted 2px #cccccc;
}
.company-policy .voice-wrap {
	padding-bottom:20px;
	padding-top:60px;
	margin-bottom:60px;
	    border-bottom: dotted 2px #cccccc;
}
.company-policy .voice-inner {
	padding:30px 80px;
	text-align: left;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
	background-color: #fff;
}
.company-policy .voice-wrap .voice-inner {
	overflow: hidden;
	margin-top:30px;
}

.company-policy .voice-wrap img.photo {
	float:left;
}
.company-policy .voice-wrap .voice-txt {
	width:650px;
	float:right;
	text-align: left;
}
.company-policy .voice-wrap .voice-more {
	font-size:1.1rem;
}
.company-policy .voice-wrap .voice-more p {
	margin-bottom:1.0rem;
	line-height: 1.6;
}
.company-policy .voice-wrap .voice-more p.name {
	text-align: right;
	margin-bottom:0;
}
.company-policy section {
	margin-bottom:50px;
}

.company-policy .kodawari-wrap {
	padding-top:60px;
	padding-bottom:20px;
	margin-bottom:60px;
	    border-bottom: dotted 2px #cccccc;
}
.company-policy .kodawari-wrap p {
	margin-bottom:1.0em;
	font-size:1.1rem;	
	line-height: 1.6;
	background-color:rgba(255,255,255,0.7);
	padding: .5em;
}
.company-policy .kodawari-wrap .txt-left {
	width:515px;
}
.company-policy .kodawari-wrap .txt-right {
	width:450px;
	margin-left:350px;
}
.company-policy .kodawari-wrap .kodawari-01 {
	position: relative;
}
.company-policy .kodawari-wrap .kodawari-01 img.photo {
	position: absolute;
	top:-80px;
	right:-150px;
	z-index: -1;
}
.company-policy .kodawari-wrap .kodawari-02 {
	position: relative;
	margin-top:60px;
}
.company-policy .kodawari-wrap .kodawari-02 img.photo {
	position: absolute;
	top:-80px;
	left:-180px;
	z-index: -1;
}
.company-policy .company-enkaku {
	padding:30px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
	background-color: #fff;	
}
.company-policy .company-enkaku dl {
	overflow: hidden;
}
.company-policy .company-enkaku dl dt {
	width:28%;
	float:left;
	clear: both;
	text-align: right;
	border-right:solid 5px #efefef;
	padding:10px 2% 10px 0;
}
.company-policy .company-enkaku dl dd {
	width:68%;
	float:left;
	padding:10px 0 10px 2%;
}
@media screen and (min-width:768px) and ( max-width:991px) {
.company-policy .voice-wrap img.photo {
	float:left;
	width:200px;
}
.company-policy .voice-wrap .voice-txt {
	width:450px;
}
.company-policy .kodawari-wrap .txt-left {
	width:450px;
}
.company-policy .kodawari-wrap .kodawari-01 img.photo {
	width:600px;
	top:-10px;
	right:-120px;
}
.company-policy .kodawari-wrap .txt-right {
	width:450px;
	margin-left:300px;
}
.company-policy .kodawari-wrap .kodawari-02 img.photo {
	width:500px;
	top:-80px;
	left:-150px;
	z-index: -1;
}
}
@media (max-width: 767px) {
	.company-policy .kodawari-wrap .kodawari-02 .ngo {
		text-align: center;
	}
	.company-policy .voice-wrap {
		padding-top:20px;
		background-color: #fff;
	}
	.company-policy .voice-inner {
		padding:10px;
		border-radius: 0px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
	}
	.company-policy .voice-wrap img.photo {
		float:none;
		margin-bottom:10px;
	}
	.company-policy .voice-inner {
		padding:30px 10px;
	}
	.company-policy .voice-inner .name img {
		width:200px;
		height:auto;
	}
.company-policy {
	padding-right:15px;
	padding-left:15px;
}
.company-policy .kodawari-wrap {
	padding-bottom:0px;
}
.company-policy .kodawari-wrap .txt-left {
	width:100%;
}
.company-policy .kodawari-wrap .kodawari-01 img.photo {
	display: none;
}
.company-policy .kodawari-wrap .txt-right {
	width:100%;
	margin-left:0px;
}
.company-policy .kodawari-wrap .kodawari-02 {
	margin-top:0px;
}
.company-policy .kodawari-wrap .kodawari-02 img.photo {
	position: relative;
	width:400px;
	top:0px;
	left:0px;
}
.company-policy .company-enkaku {
	padding:10px;
}
.company-policy .company-enkaku dl dt {
	width:100%;
	float:none;
	text-align: center;
	border-right:none;
	padding:10px 0;
	background-color: #efefef;
}
.company-policy .company-enkaku dl dd {
	width:100%;
	float:none;
	padding:10px 0;
}
}
/* info */
.company-info dl.info {
	overflow: hidden;
	background-color: #efefef;
	margin:40px 0 80px;
}
.company-info dl.info dt {
	float:left;
	width:20%;
	clear: both;
	text-align: center;
	padding-top:10px;
	padding-bottom:10px;
	border-top:solid 1px #fff;
}
.company-info dl.info dd {
	float:left;
	width:80%;
	padding:10px 0 10px 20px;
	background-color: #fff;
	border-top:dotted 1px #ccc;
}

.branch-wrap {
	padding-top:50px;
	padding-bottom:20px;
	margin-bottom: 60px;
	letter-spacing: -.4em; 
	border-bottom: dotted 2px #cccccc;
}
.branch-wrap h2 {
 	letter-spacing: normal;
}
.branch-wrap .branch-inner {
	background-color: #fff;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    box-shadow: 0 0 5px #ccc;
 	letter-spacing: normal;
}
.branch-wrap section {
	width:50%;
	display: inline-block;
	padding-right:15px;
	padding-left:15px;
	margin-bottom:40px;

	vertical-align: top;
}
.branch-wrap section h3 {
	background-color: #58a82f;
	text-align: center;
	color:#fff;
	font-size:1.4rem;
	line-height: 45px;
	letter-spacing: 0.2em;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;}
.branch-wrap section .branch-photo {
	overflow: hidden;
		padding: 15px;
}
.branch-wrap section img.photo {
	margin-bottom:15px;
}
.branch-wrap section a.gmap {
	background-color:#FFCC00;
	display: inline-block;
	padding:1px 5px;
	margin-left:5px;
	font-size:0.8rem;
}
.branch-wrap section a.gmap:hover {
	background-color: #efefef;
}
.branch-wrap section a.gmap:after {
font-family: FontAwesome;
    content: '\f08e';
    margin-left: 8px;
}
.branch-wrap section div.map {
	padding:0 15px 15px 15px;
}
.branch-wrap section .photo {
	float:left;
	margin-right:10px;
}
@media (max-width: 767px) {

.company-info dl.info dt {
	float:none;
	width:100%;
}
.company-info dl.info dd {
	float:none;
	width:100%;
	padding:10px;
}	
.branch-wrap section {
	width:100%;
	float:none;
}
.branch-wrap {
	padding:30px 15px;
}
}
/* service */
.company-service {
	margin:40px auto 80px;	
}
.company-service .service-wrap {
	padding:30px;
	overflow: hidden;
}
.company-service .service-wrap .container {
	background-color: #fff;
	padding:30px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}
.company-service .service-milk {
	background-color: #deecfe;	
	margin-top:40px;
}
.company-service .service-water .water-reason {
	background-color: #fffac6;
	padding:15px;
	margin-top:40px;
}
.company-service .service-water .water-reason ul {
	margin-top:20px;
}
.company-service .service-water .water-reason li {
	background-color: #fff;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
	margin-top:5px;
	overflow: hidden;
}

.company-service .service-water .water-reason li span {
	background-color: #ccc;
	display: block;
	float:left;
	width:30%;
	line-height:90px;
	background-color: #58a82f;
	text-align: center;
	color:#fff;
}
.company-service .service-water .water-reason li p {
	float:right;
	width:67%;
	margin-left:3%;
	margin-top:5px;
}
.company-service .service-water .water-reason h4 {
	margin-top:-30px;
	background-color: #009cde;
	text-align: center;
	color:#fff;
	padding:10px 0;
}
.company-service .service-vending {

}
.company-service .service-wholesaler {
	background-color: #deecfe;	
}

.company-service .service-inner h3 {
	color:#009cde;
	font-size:1.4rem;
	margin-bottom:15px;
}
.company-service .service-inner .service-main {
	font-weight:bold;
	margin-bottom:15px;
}
.company-service .service-inner .more-btn {
	text-align: left;
	margin-bottom:5px;
}


@media (min-width: 992px) {
.company-service .service-inner {
	float:left;
	width:500px;
}
.company-service .service-photo {
	float:right;
	width:400px;
}
}
@media (max-width: 991px) {
.company-service .service-photo {
	text-align: center;
	margin-top:15px;
}
}
@media (max-width: 767px) {
.company-service .service-wrap {
	padding:15px;
}
.company-service .service-wrap .container {
	padding:15px;
}
.company-service .service-water .water-reason li span {
	float:none;
	width:100%;
	line-height:30px;
}
.company-service .service-water .water-reason li p {
	float:none;
	width:100%;
	margin-left:0;
	padding:10px;
}
}
/* media */

.media-wrap {
	margin:40px auto 80px;	
	padding-bottom:40px;
	 border-bottom: dotted 2px #cccccc;
}
.media-wrap .latest-cm {
	background-color: #000;
	text-align: center;
	margin-top:40px;
	padding-top:40px; 
	padding-bottom:40px; 
	background-image:url("../images/company/cm_bg.png");
	background-repeat: no-repeat;
	background-position: center;
}
.media-wrap .youtube {
	width:50%;
	float:left;
	padding-right:15px;
	padding-left:15px;
	margin-top:40px;
}
.media-wrap .youtube iframe{
  width: 100%;
}
@media (max-width: 767px) {
.media-wrap .latest-cm iframe{
  width: 100%;
}
.media-wrap .youtube {
	width:100%;
	float:none;
}	
}

/* recruit */

.recruit-main h2 {
	color:#58a82f;
	font-family: "じゅん 501";
	text-align: center;
	font-size:1.8rem;
}
.recruit-main p {
	margin-top:20px;
	text-align: center;	
}
.recruit-main .row {
	margin-right:-5px;
	margin-left:-5px;
}
.recruit-main ul {
	overflow: hidden;
	margin-top:30px;
}
.recruit-main li {
	float:left;
	width:25%;
	padding-right:5px;
	padding-left:5px;
}
.recruit-info {
	background-color: #deecfe;
	margin-top:60px;
	margin-bottom:60px;
	padding-top:40px;
	padding-bottom:60px;
}
.recruit-info h2 {
	text-align: center;
	font-size:1.4rem;
	color:#009cde;
	margin-bottom:20px;
}
.recruit-info dl {
	background-color: #efefef;
}
.recruit-info dl dt {
	float:left;
	width:20%;
	clear: both;
	text-align: center;
	padding-top:10px;
	padding-bottom:10px;
	border-top:solid 1px #fff;
}
.recruit-info dl dd {
	float:left;
	width:80%;
	padding:10px 0 10px 20px;
	background-color: #fff;
	border-top:dotted 1px #ccc;
}
.recruit-info dl .pr {
	color:#66cc33;
}
.recruit-title {
    margin-top:24px;
}
@media (max-width: 767px) {
.recruit-main h2 {
	font-size:1.2rem;
	text-align: left;
}
.recruit-main p {
	margin-top:20px;
	text-align: left;
}
.recruit-main li {
	width:50%;
}
.recruit-info {
	background-color:transparent;
	margin-bottom:20px;
	padding-top:0px;
	padding-bottom:0px;
}
    .recruit-info h2 {
        background-color: #deecfe;
    }
.recruit-info dl dt {
	float:none;
	width:100%;
}
.recruit-info dl dd {
	float:none;
	width:100%;
	padding:10px;
}	
}
/* staff */
.company-staff {
	padding-top:40px;
	padding-bottom:80px;
	background-color: #E9F5FB;
}
.company-staff .staff-wrap {
	overflow: hidden;
	background-color: #fff;
	margin-top:40px;
}
.company-staff .staff-wrap .photo-left {
	float:left;
	width:500px;
	margin-right:20px;
}
.company-staff .staff-wrap .photo-right {
	float:right;
	width:500px;
	margin-left:20px;
}
.company-staff .staff-wrap .staff-voice {
	margin:20px;
}
.company-staff .staff-wrap .staff-voice h3 {
	font-weight: bold;
	font-size:1.2rem;
}
.company-staff .staff-wrap .staff-voice .name {
	font-weight: bold;
	margin-bottom:15px;
}
@media screen and (min-width:768px) and ( max-width:991px) {
.company-staff .staff-wrap .photo-left,
	.company-staff .staff-wrap .photo-right{
	width:50%;
}

}
@media (max-width: 767px) {
.company-staff .staff-wrap .photo-left,
.company-staff .staff-wrap .photo-right {
	width:100%;
	float:none;
}
	
}

/* customer */
.customer-wrap {

	padding-top:60px;
	padding-bottom:80px;
	
}
.customer-wrap .customer-main {
	text-align: center;
}
.customer-wrap .customer-main h1 {
	margin-bottom:30px;}
.customer-wrap .customer-inner {
	background-color: #fff;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
	margin:40px 0;
	padding:30px;
	border:solid 8px #edcdcd;
	overflow: hidden;
	background-image: url("../images/company/customer-bg.jpg");
	background-position: bottom;
	background-size:contain;
	background-repeat: no-repeat;
}
.customer-wrap .customer-inner .txt {
	width:610px;
	float:left;
}
.customer-wrap .customer-inner .txt ul.example {
	background-color: #fffac6;
	padding:10px;
	margin:20px 0;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
	font-size:1.2rem;
}
.customer-wrap .customer-inner .txt ul.example li:before {
	font-family: FontAwesome;
    content: '\f046';
    margin-right: 8px;
}
.customer-wrap .customer-inner .photo {
	width:300px;
	float:right;
	text-align: center;
}
.customer-wrap .customer-inner .photo .name {
	background-color: #66cc33;
	color:#fff;
	padding-top:5px;
	padding-bottom:5px;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
} 
.customer-wrap .customer-inner .name span {
	display: block;
	
}
.customer-wrap .customer-inner .form dd span {
	font-size:14px;
}
@media (max-width: 991px) {
	.customer-wrap .customer-inner .txt {
	width:100%;
	float:none;
}
.customer-wrap .customer-inner .photo {
	width:100%;
	float:none;
}
}
@media (max-width: 767px) {
.customer-wrap .customer-main {
	padding-right:15px;
	padding-left:15px;
	text-align: left;
}	
.customer-wrap .customer-inner {
	padding:15px;
	border:none;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}

}