/* CSS Document */
#ptop{
	margin-top:-70px;
	padding-top:70px;
	display:block;
}

/* PC/SP/TB共通 セレクタ */
#ymd dd img{
	display:block;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	margin-bottom:50px;
}
#upage-box table{
	width:100%;
	text-align:left;
	border-top:1px solid #CCCCCC;
	border-left:1px solid #CCCCCC;
	margin-bottom:80px;
}
#upage-box table th{
	width:30%;
	vertical-align:middle;
	background:#EEEEEE;
}
#upage-box table td{
	background:#FFF;
}
#upage-box table th,
#upage-box table td{
	box-sizing:border-box;
	padding:15px;
	border-bottom:1px solid #CCCCCC;
	border-right:1px solid #CCCCCC;
}
#upage-box table td a{
	color:#333333;
	text-decoration:underline;
}
#upage-box table td a:hover{
	color:#4087BB;
}

#company-info th span{
	color:#4087BB;
	position:relative;
	top:5px;
	float:right !important;
}


#guide-t{
	margin-bottom:40px;
}

#upage-box table td dt,
#upage-box table td dd{
	margin-bottom:30px;
}
#upage-box table td dt{
	float:left;
	margin-right:20px;
}
#upage-box table td dd{
	overflow:auto;
}

/* */
.sp #upage-box table th,
.sp #upage-box table td{
	width:100%;
	display:block;
}
.tb #upage-box table td dt,
.tb #upage-box table td dt span,
.tb #upage-box table td dd,
.sp #upage-box table td dt,
.sp #upage-box table td dt span,
.sp #upage-box table td dd{
	width:100%;
	display:block;
}
.tb #upage-box table td dt,
.tb #upage-box table td dd,
.sp #upage-box table td dt,
.sp #upage-box table td dd{
	margin-bottom:0 !important;
}
.tb #upage-box table td dd:nth-of-type(1),
.sp #upage-box table td dd:nth-of-type(1){
	margin-bottom:30px !important;
}


/* フォーム inputの指定 */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder{
	font-size:14px;
}
input:-moz-placeholder,
textarea:-moz-placeholder{
	font-size:14px;
}

.pc input[type="text"],
.pc input[type="number"],
.pc input[type="tel"],
.pc input[type="email"],
.pc input[type="url"],
.pc select,
.pc input[name="郵便番号"],
.pc select[name="都道府県"],
.pc input[name="電話番号"],
.pc input[name="電話番号1"],
.pc input[name="携帯電話番号"],
.tb input[type="text"],
.tb input[type="number"],
.tb input[type="tel"],
.tb input[type="email"],
.tb input[type="url"],
.tb select{
	width:148px;
}
.pc input[name="メールアドレス"],
.pc input[name="メールアドレス1"],
.pc input[name="メールアドレス確認"],
.pc input[name="メールアドレス確認1"],
.tb input[name="メールアドレス"],
.tb input[name="メールアドレス1"],
.tb input[name="メールアドレス確認"],
.tb input[name="メールアドレス確認1"]{
	width:235px;
}



.pc input[name="市区町村"],
.pc input[name="丁目番地"],
.pc input[name="マンション・アパート名"],
.tb input[name="市区町村"],
.tb input[name="丁目番地"],
.tb input[name="マンション・アパート名"]{
	width:235px;
}

.sp input[type="text"],
.sp input[type="number"],
.sp input[type="tel"],
.sp input[type="email"],
.sp input[type="url"],
.sp input[name="電話番号"],
.sp select{
	width:100%;
	margin-bottom:10px;
}
.pc textarea,
.tb textarea{
	width:300px;
	height:80px;
}
.sp textarea{
	width:100%;
}


/* PC/SP/TB共通 ヘッダーレイアウト */

/* メイン画像 */
.hero-image{
   width: 100%;
   margin: 0 auto;
}



#top{
	background:url(../images/common/bg_main.jpg) no-repeat top center;
	background-size:cover;
	height:100vh;
}
.hero-image p{
   color:#FFF;
}
.hero-image p,
.maincacth p{
   line-height:1.4;
   text-align:center;
}
.hero-image p,
.hero-image p > span{
   font-family: "FP-HiraMinProN-W3";
}
.maincacth p,
.maincacth p > span{
   font-family: "FP-HiraMinProN-W3";
}

.pc .hero-image p{
   position:relative;
   top:400px;
}

