@charset "UTF-8";

main .layer_rich_main{background: url("../img/main_img.webp") no-repeat center center/cover;}
.layer_rich_main::before{content: "";display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: linear-gradient(to right,transparent,rgba(255,255,255,0.5))}
.layer_rich_main > *{justify-content: flex-end;}

@media screen and (max-width: 768px) {
main .layer_rich_main{background-position: 40% center;}
}

#contents > div:nth-of-type(n+2){margin-top: 3.5em;}
.item_tit{font-size: 1.2em;font-weight: 600;line-height: 1.3;animation-name: fadeInUp;}
.item_tit + p{font-size: 0.75em;animation-name: fadeInUp;}
.item_tit + *{margin-top: 0.8em;}

.performance_item{display: flex;justify-content: space-between;}
.performance_item > li{width: 15.5em;background: #e4ede9;animation-name: fadeInUp;}
.performance_item > li dl{display: flex;flex-wrap: wrap;justify-content: space-between;}
.performance_item > li dt{background: #007774;font-size: 1em;letter-spacing: 0.05em;padding: 0.5em 0;color: #fff;width: 5.5em;display: flex;justify-content: center;align-items: center;text-align: center;}
.performance_item > li dt big{font-size: 2.4em;font-weight: 600;line-height: 1;vertical-align: -0.2em;margin-left: 0.1em;}
.performance_item > li dt p{color: #fff462;letter-spacing: 0;}
.performance_item > li dd:nth-of-type(1){width: 9.7em;align-self: center;}
.performance_item > li dd:nth-of-type(1) strong{font-size: 1.3em;font-weight: 600;display: block;line-height: 1.1;}
.performance_item > li dd:nth-of-type(1) strong small{font-size: 0.6em;font-weight: 300;display: block;margin-top: 0.2em;}
.performance_item > li dd:nth-of-type(1) p{font-size: 0.65em;margin-top: 0.3em;}
.performance_item > li dd:nth-of-type(2){font-size: 0.75em;padding: 1em;}
.insulation_item{display: grid;grid-template-columns: 31em 31em;justify-content: space-between;gap: 1em 0;}
.insulation_item > li{background: #e4ede9;padding: 1em;animation-name: fadeInUp;}
.insulation_item > li.low-e{display: flex;justify-content: space-between;}
.insulation_item > li.low-e .item_tit{width: 38%;}
.insulation_item > li.low-e figure{width: 16.45em;}
.insulation_item > li.low-e figure .cap_b{right: 0;bottom: 0;}
.insulation_item > li.low-e div{width: 11.5em;position: absolute;left: 1em;bottom: 1em;color: #fff;background: #62885e;padding: 0.5em;text-align: center;}
.insulation_item > li.low-e div small{font-size: 0.8em;display: block;}
.insulation_item > li.low-e div > big{font-size: 1.2em;display: inline-block;}
.insulation_item > li.low-e div > big strong{color: #fff462;}
.insulation_item > li.low-e div > big strong big{font-size: 1.17em;line-height: 1;}
.insulation_item > li.low-e div > big [data-ruby]{position: relative;}
.insulation_item > li.low-e div > big [data-ruby]::before{content: attr(data-ruby);position: absolute;top: -0.9em;right: 0;font-size: 0.4em;}
.insulation_item > li.bath .bath_item{display: flex;justify-content: space-between;}
.insulation_item > li.bath .bath_item > *{width: 48%;display: flex;flex-direction: column;align-content: flex-start;}
.insulation_item > li.bath .bath_item > * h6{font-size: 0.9em;background: #fff;padding: 0.3em;text-align: center;width: 100%;}
.insulation_item > li.bath .bath_item > dd h6{color: var(--main_color);}
.insulation_item > li.bath .bath_item > * h6 + p{font-size: 0.75em;margin: 0.5em 0 1em;width: 100%;}
.insulation_item > li.bath .bath_item > * figure{width: 10.05em;margin: auto auto 0 auto;}
.insulation_item > li.sash{grid-row: 1/3;grid-column: 2/3;}
.insulation_item > li.sash .sash_img{display: flex;justify-content: center;align-items: center;gap: 0 2em;}
.insulation_item > li.sash .sash_img > figure:nth-of-type(1){width: 3.05em;margin: 2em -2em 0 0;}
.insulation_item > li.sash .sash_img > figure:nth-of-type(2){width: 4.9em;}
.insulation_item > li.sash .sash_img > figure:nth-of-type(3){width: 13em;}
.insulation_item > li.sash .sash_item{display: flex;justify-content: space-between;margin-top: 1.5em;}
.insulation_item > li.sash .sash_item dt{width: 15.5em;}
.insulation_item > li.sash .sash_item .item_tit + p strong{color: #d8a400;}
.insulation_item > li.sash .sash_item dd{width: 12em;}
.evaluation_item{display: flex;justify-content: space-between;align-items: center;}
.evaluation_item > dt{width: 9.7em;animation-name: fadeInUp;}
.evaluation_item > dt:nth-of-type(2){animation-delay: 0.3s;width:18%}
.evaluation_item > dt p{font-size: 0.75em;margin-top: 0.8em;}
.evaluation_item > dd{width: 40em;background: #e4ede9;padding: 1em;animation-name: fadeInUp;}
.evaluation_item > dd h5{font-size: 1.2em;color: #fff;text-align: center;padding: 0.1em;background: #62885e;}
.evaluation_item > dd .merit_item{display: flex;justify-content: space-between;margin-top: 0.8em;}
.evaluation_item > dd .merit_item li{width: 47%;}
.evaluation_item > dd .merit_item li h6 span{font-size: 1em;font-weight: 600;padding-left: 2.2em;}
.evaluation_item > dd .merit_item li h6 i{position: absolute;left: 0;top: -0.1em; line-height: 1;color: #b28500;font-weight: 500;font-family: "Oswald", sans-serif;font-style: italic;font-size: 3em;}
.evaluation_item > dd .merit_item li h6 + p{font-size: 0.75em;margin: 0.3em 0 0 3em;}
#jio_jhs{background: #f7f7f7;padding: 3.5em 0;}
.jio_logo{width: 30em;margin-inline: auto;}
.jio_item{display: flex;justify-content: space-between;align-items: center; margin-top: 1.5em;}
.jio_item > dt{width: 34.5em;animation-name: fadeInUp;}
.jio_item > dd{width: 28.05em;animation-name: fadeInUp;}
.jhs_logo{width: 35em;margin: 3em auto 0;mix-blend-mode: multiply;}
.jhs_item{display: flex;justify-content: space-between;margin-top: 2em;}
.jhs_item > dt{width: 22.5em;animation-name: fadeInUp;}
.jhs_item > dd{width: 40em;animation-name: fadeInUp;background: #e4ede9;padding: 1em;}
.jhs_item > dd h6{font-size: 1.2em;color: #fff;text-align: center;padding: 0.1em;background: #62885e;}
.jhs_item > dd figure{width: 30.05em;margin: 0.8em auto 0;}
.afterfollow_img{margin: 1.5em auto 0;width: 82em;padding: 0 1em;animation-name: fadeInUp;}

@media screen and (min-width: 769px) {
.performance_item > li:nth-of-type(2){animation-delay: 0.3s;}
.performance_item > li:nth-of-type(3){animation-delay: 0.6s;}
.performance_item > li:nth-of-type(4){animation-delay: 0.9s;}
.insulation_item > li.sash{animation-delay: 0.3s;}
.evaluation_item > dd{animation-delay: 0.6s;}
.jio_item > dd{animation-delay: 0.3s;}
.jhs_item > dd{animation-delay: 0.3s;}
}

@media screen and (max-width: 768px) {
#contents > div:nth-of-type(n+2){margin-top: 10vw;}
.item_tit{font-size: 4.2vw;}
.item_tit + p{font-size: 3.5vw;}

.performance_item{flex-wrap: wrap;gap: 3vw 0;}
.performance_item > li{width: 49%;}
.performance_item > li dt{font-size: 3.1vw;letter-spacing: 0em;width: 38%;}
.performance_item > li dd:nth-of-type(1){width: 61%;}
.performance_item > li dd:nth-of-type(1) strong{font-size: 3.8vw;}
.performance_item > li dd:nth-of-type(1) p{font-size: 2.2vw;line-height: 1.3;}
.performance_item > li dd:nth-of-type(2){font-size: 0.75em;padding: 1em;}
.insulation_item{display: flex;flex-wrap: wrap;gap: 1em 0;}
.insulation_item > li.low-e{flex-wrap: wrap;justify-content: flex-end;}
.insulation_item > li.low-e .item_tit{width: 100%;}
.insulation_item > li.low-e figure{width: 55%;margin-top: 3vw;padding: 0;}
.insulation_item > li.low-e div{padding: 0.5em 0.2em;width: auto;font-size: 0.85em;}
.insulation_item > li.sash{}
.insulation_item > li.sash .sash_img{gap: 0 2em;font-size: 3.3vw;}
.insulation_item > li.sash .sash_item dt{width: 55%;}
.insulation_item > li.sash .sash_item .item_tit{white-space: nowrap;}
.insulation_item > li.sash .sash_item dd{width: 43%;align-self: center;}
.evaluation_item{flex-wrap: wrap;}
.evaluation_item > dt{width: 44%;}
.evaluation_item > dt:nth-of-type(2){width:50%;}
.evaluation_item > dd{width: 100%;margin-top: 3vw;}
.evaluation_item > dd h5{font-size: 4.2vw;}
.evaluation_item > dd .merit_item{flex-wrap: wrap;gap: 3vw 0;}
.evaluation_item > dd .merit_item li{width: 100%;}
#jio_jhs{padding: 10vw 0;}
.jio_logo{width: 80vw;}
.jio_item{justify-content: center;flex-wrap: wrap;gap: 3vw 0;margin-top: 3vw;}
.jio_item > dt{width: 100%;}
.jio_item > dd{width: 100%;}
.jhs_logo{width: 80vw;margin: 10vw auto 0;}
.jhs_item{justify-content: center;flex-wrap: wrap;gap: 3vw 0;margin-top: 3vw;}
.jhs_item > dt{width: 100%;}
.jhs_item > dd{width: 100%;}
.jhs_item > dd h6{font-size: 4.2vw;}
.jhs_item > dd figure{width: 100%;}
.afterfollow_img{margin: 3vw auto 0;width: calc(100vw - 8vw);padding: 0;}
.afterfollow_img img{height: 70vw;max-width: none;}
}