@charset "UTF-8";
/*----------
	sustainability top
----------*/
.un-extrabnr {
	.un-extrabnr__inner {
		display: flex;
		align-items: center;
		background-color: #EAF4FD;
	}

	.un-extrabnr__image {
		flex: 0 0 50%;
	}

	.un-extrabnr__detail {
		flex: 0 0 50%;
		padding-inline: 20px;
	}

	.un-extrabnr__title {
		position: relative;
		padding-right: 45px;
		font-size: 1.8rem;
		font-weight: 500;
	}

	.un-extrabnr__title::after {
		content: '';
		position: absolute;
		top: 50%;
		right: 0;
		translate: 0 -50%;
		display: block;
		width: 32px;
		height: 32px;
		background: url(/kyodo/assets/images/icon_arrow_l.svg) no-repeat 0 0;
		background-size: cover;
	}
}


@media (min-width: 768px), print {
	.un-extrabnr {
		width: 900px;
		margin-inline: auto;

		.un-extrabnr__inner {
			transition: opacity 0.2s;

			&:hover {
				opacity: 0.7;
			}
		}

		.un-extrabnr__image {
			flex: 0 0 337px;
		}

		.un-extrabnr__detail {
			flex: 0 0 563px;
			padding-inline: 40px;
		}

		.un-extrabnr__title {
			padding-right: 60px;
			font-size: 2.8rem;
		}

		.un-extrabnr__title::after {
			width: 56px;
			height: 56px;
		}
	}
}