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

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

　   web font

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

@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,300,400,500,700,900&display=swap&subset=japanese');
@import url('https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i&display=swap');

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

　   サイト全体

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

html {
	margin:			0;
	padding:		0;
	overflow-y:		scroll;
	-moz-text-size-adjust:		none;/* スマホ文字サイズ自動調整 */
	-webkit-text-size-adjust:	100%;
	}
*{
	margin:				0;
	padding:			0;
	/* box-sizing:			border-box;	ボックスサイズ枠線まで含める */  
	}
	
body{
	width:			100%;
	padding:		0;
	font-size:		1em;
	font-family:  'Noto Sans JP','Lato',"Meiryo","メイリオ","ＭＳ　Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
	font-weight:	400;
	line-height:	190%;
	color: #777;
	/*border-top-width: 6px;
	border-top-style: solid;*/
	-webkit-font-smoothing: antialiased;/*チラつき防止*/
	}
	@media only screen and (max-width: 680px) {
		body{
			line-height:	170%;
			}
		}
	@media only screen and (max-width: 480px) {
		body{
			font-size:		0.8em;
			}
		}

.wrapper{
	overflow: hidden;
	}

#wpadminbar{
	z-index: 1000000!important;
}


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

　   画像

--------------------------------------------------------------------------------------------- */
img {
	border:			0;
	vertical-align:	middle;/*画像 縦配置時の隙間なくす*/
	}
a img {
	text-align:center;
    border-style:none;
	}

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

　   罫線

--------------------------------------------------------------------------------------------- */
hr {
	border-width: 1px 0px 0px 0px; /* 太さ */
	border-style: solid; /* 線種 */
	border-color: #CCC; /* 線色 */
	height: 1px; /* 高さ */
    max-width: 100%;
	clear:both;
	margin: 23px 0px;
	}
hr.line_dash {
	border-top: dashed #aaa 3px;
    max-width: 100%;
	clear:both;
	}

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

　   回りこみ解除

--------------------------------------------------------------------------------------------- */
.clearfix:after {
	content: " "; 
	display: block;
	clear: both;
	}

.tex img.aligncenter {
    display:		block;
    margin-left:	auto;
    margin-right:	auto;
	clear:			none;
	}
.tex img.alignright {
    margin-left:	25px;
    margin-right:	0;
    margin-bottom:	10px;
    display:		inline;
	clear:			none;
	}
.tex img.alignleft {
	margin-left:	0;
	margin-right:	25px;
	margin-bottom:	10px;
	display:		inline;
	clear:			none;
	}
.tex img.alignnone {
    margin-left:	0;
    margin-right:	0;
    margin-bottom:	10px;
	clear:			none;
	}
.tex .alignright {
	float:			right;
	}
.tex .alignleft {
	float:			left;
	}
	@media screen and (max-width: 800px){
		.tex img.alignright,
		.tex img.alignleft,
		.tex img.alignnone,
		.tex img.aligncenter {
			display:		block;
			margin-left:	auto;
			margin-right:	auto;
			clear:			both;
			}
		.tex .alignright {
			float:			none;
			}
		.tex .alignleft {
			float:			none;
			}
		.tex .aligncenter {
			clear:			both;
			display:		block;
			margin-left:	auto;
			margin-right:	auto;
			}
		}

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

　   アンカータグの設定

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

a,a:hover,a:hover img{
	text-decoration: none;
	transition-duration: 0.3s;
	}

a:hover img{
	filter: alpha(opacity=70);
	-moz-opacity:0.70;
	opacity:0.70;
	transition-duration: 0.3s;
	}

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

　   パーツ

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

/*　改行　PCで非表示　*/
.pc_hidden{
	display: none;
	}
	@media only screen and (max-width: 800px) {
		.pc_hidden{
			display:block !important;
			}
		}

/*　改行　PCで非表示　*/
.sm_hidden{
	display: block;
	}
	@media only screen and (max-width: 800px) {
		.sm_hidden{
			display:none;
			}
		}


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

　   HEADER

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



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

　   MAIN

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

/*-- メイン全体 --*/
.main{
	width: 100%;
	padding: 0;
	margin: 134px auto 0 auto;
	}

