@charset "UTF-8";
html, body, applet, object, iframe, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0; padding: 0; border: 0; font-weight:normal; outline: 0; vertical-align: baseline; background: transparent; }
  button#menubtn,.menubtn {background:none;}
img { vertical-align: middle; width: 100%; height: auto;}
a,.phoneNumber a,
#service li,
.flexslider .service_menu li{
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	text-decoration:none;
	outline: none;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;}
footer .phoneNumber a {color:#FFF;}
footer a{color:#000;}
body { line-height: 1; }
figure { margin: 0; padding: 0; }
ol, ul { list-style: none;padding: 0; }
:focus { outline: 0;}
table { border-collapse: collapse; border-spacing: 0; }
li { list-style: none;}
li .fa-lg {	vertical-align: baseline; line-height: 1;}
dt { float:left; clear:left;}
.clearfix::after{ content: ""; display: block; clear: both;}

/* Windows 用 Medium 指定の游ゴシック */
@font-face {
  font-family: "Yu Gothic M";
  src: local("Yu Gothic Medium");
}
/* font-weight: bold 通常の Bold を使用 */
@font-face {
  font-family: "Yu Gothic M";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
body {
	font-family:"游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium",メイリオ, Meiryo, sans-serif;
	font-size:15px;
	line-height:1.8em;
	color:#333;
	margin:0 auto;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
h1,h2,h3,h4,
b,.b,
#kataduke h2,#kataduke h2 span,
#kataduke li a,.info .order,
.order span,.order p,
#kataduke_03 h4 span,#ecoBOX h2 span,
#contact .order,
footer p ,footer a,
.service_menu li:last-child span,
[id^="ttl_"] h2 span,
footer span.phoneNumber a {	font-weight: bold;}
a {color:#333;}
/* #loading -------*/
#loader-bg {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #FFF;
	z-index: 50;
}
#loader {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 200px;
	height: 200px;
	margin-top: -100px;
	margin-left: -100px;
	text-align: center;
	color: #8cb944;
	z-index: 2;
}

/* header -------*/
header { margin-bottom:2em; }
header h1 { max-width:230px; float:left; display:block;margin: 0 auto;}
.menu { display: flex;
 display: -webkit-box;
 display: -webkit-flex;
 display: -ms-flexbox;
 justify-content: flex-end;
 -webkit-box-pack: end;
 -webkit-justify-content: flex-end;
 -ms-flex-pack: end;
}
.menu li { align-items:center;}
.phone { display:block;}
nav ul {
	list-style-type: none;
	margin: 0 auto;
	padding: 0;
}
nav li a,#kataduke li a { display: block;}
.order a.mail{ display:inline-block; padding:.25em 1em;}
.order a.mail:hover {
	display:inline-block;
	background-color: #C2CD31;
	border-radius:2px;
	transition: .3s;
	color:#FFF;}
nav li a:hover,
#kataduke li a:hover {
	display: block;
	background-color: #C2CD31;
	border-radius:2px;
	transition: .3s;
	color:#FFF;
}
/* content -------*/
.container {
  max-width:960px;
  margin:0 auto 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.container div { box-sizing:border-box;}
.cols-inner { max-width: 936px; margin: 0 auto;}

.col_2,.col_3,.col_4 { margin-top:2em; display:flex; flex-wrap: wrap;}
.col_2 .col:first-child,.col_3 .col:first-child,.col_4 .col:first-child { margin-left: 0;}
.col_2 .col { width: 48.717948717948715%; margin-left: 2.564102564102564%; }
.col_3 .col { width: 31.62393162393162%; margin-left: 2.564102564102564%; }
.col_4 .col { width: 23.076923076923077%; margin-left:2.564102564102564%;}
.col p { text-align:left;}
.col img { width: 100%; }
.col figure { margin-right:0; margin-left:0;}
.col h4 { font-size:1.32em; line-height:1.3; margin-bottom:.8em; letter-spacing:0;}
.col h4 span { font-size:.7em; color:#aeaeae;}

article { padding-bottom:4em; margin: 0 auto 5em;}
article h2 { text-align:center; letter-spacing:1px; margin:0 auto 1.5em;}
article h3,#kataduke_02 h4 { text-align:center; font-size:1.1428em; }
article h4 { text-align:center; font-size:1.4285em; letter-spacing:1px; margin-bottom:1em;}
article p { text-align:center; margin: 0 auto 1.5em; }
section { margin:0 auto 5.3333em;}

/* footer -------*/
footer { background-color:#8cb944; color:#FFF; padding:2em 0 0;}
footer h1 { width: 5em;}
footer .container { background:url(../img/nav/footer_bg.svg) right bottom no-repeat; padding-bottom:2.5em;}
footer .container div:first-of-type { width:75%;}
footer .container div:last-of-type { width:25%;}
footer li { margin-bottom:.5em;}
footer a { color:#FFF; }
#page_top {
	position:fixed;
	bottom:20px;
	right:20px;
	width:40px;
	height:40px;
	text-align:center;
	line-height:2.5;
	background:#FFF;
	border-radius:50%;
	box-shadow:0px 0px 5px 1px rgba(0,0,0,0.26);
 }
#page_top a { display:block; height:auto; color:#8cb944;}
.copy { font-size:0.85em; text-align:center; padding:.5em 0 ;}

/*** index ***/
.service_menu { position:relative; bottom: 8.8%; z-index:2;}
.service_menu ul { display:flex; justify-content: space-between; width:99%; margin:0 auto;}
.service_menu li {
	font-size:1.13333em;
	text-align:center;
	background-color:rgba(255,255,255,0.95);
	padding:7px 5px;
	border-top-left-radius:5px;
	border-top-right-radius:5px;
	margin:0 5px; }
	.service_menu li a i { padding-top: .1em;}
/*　お知らせ　*/
#info dl,#info .topic { width:70%;margin:0 auto;}
.topic .overflow { margin-bottom: 2em;}
.topic table { border: 2px solid #8cb944;}
.topic table .lineL:last-of-type { margin-bottom: 0;}
.topic tr:first-of-type th { color: #8cb944; border-right: 1px solid;}
.topic tr:first-of-type td {border-bottom: 1px solid #8cb944;}
.topic tr:last-of-type th { background: #8cb944; color: #FFF;border-right: 1px solid #8cb944;}
.topic th {
  width: 8.5em;
  font-weight: bold;
  vertical-align: middle;
  padding:.5em;
}
.topic td { padding: 1em;}
.topic .btn {
  display: block;
  text-align: center;
  background: #0071bc;
  color: #FFF;
  margin-bottom: 1em;
}
.topic .btn a {
  display: block;
  color: #FFF;
  font-weight: bold;
  padding: .5em;
  box-sizing: border-box;
  border: 1px solid #0071bc;
}
.topic .btn a:hover { color: #0071bc; border: 1px solid; background: #FFF;}
#info dd { margin-left:8em; margin-bottom:1.5em;}
/*　かたづけ隊　*/
#kataduke section:nth-child(1) {
	background:#FFFAF5;
	text-align:center;
	margin:0 auto 5em;
	padding:5em 0;
	box-sizing:border-box;}
#kataduke section:nth-child(2) { margin-bottom:3em;}
#kataduke section:nth-child(3) .col { margin-bottom:2em;}
#kataduke section:nth-child(3) .col_3 .col:nth-child(3n+1) { margin-left:0;}
	#kataduke section:nth-child(3) .col_3 .col h4 {
		font-size:1.06em;
		color:#FFF;
		background:#8cb944;
		padding:.15em 0;
		margin:0 auto .5em;}
	#kataduke section:nth-child(3) .col_3 .col h5 {
		font-size:1em;
		font-weight:500;
		text-align:left;
		margin:.85em auto;} 
	#kataduke section:nth-child(3) .col_3 .col figure { margin:0 auto;}
	#kataduke section:nth-child(3) .col_3 .col:nth-child(1) h4, 
	#kataduke section:nth-child(3) .col_3 .col:nth-child(2) h4,
	#kataduke section:nth-child(3) .col_3 .col:nth-child(3) h4 { background:#8cb944; }
	#kataduke section:nth-child(3) .col_3 .col:nth-child(1) span, 
	#kataduke section:nth-child(3) .col_3 .col:nth-child(2) span,
	#kataduke section:nth-child(3) .col_3 .col:nth-child(3) span { color:#8cb944; }
	#kataduke section:nth-child(3) .col_3 .col:nth-child(4) h4, 
	#kataduke section:nth-child(3) .col_3 .col:nth-child(5) h4,
	#kataduke section:nth-child(3) .col_3 .col:nth-child(6) h4 { background:#C2CD31; }
	#kataduke section:nth-child(3) .col_3 .col:nth-child(4) span, 
	#kataduke section:nth-child(3) .col_3 .col:nth-child(5) span,
	#kataduke section:nth-child(3) .col_3 .col:nth-child(6) span { color:#C2CD31; }
	#kataduke section:nth-child(3) .col_3:last-of-type .col h4 { background:#0B8841; }
	
#kataduke h2 { color:#4D4D4D; font-size: 1.7333em; margin-bottom:.5em;}
#kataduke h3 { color:#8cb944; font-size: 1.3333em; } 
#kataduke h2 span:first-of-type { font-size:0.65em; line-height:3;}
	#kataduke h2 span:first-of-type::before { content:url(../img/nav/ttl_kataduke_left.svg); display:inline-block; margin-right:1em;}
	#kataduke h2 span:first-of-type::after { content:url(../img/nav/ttl_kataduke_right.svg); display:inline-block; margin-left:1em;}
	.flexslider .service_menu li:first-of-type span,
	#kataduke h2 span:last-of-type,
	#service li:first-of-type span {
		font-size:0.65em; background:url(../img/nav/ttl_kataduke_de.svg) no-repeat center; padding:1.1% 1.5%; margin:0 auto;}
	.flexslider .service_menu li:first-of-type span,
	#service li:first-of-type span { font-size:0.8em; background-size:90%; padding: 1em; margin:0 auto;}
	.flexslider .service_menu .fa.fa-pull-right,
	#service .fa.fa-pull-right { margin-left:0;}
	.flexslider .service_menu .fa-fw,
	#service .fa-fw { width:.8em;}
#kataduke .info { width:61.97%; margin:0 auto; text-align:center;}
#kataduke .info figure { max-width: 226px; width: 38.96551724137931%; margin:0 auto 1.5em;}
#kataduke .info p:nth-of-type(2){ font-size:1.2em; margin:0 auto .2em; font-weight:600;}

#kataduke ul {
	display: flex;
	display: -webkit-flex ;
	justify-content: space-between;
	font-size: 1.1333em;
	color: #8cb944;
	margin: 0 auto 2em;
	}
	#kataduke li a{ color:#8cb944;}
	
	/* 依頼方法 Tel,Fax,Mail */
	#kataduke section:first-of-type .order a.phoneNumber,
	#contact a.phoneNumber,#contact .order a{ color:#8cb944;}
	.order span.phoneNumber { font-size:1em; margin:0 auto;}
	
	.info .order,.order p,.order span,#contact .order { font-size:1.95em; color:#8cb944; line-height:1.2; margin:1em auto; }
	.info .order { margin:0 auto;}
	.info .order span:last-of-type,
	#kataduke section:last-of-type .order span:last-of-type { letter-spacing:1px; font-size:.8em; color:#8cb944;}
	
	#kataduke section:last-of-type h3 { color:#FFF; margin-bottom:.25em;} 
	#kataduke section:last-of-type .order i,
	#kataduke section:last-of-type .order a.phoneNumber,
	#kataduke section:last-of-type .order span:first-of-type,
	#kataduke section:last-of-type .order span:last-of-type a { color:#FFF; text-align:center;}
	
#kataduke section:nth-child(3) ,
#kataduke section:nth-child(3) #kataduke_03{ position: relative; overflow: hidden; padding: 5em 0 0;}
.cols-inner#kataduke_02 { margin:4em auto 2em;}
#ecoBOX,
#kataduke section:nth-child(3) { margin-bottom:0;}

#kataduke section:nth-child(3):before {content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 120%;
  height: 100%;
  margin: 3% -10% 0;background-color:#FFFAF5;-webkit-transform-origin: left center;
  -ms-transform-origin: left center;
  transform-origin: left center;
  -webkit-transform: rotate(3.5deg);
  -ms-transform: rotate(3.5deg);
  transform: rotate(3.5deg);
  z-index: -3;}
  
#kataduke section:nth-child(3):after {content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 120%;
  height:100%; margin: 3% -10% 0;
  background: #FFFAF5;
  -webkit-transform-origin: right center;
  -ms-transform-origin: right center;
  transform-origin: right center;
  -webkit-transform: rotate(-3.5deg);
  -ms-transform: rotate(-3.5deg);
  transform: rotate(-3.5deg);
  z-index: -4;}
#kataduke section:nth-child(3) #kataduke_03:before,
#kataduke section:last-of-type:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 120%;
  height: 100%;
  margin: 3% -10% 0;
  background: #8cb944;
  -webkit-transform-origin: left center;
  -ms-transform-origin: left center;
  transform-origin: left center;
  -webkit-transform: rotate(3.5deg);
  -ms-transform: rotate(3.5deg);
  transform: rotate(3.5deg);
  z-index: -3;
}
#kataduke section:nth-child(3) #kataduke_03:after,

#kataduke section:last-of-type:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 120%;
  height: 80%;
  background: #8cb944;
  -webkit-transform-origin: right center;
  -ms-transform-origin: right center;
  transform-origin: right center;
  -webkit-transform: rotate(-3.5deg);
  -ms-transform: rotate(-3.5deg);
  transform: rotate(-3.5deg);
  z-index: -4;
}
#kataduke section:last-of-type:after { margin: 3% -10% 0;}
#kataduke section:nth-child(3) #kataduke_03:before,
#kataduke section:nth-child(3) #kataduke_03:after { background:#FFF; margin: 0 -10% 0; z-index:-2;}
#kataduke section:nth-child(3) #kataduke_02:after,
#kataduke section:nth-child(3) #kataduke_02:before { background:#FFFAF5; margin: 0 -10% 0;}
#kataduke section:last-of-type {
  position: relative;
  overflow: hidden;
  padding: 2em 0 0;
  margin-bottom: 0;
}
#kataduke section:last-of-type .order {padding:3em 0 2em;}
#kataduke section:last-of-type p{ 
  box-sizing: boder-box;
  max-width: 640px;
  width: 100%;
  height: 100%;
  color: #fff;
  text-align: center;
  margin: 0 auto;
  padding: 0 10px;
}
#kataduke .col_3 figure { margin-bottom:1em;}
/* 依頼方法 */
#kataduke_03 figure { margin: 0 auto .8em;}
#kataduke_03 h4 { font-size:1em; line-height:1.7; margin-top:0;}
#kataduke_03 h4 span { display:block; color:#8cb944; font-size:1em;}
/* エコBOX */
#ecoBOX h2 { color:#0B8841; line-height:1.5; margin:2em auto 2.5em;}
#ecoBOX h2 span { display:block; font-size:.75em;}
#ecoBOX h3 { margin:1em auto;}
#ecoBOX figure { max-width:120px; margin:0 auto;}
/* アクセス */
#access h2 i { margin-bottom:.5em;}
#map { width:100%; min-height:400px; margin:0 auto;}
/* service_menu */
#service { padding-bottom:3em;}
#service figure img { width:9.081196581196581%; margin-bottom:2em; }
#service h2 { font-size:1.3333em; margin:0 auto .3em; }
#service li {
  width:40.17094017094017%;
  font-size: 1.15em;
  letter-spacing: 1px;
  text-align: center;
  border:solid 1px #CCC;
  box-sizing: content-box;
  border-radius: 5px;
  padding:.35em 0;
  margin:0 auto 1.2%;display:block;}
  .flexslider .service_menu li a,#service li a {display:block;}
  .flexslider .service_menu li:hover,#service li:hover {display:block; background:#ededed;}

  /* text */
  .L { font-size:1.0666em;/*16*/}
  .S { font-size: .9333em;/*14*/}
  .mb {margin-bottom:5em;}
  .center { text-align:center;}
  .lineL { text-align:left;}
  .lineR { text-align:right;}
  .c_light { color:#8cb944;}
  .c_dark { color:#0B8841;}

/*** PAGE common ***/
#page_link {margin-bottom: 4em;}
#page_link a {
	display:inline-block;
	color:#0B8841;
	letter-spacing: 1px;
	text-align:center;
	padding:0 .5em;
	}
	#page_link a:hover {display:inline-block; border-radius:2px; background:#0B8841; color:#FFF;}
/* PAGE TITLE */
div[id^="ttl_"] {
	position:relative;
	width:100%;
	height:8.33333em;
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	font-size:1.6em;
	margin-bottom:1em;
	}
	[id^="ttl_"] h2 {
		position:absolute;
		top:1.5em;
		left:2.5em;
		font-size:1.1em;
		line-height:1.5;
		letter-spacing:3px;
		text-align:left;
		color:#FFF;
		text-shadow:1px 1px 3px #333;
		}
	[id^="ttl_"] h2 span {font-size:.7em; display:block; letter-spacing:5px;}

#ttl_about {background-image:url(../img/ttl_about.jpg);}
#ttl_member {background-image:url(../img/ttl_member.jpg);}
#ttl_customer {background-image:url(../img/ttl_customer.jpg);}
#ttl_contact {background-image:url(../img/ttl_contact.jpg);}
#ttl_eco {background-image:url(../img/ttl_eco.jpg);}
#ttl_eco h2 { color:#333;text-shadow:1px 1px 3px #FFF;}
/*** PAGE:about ***/	 
#about.cols-inner div ,
#customer section { width:48.717948717948715%; margin:0 auto;}
 #guide dt { width:5em;}
 #guide dd {margin-left:6em; margin-bottom:1em;}
 #guide figure { margin-bottom:2em;}

/*** PAGE:CUSTOMER ***/
#customer01:before,
#customer02:before,
#customer03:before {
	display:block;
	color:#FFF;
	font-weight:600;
	width:1.2em;
	height:1.2em;
	background:#C2CD31;
	text-align:center;
	line-height:1.2;
	padding:.8em;
	border-radius:50%;
	margin:0 auto;}

