@charset "utf-8";

.intro .inner {
    padding: 40px 0 160px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}

.intro .p-box {
    background-color: #FFF4F4;
    width: 100%;

}

.intro .p-box .w90 {
    padding: 32px 0;
    display: flex;
    gap: 4%;
}

.intro .p-box .w90 .tit-ja {
    font-weight: 600;
    font-size: clamp(1.25rem, 1.129rem + 0.52vw, 1.75rem);
    color: #c90601;
}

.intro .p-box .w90 .desc {
    width: 64%;
    flex: 1;
}

.intro .p-box .w90 .desc p {
    font-size: clamp(0.875rem, 0.814rem + 0.26vw, 1.125rem);
    line-height: calc(32/18);
    color: #000;
}

.intro .column {
    display: flex;
    gap: 5%;
    width: 100%;
}

.intro .column .sec-img {
    max-width: 634px;
    width: 48%;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.intro .column .list {
    display: flex;
    flex-direction: column;
    gap: 24px;
    flex: 1;
}

.intro .column .item {
    border: 2px solid #050505;
}

.intro .column .item .main-tit,
.products .column .main-tit {
    font-weight: 500;
    font-size: clamp(0.875rem, 0.723rem + 0.65vw, 1.5rem);
    line-height: clamp(1.813rem, 1.403rem + 1.75vw, 3.5rem);
    text-align: center;
    color: #fff;
    background-color: #C90601;
}

.intro .column .item .dot-list {
    padding: 24px 5%;
    display: flex;
    flex-direction: column;
    gap: 20px;
    font-weight: 500;
    font-size: clamp(0.875rem, 0.814rem + 0.26vw, 1.125rem);
    color: #000;
}

.intro .column .item .dot-list p {
    display: flex;
    align-items: baseline;
    gap: 14px;
}

.intro .column .item .dot-list p::before {
    content: "";
    min-width: clamp(0.438rem, 0.377rem + 0.26vw, 0.688rem);
    min-height: clamp(0.438rem, 0.377rem + 0.26vw, 0.688rem);
    background: #c90601;
    display: inline-block;
}

.products .inner {
    padding-bottom: 160px;
    display: flex;
    flex-direction: column;
    gap: 80px;
}

.products .sec-body {
    display: flex;
    flex-direction: column;
    gap: 120px;
}

.products .item-tit {
    font-weight: 600;
    font-size: clamp(1rem, 0.818rem + 0.78vw, 1.75rem);
    color: #000;
    padding-bottom: 16px;
    position: relative;
}

.products .item-tit::after {
    content: "";
    display: inline-block;
    background-image: linear-gradient(90deg, rgba(201, 6, 1, 1) 93px, rgba(0, 0, 0, 1) 93px);
    width: 100%;
    height: 2px;
}

.products .column {
    display: flex;
    gap: 4%;
    align-items: flex-start;
    margin-bottom: 40px;
}

.products .column:last-child {
    margin: 0;
}

.products .column .sec-img {
    position: relative;
    max-width: 493px;
    width: 37%;
}

.products .column .sec-img .caption {
    position: absolute;
    font-weight: 400;
    font-size: clamp(0.688rem, 0.642rem + 0.19vw, 0.875rem);
    color: #000;
    right: 30px;
    bottom: 17px;
}

.products .column .main-tit {
    background-color: #000000;
}

.products .column .specification {
    flex: 1;
    background: #fff;
    border: 1px solid #000;

}

.products .column .specification.column-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    border: none;
    gap: 4%;
}

.products .column .specification.column-2 .item {
    border: 1px solid #000;
}

.products .column .specification.column-2 .item .main-tit {
    background-color: #C90601;
}

