@charset "utf-8";
/* CSS Document */
#Corporate {
	.box01 {
		background-color: #e9f7eb;
		margin-top: 30px;
		text-align: center;
		padding: 20px 10px;
	}
	.box01-text {
		font-size: 18px;
		font-weight: 500;
	}
	.box02-text {
		font-size: 24px;
		font-weight: 900;
	}
	.box03-text {
		font-size: 20px;
		font-weight: 700;
	}
	.color01 {
		color: #28ad3f;
	}
	
	/* SDGS Icon */
	.sgdsbox01-logoList03 {
		display: flex;
		margin-top: 10px;
		width: 100%;
	}
	.sgdsbox01-logoList03-item + .sgdsbox01-logoList03-item {
		padding-left: 20px;
	}
	.sgdsbox01-logoList03-item img {
		width: 100%;
	}
	
	@media screen and (min-width: 768px),print {
		.box01 {
			padding: 50px 20px;
		}
		.box01-text {
			font-size: 30px;
		}
		.box02-text {
			font-size: 46px;
		}
		.box03-text {
			font-size: 36px;
		}
	}
	
	.imgCol2 {
		margin-top: 30px;
	}
	.imgCol2-left {
		text-align: center;
	}
	.imgCol2-right {
		margin-top: 20px;
		text-align: center;
	}
	
	.imgCol2-right-linkList01,
	.imgCol2-right-linkList02 {
		margin-top: 15px;
		text-align: left;
	}
	.imgCol2-right-linkList-text + .imgCol2-right-linkList-text {
		margin-top: 5px;
	}
	.imgCol2-right-link {
		position: relative;
		padding-left: 20px;
		display: inline-block;
	
	}
	.imgCol2-right-link::before {
		content: "";
		display: block;
		width: 16px;
		height: 16px;
		background-color: #de0000;
		position: absolute;
		top: 0;
		left: 0;
	}
	.imgCol2-right-link::after {
		content: "";
		display: block;
		width: 8px;
		height: 8px;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		-webkit-transform: rotate(45deg);
				transform: rotate(45deg);
		position: absolute;
		top: 4px;
		left: 2px;
	}
	.imgCol2-right-linkList-text02::before {
		content: "";
		display: block;
		width: 18px;
		height: 18px;
		background-image: url("/company/sustainability/symbiosis/water/img/ico_tree.png");
		background-repeat: no-repeat;
		background-position: 0 top;
		background-size: contain;
		position: absolute;
		top: auto;
		left: auto;
	}
	.imgCol2-right-linkList-text02 .imgCol2-right-link::before {
		content: "";
		display: block;
		background-color: inherit;
		position: absolute;
		top: auto;
		left: auto;
	}
	.imgCol2-right-linkList-text02 .imgCol2-right-link::after {
		content: "";
		display: block;
		width: 8px;
		height: 8px;
		border-top: none;
		border-right: none;
		position: absolute;
		top: 4px;
		left: 2px;
	}
	.newicon {
		display: inline-block;
		background-color: #de0000;
		color: #fff;
		padding: 0px 5px 2px;
		line-height: 1.2;
		font-size: 70%;
		font-weight: normal;
	}
	@media screen and (min-width: 768px),print {
		.imgCol2-right-linkList-text + .imgCol2-right-linkList-text {
			margin-top: 0;
			margin-left: 10px;
		}
		.imgCol2-right-img-wrap {
			display: inline-block;
			position: relative;
		}
		.imgCol2-right-linkList01 {
			position: absolute;
			left: 0;
			right: 0;
			bottom: 0;
			background-color: rgba(255,255,255,0.85);
			display: flex;
			justify-content: space-around;
			padding: 15px 10px;
		}
		.imgCol2-right-linkList02 {
			position: absolute;
			left: 0;
			right: 0;
			bottom: -55px;
			background-color: rgba(146,181,157,0.85);
			display: flex;
			justify-content: space-around;
			padding: 15px 10px;
		}
	
		.imgCol2-right-linkList-text02::before {
			width: 25px;
			height: 25px;
		}
	
		.newicon {
			font-size: 76%;
		}
		.imgCol2-right-link {
			font-size: 16px;
			padding-left: 23px;
			display: inline-block;
		}
		.imgCol2-right-link::before {
			width: 20px;
			height: 20px;
			top: -1px;
		}
		.imgCol2-right-link::after {
			width: 10px;
			height: 10px;
			top: 5px;
			left: 3px;
		}
		.imgCol2-left-img {
			width: 100%;
			max-width: 384px;
		}
		.imgCol2-right-img {
			width: 100%;
			max-width: 824px;
		}
	}
	@media screen and (min-width: 1025px),print {
		.imgCol2 {
			display: flex;
			justify-content: space-between;
		}
		.imgCol2-left {
			width: 33.4%;
			text-align: left;
		}
	
		.imgCol2-right {
			width: 64%;
			margin-top: 0;
		}
	
	}
	
	.youtubeList {
		display: flex;
		justify-content: space-between;
	}
	.youtubeList > li {
		position: relative;
		width: 48%;
		padding-top: 27%;
	}
	.youtubeList iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	@media screen and (max-width: 767px),print {
		.youtubeList {
			display: block;
		}
		.youtubeList > li {
			width: auto;
			padding-top: 56.25%;
		}
		.youtubeList > li + li {
			margin-top: 30px;
		}
	}
}