#customer01:before {content:'01'; margin-top:3em;}
#customer02:before {content:'02';}
#customer03:before {content:'03';}
#customer section div {margin-bottom:5em;}
#customer section:last-of-type div { margin-bottom:0;}
#customer section p {text-align:left;}
#customer section h3 span {display:block; font-size:.9em;}

/*** PAGE:ECO ***/
#eco .cols-inner div{ width: 48.717948717948715%; margin-left:auto; margin-right:auto;}
.page-primary { width: 48.717948717948715%; margin:5em auto;}
.page-primary h2 { font-size: 1.2em; color: #0b8841;}
.page-primary h2 a{ display: block; font-weight: bold; color: #0b8841;}
.page-primary h2 a:hover { background:#0b8841; color: #FFF; }
.page-primary figure { margin: 2em auto; }
.page-primary figure .tel { width: 80%; display: block; margin: auto;}
#eco .guide{
  background: #FFFAF5;
  margin: 0 auto 5em;
  padding: 5em 0;
}
#eco .area-ttl h3 { font-size: 1.2em; color: #0071bc; margin-bottom: 0;}
.icon-bycycle:before {
  content: url("../img/eco_bycycle.svg");
  display: block;
  width : 3.5em;
  margin: 0 auto 1em;
}
.icon-paper:before {
  content: url("../img/eco_paper.svg");
  display: block;
  width : 5.5em;
  margin: 0 auto 1em;
}
.icon-home-appliances:before {
  content: url("../img/eco_home-appliances.svg");
  display: block;
  width : 12em;
  margin: 0 auto 1em;
}
#eco .area-ttl h4 { font-size: 1.13em; margin: .5em auto 0;}
#eco .area-ttl h4 span { display: block; font-size: .88em; line-height: 2; font-weight: normal;}
article .area-body p { text-align: left;}
article .area-body { border-top: #999 1px dashed ; padding-top: 1.5em; margin-top:1.5em;}
#info .item-list li,
#eco .area-body li { display: inline-block; margin-right: 1em;}
.item-list { border:1px solid #0071bc; margin-bottom: 2.5em;}
.item-list th:first-of-type{ background: #0071bc; color: #FFF;}
.item-list tr:nth-of-type(3) { border: solid 1px #0071bc;}
.item-list td { padding: 1em;}
.item-list tr:nth-child(3) td{ padding: .25em;}
.item-list__ok li:before {
  content :'●';
  color: #0071bc;
  font-size: .9em;
  font-weight: bold;
  display: inline;
  margin-right: .35em;
}
.item-list__no li:before {
  content :'×';color: #0071bc;
  font-weight: bold;
  display: inline;
  margin-right: .35em;
}
.item-list__ok,.item-list__no { margin:0 auto;}
.item-list__ttl { font-size: 1.13em; font-weight: bold; color: #FFF; margin:.3em auto;}
#eco #page_link { font-size: 1.13em; margin: 2em auto;}
#eco #page_link a { color: #666; font-weight: bold;}
#eco #page_link a:hover { color: #FFF;}
#eco #page_link a:before {
    content:'▼';
    color: #c2cd31;
    display: inline-block;
    transform: rotate(-90deg);
    margin-right: .5em;
    font-size: .8em;
}
#eco .btn {
  display: block;
  width: 100%;
  text-align: center;
  background: #0071bc;
  color: #FFF;
  padding: .5em;
}
#eco .btn a { color: #FFF; font-weight: bold;}
/*** PAGE:CONTACT ***/
#contact .order { line-height:1.5;}
#contact.cols-inner div { width:65.8119658119658%;/*616px*/ margin:0 auto;} 
#contact section h3 { font-size:1.3333em/*20*/; }
#contact ul,#contact .order { margin:0 auto;}
#contact section:last-of-type { margin:0 auto;}
@media print {#page_top,#page_top a { display:none; box-shadow:none;}}
@media print, screen and (min-width: 937px) {
  body { font-size:15px;}
  .flexslider { margin: 2em auto 5em; height: 476px;}
  .flexslider .service_menu li { width:/*33%*/48%;}
  .menu_index { padding-top:1em;}
  
  .phone { float: right; width: 295px; padding: 0 0 .5em;}
  .pc { display: block !important; margin: 5px auto;}
	.sp { display: none !important; }
  .pc div { float:left; font-size:27px; text-align:right; line-height:1.1;}

  nav { text-align: right; display: block; clear: right;}
 
  #kataduke_01 figure, #kataduke_02 figure { max-width:296px; margin: 0 auto 1em;}
  #kataduke_02 figure { margin: 0 auto;}
  #kataduke .info figure { width: 100%;}
  #kataduke_03 figure { max-width:216px; margin: 0 auto .8em;}
  article { margin: 0 auto; padding-bottom: 5.7857em; }
  article h2 { font-size: 1.6428em;}
  .menu { display: block;letter-spacing: 0;}
  .menu-trigger, .menu-trigger span {
    display: inline-block;
    transition: all .4s;
    box-sizing: border-box;
	}
  .menu-trigger {
    position: relative;
    width: 25px;
    height: 20px;
	}
  .menu-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: none;
    border-radius: 2px;
	}
  .menu-trigger span:nth-of-type(1) { top: 0; }
  .menu-trigger span:nth-of-type(2) { top: 9px; }
  .menu-trigger span:nth-of-type(3) { bottom: 0; }
  .menu-trigger.active span:nth-of-type(1) {
    -webkit-transform: translateY(7px) rotate(-45deg);
    transform: translateY(7px) rotate(-45deg);}
  .menu-trigger.active span:nth-of-type(2) { opacity: 0; }
  .menu-trigger.active span:nth-of-type(3) {
    -webkit-transform: translateY(-11px) rotate(45deg);
    transform: translateY(-11px) rotate(45deg);}
  .menubtn {
	display: none;
    position: absolute;
    right: 2%;
    top: 2%;
    background-color: #FFF;
    padding: 0;
    border: none;
    cursor: pointer;}
  .menubtn:hover { background-color: #FFF; }
  .menubtn:focus { outline: none; }

  .menu ul { width: 100%; margin: 0 auto; }
  .menu ul:after { content: ""; clear: both; }
  .menu li { letter-spacing: 1px;display: inline-block;}
  .menu li a,#kataduke li a { display: block; height: 100%; padding:0 .75em; }
  .menu li a:hover { color: #FFF; }
  .menu li a::after {
    position: absolute;
    left: 50%;
    content: '';
    width: 0;
    color: #FFF;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
	}
  .menu li a:hover::after { width: 100%; color: #FFF; }
  #kataduke section:last-of-type h3 { padding-top:2em;}
  
}
@media only screen and (max-width:936px) {
body {font-size:14px;}
header { margin-bottom:0;}
header .menu_index { position:relative; min-height: 95px;}
header .menu_index .cols-inner { flex-direction: column;}
header h1 { position:absolute; left:10px; max-width:230px; width:40%; margin:0 auto;}
header h1 img { margin:.2em 0 0; width:80%;}

.cols-inner { padding-left:15px; padding-right:15px;}
.phone { position:absolute; right:60px; top:15px; font-size: 1.25em; text-align: start; padding:0;}
.pc { display: none !important; }
.sp { display: block !important; }

.service_menu ul { width:100%;}
  .menu-trigger, .menu-trigger span {
    display: inline-block;
    transition: all .4s;
    box-sizing: border-box;
  }
  .menu-trigger {
    position: relative;
    width: 30px;
    height: 25px;
  }
  .menu-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #ccc;
    border-radius: 2px;
  }
  .menu-trigger span:nth-of-type(1) { top: 0; }
  .menu-trigger span:nth-of-type(2) { top: 11px; }
  .menu-trigger span:nth-of-type(3) { bottom: 0; }
  .menu-trigger.active span:nth-of-type(1) {
    -webkit-transform: translateY(8px) rotate(-45deg);
    transform: translateY(8px) rotate(-45deg);
  }
  .menu-trigger.active span:nth-of-type(2) { opacity: 0; }
  .menu-trigger.active span:nth-of-type(3) {
    -webkit-transform: translateY(-15px) rotate(45deg);
    transform: translateY(-15px) rotate(45deg);
  }
  .menu { display: none; font-size: 1.1333em; }
  .menu { display: block !important;}
  .menubtn {
	position: relative;
    right: 0;
    top: 23px;
    background-color: #FFF;
    padding: 0;
    border: none;
    cursor: pointer;
	float: right;
  }
  .menubtn:hover { background-color: #FFF; }
  .menubtn:focus { outline: none; } 

  nav { display:none; width: 100%;}
  nav ul,
  .menu ul { width: 100%; margin: 0 auto; }
  .menu ul:after { content: ""; display: block; clear: both; }
  .menu li { width: 100%; display: inline-block; text-align:center; font-size:1em; padding:2px 0; }
  .menu li:first-child { margin-top: 4em; }
  .menu li a { display: block; height: 100%; padding:2px 0;}
  .menu li a:hover { color: #FFF; }
  .menu li a::after {
    position: absolute;
    left: 50%;
    content: '';
    width: 0;
    background: #153BA0;
    color: #FFF;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .menu li a:hover::after { width: 100%; color: #FFF; }
  .flexslider { margin:1em auto 4em;}
  .flexslider li { width:auto;}
  .service_menu { bottom:0; margin-top:2em;}
  .service_menu li { width:33%; border-radius:5px; border:1px solid #CCC; margin: 0 2px;}

  .topic .overflow { overflow: auto;white-space: nowrap;}
 
  
#kataduke section:nth-child(3):after{ width: 100%;margin: 0 30% 0;}
#kataduke section:nth-child(3):before { width: 100%;margin: 0 -30% 0;}
 #kataduke h2 span:last-of-type { font-size:0.8em; background-size:90%; padding: 1em; margin:0 auto;} 
 #kataduke_03 figure { max-width: 216px; margin: 0 auto;}
 #kataduke ul,#kataduke_03 .cols-inner {width:90%;}

div[id^="ttl_"] { margin:0 auto 1em;}
#contact.cols-inner div { width:95%;}

.col_4 .col { width:47.5%; margin-left:5%; margin-bottom:5%;}
.col_4 .col figure { width: 60%; margin: 0 auto;}
.col_4 .col:nth-child(3) { margin-left:0;}
  
footer .container { width:98% ; margin:0 auto; }
#page_top {line-height:3; bottom:55px; right:10px; }
}
@media only screen and (max-width: 768px) {
	body { font-size:13px;}
	header .menu_index { min-height:80px; padding-top:0;}
	header .menu_index .cols-inner h1,
	header .menu_index .cols-inner .phone { flex-flow: row nowrap;}
	header h1 { max-width: 180px;}
	header h1 img { width:100%;}
	.phone a img {display:none;}
	.phone { width:3em;}
	div[id^="ttl_"] { height:7em;}
	article,
	article#service { padding-bottom:0;}
	.flexslider .service_menu li { flex-flow: column; width:60%; margin-bottom:.5em; padding: 5px;}
	#info dl,#service li { width:60%;}
	#info dt { display:block; float:none;}
	#info dd { margin-left:0;}
	.col_4 .col figure { width: 100%; margin: 0 auto;}
	#kataduke section:last-of-type p { padding: 0;}
	#map { min-height:300px;}
	#service figure img { max-width:90px; width:30%;}
	#about.cols-inner div,#customer section,
  #eco .cols-inner div,.page-primary{ width: 90%;}
  .page-primary figure { max-width: 456px;}
	footer .container { flex-flow:column-reverse wrap; width:80%; margin:0 auto; background-size: 80px;background-position:bottom center; }
	footer .container div:first-of-type,
	footer .container div:last-of-type {width:100%; text-align:center;}
	footer h1 { text-align:center; margin:1em auto 0;}

	section { margin:0 auto 5em;}
	article#info h2 { font-style:1.5em; margin-bottom:1em;}
	div[id^="ttl_"] { margin-top:.5em;}
	div[id^="ttl_"] h2 { font-size:.95em;}
	#ecoBOX .col_2,
	#kataduke_01 .col_3,
	.flexslider .service_menu ul { flex-flow: column; align-items: center;}
	#ecoBOX .col_2 .col { width:100%; margin:0 0 1em 0;}
	#kataduke section:nth-child(3) .col_3,
	#kataduke section:nth-child(3) .col_4 { justify-content: space-between;}
	#kataduke_01 .col_3 .col { width:70%; margin:0 0 1em 0;}
	#kataduke section:nth-child(3) .col { width:48.5%; margin-left:0; margin-bottom:0;}
	#kataduke section:nth-child(1) { padding:3em 0;}
	#kataduke h2 { font-size:1.5em;}
	#kataduke_01 figure,
	#kataduke div.info { width:100%;}
	#kataduke section:first-of-type figure { max-width:200px;}
	#kataduke_01 figure { max-width:256px; width:100%; margin:0 auto 1em;}
	
	#kataduke_03 div.center figure { max-width:216px; margin:0 auto; }
	
	#guide dd { margin-left: 5em;}
	#about #bros figure { max-width: 456px; margin: 0 auto;}
	
	#service h2 { font-size:1.2em;}
	.copy { font-size: 10px; padding:.25em 0;}
	#page_top { bottom: 15px; right: 10px;}
	}
	@media only screen and (max-width: 600px){
		.cols-inner { padding-left:12px; padding-right:12px;}
		.cols-inner:nth-of-type(2){ padding-left:0; padding-right:0;}
		 div[id^="ttl_"] { height:5em; margin-top:.5em;}
		 div[id^="ttl_"] h2 { top:.5em; left:2em; font-size:.85em;}
		 .col_3 {display:flex;}
		 #kataduke a.phoneNumber {letter-spacing:1px;}
		 #kataduke section:first-of-type figure { max-width: 190px; width:55%;}
		 #kataduke section:nth-child(2) .col_3,
		 #kataduke section:nth-child(3) .col_3 { width: 100%; font-size: 1em; margin: 0 auto.5em;}
		 #kataduke section:nth-child(2) .col_3 .col { width:90%;}
		 #kataduke_03 div.center:last-of-type p { padding:0 1em;}
		 footer .container { width:95%;}
		 #service li { width:75%;}
		 #kataduke section:last-of-type h3 { margin-top: 0;}
		 }
	@media only screen and (max-width: 480px){
		.phone { right: 50px;}
		.menu li:first-child { margin-top: 3em;}
		.flexslider .service_menu li { width:75%;}
		#info dl, #info .topic { width:85%;}
		div[id^="ttl_"] { height:4em; margin-top:.8em;}
		 div[id^="ttl_"] h2 { top:.3em; left:1em; font-size:.75em;}
		#kataduke ul { flex-flow: column; align-items: center;}
		#kataduke li {margin-bottom:.5em;}
		#kataduke section:nth-child(3) .col_3 { flex-flow: column; align-items: center;}
		#kataduke section:nth-child(3) .col_3 .col { width:80%;}
		}
	@media only screen and (max-width: 380px){header .menu_index {min-height: 55px;}	#service li{ width:90%;}}