@charset "utf-8";
/*   
Theme Name: tenichi
Theme URI: http://www.ten1.co.jp/
Description: 使用済みペットボトルを回収しリサイクル致します。ペットボトルのラベルキャップ取り除き、圧縮、国内メーカーへの販売新しく製品として生まれ変わります。
Author: liveknott
*/

/* 共通
------------------------------------------------------------*/

img{
	max-width: 100%;
	height: auto;
}

section{
	clear:both;
	padding-top: 40px;
	background:#fff;
}


.inner{
	width: 1000px;
	margin: 0 auto;

}

.innerS{
	width: 1000px;
	margin: 0 auto;
	padding-bottom: 80px;
	background: #fff;
}
.color_b { color: #004284;}


/* COLMN
------------------------------------------------------------*/


/* COL3
-------------*/
.col3 img{
	display: block;
	margin: 0 auto 5px;
}

.col3 li{
	line-height: 2.0;
}

.col3 .img{
	padding: 80px 50px;
	margin-bottom: 40px;
	line-height: 0 !important;
	background: #f6f6f6;
}


/* COL3
-------------*/
.col4 img{
	display: block;
	margin: 0 auto 5px;
}

.col4 li{
	line-height: 2.0;
}

.col4 .img{
	line-height: 0 !important;
	background: #f6f6f6;
}
.col4 p {margin-bottom: 30px;}



/* PALL
------------------------------------------------------------*/

#pall{
	background: url(images/main3.jpg) no-repeat 100% 100% fixed;
	background-size: cover;
	-webkit-background-size: cover;
	text-align: center;
	padding: 220px 20px;
}

#pall img{
	width: auto;
}


/* SEC05
------------------------------------------------------------*/
#sec05 p{
	margin-bottom: 5px;
}

.col2 li{
	display: inline-block;
	width: 100%;
	margin: 20px 0;
}




/* RESPONSIVE 設定
------------------------------------------------------------*/

@media only screen and (min-width: 1200px){
	.inner{
		width: 1024px;
	}
}

@media only screen and (min-width: 800px){
	body{
		font-size:14px;
	}
	
	.panel{
		display:block !important;
	}
	
	
	/* SEC03
	-----------------*/
	.col3{
		text-align: center;
	}

	.col3 li{
		display: inline-block;
		width: 28%;
		
		margin-bottom: 0;
		vertical-align: top;
		text-align: left;
	}
	
	
	.col4 li{
		display: inline-block;
		width: 24%;
		padding: 0 2px 50px;
		margin-bottom: 0;
		vertical-align: top;
		text-align: left;
	}
	
  #footer{
		padding: 30px 10px 70px 0;
	}
}

/*-----画面の横幅が641px以上-----*/
@media only screen and (min-width: 641px){
	.col2 li{
		width: 60%;
		vertical-align: top;
	}
	.col2 li:first-child{
		width: 35%;
		padding-right: 4%;
	}
	
	.col4 li{
		display: inline-block;
		width: 48%;
		padding: 0 5px 50px;
		margin-bottom: 0;
		vertical-align: top;
		text-align: left;
	}
	
}
/*-----画面の横幅が640pxまで-----*/
@media only screen and (max-width: 640px){
	.innerS{
		width: 94%;
		padding-bottom: 70px;
	}
	.col3 li{
		line-height: 1.7;
	}
	.col3 img{
		margin: 0 auto;
	}
	.col3 .img{
		padding: 30px;
		margin-bottom: 20px;
	}
	
	
	#gallery li{
		float: none;
		width: 100%;
	}
	#sec04_02{
		padding: 50px 20px;
	}
}

/*-----画面の横幅が799pxまで-----*/
@media only screen and (max-width: 799px){
	.panel{
		width: 100%;
		display: none;
		overflow: hidden;
		position: relative;
		left: 0;
		top: 0;
		z-index: 100;
	}
	.col3 li{
		margin: 50px auto 0 auto;
		display: block;
	}
	section{
		padding-top: 50px;
	}


	
}


/*-----画面の横幅が600px以上-----*/
@media screen and (min-width : 600px) {
  i.fa.fa-caret-right {
    font-size: 14px;
    display: inline-block;
  }
}

