@charset "UTF-8";
/* CSS Document */

/* ==================================================
   about
================================================== */
#about .lowerContent .container p {text-indent: 1em;}
#about .lowerContent .container a {text-indent: 0em; margin-left: 1em;}

#about .lowerContent .container h3 {margin-top: 2em;}



/* ==================================================
   measure
================================================== */
#measure .lowerContent .container p {text-indent: 1em;}
#measure .lowerContent .container a {text-indent: 0em;}

#measure .lowerContent .container.img_box {text-align: center; margin: 2em auto auto auto;}
#measure .lowerContent .container.img_box img {width: 100%; max-width: 600px;}

#measure .lowerContent .container.effort h3 {margin-top: 2em;}
#measure .lowerContent .container.effort h3:nth-of-type(1) {margin-top: 0em;}

#measure .lowerContent .container .related-links {margin: 1em 0 0 1em; list-style: disc}
#measure .lowerContent .container .related-links li {line-height: 2em;}

#measure .lowerContent .container .text-button.arrow-link__blue {margin: 1em 0 0 1em}



/* ==================================================
   activity
================================================== */
#activity .lowerContent .container p {text-indent: 1em;}
#activity .lowerContent .container a {text-indent: 0em;}

#activity .lowerContent .container h3 {margin-top: 2em;}

#activity .lowerContent .container .text-button.arrow-link__blue {margin: 1em 0 0 1em}


#activity .lowerContent #facility_tour .photo_area {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: 1000px;
	margin: 2em auto 0em auto;
}
#activity .lowerContent #facility_tour .photo_area div {
	width: calc(50% - 1em);
	margin: 0 0 2em 0;
	text-align: center;
}
#activity .lowerContent #facility_tour .photo_area div img {width: 100%; margin: 0 0 .25em 0;}
#activity .lowerContent #facility_tour .photo_area div p {line-height: 1.6;}

#activity .lowerContent #facility_tour .impression ul {margin: 0 0 1em 0; padding: 0 0 0 1.5em}

#activity .lowerContent #facility_tour .kawaiko-chan {
	float: right;
	width: 25%;
	max-width: 200px;
	margin: -3em 3em 2em 2em;
	text-align: center;
}
#activity .lowerContent #facility_tour .kawaiko-chan img {width: 100%;}
#activity .lowerContent #facility_tour .kawaiko-chan p {margin: .5em 0 0 0; line-height: 1.4; text-indent: 0}

@media screen and (max-width:768px) {
	#activity .lowerContent #facility_tour .photo_area {display: block;}
	#activity .lowerContent #facility_tour .photo_area div {width: 80%; margin: 0 auto 2em auto;}
	#activity .lowerContent #facility_tour .kawaiko-chan {margin: 0em 0em 2em 2em;}
}


#activity .lowerContent #pamphlet ul {
	display: flex;
	gap: 30px;
	justify-content: flex-start;
	margin: 1em 0 0 1em;
}
#activity .lowerContent #pamphlet ul li {
	max-width: 220px;
}
#activity .lowerContent #pamphlet ul li img {
	width: 100%;
	margin: 0;
	padding: 0;
}
#activity .lowerContent #pamphlet ul li p {
	margin: .5em 0 0 0;
	padding: 0;
	text-indent: 0;
	text-align: center;
	line-height: 1.4;
}
#activity .lowerContent #pamphlet ul li p::after {
  display: inline-block;
  width: 16px;
  height: 20px;
  margin-left: 0em;
  background-repeat: no-repeat;
  background-size: contain;
	background-size: 15px;
	background-position: top;
  content: "";
  vertical-align: middle;
	background-image: url("../img/icon-file-pdf.svg");
}


/*過去の見学会*/
#activity .lowerContent #facility_tour .tableNomal {
	max-width: calc(100% - 2em);
	margin: 2em auto 0 auto;
}
#activity .lowerContent #facility_tour ul {
	width: calc(100% - 2em);
	margin: 2em auto 0 auto;
}

