@charset "UTF-8";
/* /partners/kawasaki_city_100th/asset/css/base.css */


/* * {
	font-family: YakuHanJP, 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
} */

/*  */

#box_kv {
	max-width: 2000px;
	width: 100%;

	height: calc(100vw * 0.334);
	/* height: 668px; */
	max-height: 668px;
	min-height: 520px;

	background-image: url(/partners/kawasaki_city_100th/asset/img/bg_kv_main_pc.avif);
	background-size: auto 100%;
	background-position: 50% 0;
	background-repeat: no-repeat;

	position: relative;
	margin: 0 auto;
}

/* #box_kv::before {
	content: '';
	display: block;
	width: calc(100vw * 0.928);
	max-width: 1856px;

	height: calc(100vw * 0.928 * 0.08189655172413793);
	max-height: 152px;
	background-image: url(/partners/kawasaki_city_100th/asset/img/typo_kawasaki_100th.svg);
	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: auto 100%;

	position: absolute;
	bottom: calc(100vw * 0.06060606060606061 * -1);
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
} */

#typo_kawasaki_100th {
	display: block;
	width: calc(100vw * 0.928);
	max-width: 1856px;

	height: calc(100vw * 0.928 * 0.08189655172413793);
	max-height: 152px;

	margin: calc(100vw * 0.01515151515151515 * -1) auto 0;

	/* position: absolute;
	bottom: calc(100vw * 0.06060606060606061 * -1);
	left: 50%;
	transform: translateX(-50%);
	z-index: -1; */
}

#typo_kawasaki_100th img {
	width: 100%;
	height: auto;
}

#box_kv div.inner {
	/* width: 900px; */
	width: calc(100vw * 0.4545454545454545);
	max-width: 900px;
	min-width: 720px;
	height: auto;
	margin: 0 auto;
	position: relative;
}

#box_kv div.inner picture {
	display: block;
	width: 100%;
}

#box_kv div.inner picture img {
	width: 100%;
}

#box_kv div.inner h1 {
	display: none;
}

#box_kv figure {
	position: absolute;
	right: -150px;
	bottom: -300px;
	width: calc(100vw * 0.1131313131313131);
	max-width: 224px;
	min-width: 179.312px;
	z-index: 9999;
}

@media screen and (max-width: 1979px) {
	#box_kv figure {
		right: calc(100vw * 0.07579585649317837 * -1);
		bottom: calc(100vw * 0.1515151515151515 * -1);
	}
}

/* 1584 */
@media screen and (max-width: 1584px) {
	#box_kv figure {
		right: -120.136px;
		bottom: -240.152px;
	}
}

#box_kv figure img {
	width: 100%;
}

/*  */

main {
	width: 1980px;
	min-width: 1412px;

	margin-inline: auto;
	margin-top: calc(100vw * 0.03434343434343434);

	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

@media screen and (min-width: 1980px) {
	main {
		margin-top: 68px;
	}
}

@media screen and (max-width: 1600px) {
	main {
		width: 100%;
	}
}

main img {
	width: 100%;
	height: auto;
}

main h2 {
	font-size: 2.8rem;
	margin-bottom: 45px;
}

main div.wrap {
	width: 1100px;
	position: relative;
	margin: 0 auto 0;
	/* min-height: 1114px; */
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	overflow: visible;

	order: 2;
}

@media (min-width: 1601px) and (max-width: 1979px) {
	main {
		width: 100%;
	}

	main div.wrap {
		width: calc(100vw * 0.5555555555555556);
	}
}

@media screen and (max-width: 1600px) {
	main div.wrap {
		width: 780px;
	}
}

@media screen and (max-width: 1412px) {

	main,
	#box_kv {
		width: 1412px;
		position: relative;
		left: 50%;
		transform: translateX(-50%);
		z-index: 9;
	}

	#box_kv {
		height: 472px;
		max-height: initial;

	}
}

/*  */

#list_partner {
	width: 780px;
}

ul[id^="list_"] {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

ul[id^="list_"]:not(:first-child) {
	margin-top: 50px;
}

#list_a {
	width: 770px;
	gap: 24px 40px;
}

#list_a li {
	width: calc(770px / 2 - 20px);
}

#list_b {
	width: 680px;
	gap: 24px 38px;
}

#list_b li {
	width: calc(680px / 2 - 38px);
}

#list_c {
	width: 700px;
	gap: 24px 38px;
}

#list_c li {
	width: calc(100% / 2.4 - 38px);
}