@media screen and (orientation: portrait){
.tb .hero-image p{
   position:relative;
   top:400px;
}
.sp .hero-image p{
   position:relative;
   top:400px;
}
}
@media screen and (orientation: landscape){
.tb .hero-image p{
   position:relative;
   top:300px;
}
.sp .hero-image p{
   position:relative;
   top:300px;
}
}
.hero-image p > span,
.maincacth p > span{
	display:block;
}


/*  area map */
#areamap{
	width:100%;
}
#areamap div{
	line-height:1.4;
	float:left;
}
#areamap div p{
	margin-bottom:10px;
}

.pc #areamap iframe{
	width:100vw;
	height:368px;
}

@media screen and (orientation: portrait) {
.sp .hero-image p{
	top:200px;
}

/* TB用地図 */

.tb #areamap iframe{
	width:100vw;
	height:394px;
}

/* SP用地図 */
.sp #areamap iframe{
	width:315px;
	height:177px;
}
.sp #areamap div:nth-of-type(1){
	margin-bottom:50px;
}

}
@media screen and (orientation: landscape) {
.sp .hero-image p{
	position:absolute;
	top:100px;
}

/* TB用地図 */
.tb #areamap iframe{
	width:100vw;
	height:394px;
}

/* SP用地図 */
.sp #areamap iframe{
	width:375px;
	height:211px;
}
}


/* 下層ページ帯 */
#main-line{
	color:#FFF;
	box-sizing:border-box;
	background:#4087BB;
	border-bottom:2px solid #E6E6E6;
}
#main-line2{
	box-sizing:border-box;
	border-bottom:7px solid #4087BB;
}
.env{
	background:url(../environmentalrecycling-business/images/bg_environmental.png) no-repeat;
	background-size: cover;
	width:auto;
	height:480px;
}
.con{
	background:url(../construction-business/images/bg_construction.png) no-repeat;
	background-size: cover;
	width:auto;
	height:480px;
}
.pc #main-line{
	margin-top:70px;
	padding:69px;
	margin-bottom:80px;
}
.pc #main-line2{
	margin-top:70px;
}


.tb #main-line{
	margin-top:70px;
	padding:40px 20px;
	margin-bottom:40px;
}

.sp #main-line{
	margin-top:50px;
	padding:20px;
	margin-bottom:40px;
}

#main-line h1{
	width:100%;
	max-width:950px;
	margin-left:auto;
	margin-right:auto;	
	color:#FFFFFF;
}

.sp #main-line h1,
.tb #main-line h1{
	text-align:center;
}

#top-pagename{
	font-size:5rem; font-size:50px;
	text-align:center;
	line-height:1.4;
	margin-bottom:30px;
}
#top-pagename span{
	font-size:4rem; font-size:40px;
	color:#3F85B9;
	display:block;
}
#top-pagename+p{
	font-size:1.8rem; font-size:18px;
	letter-spacing:2px;
	line-height:1.5;
}

#upage-box h2{
	border-top:1px solid #CCCCCC;
	border-bottom:1px solid #CCCCCC;
	margin-bottom:50px;
}
.pc #upage-box h2,
.tb #upage-box h2{
	padding:20px;
}
.sp #upage-box h2{
	padding:10px;
}


/* PC/SP/TB共通 フッターレイアウト  */
footer{
	border-top:1px solid #E6E6E6;
	background:#FAFAFA;
}

footer #footer-bg {
	background:url(../images/common/bg_footer.png) bottom repeat-x;
}
.pc footer #info .footer-logo img{
	width:130px;
	height:50px;
}

footer .copyright{
   width:100%;
   text-align:center;
   border-top:1px solid #FFF;
   background:#4087BB;
   margin: 0;
   clear: both;
}
footer .copyright #copy{
	position:relative;
	top:3px;
	display:inline-block;
}
footer .copyright,
footer .copyright a{
	color:#FFF;
}
footer .copyright a{
	text-decoration:underline;
}


@media only screen and (min-width: 1025px) {

/*　PC 横  */
.pc footer #info{
	max-width:700px;
	margin-left:auto;
	margin-right:auto;
	padding:30px 0;
	box-sizing:border-box;
}
.pc #footer-bg .row{
	min-height:150px;
}
.pc footer #info .footer-logo{
	float:left;
	margin-left:40px;
	margin-right:40px;
}
.pc footer #info dl{
	overflow:auto;
}
.pc footer #info dt span{

	display:inline-block;
}
.pc footer #info dd{

}


}
@media only screen and (max-width: 1024px) {

.design p{
	margin-bottom:30px;
}
.pc footer #info{
	padding:15px 0;
	text-align:center;
	box-sizing:border-box;
}

.pc footer #info dl{
	font-size:90%;
	box-sizing:border-box;
	padding-left:15px;
	padding-right:15px;
}

