@charset "UTF-8";
/* CSS Document */
@media screen and (max-width:770px) {
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;/*基本を16pxで設定*/
font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
line-height: 1.8;
vertical-align: baseline;
-webkit-text-size-adjust: 100%;
box-sizing: border-box;
}
a{
	text-decoration: none;
}
.fade_sample {
	/*変化にかかる時間とタイミング、進行具合を指定*/
	-webkit-transition: 0.3s ease-in-out;  
	transition: 0.3s ease-in-out;  
}
/*オンマウス時に実行*/
.fade_sample:hover {
	/*透明度具合を指定*/
	opacity: 0.4;  
	filter: alpha(opacity=60);  
}
.clearfix::after {
   content: "";
   display: block;
   clear: both;
}
/*ローディング*/
#loading{
	display: none;
}
#loading.opening{
	display: flex;
	position: fixed;
	width: 100%;
	height: 100%;
	background: rgb(2,125,199);
	z-index: 9999;
	justify-content: center;
	align-items: center;
	text-align:center;
}
#loading.hide{
	display: none;
}
.open{
	position: absolute;
	width: 20%;/* 500px */
	height: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
.open2{
	animation: opening 1s ease forwards;
}
#wrapper{
	position: relative;
}
#content{
	margin: auto;
	padding-top: 13vw;
}
.box{
	width: 100%;
	margin: auto;
}
.box1{
	width: 100%;/*1368px*/
	max-width: 1300px;
	margin: auto;
}
.box2{
	width: 100%;/*1380px*/
	max-width: 1200px;
	margin: auto;
}
.hidden{
	overflow: hidden;
}
/*---------------------------------------------------------------------------------------------------------------*/
/* ----フォント関連 ----*/
.com_title1{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: clamp(1.5rem, 1.381rem + 0.51vw, 1.625rem);/* 24px */
	font-weight: bold;
	font-style: normal;
	line-height: 1.5;
}
.com_title2{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: clamp(1.375rem, 1.256rem + 0.51vw, 1.5rem);/* 22px */
	font-weight: bold;
	font-style: normal;
	line-height: 1.5;
}
.com_title3{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: clamp(1.625rem, 1.506rem + 0.51vw, 1.75rem);/* 26px */
	font-weight: bold;
	font-style: normal;
	line-height: 1.5;
}
.en_title1{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: clamp(1.938rem, 1.82rem + 0.24vw, 2.125rem);/* 34px */
	font-weight: 700;
	font-style: normal;
	line-height: 2;
}
.en_title2{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: clamp(1.063rem, 0.945rem + 0.24vw, 1.25rem);/* 28px */
	font-weight: 700;/* 700 */
	font-style: normal;
	line-height: 2;
}
.en_title3{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: clamp(1.938rem, 1.82rem + 0.24vw, 2.125rem);/* 34px */
	font-weight: 700;/* 700 */
	font-style: normal;
	line-height: 2;
}
.box_title1::before{
	content: '';
	display: block;
	width: 60px;/* 60px*/
	height: 65px;/* 60px*/
	margin: 0 auto 10px;
	padding: 20px 0;/* 20px 0*/
	background: url("img/common/title-tag2.png");
	background-size: cover;
}
.box_title2::before{
	content: '';
	display: block;
	width: 60px;/* 60px*/
	height: 65px;/* 60px*/
	margin: 0 auto 10px;
	padding: 1.39vw 0;/* 20px 0*/
	background-image: url("img/common/title-tag.png");
	background-size: cover;
}
.box_title3::before{
	content: '';
	display: block;
	width: 60px;/* 60px*/
	height: 60px;/* 60px*/
	margin: auto;
	padding: 1.39vw 0;/* 20px 0*/
	background-image: url("img/common/box_title3.png");
	background-size: cover;
}
.line-title1::after{
	content: '';
	display: block;
	width: 60px;/* 60px*/
	margin: auto;
	border-bottom: 4px solid #D20003;
}
.af-line::after{
	display: block;
	content: '';
	width: 90px;/* 90px */
	border-top: 10px solid #0065BD;
	margin: auto;
	border-radius: 10px;
}
.line-title2{
	display: inline-block;
	border-bottom: 3px solid #6c2735;
	margin-top: 4px;
}
/*--------------- 縦書き----------------------*/
.font1{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: clamp(0.938rem, 0.878rem + 0.25vw, 1rem);/* 17px */
	font-weight: normal;
	font-style: normal;
	line-height: 2;
}
.font2{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: clamp(0.875rem, 0.816rem + 0.25vw, 0.938rem);/* 16px */
	font-weight: normal;
	font-style: normal;
	line-height: 2;
}
/*-------------------------------*/
.green{
	color: rgb(2,104,55);
}
.pink{
	color: #c70067;
}
.blue{
	color: #0068b7;
}
.white{
	color: #FFFFFF;
}
/*-------------------------------*/
.m-top10{
	margin-top: 2.5%;/* 15px */
}
.m-top30{
	margin-top: 7.6%;/* 35px */
}
.m-top50{
	margin-top: 55px;/* 55px */
}
/*--------------------------*/
.f-center{
	display: flex;
	margin: auto;
	justify-content: center;
}
.center{
	text-align: center;
}
.s-center{
	text-align: center;
}
/*-----------------------------------------------------------*/
.gnav-btn2{
	display: none;
}
.g-nav2{
	display: none;
}
.phone-mark{
	display: none;
}
.mail-mark{
	display: none;
}
/*========================  　背景画像　　======================================================================*/
.bg-img1{
	background-image: url("img/common/bg-img1.jpeg");
	background-size: cover;
	background-position: center middle;
}
.bg-img2{
	background-image: url("img/common/bg-img2.jpg");
	background-size: cover;
	background-position:center;
}
.bg-img3{
	background-image: url("img/common/bg-img3.jpg");
	background-size: cover;
	background-position:center;
}
.bg-img4{
	background-image: url("img/common/bg-img4.jpg");
	background-size: cover;
	background-position:center;
}
.bg-img5{
	background-image: url("img/common/bg-img5.jpg");
	background-size: cover;
	background-position: center;
	vertical-align: middle;
}
.bg-img6{
	background-image: url("img/common/bg-img6.jpg");
	background-size: cover;
}
.bg-img7{
	background-image: url("img/common/bg-img7.jpg");
	background-size: cover;
}
/*---------------------  背景カラー　--------------------------------*/
.bg-black{
	background: #000000;
}
.bg-white{
	background:#FFFFFF;
}
.bg-gray{
	background:rgba(245,245,245,0.8);
}
/* 改行コード-----------------*/
.pc-br{
	display: none;
}
.sp-br{
	display: block;
}
/*===================================  スマホヘッダー　=============================================================================================*/
#sp-header{
	position: fixed;
	display: block;
	padding: 0;/*3px 0 0*/
	width: 100%;
	height: 13vw;/*70px*/
	z-index: 1000;
	background: rgb(2,104,55);
}
#sp-hd-logo{
	position: absolute;
	display: inline-block;
	width: 45%;/* 225px */
	height: auto;/* 65px*/
	top: 0;
	bottom: 0;
	left: 1%;
	margin: auto;
	z-index: 4000;
}
/*----------------------   スマホボタンcss  -------------------------------------*/
.line-mark{
	position: absolute;
	display: block;
	width: 11%;/* 45px*/
	height: 12vw;/* 45px*/
	top: 4vw;/* 14px*/
	right: 44vw;/* 165px*/
}
.line-mark img{
		width: 100%;
		height: auto;
	}