/*-- スライドイメージ --*/
.slider{
	z-index: 100;
	box-shadow: 0px 3px 10px rgba(0,0,0,0.2);
	position: relative;
	}
.slider img{
	width: 100%;
	height: auto;
	}

/*VIEW MOREボタン*/
.viewmore{
	text-align: center;
	}
.viewmore a {
	position: relative;
	display: inline-block;
	width: 35%;
	padding: 15px 0;
	margin: 35px auto;
	border: 1px solid #ddd;
	border-radius: 2px;
	color: #777;
	font-size: 0.9em;
	font-family: 'Lato';
	text-align: center;
	text-decoration: none;
	transition: .3s;
	}
.viewmore a:hover {
	color: #fff;
	}
.viewmore a::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	content: '';
	background: #ddd;
	transform-origin: right top;
	transform: scale(0, 1);
	transition: transform .3s;
	}
.viewmore a:hover::before {
	transform-origin: left top;
	transform: scale(1, 1);
	}

	@media only screen and (max-width: 980px) {
		.viewmore a {
			width: 50%;
			padding: 7px 0;
			margin: 20px auto 20px auto;
			}
		}


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

　   概要エリア

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

h2{
	margin: 0 auto;
	text-align: center;
	}

h2 span{
	display: inline-block;
	}

h2 span.heading{
	font-size: 4em;
	font-weight: 100;
	font-family: 'Lato';
	font-style: italic;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	line-height:100%;
	padding: 60px 0 12px 0;
	}
h2 span.caption{
	font-size: 0.9em;
	font-weight: 300;
	border-top-style: solid;
	border-top-width: 2px;
	position:relative;
	top: -1px;
	padding: 12px 0 60px 0;
	}
	@media only screen and (max-width: 1080px) {
		.main{
			margin: 94px auto 0 auto;
			}
		}
	@media only screen and (max-width: 800px) {
		h2 span.heading{
			font-size: 2.5em;
			line-height:100%;
			padding: 40px 0 7px 0;
			}
		h2 span.caption{
			font-size: 0.8em;
			font-weight: 700;
			padding: 7px 0 40px 0;
			}
		}


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

　   事業内容

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

.works{
	z-index: 1;
	padding-bottom: 40px;
	}

/*タイトル*/
.works h2 span.heading{
	color: #fff;
	border-bottom-color: #fff;
	}
.works h2 span.caption{
	color: #fff;
	border-top-color: #fff;
	padding: 12px 0 20px 0;
	}

/*キャッチ*/
.works .catch{
	color: #fff;
	font-weight: 500;
	text-align: center;
	margin: 0 auto 40px auto;
	width: 82%;
	}

.works_wrap{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	}

.works_item,
.works_item3{
	width: 50%;
	float: left;
	text-align: center;
	}

.works_item:nth-child(even){
	float: right;
	}

.works_item img,
.works_item3 img{
	width: 100%;
	max-width: 600px;
	height: auto;
	max-height: 400px;
	}

.works_item2 {
	width: 100%;
	text-align: center;
	}

.works_item2 img{
	width: 100%;
	height: auto;
	}
.works_item3 {
display: none;
}
.works_detail{
	display: block;
	box-shadow: 0px 3px 10px rgba(0,0,0,0.2);
	background-color: #fff;
	padding: 32px 10px;
	margin: 0 auto;
	width: 80%;
	position: relative;
	top: -75px;
	transition: .3s;
	color: #777;
	}
.works_detail h3{
	font-size: 1.4em;
	}
.works_detail p{
	line-height: 130%;
	}

	@media only screen and (max-width: 680px) {
		/*キャッチ*/
		.works .catch{
			font-size: 0.9em;
			}
		.works_item,
		.works_item3{
			width: 80%;
			float: none;
			margin: 0 auto;
			display: block;
			}
		.works_item:nth-child(even){
			float: none;
			}

		.works_item2 {
			display: none;
		}
		.works_detail{
			padding: 12px 15px;
			top: -42px;
			}
		.works_detail h3{
			font-size: 1.2em;
			}
		.works_detail p{
			font-size: 0.9em;
			margin-top: 5px;
			}
	}


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

