@charset "UTF-8";
.pd_m {width: 100%;}.main_area.main-home {width: 100%;}section.l-section {margin: 0 auto 100px auto;}.swiper-wrapper {padding-bottom: 30px;}.main-home .blog_bana {width: 100%;max-width: 700px;margin: 50px auto;}.c-article-list-item a {display: grid;grid-template-columns: 1fr;gap: 12px;padding: 18px 20px;background: #fff;border: 1px solid #e6e6e6;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);text-decoration: none;position: relative;transition: .25s;align-items: center;max-width: 320px;border-radius: 20px;margin-bottom: 30px;}ul.c-category-list {display: flex;justify-content: flex-start;align-items: center;flex-wrap: wrap;}li.large-list {width: fit-content !important;margin: 0 4px;}  .article_box a {border-bottom: 0;display: block;border: none;box-shadow: none;}ul.c-category-list {display: flex;justify-content: center;}h2.c-caption {font-size: 28px;font-weight: 600;/* letter-spacing: 0.14rem; */margin: 30px auto;text-align: left;line-height: 1;}.c-caption .en {display: block;font-size: 18px;margin:5px auto 14px auto;text-shadow: 1px 1px 1px #ddd;text-transform: uppercase;letter-spacing: 0.01em;}.line {background: #333;}.knowledge-card-cat {font-weight: 700;display: inline-flex;align-items: center;color: rgb(51, 51, 51);font-size: 11px;line-height: 1.4;padding: 3px 8px;border-width: 1px;border-style: solid;border-color: rgb(44, 179, 179);color: #2cb3b3;}.c-article-list-item a {display: grid;grid-template-columns: 1fr;gap: 12px;padding: 15px 20px;min-height: 400px;background: #fff;border: 1px solid #e6e6e6;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);text-decoration: none;position: relative;transition: .25s;align-items: center;max-width: 320px;border-radius: 0;}.c-article-img {padding: 0 !important;width: 100% !important;height: 180px;border-radius: 10px;}.c-article-img img {width: 100% !important;height: 180px;border-radius: 10px;object-fit: cover;}h3.c-article-ttl {margin: 0 0 10px;font-size: 16px;font-weight: 700;line-height: 1.6;color: #111;}time.c-article-date {letter-spacing: 0.01em;font-size: 14px;}.c-article-txt {width: 100% !important;padding: 1em 0 0 0!important;}.c-article-list-item {letter-spacing: 0.05em;}
ul.c-category-list {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    padding: 0;
    margin: 0;
}

span.en {
    color: #178888;
}

li.large-list {
    list-style: none;
	margin: 0 0 5px 0 !important;
}

li.large-list a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    width: fit-content;
    border: 1px solid #999;
    font-size: 12px;
    padding: 0 10px;
    font-weight: bold;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
	letter-spacing: 0.01em;
	border-radius: 5px;
    box-shadow: 1px 1px 1px #ccc;
}

@media screen and (min-width: 768px) {

    li.large-list a {
        min-height: 40px;
        padding: 0 8px;
        font-size: 14px;
    }
}

ul.c-article-list.c-pop-article-list {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.c-article-list-item a {
    position: relative;
}

.c-article-list-item.pop-1st a::after {
    position: absolute;
    inset: 0 auto auto 5%;
    z-index: 1;
    display: grid;
    place-items: center;
    left: 0;
    height: 20px;
    width: 130px;
    padding-inline: 0 5px;
    padding-bottom: 5%;
    font-size: 20px;
    color: #fff;
    text-align: center;
    pointer-events: none;
    content: "Ranking " counter(counter);
    counter-increment: counter 1;
    background: #b79168;
    text-shadow: 1px 1px 1px #ccc;

    clip-path: polygon(0 0,100% 0,90% 50%,100% 100%,0 100%);
}

.c-article-list-item.pop-2nd a::after {
    position: absolute;
    inset: 0 auto auto 5%;
    z-index: 1;
    display: grid;
    place-items: center;
    left: 0;
    height: 20px;
    width: 130px;
    padding-inline: 0 5px;
    padding-bottom: 5%;
    font-size: 20px;
    color: #fff;
    text-align: center;
    pointer-events: none;
    content: "Ranking " counter(counter);
    counter-increment: counter 2;
    background: #999;
    clip-path: polygon(0 0,100% 0,90% 50%,100% 100%,0 100%);
}

.c-article-list-item.pop-3rd a::after {
    position: absolute;
    inset: 0 auto auto 5%;
    z-index: 1;
    display: grid;
    place-items: center;
    left: 0;
    height: 20px;
    width: 130px;
    padding-inline: 0 5px;
    padding-bottom: 5%;
    font-size: 20px;
    color: #fff;
    text-align: center;
    pointer-events: none;
    content: "Ranking " counter(counter);
    counter-increment: counter 3;
    background: #be7859;
    clip-path: polygon(0 0,100% 0,90% 50%,100% 100%,0 100%);
}

.l-section .mod-btn {
    margin: 30px auto;
}

span.txt {
    font-size: 28px;
}

	section.l-section.bath-renovation-wrap,
	section.l-section.kitchen-renovation-wrap,
	section.l-section.reform-subsidy-wrap,section.l-section.bro-zero-wrap{
		position: relative;
	}

	section.l-section.bath-renovation-wrap::after,
	section.l-section.kitchen-renovation-wrap::after,
	section.l-section.reform-subsidy-wrap::after,section.l-section.bro-zero-wrap::after{
		background: #f7f7f7;
		display: block;
		position: absolute;
		width: 200vw;
		height: 7rem;
		content: "";
		top: -0.5rem;
		right: 50%;
		transform: translateX(50%);
		z-index: -1;
	}


	@media screen and (min-width: 768px) {
		section.l-section.bath-renovation-wrap::after,
		section.l-section.kitchen-renovation-wrap::after,
		section.l-section.reform-subsidy-wrap::after {
			height: 9rem;
		}
	}

	@media screen and (min-width: 1440px) {
		section.l-section.bath-renovation-wrap::after,
		section.l-section.kitchen-renovation-wrap::after,
		section.l-section.reform-subsidy-wrap::after {
			height: 7rem;
		}
	}