.phone-mark{
	position: absolute;
	display: block;
	width: 12%;/* 45px*/
	height: auto;/* 45px*/
	top: 4vw;/* 14px*/
	right: 32vw;/* 120px*/
}
.phone-mark img{
		width: 100%;
		height: auto;
}
.mail-mark{
	position: absolute;
	display: block;
	width: 11%;/* 40px*/
	height: auto;/* 40px*/
	top: 1vw;/* 14px*/
	right: 18.66vw;/* 70px*/
}
.mail-mark img{
		width: 100%;
		height: auto;
}
/* ▼メニュー（ハンバーガーアイコン）▼*/
	/*nabi開閉部分*/
/*ハンバーガーボタン*/ 
.gnav-btn{
	display: block;
	position: absolute;
	top: 0;/*24px*/
	right: 0.69vw;/*20px*/
	z-index: 3000;
}
   /*ハンバーガーボタン*/ 
    .icon-animation {
	width: 13vw;/*50px*/
	height: 13vw;/*50px*/
	display: block;
	cursor: pointer;
	float: right;
	position: absolute;
    right: .5rem;
	text-align: center;
    top: .1.5rem;
	color: #FFFFFF;
    }
    .icon-animation span {
      width: 8vw;/*30px*/
      height: 0.53vw;/*2px*/
      display: block;
      background: #FFFFFF;
      position: absolute;
      left: 50%;
      top: 50%;
      margin-left: -4vw;
      -webkit-transition: all 0.3s;
      transition: all 0.3s;
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    .icon-animation .top {
      -webkit-transform: translateY(-13px);
      -ms-transform: translateY(-13px);
      transform: translateY(-13px);
    }
    .icon-animation .bottom {
      -webkit-transform: translateY(13px);
      -ms-transform: translateY(13px);
      transform: translateY(13px);
    }
    .is-open .middle {
      background: rgba(51, 51, 51, 0);
    }
    .is-open .top {
      -webkit-transform: rotate(-45deg) translateY(0px);
      -ms-transform: rotate(-45deg) translateY(0px);
      transform: rotate(-45deg) translateY(0px);
    }
    .is-open .bottom {
      -webkit-transform: rotate(45deg) translateY(0px);
      -ms-transform: rotate(45deg) translateY(0px);
      transform: rotate(45deg) translateY(0px);
    }
	/* .global_nav */
.global_nav {
    position: fixed;
	overflow: scroll;
    top: 13vw;
    left: 0;
    width: 100%;
	height: 100vh;
    transform: translateX(100%);/* 360%*/
    padding-top: 0;
    text-align: center;
    color: #000;
    transition: all 0.7s;
	z-index: 3000;
	background:rgba(0,0,0,0.8);
}
.global_nav .nav_li {
    width: 100%;
    padding: 5px 10px;
    list-style-type: none;
	font-family: 'Noto Sans JP', sans-serif;
}
.global_nav .nav_li a {
    display: block;
    color: #FFFFFF;
}
/* .global_navに.activeが追加 */
.global_nav.active {
    transform: translateX(0%);/* 240%*/
}
#global-menu{
	display: block;
	position: absolute;
	width: 80%;
	height: 90%;
	list-style: none;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}
