@charset "utf-8";
#loading{
	display: none;
}

section{
	width:100%;
	margin:0 auto;
	padding:80px 0;
}

h1{
	display: inline-flex;
	align-items: center;
	gap:15px;
}

h1 img{
	height: 1.5em;
	width:auto;
}

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

	上部

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

section#top-item{
	padding:150px 0 80px 0;
	display: flex;
	/*align-items: center;*/
	gap:100px;
}

#csr-logo{
	width:230px;
	text-align: center;
	line-height: 0;
}

#csr-logo img{
	display: none;
	width:auto;
	height: 100%;
}

#top-item .main{
	flex:1;
	/*margin-left: 30px;*/
}

#compliance{
	margin-top:30px;
	background-image:url(img/rinen-back.jpg);
	padding:20px 20px 20px 0;
	border-radius: 10px;
}

#compliance h2{
	margin-bottom:20px;
	background-color:#75C799;
	padding:0 8px;
	border-radius: 100px;
	display: inline-block;
	color:#fff;
	margin-left:10px;
}

#compliance .text{
	font-family: 'Noto Serif JP',"HG明朝E","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN",  "ＭＳ Ｐ明朝", serif;
	font-size:20px;
	font-weight: 800;
	padding:0 20px;

}

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

	レスポンシブ

------------------------------*/
@media screen and (max-width: 980px){
	section#top-item{
		flex-direction: column;
		gap:50px;
	}
	
	#csr-logo{
		margin:0 auto;
	}
	
	#top-item .main{
		flex:none;
	}
}

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

	CSR方針

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

#policy h2{
	font-family: 'Noto Serif JP', serif;
	text-align: center;
	font-size: 2.3rem;
	font-weight: 800;
	margin-bottom:100px;
	display: flex;
	align-items: center;
	letter-spacing: 3px;
	/*color:var(--green)*/
}

#policy h2::before,
#policy h2::after{
	content: '';
	flex:1;
	height: 2px;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
}

#policy h2::before{
	margin-right:20px
}

#policy h2::after{
	margin-left:20px
}


#policy .inner{
	width:100%;
	display: flex;
	gap:30px;
	margin-bottom:100px;
}


#policy #cachi{
	font-weight: 700;
	margin-bottom:30px;
	font-size:1.1rem;
}

#policy .shoujyou{
	/*width:550px;*/
	flex:1;
	line-height: 0;
}

#policy .shoujyou img{
	width:100%;
	height: auto;
	border: 1px solid #ddd;
	border-radius: 3px;
}

#policy-main{
	flex:1;
	margin-left:40px;
	marign-bottom:30px;
}

#policy-main li{
	margin-bottom:8px;
	padding-left:1.5em;
	text-indent: -1.5em;
	font-size: 1rem;
}

#photo{
	width:100%;
	display: flex;
	gap:5px;
	flex-wrap: wrap;
}

#photo li{
	 flex:1;
	line-height: 0;
}

#photo li img{
	width:100%;
	height: auto;
	border-radius: 5px;
}


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

	レスポンシブ

------------------------------*/
@media screen and (max-width: 980px){
	#policy .inner{
		flex-direction: column;
		gap:50px;
	}
	
	#policy-main{
		margin-left:0;
	}
	#policy .shoujyou{
		flex:none;
		width:min(100%,400px);
		margin: 0 auto;
	}
	#photo{
		widt:100%;
		flex:none;
		justify-content: space-around;
		align-items: stretch;
		gap:10px;
	}
	
	#photo::after{
		content: '';
		width:min(calc(50% - 10px),350px);
		display: block;
		background-image: url("img/back.jpg");
		background-size: 50% auto;
		background-position: right bottom;
		background-repeat: no-repeat;
	}
	#photo li{
		flex:none;
		width:min(calc(50% - 10px),350px);
		text-align: center;
		justify-content: center;
	}
	
}