/*-----add-----*/
a { color: #0059B2;}

h1 span {font-size:14px; font-weight: normal; display: block;}
section h3 { font-size:1.6em; padding-bottom: 15px; position: relative; border-bottom: 2px solid #ccc; display: block;
margin: 0 0 40px 0;
}
section h3:after { content: "."; line-height: 0; display: block; overflow: hidden; position: absolute; 
bottom: -2px; width: 30%; border-bottom: 2px solid #4273A4; }
section h4
{
  font-size: 1.4em;
  border-left: 2px solid #004284;
  line-height:2;
  padding: 0 0 0 20px; 
  margin: 0 0 30px;
}

#banner2 {
	background: #fff;
	color: #000;
	font-size: 100%;
	padding: 30px 0;
	border-bottom: 1px solid #004284;
	
}
#banner2 h2 {
	width: 1000px;
	border-left: 3px solid #004284;
	padding: 10px 20px;
	margin: 0 auto;
}
#banner2 h2 span { }

.h10 { height:10px;}
.h20 { height:20px;}
.h30 { height:30px;}
.h40 { height:40px;}
.h60 { height:60px;}
.mb30 { margin-bottom: 30px;}
.pb30 { padding-bottom: 30px;}
.fs15 { font-size: 15px;}
.fs20 { font-size: 20px;}
.fs20b { font-size: 20px; font-weight: bold;}
.fs25 { font-size: 25px; line-height:1.7em;}

.btn a {
	background: #077AAB;
	color: #fff;
	text-decoration: none;
	width: 40%;
	display: block;
	padding: 20px 0;
	border: 4px solid #077AAB;
	font-size: 23px;
}
.btn a:hover {
	border: 4px solid #077AAB;
	color: #077AAB;
	background: #fff;
}

.btn a span:after {
content:"";
width: 12px;
height: 12px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
display: inline-block;
margin: 0 0 0 30px;
}
.btn a:hover span:after {
content:"";
width: 12px;
height: 12px;
border-top: 2px solid #077AAB;
border-right: 2px solid #077AAB;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
display: inline-block;
}