#list_d {
	width: 680px;
	gap: 24px 12px;
}

#list_d li {
	width: calc(680px / 4 - 20px);
}

#list_d li img {
	max-width: 100%;
	max-height: 30px;
	width: auto;
}


ul[id^="list_"] a {
	display: block;
	text-align: center;
	/* background-color: antiquewhite; */
}

ul[id^="list_"] a:hover {
	transition: all 0.15s ease-in;
	opacity: 0.8;
}

ul[id^="list_"] a img {
	width: 100%;
	height: auto;
}

ul[id^="list_"] .border {
	border: 1px solid #c7c4c3;
}

/*  */

#description {
	width: 20em;
	/* position: absolute;
	top: 0;
	right: 0; */
}

#description p {
	font-size: 1.5rem;
	line-height: 1.4;
	font-weight: 500;
}

#description p:not(:first-child) {
	margin-top: 1em;
}

@media screen and (max-width: 1900px) {
	#description {
		width: 100%;
		margin-top: 60px;
	}
}


/*  */

.bnr {
	width: 944px;
	margin: 90px auto 0;
}

.bnr p {
	width: 100%;
}

.bnr p:not(:first-child) {
	margin-top: 55px;
}

.bnr p a {
	display: block;
	transition: 0.3s;
}

.bnr p img {
	width: 100%;
	height: auto;
}

.bnr p a:hover {
	transform: translate(0, -8px);
}

@media screen and (max-width: 1600px) {
	.bnr {
		width: 100%;
	}
}

/*  */

[id^="grid_"] {
	width: calc(100vw * 0.1868686868686869);
	max-width: 370px;
}

#grid_sp {
	display: none;
}

#grid_left {
	order: 1;
}

#grid_right {
	order: 3;
}

[id^="grid_"] ul {
	display: flex;
	flex-wrap: wrap;
}

[id^="grid_"] li {
	width: calc(100vw * 0.1868686868686869 / 2);
	height: calc(100vw * 0.1868686868686869 / 2);
	max-width: 185px;
	max-height: 185px;
	overflow: hidden;
}

[id^="grid_"] li.fig_13 {
	height: calc(100vw * 0.1868686868686869);
	max-height: 370px;
}

[id^="grid_"] li.x2 {
	width: 100%;
	max-width: initial;
}

[id^="grid_"] li.pink {
	background-color: #FFD1D1;
}

[id^="grid_"] li.blue {
	background-color: #CFEFFF;
}

[id^="grid_"] li.green {
	background-color: #DEF9D5;
}

[id^="grid_"] li.symbol {
	background-image: url(/partners/kawasaki_city_100th/asset/img/kawasaki_city_symbol.svg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 94px auto;
}

[id^="grid_"] li.right {
	/* margin-left: 235px; */
}

/* 1412px */
@media screen and (max-width: 1412px) {

	[id^="grid_"] {
		width: 286px;
	}

	[id^="grid_"] li {
		width: 143px;
		height: 143px;
	}

	[id^="grid_"] li.fig_13 {
		height: 286px;
	}
}


/*  */

#grid_btm {
	display: none;
}

/*  */

