@charset "UTF-8";
@media screen and (max-width: 1180px) {
	

/*私たちにできること*/
.service-detail01 img,.service-detail03 img{
width:45%;
}
	.service-detail02 img{
		width:45%;

}
#service .service-text{
		width:45%;
			line-height : 40px;
}

}


@charset "UTF-8";
@media screen and (min-width: 768px) {
	.SPmenu {
display: none;
	}
	
}



@charset "UTF-8";
@media screen and (max-width: 768px) {
	
	/*スライダーテキスト*/
.slide-text01{
	font-size: 16px;
	letter-spacing: 4px;
		line-height:40px;
}
.slide-text02{
left: 20px;
font-size: 16px;
letter-spacing: 4px;
line-height:30px;
}
	/*お知らせ*/
	
#news , #about , #service , #company {
	padding-top:100px;
}
	.border_news{
		width:80%;
	}
	.border_news th{
	padding-left: 20px;
	padding-right: 20px;
width:25%;
	}
		.border_news td{
	padding-left: 20px;
	padding-right: 20px;
}
/*私たちのこだわり*/
#about p{
  margin-left: auto;
	margin-right: auto;
		width:80%;
}
/*私たちにできること*/
	#service{
text-align: center;
	}
.service-detail01 img,.service-detail03 img{
		float: none;
		width:80%;
}
.service-detail02 img{
		float: none;
		width:80%;
}
	#service .service-text{
		padding:0px 0px 80px 0px;
		width:80%;
		float: none;
		margin-left:auto;
		margin-right:auto;
}
/*会社概要*/
.border_company{
		width:80%;
	}
		.border_company td{
	padding-left: 20px;
	padding-right: 20px;
}
	.border_company th{
	padding-left: 20px;
	padding-right: 20px;
width:25%;
}
	/*フッター*/
	footer nav{
	margin:20px 0px 0px 0px;
	}
	footer .nav2{
	margin:40px 0px 40px 0px;
}
	footer nav ul li{
		line-height:30px;
}
.footer-line {
	margin:40px 0px 0px 0px;
	}


	/*SPメニュー*/
.SPmenu {
	/* メニューを縦に */
	display: flex;
	flex-direction: column;
	position: fixed;
	/* メニューの位置マイナス指定で画面外に */
	right: -100%;
	width: 70%;
	height: 90%;
	background-color: rgba(63, 49, 43, 0.8);
	transition: .3s;
	top: 20px;
}
.SPmenu-list {
	/* メニューテキスト位置をリスト内中心に */
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	}
	.SPmenu-list:hover {
	background-color: rgba(63, 49, 43, 0.8);
	cursor: pointer;
	transition: .3s;
	}
	.SPmenu-list a{
	text-align:center;
	padding: 50px 50px;
	width: 100%;
	height: 100%;
}
/***** メニューオープン時位置0にして画面内に *****/
.SPmenu.open {
	right: 0;
}
	
	/*ハンバーガーボタン*/
.btn {
  /* ボタンの配置位置  */
  position: fixed;
  top: 20px;
	right: 24px;
  /* ボタンの大きさ  */
  width: 44px;
  height: 52px;
  /* 最前面に */
		z-index: 9999;
		border-color: rgba(0,0,0,0);
		 background-color: rgba(0,0,0,0);
}
/***** 真ん中のバーガー線 *****/
.btn-line {
	display: block;
	position: relative;  /* バーガー線の位置基準として設定 */
	width: 100%;  /* 線の長さと高さ */
	height: 4px;
	background-color: #fff;  /* バーガー線の色 */
	transition: .2s;
}
/****** 上下のバーガー線 *****/
.btn-line::before , .btn-line::after {
  content: "";
		position: absolute;	/* 基準線と同じ大きさと色 */
		  right: 0px;
  width: 100%;
  height: 100%;
  background-color: #fff;
  transition: .5s;
}
.btn-line::before {
  /* 上の線の位置 */
  transform: translateY(-16px);
}
.btn-line::after {
  /* 下の線の位置 */
  transform: translateY(16px);
}

/***** メニューオープン時 *****/
.btn-line.open {
	background-color: transparent;  	/* 真ん中の線を透明に */
}
.btn-line.open::before ,
.btn-line.open::after {
	content: "";
	background-color: #fff;  /* 上下の線の色を変える */
		transition: .2s;
}
.btn-line.open::before {
	transform: rotate(45deg);  /* 上の線を傾ける */
}
.btn-line.open::after {
	transform: rotate(-45deg);  /* 下の線を傾ける */
}
	
/* PCメニュー非表示 */
.PCmenu , .ContactBtn {
display: none;
}
	
/*スクロールフェード（Newsのみ）無効-----------------------------*/
#news .scroll-up {
  opacity: initial; 
  visibility: initial;
  transform: initial;
  transition: initial;
}
	
}