#activity .lowerContent #facility_tour ul a {
	display: block;
	border: 1px solid #ccc;
	border-bottom: none;
	width: 100%;
	padding: 1em;
	position: relative;
  transition-duration: .5s;
}
#activity .lowerContent #facility_tour ul li:last-child a {
	border-bottom: 1px solid #ccc;
}
#activity .lowerContent #facility_tour ul a:hover {
	color: #fff;
	font-weight: bold;
}

#activity .lowerContent #facility_tour ul a::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0%;
	background: #fff;
  transition-duration: .3s;
	z-index: -9999;
}
#activity .lowerContent #facility_tour ul a:hover::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 100%;
	background: #046EB8;
}
#activity .lowerContent #facility_tour ul a:hover::after {
	content: "";
	position: absolute;
	top: calc(50% - 6px);;
	right: 10px;
	width: 12px;
	height: 12px;
	border-top: 3px solid #FFFFFF;
	border-right: 3px solid #FFFFFF;
	transform: rotate(45deg);
}


/*見学会、募集のページ*/
#activity .lowerContent #apply p {
	text-indent: 0;
	margin-left: 1em;
}

#activity .lowerContent #apply #notice {
	margin: 2em 0 2em 0;
	font-size: 120%;
	color: red;
	font-weight: 500;
	text-align: center;
}

#activity .lowerContent #apply .floot_photo {
	float: right;
	width: 300px;
	margin: 3em 1em 0 2em;
	text-align: center;
}
#activity .lowerContent #apply .floot_photo img {width: 100%}
#activity .lowerContent #apply .floot_photo p {margin:  0.5em 0 0 0;}
@media screen and (max-width:768px) {
	#activity .lowerContent #apply .floot_photo {
		float: none;
		width: 80%;
		margin: 1.5em auto 0 auto;
	}
}
#activity .lowerContent #apply .link_reservoir {padding: 1em 0 0 3em}

#activity .lowerContent #apply .contact {
	margin: 3em auto 0 auto;
	padding: 1.5em 2em 2em 2em;
	border: 1px solid #333;
}
#activity .lowerContent #apply .contact ul {
	display: flex;
	justify-content: flex-start;
	gap: 2em;
	margin: 0 0 0 1em;
}
@media screen and (max-width:768px) {
	#activity .lowerContent #apply .contact ul {
		display: block;
		line-height: 2;
	}
	#activity .lowerContent #apply .contact ul li:last-child {
		margin-left: 0.2em
	}
}


/*地下街等浸水対策協議会　防災イベントのページ*/
#activity .lowerContent #event > div {margin: 3em 0 0 0;}
#activity .lowerContent #event > div:nth-child(1) {margin: 0 0 0 0;}

#activity .lowerContent #event .top-img {
	padding: 1em;
	background: #3ECDFF;
}

#activity .lowerContent #event .reservation {
	display: flex;
	gap: 30px;
	justify-content: space-between;
	margin: 3em 0 0 0;
}
#activity .lowerContent #event .reservation h4 {
	display: inline-block;
	font-size: 130%;
	background: #333;
	color: #fff;
	font-weight: bold;
	padding: .5em 1em;
	margin: 0	0	.5em	0;
	border-radius: 14px;
}
#activity .lowerContent #event .reservation div:first-child p {font-size: 120%;}

#activity .lowerContent #event .reservation div:last-child {width: 300px; text-align: center}
#activity .lowerContent #event .reservation div:last-child img {width: 50%; margin: 4.5em auto 0 auto}
#activity .lowerContent #event .reservation div:last-child a {display: block; margin: .5em auto}
@media screen and (max-width:768px) {
	#activity .lowerContent #event .reservation {display: block;}
	#activity .lowerContent #event .reservation div:last-child {margin: 1.5em auto 0 auto}
	#activity .lowerContent #event .reservation div:last-child img {width: 50%; margin: 0 auto 0 auto}
	}