@media screen and (max-width: 768px) {
	#wrapper {
		min-height: initial;
	}

	#box_kv {
		width: 100%;
		max-width: initial;
		height: calc(100vw * 1.505555555555556);
		background-image: url(/partners/kawasaki_city_100th/asset/img/bg_kv_main_sp.avif);
		background-position: 0 0;
		background-repeat: no-repeat;
	}

	#box_kv div.inner {
		width: 100%;
		min-width: initial;
		max-width: initial;
	}

	#box_kv div.inner picture {
		width: 80vw;
		margin: 0 auto 0;
		padding-top: 8vw;
	}

	#box_kv div.inner picture img {
		width: 100%;
	}

	#box_kv figure {
		position: absolute;
		right: 4vw;
		bottom: -60vw;

		width: auto;
		max-width: initial;
		min-width: inherit;
	}

	#box_kv figure img {
		width: 30vw;
	}

	/* #box_kv::before {
		width: 96%;
		height: calc(96vw * 0.2856640899508082);
		background-image: url(/partners/kawasaki_city_100th/asset/img/typo_kawasaki_100th_sp.svg);
		background-size: 100% auto;
		bottom: -26vw;
	} */

	#typo_kawasaki_100th {
		width: 96%;
		height: calc(96vw * 0.2856640899508082);
	}

	/*  */

	main {
		width: 100%;
		min-width: initial;
		min-height: initial;
		margin-top: 4vw;

		display: flex;
		flex-wrap: wrap;
		padding: 0;

		position: static;
		transform: translateX(0);
	}

	main h2 {
		width: 100vw;
		text-align: center;
		font-size: 4.375vw;
		/* 14px */
		margin-bottom: 7vw;
		order: 1;
	}

	main div.wrap {
		margin-top: 0;
		min-height: initial;
		display: block;
		/* width: 60vw; */
		margin-right: 3vw;
		margin-left: auto;
		order: 2;

		width: 100vw;

		display: flex;
	}

	/*  */

	#list_partner {
		width: 66vw;
		order: 3;
		padding-bottom: 40vw;
	}

	#list_partner ul[id^="list_"] {
		width: 60vw;
		gap: 8vw 0;
	}

	ul[id^="list_"]:not(:first-child) {
		margin-top: 8vw;
	}

	#list_a li {
		width: 100%;
	}

	#list_b li {
		width: 80%;
	}

	#list_c li {
		width: 60%;
	}

	#list_d {
		justify-content: space-between;
		position: relative;
	}

	#list_d li {
		width: calc(50% - 2vw);
	}

	#list_d li:nth-child(-n+3) {
		margin-right: 30vw;
	}

	#list_d::before {
		content: '';
		display: block;
		width: 34vw;
		height: 34vw;
		margin-left: auto;
		background-image: url(/partners/kawasaki_city_100th/asset/img/fig_13.jpg);
		background-position: 0 0;
		background-repeat: no-repeat;
		background-size: 100% auto;
		position: absolute;
		top: 0;
		right: -6vw;
	}

	/*  */

	#description {
		position: static;
		width: 90vw;
		margin-top: 6vw;
		margin-left: auto;
		margin-right: auto;
		font-size: 3.75vw;
		order: 4;
	}

	#description p {
		font-size: 3.125vw;
		/* 10px */
		font-size: 3.75vw;
		/* 12px */
		line-height: 1.6;
	}

	/*  */

	.bnr {
		width: 90vw;
		margin-top: 12vw;
		order: 5;
	}

	.bnr p:not(:first-child) {
		margin-top: 6vw;
	}

	/*  */

	[id^="grid_"] {
		width: 28vw;
		top: 20vw;

		position: static;
	}

	#grid_sp {
		display: block;
		order: 2;
		height: calc(100% + 32vw);
		padding-bottom: 60vw;
		position: relative;
	}

	#grid_sp ul {
		display: block;
	}

	#grid_sp li.x2 {
		width: 56vw;
		/* margin-top: -28vw;
		margin-left: 28vw; */
	}

	#grid_sp li:last-child {
		position: absolute;
		bottom: 0;
	}

	#grid_left,
	#grid_right {
		display: none;
	}

	[id^="grid_"] ul {
		/* display: flex;
		flex-wrap: wrap; */
	}

	[id^="grid_"] li {
		width: 28vw;
		height: 28vw;
	}

	[id^="grid_"] li.fig_13 {
		/* height: 470px; */
	}

	[id^="grid_"] li.x2 {
		width: 100%;
	}

	[id^="grid_"] li.x2 img {
		width: auto;
		height: 100%;
		position: relative;
		left: 50%;
		transform: translateX(-50%);
	}

	[id^="grid_"] li.symbol {
		background-size: 12vw auto;
	}

	[id^="grid_"] li.right {
		margin-left: auto;
	}

	#grid_left li:nth-child(n+13) {
		display: none;
	}

	/*  */

	#grid_btm {
		display: block;
		width: 100vw;
		margin: 6vw auto 0;
		max-width: initial;
	}

	#grid_btm ul {
		position: relative;
	}

	#grid_btm li {
		width: calc(100vw / 3);
		height: calc(100vw / 3);

		max-width: initial;
		max-height: initial;
		min-height: initial;
		min-width: initial;
	}

	#grid_btm li:nth-child(4) {
		position: absolute;
		right: 0;
		top: calc((100vw * 0.6652777777777777) + (100vw / 3));
	}

	#grid_btm li.x3 {
		width: 100%;
		height: calc(100vw * 0.6652777777777777);
	}

	#grid_btm li.x2 {
		width: calc(100vw / 3 * 2);
		height: calc(100vw / 3 * 2);
	}

	#grid_btm li img {
		width: auto;
		height: 100%;
	}



























	/*  */
}

/*  */