.products .column .specification .detail-list {
    padding: 24px 5%;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.products .column .specification .group {
    display: grid;
    grid-template-columns: 40% 1fr;
}

.products .column .specification .group .dt {
    font-weight: 500;
    font-size: clamp(0.875rem, 0.845rem + 0.13vw, 1rem);
    color: #000;
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
}

.products .column .specification .group .dt::before {
    content: "⚫︎";
    font-weight: 600;
    font-size: clamp(0.75rem, 0.689rem + 0.26vw, 1rem);
    display: inline-block;
    color: #c90601;
}

.products .column .specification .group .dt::after {
    content: ":";
    position: absolute;
    right: 20%;
    font-weight: 500;
    font-size: clamp(0.875rem, 0.845rem + 0.13vw, 1rem);
    color: #000;
}

.products .column .specification .desc p {
    font-weight: 500;
    font-size: 14px;
    line-height: calc(24/14);
    color: #000;
}

.standard {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.standard .sub-tit {
    font-weight: 600;
    font-size: clamp(1.125rem, 1.095rem + 0.13vw, 1.25rem);
    ;
    color: #000;
}

.standard .standard-table {
    grid-template-columns: 1fr 1fr 1fr 2fr 1fr;
    border: 1px solid #000;
    display: grid;
}





.standard .standard-table .item {
    display: grid;
    grid-template-rows: 1fr 4fr;
    border-right: 1px solid #000;
}

.standard .standard-table .item:last-child {
    border: none;
}

.standard .standard-table .item .head {
    font-weight: 500;
    font-size: clamp(0.875rem, 0.814rem + 0.26vw, 1.125rem);
    line-height: clamp(2.188rem, 1.869rem + 1.36vw, 3.5rem);
    text-align: center;
    color: #fff;
    background: #c90601
}

.standard .standard-table .item .body {
    display: grid;

}

.standard .standard-table .item .body p {
    display: flex;
    align-items: center;
    justify-content: center;
}

.standard .standard-table .item.grid-4 .body {
    grid-template-rows: 4fr;
}

.standard .standard-table .item.grid-1 .body p,
.standard .standard-table .item.grid-2 .body p,
.products02 .item-c .standard-table .item .body p,
.products02 .item-d .standard-table .item .body p,
.products02 .item-e .standard-table .item .body p {
    border-bottom: 1px solid #000;
}

.standard .standard-table .item.grid-1 .body p:last-child,
.standard .standard-table .item.grid-2 .body p:last-child,
.products02 .item-c .standard-table .item .body p:last-child,
.products02 .item-d .standard-table .item .body p:last-child,
.products02 .item-e .standard-table .item .body p:last-child {
    border: none;
}

.standard .standard-table .item.grid-1 .body {
    grid-template-rows: repeat(auto-fit, minmax(0, 1fr));
}

.standard .standard-table .item.grid-2 .body {
    grid-template-rows: 2fr 2fr;
}

.standard .standard-table .item .body {
    grid-template-rows: repeat(auto-fit, minmax(0, 1fr));
}


.about-test {
    padding-bottom: 160px;
}

.products02 .item-a .standard-table {
    grid-template-columns: 1fr 1fr 1.5fr 1fr 1.5fr;
}

.products02 .item-a .standard-table .item {
    grid-template-rows: 1fr 2fr;
}

.products02 .item-b .standard-table {
    grid-template-columns: 1fr 1fr 1.5fr 1fr 1.5fr;
}

.products02 .item-b .standard-table .item {
    grid-template-rows: 1fr 1fr;
}

.products02 .item-c .standard-table,
.products02 .item-d .standard-table {
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
}

.products02 .item-c .standard-table .item {
    grid-template-rows: 1fr 7fr;
}

.products02 .item-d .standard-table .item {
    grid-template-rows: 1fr 3fr;
}

.products02 .item-e .column {
    display: grid;
    grid-template-areas: "title title"
        "img01 img02";
    justify-content: center;
    gap: 20px 48px;
}

.products02 .item-e .column .catch {
    grid-area: title;
    font-family: var(--sub);
    font-weight: 900;
    font-size: clamp(1rem, 0.879rem + 0.52vw, 1.5rem);
    text-align: center;
    color: #c10500;
}

.products02 .item-e .column .img01 {
    grid-area: img01;
    width: 100%;
}

.products02 .item-e .column .img02 {
    grid-area: img02;
    width: 100%;
}

.products02 .item-e .standard-table .item {
    grid-template-rows: 1fr 5fr;
}

.products02 .item-e .standard-table .item:first-child .body {
    grid-template-rows: 3fr 2fr;
}

.products03 .column {
    flex-direction: column;
    gap: 56px;
}

.products03 .column .specification .group {
    grid-template-columns: 26% 1fr;
}

.products03 .column .img-wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4%;
}

.products03 .column .img-wrap .sec-img {
    width: 100%;
}

.products03 .column .specification {
    width: 100%;
}

.products03 .item-a .standard-table .item {
    grid-template-rows: 1fr 10fr;
}

.products03 .item-a .standard-table .item .body {
    grid-template-rows: repeat(auto-fit, minmax(0, 2fr));
}




@media (max-width: 1280px) {
    .products03 .column .img-wrap {
        gap: 2%;
    }
}

@media (max-width: 1023px) {
    .intro .p-box .w90 {
        width: 91%;
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }

    .intro .p-box .w90 .desc {
        width: 100%;
    }

    .intro .column .sec-img {
        width: 38%;
    }

    .products .column {
        flex-direction: column;
        gap: 20px;
        align-items: center;
    }

    .products .column .sec-img {
        max-width: 80%;
        width: 100%;
    }

    .products .column .specification {
        width: 100%;
    }

    .standard .standard-table {
        min-width: 1000px;
    }

    .intro .inner {
        padding-bottom: 72px;
    }

    .products .inner {
        padding-bottom: 120px;
    }

    .products .sec-body {
        gap: 60px;
    }

    .products03 .column .img-wrap {
        display: flex;
        flex-direction: column;
        gap: 24px;
        align-items: center;
    }
}

@media (max-width: 767px) {

    .intro .column .sec-img {
        max-width: 80%;
        width: 100%;
    }

    .intro .column {
        flex-direction: column;
        gap: 19px;
        align-items: center;
    }

    .intro .column .list {
        width: 95%;
    }

    .intro .column .item .dot-list {
        padding: 16px 2%;
    }

    .intro .column .item .dot-list p {
        gap: 8px;
    }

    .products .column .specification.column-2 {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .products02 .item-e .column {
        gap: 20px 0;
    }

    .products03 .column .specification .group {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .products .column .specification .group .dt::after {
        right: 50%;
    }
}