#activity .lowerContent #event .precautions {
	margin: 3em 0 0 0;
	padding: 1.5em 2em 2em 2em;
	border: 4px solid #3ECDFF;
}
#activity .lowerContent #event .precautions ul {margin: .5em 0 0 2em;}
#activity .lowerContent #event .precautions ul li {line-height: 1.6; margin-bottom: .5em; }
#activity .lowerContent #event .precautions div {
	display: flex;
	gap: 20px;
	margin: 1em 0 0 0;
}
@media screen and (max-width:768px) {
	#activity .lowerContent #event .precautions {
		margin: 3em 0 0 0;
		padding: 1em 1em 2em 1em;
		border: 2px solid #3ECDFF;
	}
	#activity .lowerContent #event .precautions div {
		display: block;
		margin: 1em auto 0 auto;
		width: 94%;
	}
}

#activity .lowerContent #event .contact p {margin: 0 0 0 1em; text-indent: 0;}
#activity .lowerContent #event .contact a {margin: 0 0 0 0em; text-indent: 0;}

#activity .lowerContent #event .organizer {
	background: #3ECDFF;
	text-align: center;
}





/* ==================================================
   guidelines
================================================== */
#guidelines .lowerContent .container p {text-indent: 1em;}
#guidelines .lowerContent .container a {text-indent: 0em;}

#guidelines .lowerContent .container h3 {margin-top: 2em;}
#guidelines .lowerContent .container h4 {margin-top: 1em;}

#guidelines .lowerContent .container .related-links {margin: 1em 0 0 1em; list-style: disc}
#guidelines .lowerContent .container .related-links li {line-height: 2em;}

#guidelines .lowerContent .container .tableNomal {max-width: calc(100% - 2em); margin: .5em auto 0 auto;}

#guidelines .lowerContent .container .tableNomal.plan_pdf_list {}
#guidelines .lowerContent .container .tableNomal.plan_pdf_list td {vertical-align: middle;}
#guidelines .lowerContent .container .tableNomal.plan_pdf_list td:nth-of-type(1) {width: auto; border-right: none}
#guidelines .lowerContent .container .tableNomal.plan_pdf_list td:nth-of-type(2) {width: 220px; min-width: 220px; padding: 0 0 0 2em}
@media screen and (max-width:768px) {
	#guidelines .lowerContent .container .tableNomal.plan_pdf_list td:nth-of-type(2) {width: 115px; min-width: 115px; padding: 0 0 0 1em}
}


#guidelines .lowerContent .container .tableNomal.plan {}
#guidelines .lowerContent .container .tableNomal.plan_list td {vertical-align: middle}
#guidelines .lowerContent .container .tableNomal.plan_list td:first-child {width: 10em; min-width: 10em;}



/* ============plan================ */
#guidelines .lowerContent .plan h3 {margin: 0}
#guidelines .lowerContent .plan p {line-height: 1.5; text-indent: 0}

#guidelines .lowerContent .plan table {min-width: 100%; table-layout: fixed;}
#guidelines .lowerContent .plan table td {vertical-align: middle;}
#guidelines .lowerContent .plan table col:nth-child(1) {width: 7.2em}
#guidelines .lowerContent .plan table col:nth-child(2) {width: 7.2em}
#guidelines .lowerContent .plan table col:nth-child(3) {width: 7.2em}
@media screen and (max-width:768px) {
	#guidelines .lowerContent .plan table col:nth-child(1) {width: 4.2em}
	#guidelines .lowerContent .plan table col:nth-child(2) {width: 3.3em}
	#guidelines .lowerContent .plan table col:nth-child(3) {width: 4.2em}
}





/* ==================================================
   counter
================================================== */