　   新着情報

--------------------------------------------------------------------------------------------- */
.news{
	width: 100%;
	margin: 0 auto;
	background: url(../img/group_news_bg.png) no-repeat center top;
	background-position: 150%;
	position: relative;
	top: -120px;
	}

.post{
	width: 100%;
	border-bottom:1px solid #ddd;
	padding: 26px 0 ;
	}	
.post:first-of-type{
	border-top:1px solid #ddd;
	}

.post_wrap{
	width: 90%;
	max-width: 1200px;
	display: flex;
	margin: 0 auto;
	}

/*カテゴリー名*/
.post .cat{
	display: block;
	color: #fff;
	font-size:0.75em;
	font-weight: bold;
	line-height: 100%;
	text-align: center;
	border-radius: 2px;
	padding: 10px 20px;
	margin: 0 20px 0 0;
	min-width: 200px;
	}
.c_group .cat{
	background: #122cc1;
	}
.c_earth .cat{
	background: #2ea7e0;
	}
.c_ts-yuasa .cat{
	background: #f8b62d;
	}
.c_erc-fukui .cat{
	background: #3dbbc5;
	}
.c_agritope .cat{
	background: #8fc31f;
	}
.c_recruit .cat{
	background: #3ccff9;
	}
.c_news .cat{
	background: #122cc1!important;
	}

/*日付*/
.post span{
	font-size:0.95em;
	margin: 0 20px 0 0;
	}

/*エントリータイトル*/
.post h3 a{
	position: relative;
	display: inline-block;
	font-size:0.9em;
	font-weight: 400;
	color: #777;
	text-decoration: none;
	}