.column2 { display:table; padding:0;}
.column2 section{ display:table-cell; vertical-align:top; padding:0 40px 0 0 !important;}
.taC { text-align:center;}
.taR  { text-align:right;}
.waku { border:2px solid #ccc; padding:20px 30px; margin: 0 0 60px;}
.waku p { margin:0;}

.map { text-align:center;}
.ttl { font-weight: bold; margin: 0 0 10px 0; color:#004284;}

textarea { width: 80%; padding:10px;}
input[type="text"],input[type="email"] {width: 60%; padding:10px;}
input[type="submit"] {width: 40%; background: #004284; border-style: none; 
text-align:center; padding:15px 0; font-size:120%; color:#fff;
}

.row>* { padding:0;}




.flow2 section {
	width: 30%;
	display: inline-block;
	vertical-align: top;
	margin: 0 0 30px 0;
}
.flow2 section:nth-child(2) {
	margin: 0 20px !important;
}

.day { font-size:60%; display: block; padding: 0 0 8px 0; color:#666;}



/*-------table1---------*/
.table1 {
	width: 100%;
}
.table1 section { width: 100%; margin: 0 auto;}
.table1 dl {
		width: 100%;
		border-bottom: 1px solid #DDDDDD;
		display:table;
		margin:0;
		padding: 0 !important;	
}
.table1 dl:first-child {
	border-top: 1px solid #DDDDDD;
}
.table1 dt, .table1 dd {display:table-cell; vertical-align: top;}
.table1 dt {width: 20%;  background: #f0f0f0; padding:10px 20px;}
.table1 dd {width: 60%; background: #f9f9f9; padding:10px 20px;}


/*-------table2---------*/
.table2 {
	width: 100%;
}
.table2 section { width: 100%; margin: 0 auto;}
.table2 dl {
		width: 100%;
		border-bottom: 1px solid #DDDDDD;
		display:table;
		margin:0;
		padding: 0 !important;	
}
.table2 dl:first-child {
	border-top: 1px solid #DDDDDD;
}
.table2 dt, .table2 dd {display:table-cell; vertical-align: middle;}
.table2 dt {width: 20%;  background: #f0f0f0; padding:10px 20px;}
.table2 dd {width: 60%; background: #f9f9f9; padding:10px 20px;}
.radio li { display:inline;}
.border { border:1px solid #ddd;}

.mv { background:url(images/bg_main.jpg) repeat-x left top;}

h2{font-size: 25px !important;
margin: 0 0 40px 0;
}

	.box_info dl {
		width: 100%;
		padding: 20px 0;
		border-bottom: 1px solid #DDDDDD;
		display:table;
	}
	.box_info dt, .box_info dd {
		display:table-cell;
	}
	.box_info dt {	width: 20%;}
	.box_info dd {	width: 80%;}
	.box_info h2 { letter-spacing:0.1em; margin:30px 0;}
	.box_info h2 span { font-size:50%; padding: 0 0 0 10px;}

	.footer
	{
		position: relative;
		background: #077AAB;
		color: #fff;
		padding: 20px 0 0 0;
		margin: 120px 0 0 0;
	}
	.footer ul { margin: 0 0 30px 0;}
	.footer li{ display: inline-block; vertical-align: top; padding: 0 30px 0 0;}
	.footer a{ color:#fff;}
	.copy { text-align:center; padding: 10px;}



/*Pagenation*/
.pagination {
	clear: both;
	padding: 20px 0;
	position: relative;
	font-size: 14px;
	line-height: 14px;
    text-align: center;
}
.pagination-box {
	display: inline-block;
}
.pagination span, .pagination a {
	display: block;
	float: left;
	margin: 2px 2px 2px 0;
	padding: 10px 15px 10px 15px;
	text-decoration: none;
	width: auto;
	color: #fff; /* 文字色 */
	background: #ccc; /* 背景色 */
}
.pagination a:hover{
	color: #333; /* マウスホバー時の文字色 */
	background: #fff; /* マウスホバー時の背景色 */
}
.pagination .current{
	padding: 10px 15px 10px 15px;
	background: #fff; /* 現在のページの文字色 */
	color: #333; /* 現在のページの背景色 */
}
@media only screen and (max-width: 413px) {
.pagination {
	font-size: 12px;
	line-height: 12px;
}
.pagination span, .pagination a {
	padding: 8px 10px 8px 10px;
}
.pagination .current{
	padding: 8px 10px 8px 10px;
}
}



/*-----画面の横幅が799pxまで-----*/
@media only screen and (max-width: 799px){
#banner2 { padding: 20px 0;}
#banner2 .inner { margin: 0; padding: 0;}
h2 { width: 100%; font-size: 1.4em;}
section h3 {
	line-height: 1.7em;
	font-size: 1.2em;
	margin: 0 0 30px 0;
}
.flow2 section {
	width: 100%;
	display: block;
	vertical-align: top;
	margin: 0 0 30px 0 !important;
}
.flow2 section:nth-child(2) {
	margin: 0 0 !important;
}
.flow2 p {margin: 0 0 30px 0 !important;}

.column2 section{ width: 100%; display:block;}

.content { background: #fff; padding: 100px 0 0 0;}
.h60 { height: 40px;}
	
	.mv { padding: 0;}
	.inner { width: 90%; padding: 0 1em; margin: 0 auto;}
	.content img { width: 100%; height: auto;}
	.btn a { width:90%;}
	
	.box_info dl {
}	
.box_info dt, .box_info dd {
	display:block;
	width: 100%;
}
.box_info h2 { margin:0;}


.flow .image {
	width: 100%;
	height: auto;
}
.btn { margin: 0 0 60px 0;}
.btn a{ width: 90%;}
.btn a span:after {
content:"";
width: 12px;
height: 12px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
display: inline-block;
margin: 0 0 0 30px;
}
.btn a:hover span:after {
content:"";
width: 12px;
height: 12px;
border-top: 2px solid #077AAB;
border-right: 2px solid #077AAB;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
display: inline-block;
}


/*-------table1---------*/
.table1 dl{	width: 100%; display: block;}
.table1 dt{width: 90%; display: block; margin:0 auto;}
.table1 dd{width: 90%; display: block; margin:0 auto; word-wrap: break-word;}

/*-------table2---------*/
.table2 {
	width: 100%;
}
.table2 section { width: 100%; margin: 0 auto;}
.table2 dl {
		width: 100%;
		border-bottom: 1px solid #DDDDDD;
		display:table;
		margin:0;
		padding: 0 !important;	
}
.table2 dl:first-child {
	border-top: 1px solid #DDDDDD;
}
.table2 dt, .table2 dd {display:block; vertical-align: middle;}
.table2 dt {width: 88%;  background: #f0f0f0; padding:10px 20px;}
.table2 dd {width: 100%; background: #fff; padding:20px 5px;}
input[type="text"], input[type="email"], textarea { width: 90%; border: 1px solid #ccc;}
input[type="submit"] {width: 100%;}

.mwform-radio-field { display:block; line-height:2em;}
.mwform-radio-field input { margin: 0 10px 0 0;}
.horizontal-item { margin-left:0 !important;}
	
}