.pc footer #info dd:nth-of-type(1){
	margin-bottom:15px;
}


.pc footer #info dt span{
	display:block;
	font-weight:bold;
}


}
@media only screen and (max-width: 768px) {
.wbox p{
	padding:10px 20px;
}
}

/*　TB/SP　縦横  */
@media screen and (orientation: portrait) {

.tb #features .design div{
	width:100%;
}
.tb #features .design div img{
	display:block;
	text-align:center;
	margin-left:auto;
	margin-right:auto;	
}
.tb footer #info,
.sp footer #info{
	padding:15px 0;
	box-sizing:border-box;
}
.sp footer #info .footer-logo img,
.tb footer #info .footer-logo img{
	width:130px;
	height:50px;
}

.tb footer #info dl,
.sp footer #info dl{
	font-size:90%;
	box-sizing:border-box;
	padding-left:15px;
	padding-right:15px;
}
.tb footer #info dd:nth-of-type(1),
.sp footer #info dd:nth-of-type(1){
	margin-bottom:15px;
}

.tb footer #info dt span,
.sp footer #info dt span{
	display:block;
	font-weight:bold;
}

}
@media screen and (orientation: landscape) {

.tb  footer #info{
	margin-left:auto;
	margin-right:auto;
	padding:30px 0;
	box-sizing:border-box;
}
.tb  footer #info .footer-logo{
	float:left;
	margin-left:80px;
	margin-right:60px;
}
.tb  footer #info dl{
	overflow:auto;
}

.sp footer #info{
	padding:15px 0;
	box-sizing:border-box;
}
.sp footer #info dl{
	font-size:90%;
	box-sizing:border-box;
	padding-left:15px;
	padding-right:15px;
}
.sp footer #info dd:nth-of-type(1){
	margin-bottom:15px;
}
.sp footer #info dt span{
	display:block;
	font-weight:bold;
}

.sp footer #info .footer-logo img,
.tb footer #info .footer-logo img{
	width:130px;
	height:50px;
}

}


/* ------------------------------------------------------------------ */
/* 	各ページ固有要素
/* ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ */
/* Features Section
/* ------------------------------------------------------------------ */

/* */

#features {
	border-bottom:1px solid #E6E6E6;
}
@media only screen and (min-width: 1025px) {
.pc .features-3box,
.tb .features-3box{
	display: flex;
	justify-content:center;
	margin-bottom:30px;
}
.pc .features-3box div,
.tb .features-3box div{
	width:calc(100% / 3);
	background:#FFF;
	padding:10px 10px 15px;
	border:1px solid #4087BB;
	box-shadow: 0 0 0 0 #4087BB,0 0 0 5px #ABDD8C;
	margin-right:30px;
}
}
@media only screen and (max-width: 1024px) {
.features-3box div{
	background:#FFF;
	box-sizing:border-box;
	border:1px solid #4087BB;
	box-shadow: 0 0 0 0 #4087BB,0 0 0 5px #ABDD8C;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:30px;
}
.pc .features-3box div,
.tb .features-3box div{
	width:100%;
	padding:20px;
	min-height:100px;
}
.sp .features-3box div{
	width:90%;
	padding:10px 10px 15px;
	min-height:190px;
}
}

.bg-t div:nth-child(1){ background:url(../images/top/bg_features01.png) no-repeat right 10px bottom 15px; }
.bg-t div:nth-child(2){	background:url(../images/top/bg_features02.png) no-repeat right 10px bottom 15px; }
.bg-t div:nth-child(3){	background:url(../images/top/bg_features03.png) no-repeat right 10px bottom 15px; }
.bg-b div:nth-child(1){ background:url(../images/top/bg_features04.png) no-repeat right 10px bottom 15px; }
.bg-b div:nth-child(2){ background:url(../images/top/bg_features05.png) no-repeat right 10px bottom 15px; }
.bg-b div:nth-child(3){ background:url(../images/top/bg_features06.png) no-repeat right 10px bottom 15px; }

.features-3box div h3{
	font-weight:bold;
	text-align:center;
	color:#5A9F30;
	margin-bottom:5px;
}
.features-3box div p{
	text-align:justify;
	line-height:1.6;
}
/*.pc #features h1,
.tb #features h1{
	color:#FF0000;
}
.sp #features h1{
	color:#FF0000;
	text-align:center;
}*/
#features h2{
	color:#333333;
}
#features p.features6-text{
	line-height:1.6;
}
#features p a{
	text-decoration:underline;
}

/* ------------------------------------------------------------------ */
/* business
/* ------------------------------------------------------------------ */