.post h3 a:before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	content: '';
	transform-origin: right top;
	transform: scale(0, 1);
	transition: transform .3s;
}
.post h3 a:hover:before {
	transform-origin: left top;
	transform: scale(1, 1);
}
/*hover背景の色*/
.c_group h3 a:before {/*グループについて*/
	background: -webkit-linear-gradient(transparent 50%, #dde1f6 0%);
	background: -o-linear-gradient(transparent 50%, #dde1f6 0%);
	background: linear-gradient(transparent 50%, #dde1f6 0%);
}
.c_earth h3 a:before {/*アースコーポレーション*/
	background: -webkit-linear-gradient(transparent 50%, #e1f2fb 0%);
	background: -o-linear-gradient(transparent 50%, #e1f2fb 0%);
	background: linear-gradient(transparent 50%, #e1f2fb 0%);
}
.c_ts-yuasa h3 a:before {/*湯浅産業&トータルシステム*/
	background: -webkit-linear-gradient(transparent 50%, #fef4e2 0%);
	background: -o-linear-gradient(transparent 50%, #fef4e2 0%);
	background: linear-gradient(transparent 50%, #fef4e2 0%);
}
.c_erc-fukui h3 a:before {/*ERC福井*/
	background: -webkit-linear-gradient(transparent 50%, #e3f5f7 0%);
	background: -o-linear-gradient(transparent 50%, #e3f5f7 0%);
	background: linear-gradient(transparent 50%, #e3f5f7 0%);
}
.c_agritope h3 a:before {/*アグリトープ*/
	background: -webkit-linear-gradient(transparent 50%, #eef6e1 0%);
	background: -o-linear-gradient(transparent 50%, #eef6e1 0%);
	background: linear-gradient(transparent 50%, #eef6e1 0%);
}
.c_recruit h3 a:before {/*採用情報*/
	background: -webkit-linear-gradient(transparent 50%, #b8ecfb 0%);
	background: -o-linear-gradient(transparent 50%, #b8ecfb 0%);
	background: linear-gradient(transparent 50%, #b8ecfb 0%);
}
#3ccff9;
	@media only screen and (max-width: 980px) {
		.news{
			top: 0;
			padding-bottom: 30px;
			}
		}
	@media only screen and (max-width: 800px) {
		.news{
			background: url(../img/group_news_bg.png) no-repeat center;
			background-position: 10%;
			background-size: 125%;
			}
		.post{
			line-height: 150%;
			}
		.post_wrap{
			width: 88%;
			max-width: 1200px;
			display:table;
			margin: 0 auto;
			}
		/*カテゴリー名*/
		.post .cat{
			display: inline-block;
			margin: 0 0 8px 0;
			}
		/*日付*/
		.post span{
			display: block;
			margin: 0;
			}
		/*エントリータイトル*/
		.post h3 a{
			display: block;
			}
		}
	@media only screen and (max-width: 680px) {
		.news{
			top: 0;
			}
		.post{
			padding: 12px 0 ;
			}
		}


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

　   お問い合わせ先　住所

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

address.address{
	background-color: #d9d9d9;
	padding: 40px 0 48px 0;
	font-style: normal;
	line-height: 150%;
}
.add_top{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto 30px auto;
}

/*社名*/
.add_top h2{
	float: left;
	font-size: 1.4em;
	text-align: left;
}
.add_top h2 span{
	display: block;
	font-size: 0.55em;
	font-weight: 400;
}

/*お問い合わせ先*/
.add_info{
	float: right;
	width: 35%;
}
.add_info .waku{
	font-size: 1em;
	font-weight: 500;
	text-align: center;
	border: solid 1px #aaa;
	padding:10px 15px 12px 15px;
	margin-right: 20px;
	float: left;
}
.add_info span{
	display: block;
	font-size: 1.7em;
	font-weight: 500;
}
.add_info p{
	display: block;
	font-size: 0.9em;
}


/*住所*/
.add_bottom{
	width: 100%;
	max-width: 1200px;
	/*display: flex;
	justify-content: space-between;*/
	margin: 20px auto 0 auto;
}
.add_item{
	border-right: solid 1px #bbb;
	padding: 0 20px;
	float: left;
	min-width: 25%;
}
.add_item:first-child{
	padding: 0 20px 0 0;
}
.add_item:last-child{
	border-right: none;
}
.add_item h3{
	font-size: 0.95em;
}
.add_item p{
	font-size: 0.9em;
}


	@media only screen and (max-width: 	1200px) {
		.add_top,
		.add_bottom{
			width: 94%;
			}
		.add_info{
			width: 40%;
			}
		.add_item{
			min-width: 12%;
			}
		}
	@media only screen and (max-width: 	980px) {
		.add_info{
			width: 55%;
			}
		.add_info .waku{
			margin-right: 10px;
			}
		.add_item{
			min-width: 50%;
			margin-bottom: 20px;
			}
		.add_item:nth-child(even){
			border-right: none;
			}
		.add_item:nth-child(odd){
			padding: 0 20px 0 0;
			}
		}
	@media only screen and (max-width: 	710px) {
		address.address{
			padding: 26px 0 20px 0;
			}
		.add_top{
			width: 90%;
			margin: 0 auto;
			}
		.add_top h2{
			float: none;
			font-size: 1.25em;
			}
		.add_info{
			float: none;
			width: 100%;
			margin-top: 10px;
			}
		.add_info .waku{
			padding:10px;
			float: left;
			}
		.add_bottom{
			display:block;
			width: 90%;
			margin: 10px auto 0 auto;
			}
		.add_item{
			border-bottom: solid 1px #bbb;
			border-right: none;
			padding: 4px 0 7px 0;
			min-width: 100%;
			margin-bottom: 7px;
			line-height: 125%;
			}
		.add_item:first-child,
		.add_item:nth-child(odd){
			padding: 4px 0 7px 0;
			}
		.add_item:last-child{
			border-bottom: none;
			}
		.add_info span{
			font-size: 1.5em;
			}
		}


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

　   バナー

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

.bnr{
	width:100%;
	max-width: 1400px;
	margin:0 auto;
	}
.b_1 a{
	background:url(../img/bnr_history.jpg) no-repeat center top;
	}
.b_2 a{
	background:url(../img/bnr_recruit.jpg) no-repeat center top;
	}
.b_1 a,
.b_2 a{
	display:block;
	width:50%;
	min-height:200px;
	padding:70px 0 0 50px;
	color: #fff;
	float: left;
	}
.b_1 a:hover,
.b_2 a:hover{
	opacity:0.7;
	filter:alpha(opacity=70);
	-ms-filter:"alpha( opacity=70 )";
	}

.b_1 a h4,
.b_2 a h4{
	font-size: 3.2em;
	font-weight: 900;
	}
.b_1 a span,
.b_2 a span{
	display: block;
	font-size: 1.2em;
	margin-top: 10px;
	font-weight: 500;
	}
	@media only screen and (max-width: 980px) {
		.b_1 a,
		.b_2 a{
			min-height:150px;
			padding:45px 0 0 25px;
			background-size: cover;
			}
		}
	@media only screen and (max-width: 800px) {
		.b_1 a h4,
		.b_2 a h4{
			font-size: 2.5em;
			}
		.b_1 a span,
		.b_2 a span{
			display: block;
			font-size: 1.2em;
			margin-top: 2px;
			}
		}
	@media only screen and (max-width: 680px) {
		.b_1 a,
		.b_2 a{
			display:block;
			width:100%;
			padding:25px 0 0 5%;
			float: none;
			min-height:100px;
			}
		.b_1 a h4,
		.b_2 a h4{
			font-size: 2.6em;
			}
		.b_1 a span,
		.b_2 a span{
			display: block;
			font-size: 1.2em;
			margin-top: 5px;
			}
		}




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

　   FOOTER

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

/*-- フッター全体 --*/
.footer{
	background: #777;
	width: 100%;
	color: #fff;
	font-weight: 500;
	}


/*-- フッターメニュー　括り --*/
.footer ul.f_menu{
	font-size: 0.95em;
	padding: 42px 0;
	text-align: center;
	}
.footer ul.f_menu li{
	margin-right: 3%;
	list-style: none;
	display: inline-block;
	}
.footer ul.f_menu li a{
	color: #fff;
	}

/*-- グループ --*/
.footer ul.f_group{
	font-size: 0.8em;
	text-align: center;
	margin: 0 auto 15px auto;
	}
.footer ul.f_group li{
	list-style: none;
	display: inline-block;
	margin-right: 15px;
	}
.footer ul.f_group li::before{
	font-family: "Font Awesome 5 Free";
	font-weight: 500;
	content: "\f2d2";
	margin-right: 6px;
}
.footer ul.f_group li a{
	color: #fff;
	}

.footer ul.f_menu li a:hover,
.footer ul.f_group li a:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.70;
	opacity:0.70;
	transition-duration: 0.3s;
}

/*-- フッター ロゴ --*/
.f_ttl_wrap{
	width: 90%;
	margin: 0 auto;
	padding: 50px 0;
	border-top: solid 1px #fff;
	text-align: center;
	}
.f_ttl img{
	width: 100%;
	max-width: 387px;
	height: auto;
	max-height: 80px;
	margin: 0 auto 0 auto;
	}

/*-- コピーライト --*/
.copy{
	width: 90%;
	margin: 0 auto;
	padding: 35px 0;
	text-align: center;
	border-top: solid 1px #fff;
	}
.copy small{
	color: #fff;
	font-size: 0.7em;
	font-family: 'Lato';
	}
	@media only screen and (max-width: 680px) {
		.f_ttl_wrap{
			width: 90%;
			margin: 0 auto;
			padding: 50px 0;
			border-top: none;
			}
		.footer ul.f_menu{
			display: none;
			}
		/*.footer ul.f_group{
			display: none;
			}*/
		.footer ul.f_group li{
			font-size: 0.9em;
			line-height: 100%;
			margin-right: 10px;
			}
		.f_ttl_wrap{
			width: 70%;
			padding: 20px 0;
			}
		.copy{
			padding: 12px 0 30px 0;
			}
		.copy small{
			font-size: 0.9em;
			}
		}


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

　   PAGETOP

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

#page_top a{
	display: block;
	width: 64px;
	height: 53px;
	margin: 35px auto;
	background:url(https://www.erc-co.jp/erc-co/img/pagetop_r.png);
		text-indent: -9999px;
	}
	@media only screen and (max-width: 680px) {
		#page_top a{
			margin: 20px auto;
			}
		}

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

　   スマホのみで電話発信（PCで無効）

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

@media(min-width: 800px){
	a[href^="tel:"]{
		pointer-events: none;
		color: #777;
		}
	}