#global-menu li{
	font-family: 'Noto Sans JP', sans-serif;
	font-size: clamp(1.125rem, 1.006rem + 0.51vw, 1.25rem);/* 18px */
	color: #FFFFFF;
	font-weight: bold;
	padding: 9px 10px;/* 10px */
	transition: 1s;
	line-height: 1;
	text-align: center;
	width: 100%;
	margin: 10px auto;
}
#global-menu li a{
	display: block;
	color: #FFFFFF;
	text-decoration: none;
}
#global-menu li .innr2{
	font-size: 0.69rem;/* 11px */
	margin: 0;
	padding: 0;
	font-weight: normal;
}
#menu-tell{
	padding: 0;
	border-left: none;
}
.menu-tell{
	display: block;
	width: 40%;
	height: 50px;/* 70px */
	margin: 10px auto 5px;
}
.menu-tell img{
	width: 100%;
	height: auto;
}
.menu-sengen{
	position: absolute;
	width: 60%;
	height: auto;
	top: 4%;
	right: 0;
	left: 0;
	margin: auto;
	z-index: -1;
}
.menu-flaming{
	position: absolute;
	width: 27%;
	height: auto;
	bottom: 9%;
	right: 2%;
	z-index: -1;
}
.sp-menu-flower{
	position: absolute;
	width: 28%;
	height: auto;
	bottom: 9%;
	left: 1%;
	z-index: -1;
}
/*------------*/
/*===================================*/
/*------------------------------------  コンテンツcss ------------------------------------------------------------*/
#home-head{
	display: none;
}
#home-head::after{
	display: none;
}
#in-header{
	display: none;
}
/*----下層ページのpメニューの高さ---*/
#in-header2{
	position: absolute;
	display: block;
	width: 100%;
	height: 20%;/* 60px */
}
/*-------*/
#hd-logo{
	display: none;
}
#hd-menu-box{
	display: none;
}
#hd-menu-box:before{
	display: none;
}
/*----下層ページのpメニューの高さ---*/
#hd-menu-box2{
	display: none;
}
#hd-menu-box2:before{
	display: none;
}
/*------------------------------*/
#hd-menu{
	display: none;
}
#hd-menu li{
	display: none;
}
#hd-menu li a{
	display: none;
}
.sub-menu1::after{
	display: none;
}
/*--------
.sub-menu2::after{
	content: '建設汚泥処理・建設発生土処理';
	display: block;
	font-size: 13px;
	text-align: center;
}
--*/
.hd-sousyoku{
display: none;
}
.hd-sousyoku:after{
	display: none;
}
.m-msg1{
	display: none;
}
.m-msg2{
	display: none;
}
/*-------------------*/
footer{
	position: relative;
	background: rgb(2,104,55);
}
#in-footer1{
	position: relative;
	height: auto;/* 460px */
	background: url("img/common/footer-back1.png");
	background-size: cover;
}
#in-footer1::after{
	content: '';
	display: block;
	padding-top: 36%;
}
.ft-ct-title{
	position: absolute;
	width:65%;/* 790px */
	height: 35%;/* 90px */
	vertical-align: middle;
	background: #FFFFFF;
	text-align: right;
	color: rgb(2,104,55);
	font-size: 21px;/* 27px */
	font-weight: bold;
	line-height: 1;
	padding: 3.5%;/* 30px 30px */
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}
.ft-ct-title::after{
	position: absolute;
	content: '';
	display: block;
	width: 15%;
	height: 100%;/* 90px */
	top: 0;
	bottom: 0;
	right: -8%;
	background: #FFFFFF;
	clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.ct-title-img{
	position: absolute;
	display: block;
	width: 30%;/* 280px*/
	height: auto;/* 70px */
	top: 0;
	bottom: 0;
	right: 60%;/* 200px */
	margin: auto;
}
#in-footer2{
	position: relative;
}
#in-footer2-2{
	position: relative;
	height: auto;/* 550px */
}
#in-footer2-2::after{
	content: '';
	display: block;
	padding-top: 50.4%;
}
#ft-menu{
	display: none;
}
#ft-menu li{
	display: none;
}
#ft-menu li a{
	display: none;
}
#ft-logo{
	position: absolute;
	width: 50%;/* 393px */
	height: auto;
	top: 15%;/* 150px */
	left: 4.4%;/* 70px */
}
.ft-adress{
	position: absolute;
	font-size: 12px;/* 17px */
	color: #FFFFFF;
	top: 49%;/* 270px */
	left: 4.4%;/* 70px */
}
#copy{
	position: absolute;
	width: 100%;
	bottom: 3px;/* 5px */
	font-size: 10px;/* 13px */
	color: #FFFFFF;
	text-align: center;
}
/*---------------*/
.side-menu{
	display: none;
}
.side-menu li{
	display: none;
}
.side-menu li img{
	display: none;
}
/*--------------------------------------------*/
#header2{
	position: relative;
	height: auto;/* 300px */
}
#header2::after{
	content: '';
	display: block;
	padding-top: 26.7%;
}
.page-title{
	position: absolute;
	font-size: 21px;
	font-weight: normal;
	color: #FFFFFF;
	top: 0;
	bottom: 0;
	left: 10px;
	width: 100;
	height: 30px;
	margin: auto;
	padding: 0;
}
}