#counter .map-image .tokyo-to-link {text-align: justify; display: flex; justify-content: flex-end}
#counter .map-image .tokyo-to-link > ul {
	display: flex;
	top: 0px;
	right: 0px;
}
#counter .map-image .tokyo-to-link > ul > li:last-child {margin: 0 0 0 1em;}
#counter .map-image .tokyo-to-link > ul > li:last-child li {margin: 0 0 .25em 0;}
#counter .map-image .tokyo-to-link > ul > li:last-child li:last-child {margin: 0 0 0 0;}

#counter .lowerContent.counter-list .container h3 {margin: 2em 0 0 0;}
#counter .lowerContent.counter-list .container:nth-child(1) h3 {}

#counter .lowerContent.counter-list .container ul {
	display: flex;
	list-style: none;
	padding-bottom: 0em;
	padding-left: 1.5em;
	border-bottom: 1px dotted #ccc;
}
#counter .lowerContent.counter-list .container li {padding-top: 1em;}
#counter .lowerContent.counter-list .container li:first-child {
	min-width: 8em;
	list-style: disc;
}
#counter .lowerContent.counter-list .container ul {
	display: flex;
	list-style: none;
	padding-bottom: 1em;
	padding-left: 1.5em;
	border-bottom: 1px dotted #ccc;
}
#counter .lowerContent.counter-list .container ul.tokyo-to li:first-child {
	min-width: auto;
	margin-right: 1.5em;
}
#counter .lowerContent .container .map-panel {margin: 0em 0 4em 0; padding-top: 1em}
#counter .lowerContent .container .map-panel p {margin: 0 0 1em 0; text-indent: 0;}


/* ==================================================
   subsidy
================================================== */

#subsidy .lowerContent .container ul.tokyo_subsidy_link {margin: .5em 0 1em 0; padding: 0 0 0 1.5em}
#subsidy .lowerContent .container ul.tokyo_subsidy_link li {line-height: 1.8;}

#subsidy .lowerContent .container p {text-indent: 1em}
#subsidy .lowerContent .container .map-panel {margin: 2em 0 0 0; padding-top: 1em}
#subsidy .lowerContent .container .map-panel p {margin: 0 0 1em 0; text-indent: 0;}

#subsidy #table_subsidy > div {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: .25em 0 .25em 0;
}
#subsidy #table_subsidy > div p {
	display: inline;
	text-indent: 0;
}

#subsidy #table_subsidy table {table-layout: fixed; border-collapse: separate; border-spacing: 0;}
#subsidy #table_subsidy table tr {scroll-margin-top : 160px}
#subsidy #table_subsidy table thead {position: sticky; top: 77px;}
#subsidy #table_subsidy table th {text-align: center; vertical-align: middle;}

#subsidy #table_subsidy table tr.time-stamp th {
	background: #fff;
	color: #333;
	font-weight: normal;
	border: none;
	border-bottom: 1px solid #ccc;
	padding: .5em 0 0 0;
}
#subsidy #table_subsidy table tr.time-stamp th div {display: flex; justify-content: space-between;}
#subsidy #table_subsidy table tr.time-stamp th div p {line-height: 1.8; text-indent: 0;}

#subsidy #table_subsidy table th span {font-feature-settings: "palt"; font-size: 90%;}
#subsidy #table_subsidy table td {text-align: center; vertical-align: middle; vertical-align: middle;}
#subsidy #table_subsidy table td a {color: #036eb8;}
#subsidy #table_subsidy table tr th:first-child,#subsidy #table_subsidy table tr td:first-child {width: 8em;}

#subsidy #table_subsidy table th, #subsidy #table_subsidy table td {border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; border-top: none; border-left: none}
#subsidy #table_subsidy table th:first-child, #subsidy #table_subsidy table td:first-child {border-left: 1px solid #ccc;}


#subsidy #table_subsidy table th.diagonal {
  background: linear-gradient(to top right, #318ECE calc(50% - 0.5px), #b3b3b3 50%, #318ECE calc(50% + 0.5px));
}

