@charset "UTF-8";
/* ************************************** _

タイトル：company.css

概要：会社概要の追加css

_ ************************************** */


/* 会社概要
---------------------------------------------------------------------------- */

.sp_only{display:none!important;}
#about_wrap .sdg_wrap .sdgimg img{
	width:60px;
}

@media screen and (max-width: 960px) {
	/* 会社概要
---------------------------------------------------------------------------- */
	#greet_wrap .greet{
		margin:0 auto;
		max-width:960px;
		width:100%;
	}

	#about_wrap {
		margin:0 auto 50px auto;
		max-width:960px;
		width:100%;
	}

	#about_wrap .sdg_wrap{
		position: relative;
		margin:30px 0 60px 0;
		width:100%;
		/*border-bottom:1px solid #ccc;*/
		padding-bottom:10px;
	}

	#about_wrap dt {
	  width: 100%;
	  padding: 10px;
	  background-color: #d4efff;
	  margin: 0 0 0 0;
	  border-top-left-radius: 3px;
	  border-bottom-left-radius: 3px;
	  display: flex;
	  align-items: center;
	  justify-content: center;
		font-weight:bold;
	}
	#about_wrap dd {
	  width: 100%;
	  padding: 10px 20px;
	  background-color: #f2f2f2;
	  margin: 0 0 10px 0;
	  border-top-right-radius: 3px;
	  border-bottom-right-radius: 3px;
	}

	#about_wrap table{
		width: 100%;
	}

	#about_wrap table tr:nth-child(even) {
	background: #f7f7f7;
	}

	#about_wrap th{
		border-bottom: 2px solid #43ADE9;
		padding: 20px 8px 18px 15px;
		width: 25%;
		vertical-align: top;
	}
	#about_wrap td{
		border-bottom: 1px solid #ccc;
		padding: 20px 8px 18px 15px;
		line-height: 1.5;
		vertical-align: top;
	}
	#about_wrap td ul{
		padding-left:20px;

	}
	#about_wrap td li{
		list-style-type:decimal;
		margin-bottom: 12px;
		line-height:1.3;

	}

	#map_wrap {
		margin:0 auto 70px auto;
		max-width:960px;
		width:100%;
	}

	#map_wrap iframe {
	pointer-events:none;
	}
	.sp_pd{padding:0 20px;}
	
	/* Google Map */
	.ggmap {
	  position: relative;
	  width: 100%;
	  height: 0;
	  padding-top: 75%; /* 比率を4:3に固定 */
	}

	/* Google Mapのiframe */
	.ggmap iframe {
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	}
	
	.aisatsu_m_img{width:130px;}
	.daiyo_name{width:250px;}
	
	
	.page_top_bg img {width: auto!important; }
}

@media screen and (max-width: 768px) {
	/* 会社概要
---------------------------------------------------------------------------- */
	.pc_only{display:none!important;}
	.sp_only{display:block!important;}
	
	#greet_wrap{
		padding:50px 0 50px 0;
		background: url(../images/voice/voice_bg.png) repeat left top;
		margin-bottom:50px;
	}

	#greet_wrap .greet p{
		font-family: "Sawarabi Mincho";
		font-size:16px;
	}

	#about_wrap h2{
		position: relative;
		display: inline-block;
		font-size:26px;
		margin-bottom:50px;
		font-weight:bold;
		font-family: "Sawarabi Mincho";
	}
	#about_wrap h2:before {
		content: '';
		position: absolute;
		bottom: -20px;
		display: inline-block;
		width: 100px;
		height: 4px;
		left: 50%;
		-moz-transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%);
		background-color: #00ab95;
		border-radius: 2px;
	}

	#about_wrap h2 span{
		font-size:18px;
	}

	#about_wrap h3 , #map_wrap h3{
		font-size:20px;
		font-weight:bold;
		padding-left:12px;
		border-left:5px solid #00ab95;
		margin-bottom:20px;
		line-height:1.4;
	}
	#about_wrap h4{
		font-size:18px;
		font-weight:bold;
		color:#00AB95;
		margin-bottom:6px;
	}

	#about_wrap .sdg_wrap .sdgimg{
		position: static;
		right:0;
		top:0;
		display: flex;
		flex-wrap: wrap;
		justify-content:flex-start;
		flex-direction: row;
		align-items: stretch;
		width:100%;
		gap:3px;
	}
	#about_wrap .sdg_wrap .sdgimg:after {/*半端でも左寄せ*/
        content: "";
        display: block;
        width: 15.5%;
        height: 0;
    }
	#about_wrap .sdg_wrap .sdgimg img{
		flex-basis: 15.5%;
		max-width:15.5%;
	}

	#about_wrap dl {
	  display: flex;
	  flex-wrap: wrap;
	}

	.sp_pd{padding:0 20px;}
	
	.aisatsu_m_img{width:130px;}
	.daiyo_name{width:250px;}
	
	
	/*3カラム */
	.colum3_wrap div.colum3_wrap_box{
		flex-basis: 100%;
		max-width: 100%;
		margin-bottom:20px;
	}
	/*2カラム* 20210324追加*/
	.colum2_wrap div.colum2_wrap_box{
		flex-basis: 100%;
		max-width: 100%;
		margin-bottom:20px;
	}
	
	.page_top_bg img {width: auto!important; }
}