#business{
	border-bottom:1px solid #E6E6E6;
}
#business,
#business h1,
#business p{
	color:#FFFFFF;
}
#business h1{
	text-align:center;
}
#business h1 span{
	display:block;
}


.pc #business h1{
	margin-bottom:30px;
}
.sp #business h1{
	margin-bottom:15px;
}


@media only screen and (min-width: 1025px) {
.pc #business .wbox,
.tb #business .wbox{
	width:50%;
	background-size: cover;
	height:480px;
	text-align:center;
	box-sizing:border-box;
	padding:40px 0;
}

}
@media only screen and (max-width: 1024px) {
#business .wbox{
	width:100%;
	background-size: cover;
	text-align:center;
	box-sizing:border-box;
	padding:40px 0;
}
.pc #business .wbox{
	height:480px;
}
.tb #business .wbox{
	height:480px;
}
.sp #business .wbox{
	width:100%;
	height:480px;
	background-size: cover;
	text-align:center;
	box-sizing:border-box;
	padding:40px 0;
}
}

.w60,
.w90{
	height:15vw;
	text-align:left;
	margin-left:auto;
	margin-right:auto;	
}
.w60{ width:75%; }
.w90{ width:90%; }

.pc #business .wbox p,
.tb #business .wbox p{
	text-align:left;
	margin-bottom:30px;
}
.sp #business .wbox p{
	text-align:justify;
	padding:25px;
	box-sizing:border-box;
}

#business .left div,
#business .right div{
	width:90%;
	color:#FFFFFF;
	max-width:500px;
	letter-spacing:3px;
	height:100%;
	margin-left:auto;
	margin-right:auto;
}

/* ------------------------------------------------------------------ */
/* 
/* ------------------------------------------------------------------ */

.bg-scale-left,
.bg-scale-right{
    position: relative;
    overflow: hidden;
    text-align: center;
    padding: 60px 0;
}
.bg-scale-left:after,
.bg-scale-right:after{
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -ms-background-size: cover;
    background-size: cover;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    transition: all .3s ease-out;
}
.bg-scale-left:hover:after,
.bg-scale-right:hover:after{
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.bg-scale-left:after{ background:url(../images/common/wbox-l.jpg) no-repeat; }
.bg-scale-right:after{ 	background:url(../images/common/wbox-r.jpg) no-repeat; }

.tb .bg-scale-left:after{ background-size: cover; }
.tb .bg-scale-right:after{ background-size: cover; }


.bg-scale-left .inner,
.bg-scale-right .inner{
    z-index: 1;
    position: relative;
}

.bg-scale-left .inner ul,
.bg-scale-right .inner ul{
/*	height:25vh;*/
	position:relative;
}

@media screen and (orientation: portrait) {
.tb .bg-scale-left .more{
	position:absolute;
	left:175px;
	top:15vh;
}
}
@media screen and (orientation: landscape) {
.tb .bg-scale-left .more{
	position:absolute;
	left:175px;
	top:25vh;
}
.pc .bg-scale-right .more{
	position:absolute;
	left:175px;
	top:17vh;
}
}
/* ボタン */
#business .left a,
#business .right a{
	text-align:center;
	width:150px;
	margin-left:auto;
	margin-right:auto;
	display:block;
	padding:10px 0;
	color:#FFF;
	background:rgba(255,255,255,0);
	border:2px solid #FFFFFF;
}
#business .left a:hover,
#business .right a:hover{
	color:#4087BB;
	background:#FFFFFF;
}

/* ------------------------------------------------------------------ */
/* #news
/* ------------------------------------------------------------------ */

#news h1{
	color:#3F85B9;
	border-bottom:1px solid #4087BB;
	margin-bottom:20px;
}
#news h1 span{
	color:#CCCCCC;
}

.pc #news h1 span{
	margin-left:35px;
}
.sp #news h1{
	line-height:1.4;
	text-align:center;
}
.sp #news h1 span{
	display:block;
}

.pc #news ul li,
.tb #news ul li{
	line-height:2.0;
}
.sp #news ul li{
	line-height:1.4;
	margin-bottom:30px;
}
.sp #news ul{
	padding:15px;
}

#news ul li a:hover{
	text-decoration:underline;
}

.pc #news ul li span,
.tb #news ul li span{
	float:left;
	color:#3F86BA;
	display:inline-block;
	margin-right:60px;
}
.pc #news ul li p,
.tb #news ul li p{
	overflow:auto;
}
.sp #news ul li span{
	font-weight:bold;
	display:block;
	margin-bottom:10px;
}