#subsidy #table_subsidy ul {display: flex; gap: 1em; margin: .5em 0;}
#subsidy #table_subsidy ul li {font-size: 90%; margin: 0 0 0 2em; text-indent: -2em;}
#subsidy #table_subsidy ul li:first-child span {color: #046EB8;}
/*#subsidy #table_subsidy ul li:last-child span {color: #FF0000;}*/

@media screen and (max-width:768px) {
	#subsidy #table_subsidy table tr th:first-child, #subsidy #table_subsidy table tr td:first-child {width: 6.5em; padding: 0}
	#subsidy #table_subsidy ul {display: block; margin: .5em 0;}
	#subsidy #table_subsidy ul li {font-size: 90%; margin: 0 0 0 2em; text-indent: -2em;}
}


/* ==================================================
   guidance
================================================== */

#guidance .lowerContent .container h3 {margin-top: 2em;}
#guidance .lowerContent .container h3:nth-of-type(1) {margin-top: 0em;}
#guidance .lowerContent .container p {text-indent: 1em;}


#guidance .lowerContent .container ul {margin: .5em 0 1em 0; padding: 0 0 0 1.5em}
#guidance .lowerContent .container ul li {line-height: 1.8;}

#guidance .lowerContent .container ul.reference {margin: .5em 0 1em 0; padding: 0 0 0 1em}
#guidance .lowerContent .container ul.reference li {line-height: 1; }
#guidance .lowerContent .container ul.reference li p {margin: 0 0 0 5em; text-indent: -1em;}



#guidance .lowerContent .container .contact_area {
	padding: 0em 1em .75em 1em;
	margin: 3em auto 2em auto;
	max-width: 540px;
	border: 4px double #ccc;
}
#guidance .lowerContent .container .contact_area h4 {
	text-align: center; margin: .5em 0 1em 0
}
#guidance .lowerContent .container .contact_area p{
	line-height: 1.5;
}

@media screen and (max-width:768px) {
	#guidance .lowerContent .container .contact_area {width: 100%; }
}

#guidance .lowerContent .container .map-panel {margin: 1.5em 0 0 0;}

#guidance .lowerContent .container .map-panel {margin: 2em 0 0 0; padding-top: 1em}
#guidance .lowerContent .container .map-panel p {margin: 0 0 1em 0; text-indent: 0;}



/* ==================================================
   link
================================================== */

#link .lowerContent .container .link-list {
	line-height: 1.6;
	margin: 1em 0 1em 3em;
}
#link .lowerContent .container .link-list > li {
	line-height: 2;
	margin-bottom: .5em
}
#link .lowerContent .container .link-list li ul {
	margin: 0 0 0 1em;
}



/* ==================================================
   member
================================================== */

#member .lowerContent .container p {
	line-height: 1.6;
	margin: .5em 0 .5em 1em;
}

#member .lowerContent .container dl {
	display: flex;
	line-height: 1.6;
	margin: .5em 0 .5em 1em;
}
#member .lowerContent .container dl dt {
	width: 2em;
	min-width: 2em;
	margin: 0 2em 0 0;
}



/* ==================================================
   past
================================================== */
.news-list {
  margin: 0;
}

.news-list li {
  padding: 1em 1em 1em 1em;
  border-bottom: 2px dotted #268ccf;
}
.news-list li:first-child {
  padding: 0em 1em 1em 1em;
}

.news-list a {
  display: inline-flex;
	align-items: flex-start;
  font-size: 1.4rem;
	padding: 1em 0 1em 0;
}

.news-list time {
  color: var(--color-primary);
  font-weight: 700;
  width: 8em;
  min-width: 8em;
}

@media (hover: hover) and (pointer: fine) {
  .news-list a span {
    text-decoration-color: transparent;
    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    transition: color .3s ease, text-decoration-color .3s ease;
  }

  .news-list a:hover span {
    text-decoration-color: currentColor;
  }

}