@charset "UTF-8";

@media screen and (max-width: 768px) {
	.pc {
		display: none!important;
	}

	.sp {
		display: block;
	}

	p {
		font-size: 1.6rem;
		line-height: 2;
	}

	h2 {
		font-size: 2.4rem;
		line-height: 1.5;
	}

	section {
		padding: 5rem 0!important;
		margin: 0!important;
	}

	.fv {
		padding: 0!important;
	}

	header {
		padding: 0 1rem;
		height: 5.5rem;
		background-color: var(--white);
	}

	.header_top {
		width: 32rem;
		margin-left: 0;
	}

	.header_top_left {
		margin-top: 9.5px;
	}

	.header_top_left a {
		align-items: initial;
		gap: 0;
	}

	.header_logo img {
		width: 3.7rem;
		margin-right: 0.4rem;
	}

	.header_logo p {
		font-size: 0.78rem;
		line-height: 1.2;
	}

	.site_title {
		font-size: 1.5rem;
		line-height: 1.2;
	}

	.site_title span {
		font-size: 1.2rem;
		margin-left: 0.5rem;
	}

	.header_tel,
	.header_blog {
		display: none;
	}

	.header_line {
		font-size: 1.3rem;
		width: 7.5rem;
		height: 4.6rem;
	}

	.header_bottom {
		display: none;
	}

	.hamburger_menu {
		display: block;
		width: 3.3rem;
		height: 3.8rem;
		position: fixed;
		top: 1rem;
		right: 1.8rem;
		z-index: 10001;
	}

	.menu_btn {
		display: block;
		width: 3.3rem;
		height: 3.8rem;
		z-index: 10001;
		left: 0;
		right: 0;
		margin: auto;
		position: relative;
	}

	.menu_btn::before {
		position: absolute;
		content: "MENU";
		bottom: 0;
		left: -5%;
		right: 0;
		margin: auto;
		color: #707070;
		font-weight: bold;
		font-size: 1.05rem;
		text-align: center;
		width: 110%;
	}

	#menu_btn_check:checked + .menu_btn::before {
		content: "CLOSE";
	}

	.menu_btn span,
	.menu_btn span:before,
	.menu_btn span:after {
		content: '';
		display: block;
		height: 0.16rem;
		width: 3.3rem;
		background-color: var(--green);
		position: absolute;
		margin: auto;
		z-index: 81;
		/* box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.5); */
	}

	.menu_btn span:before {
		top: 0.9rem;
		left: 0;
	}
	.menu_btn span::after {
		top: 1.8rem;
		left: 0;
	}
	#menu_btn_check:checked ~ .menu_btn span::after {
		background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
	}
	#menu_btn_check:checked ~ .menu_btn span {
		top: 1rem;
		transform: rotate(45deg);
	}

	#menu_btn_check:checked ~ .menu_btn span::before {
		top: 0;
		transform: rotate(-90deg);
	}

	#menu_btn_check {
		display: none;
	}

	.menu_content {
		width: 100%;
		position: fixed;
		top: 5.5rem;
		left: 100%;
		z-index: 10000;
		transition: all 0.5s;
		background-color: var(--light-green);
		padding-bottom: 2.8rem;
	}

	.menu_content .header_tel, 
	.menu_content .header_blog {
		display: block;
		margin-right: 0;
		text-align: center;
	}

	.menu_content .header_tel {
		width: 33.1rem;
		margin: auto;
		border: 1px solid #707070;
		border-radius: 1rem;
		background-color: var(--white);
		margin-top: 2.24rem;
		padding: 0.5rem 0 1.6rem 0;
	}

	.menu_content .header_tel a {
		font-size: 3.9rem;
		line-height: 5.7rem;
	}

	.menu_content .header_tel a::before {
		width: 3rem;
		height: 3rem;
	}

	.menu_content .header_blog {
		width: 33.1rem;
		margin: auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-direction: initial;
		margin-top: 1.6rem;
	}

	.menu_content .header_blog li {
		margin-bottom: 0;
	}

	.menu_content .header_blog a {
		width: 100%;
		color: #000;
		font-size: 1.8rem;
		line-height: 2.5rem;
		padding-left: 3.15rem;
		text-align: left;
	}

	.menu_content .header_blog a::before {
		left: 0.6rem;
	}

	.menu_content .nav {
		width: calc(100% - 2.08rem);
		margin: auto;
		margin-top: 4.15rem;
	}

	.menu_content .nav li > a {
		display: block;
		font-size: 1.8rem;
		line-height: 2.5rem;
		padding: 0.88rem 0;
		border-top: 1px solid #707070;
		padding-left: 2.1rem;
		font-weight: bold;
	}

	.menu_content .nav li:last-child {
		border-bottom: 1px solid #707070;
	}

	.menu_content .nav li > a.active {
		color: var(--green);
	}

	#menu_btn_check:checked ~ .menu_content {
		left: 0;
	}

	.menu_close {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin: 2.8rem auto 0;
		cursor: pointer;
	}

	.menu_close span {
		position: relative;
		width: 3.3rem;
		height: 3.3rem;
	}

	.menu_close span::before,
	.menu_close span::after {
		content: '';
		position: absolute;
		top: 50%;
		left: 0;
		width: 3.3rem;
		height: 0.16rem;
		background: var(--green);
	}

	.menu_close span::before {
		transform: rotate(45deg);
	}

	.menu_close span::after {
		transform: rotate(-45deg);
	}

	.menu_close p {
		font-size: 1.05rem;
		line-height: 1;
		font-weight: bold;
		color: #707070;
	}


	main {
		padding-top: 5.5rem;
	}

	.wrapper {
		width: calc(100% - 4rem);
		/* width: calc(100% - 40px); */
	}

	.fv_box img {
		height: 45rem;
	}

	.fv_txt {
		top: 4rem;
		left: 1.74rem;
	}

	.fv_maintxt {
		letter-spacing: 0.035em;
		font-size: 1.88rem;
		line-height: 2.9rem;
		margin-bottom: 1rem;
	}

	.fv_maintxt span {
		text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.76);
	}

	.fv_subtxt {
		font-size: 0.85rem;
		line-height: 1.5;
		padding: 0.6rem;
	}

	.event_lists {
		flex-wrap: wrap;
		gap: 3rem;
	}

	.event_lists li {
		width: 100%;
	}

	.event_lists li a {
		width: 100%;
	}

	.btn a {
		width: 100%;
		font-size: 1.6rem;
	}

	.reform_menu_tab {
		flex-wrap: wrap;
		justify-content: center;
		gap: 1.5rem 4%;
		margin-bottom: 5rem;
		margin-top: 3rem;
	}

	.reform_menu_archive .reform_menu_tab {
		margin-top: 0;
	}

	.reform_menu_tab a {
		width: 48%;
		font-size: 1.4rem;
		height: 15rem;
		line-height: 2rem;
	}

	.reform_menu_tab img {
		width: 5rem;
		margin-bottom: 1.5rem;
		margin-top: 1.5rem;
	}

	.reform_menu_box {
		margin-bottom: 5rem;
	}

	.reform_menu_lists {
		gap: 2rem;
	}

	.reform_menu_lists li {
		width: 100%;
	}

	.reform_menu_lists li a {
		width: 100%;
		height: initial;
	}

	.reform_menu_lists li a div {
		width: 18rem;
	}

	.reform_menu_lists h4 {
		width: 100%;
		font-size: 1.7rem;
		line-height: 1.5;
	}

	.full_reform img,
	.water_reform img,
	.outside_reform img {
		width: 12rem;
		height: 9rem;
		margin-right: 2rem;
	}

	.full_reform span,
	.water_reform span,
	.outside_reform span {
		font-size: 2rem;
		line-height: 2.4rem;
	}

	.work_lists {
		flex-wrap: wrap;
		gap: 3rem;
	}

	.work_lists li,
	.work_lists li a {
		width: 100%;
	}

	.voice_lists {
		flex-wrap: wrap;
		gap: 3rem;
	}

	.voice_lists li,
	.voice_lists li a {
		width: 100%;
	}

	.name {
		margin-top: 0;
	}

	.contact {
		padding: 3rem 0!important;
	}

	#contact {
		background-image: url(../img/contact_bg_sp.webp);
	}

	.title {
		margin-bottom: 3rem;
	}

	.contact .title {
		margin-bottom: 3rem;
	}

	.contact_box {
		flex-wrap: wrap;
		gap: 3rem;
	}

	.contact_tel {
		width: 100%;
		text-align: center;
	}

	.contact_tel span {
		display: block;
		text-align: center;
	}

	.contact_tel a {
		font-size: 4.1rem;
	}

	.contact_tel a::before {
		left: 1rem;
		width: 4rem;
		height: 4rem;
		top: 0.5rem;
	}

	.contact_other {
		width: 100%;
	}

	.contact_other a {
		width: 100%;
		font-size: 1.8rem;
	}

	.footer_box {
		flex-wrap: wrap;
		gap: 5rem;
	}

	.footer_logo {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 2rem;
	}

	.footer_logo img {
		width: 10rem;
		margin-bottom: 0;
	}

	.footer_logo p {
		width: 100%;
		font-size: 1.6rem;
	}

	.footer_nav {
		padding: 5rem 0;
	}

	.footer_menu ul {
		gap: 1rem;
	}

	.footer_menu ul li {
		width: 17rem;
	}

	.footer_menu ul li:nth-of-type(4),
	.footer_menu ul li:nth-of-type(5) {
		width: 100%;
	}

	.footer_menu ul li:nth-of-type(4) {
		order: 7;
	}

	.footer_menu ul li:nth-of-type(5) {
		order: 8;
	}

	.footer_menu ul li:nth-of-type(6) {
        order: 9;
    }

	.footer_menu ul li ul li {
		width: 100%;
	}

	.footer_menu ul li a {
		font-size: 1.6rem;
	}

	.footer_txt {
		width: 100%;
		margin-bottom: 3rem;
	}

	.footer_banner {
		width: 35rem;
	}

	/* 下層ページ */
	.page-fv {
		padding: 2rem 0!important;
	}

	.page-fv h1,
	.page-fv p {
		font-size: 2.2rem;
		line-height: 3.6rem;
	}

	.page_h2_g {
		font-size: 2.2rem;
		margin-bottom: 2rem;
		line-height: 1.5;
	}

	.message_box {
		gap: 0;
		margin-top: 0;
	}

	.message p {
		width: 100%;
	}

	.company_table th,
	.company_table td {
		padding: 2rem 0 2rem 1rem;
		font-size: 1.6rem;
	}

	.company_table th {
		width: 14rem;
	}

	.access_box {
		flex-wrap: wrap;
	}

	.access_box p {
		width: 100%;
	}

	.googlemap {
		width: 100%;
	}

	.googlemap iframe {
		width: 100%;
		height: 38.3rem;
	}

	.cf7-row {
		margin-bottom: 3rem;
	}

	.cf7-head {
		margin-bottom: 2rem;
	}

	.cf7-body {
		padding-left: 0;
	}

	.wpcf7-form-control-wrap {
		width: 100%;
	}

	.cf7-checkgrid,
	.cf7-other {
		padding-left: 0;
	}

	.cf7-form input[type="text"],
	.cf7-form input[type="email"],
	.cf7-form input[type="tel"],
	.cf7-form textarea{
		width: 100%;
		box-sizing: border-box;
		padding: 1rem;
		border: 1px solid #cfcfcf;
		border-radius: 0.5rem;
		font-size: 1.8rem;
		font-weight: 500;
		outline: none;
	}

	.cf7-form input[type="radio"],
	.cf7-form input[type="checkbox"] {
		width: 2rem;
		height: 2rem;
	}

	.cf7-form .wpcf7-list-item {
		margin: 0 2rem 0 0;
	}

	.cf7-form .wpcf7-list-item label {
		margin-bottom: 1rem;
	}

	.reform-other-text {
		margin-left: 0;
	}

	.cf7-form textarea {
		width: 100%;
	}

	.cf7-btn {
		width: 100%;
	}

	.page_template h2 {
		font-size: 2rem;
		line-height: 1.5;
	}

	.breadcrumb {
		display: flex;
		flex-wrap: wrap;
		gap: 0.5rem;
		margin-bottom: 2rem;
		font-size: 1.4rem;
	}

    .reform_menu {
        padding: 56px 0 72px;
    }

	.reform_menu .work_lists {
		gap: 3rem;
		margin-top: 3rem;
	}

	.reform_menu__group + .reform_menu__group {
		margin-top: 1rem;
	}

    .reform_menu__title {
        font-size: 1.8rem;
    }

    .reform_menu__group {
        padding: 1.6rem 1.2rem 2rem;
        border-radius: 1.6rem;
    }

    .reform_menu__group-title {
        margin-bottom: 1.2rem;
        font-size: 2rem;
    }

	.reform_menu__btn {
		margin-bottom: 1rem;
	}

    .reform_menu__tags {
        gap: 0.6rem 0.8rem;
    }

    .reform_menu__tag {
        min-height: 3.4rem;
        padding: 0 0.5rem;
        font-size: 1.4rem;
    }

	.reform_menu__submit, .reform_menu__reset {
		padding: 1rem 5rem;
	}

	.reform_detail {
        padding: 20px 0 56px;
    }

    .reform_detail__breadcrumb {
        margin-bottom: 18px;
        font-size: 12px;
    }

    .reform_detail__tags {
        gap: 8px;
        margin-bottom: 14px;
    }

    .reform_detail__tag {
        min-height: 28px;
        padding: 4px 12px;
        font-size: 12px;
    }

    .reform_detail__title {
        margin-bottom: 14px;
        font-size: 2.8rem;
    }

    .reform_detail__price {
        margin-bottom: 20px;
        font-size: 20px;
    }

	.work_title {
		margin-bottom: 0.5rem;
	}

	.work_archive {
		padding-top: 0!important;
	}

	.work_detail {
		padding-top: 2rem!important;
	}

	.reform_detail__image, .work_detail__image {
		margin-bottom: 3rem;
	}

	.reform_detail__image img, .work_detail__image img {
		height: 20rem;
	}

	.product_about__image img {
		height: 20rem;
	}

	.reform_spec {
        padding: 40px 0;
    }

    .reform_spec__grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .reform_spec__title {
        margin-bottom: 14px;
        padding: 0 0 8px 28px;
        font-size: 2.2rem;
    }

    .reform_spec__title::before {
        top: 1px;
        width: 1.8rem;
        height: 1.8rem;
    }

    .reform_spec__content p {
        font-size: 1.4rem;
        line-height: 1.8;
    }

    .product_about {
        padding: 40px 0;
    }

    .product_about__heading {
        margin-bottom: 14px;
        padding: 1rem;
        font-size: 2rem;
		margin-top: 0;
    }

    .product_about__list {
        gap: 2rem;
    }

    .product_about__item {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .product_about__title {
        margin-bottom: 8px;
        font-size: 2rem;
    }

    .product_about__text {
        font-size: 1.4rem;
        line-height: 1.8;
    }

    .related_reform {
        padding: 3rem 0 0 0!important;
    }

    .related_reform__title {
        margin-bottom: 2.4rem;
        font-size: 2.4rem;
    }
	/* ニュース一覧 */
	.archive__box {
		padding: 3rem 0;
	}
	
	.archive__filter {
		margin-bottom: 3rem;
	}

	.archive__filter-list {
		gap: 0.5rem;
	}

	.archive__filter-list a {
		padding: 0 1rem;
	}
	
	.archive__content {
        flex-direction: column-reverse;
		gap: 3rem;
    }

	.card + .card {
		margin-top: 3rem;
    	padding-top: 3rem;
	}

    .sidebar {
        width: 100%;
		max-width: initial;
    }

    .sidebar__title {
        font-size: 1.8rem;
		padding: 1rem 0 1rem 3rem;
    }

    .card__title {
        font-size: 1.8rem;
		padding: 1rem 1.5rem;
		margin-bottom: 2rem;
    }

	.card__info {
		margin-bottom: 2rem;
	}

	.card__thumb {
		margin-bottom: 2rem;
	}

	.card__thumb img {
		max-height: 23rem;
		border-radius: 2rem;
	}

	.card__contents,
	.card__contents p,
	.card__contents ul li,
	.card__contents ol li {
		font-size: 1.6rem;
		line-height: 1.7;
		margin-bottom: 1.5rem;
	}

	.pagination {
		margin-top: 5rem;
		justify-content: center;
	}

	.pagination__first,
	.pagination__last {
		margin: 0;
	}

	.pagination .pagination__item, .pagination .page-numbers {
		width: 3rem;
		height: 3rem;
		font-size: 1.6rem;
	}

	.pagination__dots {
		width: 4rem;
	}

	.sidebar__block + .sidebar__block {
		margin-top: 3rem;
	}

	.sidebar__latest-thumb img {
		height: 55vw;
		max-height: initial;
	}
	.work_detail__title {
		font-size: 2rem;
	}
	.work_detail__h2 {
		font-size: 2rem;
		padding-bottom: 1.5rem;
		margin: 3rem 0 2.4rem;
	}
	.work_detail_spec {
		margin-top: 3rem;
	}
	.work_detail_spec th,
	.work_detail_spec td {
		display: block;
		width: 100%;
	}

	.work_detail_spec th {
		padding: 16px 14px;
		font-size: 1.8rem;
	}

	.work_detail_spec td {
		padding: 16px 14px;
		font-size: 1.5rem;
	}

	.single__tags {
		margin-bottom: 2rem;
	}

	#toc_container {
		padding: 2rem;
	}

	.column-detail {
		padding-top: 1rem!important;
	}

	.column-detail h1 {
		font-size: 2.4rem;
	}

	.column-detail-thumb img {
		height: 23rem;
	}

	.column-detail h2 {
		font-size: 2.4rem;
		padding: 1rem 2rem;
	}

	.reform_detail__ba__img,
	.reform_detail__ba__img img {
		width: 100%;
	}

	.reform_detail__ba__img img {
		height: 25rem;
	}

	.filter-block + .filter-block {
		margin-top: 5rem;
	}

	.filter-title {
		font-size: 2.4rem;
		margin: 0 0 3rem;
	}

	.filter-btn {
		font-size: 1.4rem;
		padding: 0 1rem;
		min-height: 3rem;
	}
	html {
		scroll-padding-top: 10px;
	}

	.column {
		padding-top: 0!important;
	}

	.column_lists {
		border-top: 0;
	}

	.column_lists li a {
		flex-wrap: wrap;
		width: 100%;
	}
	.column_thumb {
		width: 100%;
	}
	.column_thumb img {
		width: 100%;
		height: 22rem;
	}
	.column_title {
		font-size: 1.8rem;
	}
    .work_scroll_guide {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 0.6rem;
        font-size: 1.3rem;
        margin-bottom: -2.5rem;
    }
    .work_scroll_arrow {
        display: inline-block;
        animation: scrollArrow 1.2s infinite;
    }
    .work_lists.is-scroll {
        display: flex;
        flex-wrap: nowrap;
        gap: 1.6rem;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 1rem;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
    }
    .work_lists.is-scroll::-webkit-scrollbar {
        display: none;
    }
    .work_lists.is-scroll .work_item {
        flex: 0 0 100%;
        width: 100%;
        scroll-snap-align: start;
    }
    @keyframes scrollArrow {
        0% {
            transform: translateX(0);
        }
        50% {
            transform: translateX(6px);
        }
        100% {
            transform: translateX(0);
        }
    }
	.reform_menu_h3 {
		font-size: 2rem;
		padding-left: 1.5rem;
	}
	.work_thumb img {
		height: 23rem;
	}
	.menu_title {
		font-size: 2rem !important;
		line-height: 3rem !important;
		margin-bottom: 2rem !important;
		padding-top: 6.5rem!important;
	}
	.menu_title::before {
		width: 7.21rem!important;
    	height: 5.86rem!important;
	}
	.reform_menu_items {
		margin-top: 4rem;
	}
}

@media (max-width: 769px) {
    #map-area iframe {
        width: 100%;
        height: 80vw;
    }
}