@charset "UTF-8";
/* CSS Document */

/*******************************************************/
/* Common Styles
/*******************************************************/
html {
	font-family: "游明朝", "YuMincho", serif , "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 60%; color: #333333;}

* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}/*　パディングをサイズ内側にする処理　*/

img { display: block;max-width: 100%;height: auto;width /***/:auto;}
a { color: #fff; text-decoration: none;}
a:hover { color: #ffff00; }
a img:hover{opacity:0.5;}
a[href^="tel:tel:0522637500"] { cursor: default; }


/* トップに戻るボタン */
#gototop {  position: fixed; bottom: 25px; right:25px;}
#gototop a { display: block; z-index: 1; padding: 9px 0 0 0; border-radius: 30px; width: 35px; height: 35px; background-color: #9FD6D2; color: #fff; font-weight: bold; font-size: 14px; text-decoration: none; text-align: center; }
#gototop a:hover { text-decoration: none; opacity: 0.7; }

/*共通CSS*/
.main_box{ width:100%;}
.main_in { width:1024px; margin:auto;}

.pc_view { display: block;}
.sp_view { display: none; }
.clear{ clear:both;}
.tel_action{ display: inline;}

/*preset*/
.green{ color: #009245;}
.blue { color: #0071bc;}
.font_b{ font-size: 16px; font-weight: bold; line-height: 23px; margin-top: 10px; display: block;}
.font_m{ font-size: 24px; color: #fff; text-align: center; margin-top: 40px;}
.font_ll{ font-size: 46px; color: #fff; text-align: center; margin: 20px 0;}

.m10{ margin:10px;}
.m30{ margin:30px;}
.m50{ margin:50px;}
.m100{ margin:100px;}

.box80{ width:80%; height:auto; float:left;}
.box20{ width:20%; height:auto; float:left;}
.box60{ width:664px; height:auto; float:left;}
.box40{ width:360px; height:auto; float:left;}
.box50{ width:50%; height:auto; float:left;}
.box_center{ width:95%; margin:auto; text-align:center;}

h1{ font-size: 24px; font-weight: bold; text-align: center; width: 275px; margin: 20px auto 15px; color: #fff;}
h2{ width:100%;  font-size:28px; text-align:center; margin:100px 0 30px 0;　text-align: center; }
h3{ width:100%;  font-size:20px; text-align:center; margin:100px auto 30px;　text-align: center; }
.box60 h3{ width:100%;   font-size:20px; text-align:center; margin:10px auto 30px;　text-align: center; }
.two_box h2{ margin: 0;}

/*下層ページ共通CSS*/
.txt{width: 100%; height: auto; margin: auto; font-size:14px; line-height: 26px; display: block; }
.two_box{ margin: 40px auto; width: 1024px; height: 240px;}
.two_box p{font-size:14px; line-height: 26px; margin-left: 50px;}

.lr{ font-size: 14px; margin-right: 20px; line-height: 25px;  padding-right: 50px; display: block;}


.contact_table{ width:100%; height: 170px; background-color: #f2f2f2; }
.table_l{ width: 50%; height: 120px; border-right: solid 1px #b3b3b3; float: left; margin-top: 28px; padding-right: 4%;}
.table_l p{ font-size: 18px; text-align: center; padding: 0 0 10px 0;}
.table_tel{ width: 100%; height: 40px; font-size: 40px; padding: 1px 0 0 40px; text-align: left; display:inline-block; background: url("../image/table_tel.png") no-repeat; margin-left: 20%;}
.table_tel a:before { content:url("../image/table_tel.png") ;  margin-right:8px;}
.table_tel a{ color:#333;}
.table_r{ width: 50%; height: 120px;  float: left; display: flex; position:relative;}
.table_r li{ float: left; margin: 60px 0 0 10%; }
.time{ width: 435px; height: auto; background-color: #858585; margin: 10px auto 0; padding: 2%; text-align: center; color: #fff; font-size: 14px; /* 角丸テーブル */ border-radius: 10px 10px 10px 10px;}

/*パンくず*/
.topicpath { width: 600px; margin: auto; text-align: center; margin-bottom: 40px;}
.topicpath ol li { width: 200px; text-align: center; /* liを横並び＆ブレットを消す */	display: inline; list-style-type: none; font-size: 14px;}
.topicpath ol li:after { /* liの後に記号追加 */ content:" > "; }
.topicpath ol li:last-child:after {/* 最後のliだけcontentを消す */content: none;}
.topicpath a{ color: #0071bc; }


/*ヘッダーここから */
.nav{ width: 100%; height: 70px; background-color: rgba(0,113,188,0.8); position:relative; bottom: 0; margin-top: -70px; z-index:150;}
.nav_in li{ text-align: center; width: 20%; height: 70px; margin: auto; float:left; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size : 18px; color:#fff;}
.nav_in li:hover{ background-color: rgba(0,170,165,0.5); color: #ffff00; display: block;}
.nav_in a{display: block; padding:13% 0 13%; color:#fff;}

.top { width: 100%; height:100vh; min-height:600px;  position: absolute; top:0; z-index: 5; margin-bottom:-70px; display: flex; justify-content: center; align-items: center; }
.top_inner{  }
.top h1 { margin-top: -100px; }

@media only screen and (min-width:769px) and (max-width: 960px){
	.top { display: block; margin-top: 30px; }
}

.top .job{ width: 320px; height: 40px; text-align: center; color: #333; background-color: #fff; padding-top: 13px; margin: auto; font-size: 14px;}
.top .name{ font-size: 26px; text-align: center; width: 320px; margin: 25px auto 15px; color: #fff;}

.icon { width: 460px; height: 41px; margin: 20px auto 0;}
.icon img{ position: relative; left: 370px;}
.top_info { width: 460px; height: 160px; margin: auto;  background-color: rgba(255,255,255,0.8); padding-top: 15px;}
.top_info .info_ttl{ background: url(../image/icon_01.png) no-repeat left; width: 380px; height: 40px; margin: 0px 0 10px 65px; }
.top_info .info_ttl p{ font-size : 20px; padding: 13px 0 0 45px;}

.top_info .red { width: 450px; height: 25px; margin: 10px auto;  text-align: center;  color : #ED1C24; font-size: 18px;}
.top_info .tel { width: 450px; height: 40px; margin: 5px auto;  text-align: center; font-size: 18px;}
.tel span {font-size: 38px; font-weight: bold; margin-right: 10px;}

/*ボタンアニメーション*/
.btn-5 {
  box-shadow: inset 0 0 20px rgba(255, 255, 255, 0);
  outline: none;
  outline-color: rgba(255, 255, 255, .5);
  outline-offset: 0px;
  text-shadow: none;
  transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);} 
.btn-5:hover {
  box-shadow: inset 0 0 20px rgba(139,216,210, .8), 0 0 20px rgba(255, 255, 255, .2);
  outline-color: rgba(255, 255, 255, 0);
  outline-offset: 15px; text-shadow: 1px 1px 2px #427388; }

/*ヘッダーここまで */


/*下層ページヘッダー*/
.nav_underlayer{ width: 100%; height: 70px; background-color: rgba(0,113,188,0.8); margin-bottom: 80px;}
.underlayer_head{ width: 100%; height: 95px; margin-bottom: 7px;}
.logo{ width: 300px; float: left;}
.logo h1{ font-size: 26px; color: #333; margin-top: 10px;}
.head_contact{ width: 360px; margin-left: 700px; text-align: center;}

.underlayer_head .info_ttl{ background: url(../image/icon_01.png) no-repeat left; width: 290px; height: 30px; margin: 12px 0 0 9%;}
.underlayer_head .info_ttl p{ font-size : 18px; padding: 8px 0 0 13%;}
.underlayer_head  .red { width: 360px; height: 20px; margin: 10px 0 0 auto;  text-align: center;  color : #ED1C24; font-size: 1.4rem;}
.underlayer_head .tel { width: 360px; height: 25px; margin: 5px 0 0 auto;  text-align: center; font-size: 14px; display: block;}
.underlayer_head .tel span {font-size: 28px; font-weight: bold; margin-right: 10px;}
.underlayer_head  .tel a{color: #666;}

.underlayer_head .job{ width: 275px; height: 30px; text-align: center; color: #333; background-color: #f2f2f2; padding-top: 10px; margin: auto; font-size: 12px;}

.btn_box_wor{ width: 640px; margin: 40px auto 50px; display: grid;}
.btn_box_com{ width: 440px; margin: 40px auto 50px; display: grid;}

.btn_on { width: 200px; height: 40px; background-color: #009245; border: solid 1px #009245; float: left;}
.btn_on p{ color: #fff; font-size: 14px; text-align: center; padding: 12px; }

.btn_off { width: 200px; height: 40px; background-color: #fff; border: solid 1px #009245; float: left;  }
.btn_off p{ color: #009245; font-size: 14px; text-align: center; padding: 12px;}
.btn_off a{display: block;}
.btn_off:hover {background-color: #0085c7; border: solid 1px #fff; float: left;  }
.btn_off p:hover{ color: #fff;}

.btn_box_com ul li{ margin-right: 20px;}
.btn_box_com ul li:last-child{ margin-right: 0px; }
.btn_box_wor ul li{ margin-right: 20px;}
.btn_box_wor ul li:last-child{ margin-right: 0px; }
/*下層ページヘッダーここまで*/


/* トップページ */
.bg-holder { background-size: cover; background-position: 100px 100px;}
.bg_pic { background-image: url('../image/top_pic02.jpg'); width: 100%; height: 230px; object-fit: cover; }

.teiki { width: 1024px; height: 172px; margin: auto;}
.teiki ul { margin: auto; }
.teiki li { float: left;}
.teiki li:nth-child(even) { position: relative; top: 10%; padding: 0 2px;}
.teiki li:nth-child(odd) { position: relative; top: 0px; padding: 0 2px;}
	.teiki .arrow:after {
    content: ' ';
    height: 0;
    position: absolute;
    width: 0;
    border: 10px solid transparent;
    border-left-color: #666;
    left: 100%;
    top: 80px;
}
.arrow{ width: 10px; height: 171px; margin: auto 15px 0 0; display: block;}

.back_img_01{ width: 100%;}
.back_img_01 img{ width: 100%;}

.point_ttl{ width: 100%; margin: 5% 0 0 0; }
.point_ttl img {margin: auto;}
.point_box { background: #f2f2f2; padding: 40px; width: 100%; height: 500px;}
.p_box{ width: 980px; height: 300px; margin: 10px auto; padding-left: 24px}

dl{ font-size:26px; color : #0071BC; width : 227px; margin-right : 12px; padding : 5px 5px 10px; float : left;}
dt{ text-align: center; font-size:26px; color : #0071BC; padding-bottom : 10px; }
dd {color : #333; font-size:14px; line-height: 24px; padding-left : 10px; padding-right : 10px; }
dt img{ margin-bottom : 15px; display : block; width:100%; }

/*会社概要・沿革*/
table , td, th { border-bottom: 1px solid #666; border-collapse: collapse;  width: 100%;}
table , td, th:first-child{ border-top: 1px solid #595959; }
td, th { padding: 2%; width: 30px; height: auto; font-size: 14px; line-height: 25px; vertical-align: middle;}
td { background: #fff;}

.t1_even { background: #e9f2f4; width: 20%; text-align: center;}
.t2_even { background: #dcefe4; width: 20%; text-align: center;}
.t3_even { background: #f4e4e4; width: 20%; text-align: center;}
.odd {background: #fff; widows: 80%;}

.com_bg{ width: 100%; height: 240px; background: url(../image/company_bg.jpg) no-repeat; background-size:100% auto;}
.go_greeting{ width: 300px; height: 50px; margin: 50px auto 0; border: solid 1px #009245; background-color: #fff; position: relative; top: 40%;}
.go_greeting a{display: block; color: #009245;}
.go_greeting p{ font-size: 16px; text-align: center; padding: 16px; color: #009245;}
.go_greeting:hover{ width: 300px; height: 50px;  margin: 50px auto 0; border: solid 1px #fff; background-color: #009245; }
.go_greeting p:hover{color: #fff;}

.ggmap {position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden;}
.ggmap iframe, .ggmap object, .ggmap embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.bg_pic2 { background-image: url('../image/company_bg.jpg'); width: 100%; height: 230px; object-fit: cover; }


/*代表あいさつ*/
.greeting{ background: url(../image/greeting_bg.jpg) no-repeat bottom , url(../image/greeting_bg02.jpg) 
repeat bottom;; width: 100%; height: 700px;}
.greeting p{ font-size: 14px; line-height: 27px; width: 67%; height: auto; padding: 5% 7% 0 0; }
.ceo_mame{ font-size: 28px; position: relative; left: 77%}
.ceo{ font-size: 14px; position: relative;left: 77%}
.label_gy{ width: 100px; height: auto; float: left; background-color: #009245; padding: 13px; font-size: 14px; color: #fff; margin-right: 20px; display: block; text-align: center;}
.rinen { line-height: 22px; margin: 0 auto 50px; display: inline-block;}
.rinen p{ padding: 15px;}
.rinen p:last-child{ padding-top: 15px;}

/*業務案内*/
.go_recycle { background-color: #f2f2f2; width: 100%; height: 70px; margin-top: 10px;}
.go_recycle ul{ width: 70%; margin: auto;}
.go_recycle li{ float: left; margin: auto; padding-top: 15px;}
.go_recycle li:first-child{ font-size: 14px; text-align: center; padding-top: 30px; margin-right: 30px; }

.r_p{ padding-left: 40px; margin-top: 10px; }
.r_txt{ font-size: 14px; line-height: 26px; padding-top: 30px; display: block;}

/*リサイクル*/
.recycle_item{ width: 100%; height: auto; background: #f2f2f2; margin: 50px auto;}
.recycle_item img{ margin: auto; height: 160px; }
.item_list{ width: 100%; height: auto; border: solid 1px #666; margin: 35px 0 50px 0;}
.item_list li:nth-child(1){ width:662px;  float: left;}
.item_list li p{ font-size: 14px; padding: 2% 5% 2% 5%; line-height: 20px;}
.label_g{ width: 40%; height: auto; background-color: #008859; padding: 10px; font-size: 14px; color: #fff; margin:28px 0 0 5%; display: block; text-align: center;}
.label_b{ width: 40%; height: auto; background-color: #0097d1; padding: 10px; font-size: 14px; color: #fff; margin-left: 5%; display: block; text-align: center;}

/*info・フッターここから */
.info{ margin: 50px auto; width: 800px; height: 300px;}
.info p{font-size:1.4rem; line-height: 26px; margin-left: 43px;}
.info_r { width: 60%; margin: auto; float: left;}
.info_r li{ margin: auto; text-align: center;}
.info_map { width:300px; height:auto; float:left;}

.info_ttl{ background: url(../image/icon_01.png) no-repeat left; width: 370px; height: 40px; margin: 7px 0 15px 65px;}
.info_ttl p{ font-size : 22px; padding: 8px 0 0 0px;}

.red { width: 100%; height: 25px; margin: 15px auto;  text-align: center;  color : #ED1C24; font-size: 20px;}
.info_r .tel{ width: 90%;  height: auto; margin: 5px auto;  text-align: center; line-height: 27px; font-size: 18px;}
.tel { width: 450px; height: 40px; margin: 5px auto;  text-align: center; font-size: 18px;}
.tel span {font-size: 38px; font-weight: bold; margin-right: 10px;}
.tel img{ float: left;}
.area{ width: 400px; height: 65px; border: dotted 1px #333; background: url(../image/area.png) no-repeat left; padding: 13px 0 0 20px; margin: auto;}
.area p{ width: 180px;  font-size: 12px; color: #666; margin-left: 170px; line-height: 20px;}
.info_number{  width: 100%; padding: 13px 0 15px 23px;}


#footer{ width: 100%; height: 190px; background-color: #0071bc;}
#foot_com{ font-size: 12px; color: #fff; width: 336px; float: left; border-right: dotted 1px #fff; margin: 12px 8px 0 0;}
.job{ width: 275px; height: 28px; text-align: center; color: #333; background-color: #fff; padding-top: 8px;}

.name{ font-size: 22px; font-weight: bold; width: 322px; margin: 10px auto 8px 0;}

.address{width: auto; margin-top: 10px; line-height: 18px;}
.address li:nth-child(even){ margin: 0 0 10px 50px;}
.sitemap{ width: 630px; display:table; min-height:140px; float:right; margin:20px 0 0 0; }
.f_menu{ display:table-cell; width:21%; font-size: 1.3rem; color: #fff; line-height: 2em; }
.f_menu:nth-child(2){ width:24%; }
.f_menu:nth-last-child(2),
.f_menu:last-child { width:17%; }
.f_menu li:first-child a:before { content:"■"; }

#copyright { clear:right; }
#copyright { font-size: 1.2rem; color: #fff; width: auto; position: relative; text-align: right;}
/*info・フッターここまで */


@media only screen and (min-width:769px) and (max-width: 1023px){

.main_in { width:100%; }




}