@charset "UTF-8";

.page-banner {
    & .common-title {
        @media screen and (max-width: 767px) {
            padding-bottom: 6rem;
        }
    }
}

.page_container.harassment-prevention {
	padding-top: 16rem;
	padding-bottom: 30.6rem;
	position: relative;
	overflow: hidden;

	@media screen and (max-width: 767px) {
		padding-top: 0;
		padding-bottom: 8rem;
	}

	& .inner {
		position: relative;
		z-index: 1;
	}

	& .common_h2 {
		margin-bottom: 4rem;

		@media screen and (max-width: 767px) {
			margin-bottom: 2.4rem;
		}
	}

	& .intro-text {
		margin-bottom: 8rem;

		@media screen and (max-width: 767px) {
			margin-bottom: 4rem;
		}
	}

	& .content-section {
		margin-bottom: 8rem;

		@media screen and (max-width: 767px) {
			margin-bottom: 4rem;
		}

		& .common_h3 {
			margin-bottom: 2.4rem;

			@media screen and (max-width: 767px) {
				margin-bottom: 1.6rem;
			}
		}

		& .common-text {
			margin-bottom: 2.4rem;

			@media screen and (max-width: 767px) {
				margin-bottom: 1.6rem;
			}
		}
	}

	& .disc-list {
		display: flex;
		flex-direction: column;
		gap: 1.6rem;
		padding-left: 0.4rem;

		@media screen and (max-width: 767px) {
			gap: 1.2rem;
		}

		& li {
			position: relative;
			padding-left: 2rem;
			font-family: var(--zen);
			font-style: normal;
			font-weight: 400;
			font-size: 1.8rem;
			line-height: 180%;
			letter-spacing: 0.1em;
			color: #000000;

			@media screen and (max-width: 767px) {
				font-size: 1.4rem;
				padding-left: 1.6rem;
			}

			&:before {
				content: "";
				position: absolute;
				left: 0;
				top: 1.2rem;
				width: 6px;
				height: 6px;
				border-radius: 6px;
				background-color: #000000;

				@media screen and (max-width: 767px) {
					top: 0.9rem;
					width: 5px;
					height: 5px;
					border-radius: 5px;
				}
			}
		}
	}

	& .content-section:last-child {
		margin-bottom: 0;

		& .disc-list {
			margin-bottom: 8rem;

			@media screen and (max-width: 767px) {
				margin-bottom: 4rem;
			}
		}

		& .form-link-label {
			margin-bottom: 2.4rem;

			@media screen and (max-width: 767px) {
				margin-bottom: 1.6rem;
			}

			& strong {
				font-weight: 700;
			}
		}

		& .common-btn {
			/* margin-top: 2rem; */
			& span {
				color: #e60012;
			}

			&:hover {
				& span {
					color: #fff;
				}
			}
		}
	}
}

.page-banner {
    & .common-title {
        & .title-sub {
            @media screen and (max-width: 767px) {
                font-size: 3.1rem;
            }
        }
    }
}