.con-costper { margin-left: auto; margin-right: auto; width: calc(100% - 160px); }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-costper { width: 92%; } }
@media only screen and (max-width: 767px) { .con-costper { width: 89.6%; } }

/*Animate */
/* ----------------------------------------------------------- .con-outline
----------------------------------------------------------- */
.con-outline { color: #fff; background-color: #292929; padding-top: 240px; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; }
@media only screen and (max-width: 767px) { .con-outline { padding-top: 120px; } }
@media only screen and (min-width: 768px) { .con-outline .box-outline { display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; } }
@media print { .con-outline .box-outline { display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; } }
.ie8 .con-outline .box-outline { display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; }
@media only screen and (min-width: 768px) { .con-outline .box-outline .box-title { position: sticky; top: 80px; left: 0; width: 50%; text-align: center; } }
@media print { .con-outline .box-outline .box-title { position: sticky; top: 80px; left: 0; width: 50%; text-align: center; } }
.ie8 .con-outline .box-outline .box-title { position: sticky; top: 80px; left: 0; width: 50%; text-align: center; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-outline .box-outline .box-title { width: 40%; } }
@media only screen and (max-width: 767px) { .con-outline .box-outline .box-title { width: 89.6%; margin: 0 auto 48px; } }
.con-outline .box-outline .box-title .wrap { display: inline-block; text-align: left; }
.con-outline .box-outline .box-title .wrap .txt-en { color: #90825D; font-family: "Marcellus", serif; font-weight: 400; font-style: normal; text-transform: uppercase; letter-spacing: 0.14em; font-size: 1.3rem; line-height: 1.3; margin-bottom: 24px; }
@media only screen and (max-width: 767px) { .con-outline .box-outline .box-title .wrap .txt-en { font-size: 1.2rem; } }
.con-outline .box-outline .box-title .wrap h2 { font-weight: 400; line-height: 1.3; font-size: 3.2rem; letter-spacing: 0.08em; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-outline .box-outline .box-title .wrap h2 { font-size: 3vw; line-height: 1.5; } }
@media only screen and (max-width: 767px) { .con-outline .box-outline .box-title .wrap h2 { font-size: 2.4rem; } }
@media only screen and (max-width: 767px) { .con-outline .box-outline .box-title .wrap h2 span { writing-mode: tb-rl; writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -o-writing-mode: vertical-rl; -webkit-writing-mode: vertical-rl; text-align: left; display: inline-block; }
  .con-outline .box-outline .box-title .wrap h2 span em { text-orientation: upright; } }
@media only screen and (min-width: 768px) { .con-outline .box-outline .box-txt { padding-right: 7.9vw; } }
@media print { .con-outline .box-outline .box-txt { padding-right: 7.9vw; } }
.ie8 .con-outline .box-outline .box-txt { padding-right: 7.9vw; }
@media only screen and (min-width: 1025px) { .con-outline .box-outline .box-txt { width: 50%; } }
@media print { .con-outline .box-outline .box-txt { width: 50%; } }
.ie8 .con-outline .box-outline .box-txt { width: 50%; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-outline .box-outline .box-txt { width: 60%; } }
@media only screen and (max-width: 767px) { .con-outline .box-outline .box-txt { width: 89.6%; margin: 0 auto; } }
.con-outline .box-outline .box-txt .txt { line-height: 2.4; letter-spacing: 0.08em; padding-bottom: 2em; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-outline .box-outline .box-txt .txt { font-size: 1.75vw; } }
.con-outline .box-outline .box-txt .txt em { color: #D4C8A6; }
.con-outline .box-outline .box-txt .box-note { border: 1px solid #6E7283; padding: 24px 32px; letter-spacing: 0.08em; }
@media only screen and (max-width: 767px) { .con-outline .box-outline .box-txt .box-note { padding: 24px; margin-top: 48px; } }
.con-outline .box-outline .box-txt .box-note h3 { font-weight: normal; margin-bottom: 8px; }
.con-outline .box-outline .box-txt .box-note .txt-note { font-size: 1.4rem; }
@media only screen and (max-width: 767px) { .con-outline .box-outline .box-txt .box-note .txt-note { font-size: 1.2rem; } }
.con-outline .box-trinity { border-top: 1px solid #6E7283; margin-top: 160px; }
@media only screen and (min-width: 768px) { .con-outline .box-trinity { display: -webkit-flex; display: flex; } }
@media print { .con-outline .box-trinity { display: -webkit-flex; display: flex; } }
.ie8 .con-outline .box-trinity { display: -webkit-flex; display: flex; }
@media only screen and (max-width: 767px) { .con-outline .box-trinity { margin-top: 104px; } }
@media only screen and (min-width: 768px) { .con-outline .box-trinity li { width: 33.33333%; padding: 160px 4.2vw; } }
@media print { .con-outline .box-trinity li { width: 33.33333%; padding: 160px 4.2vw; } }
.ie8 .con-outline .box-trinity li { width: 33.33333%; padding: 160px 4.2vw; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-outline .box-trinity li { padding: 80px 2.4vw; } }
@media only screen and (max-width: 767px) { .con-outline .box-trinity li { padding: 48px 6vw; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; align-items: center; } }
.con-outline .box-trinity li:not(:first-child) { border-left: 1px solid #6E7283; }
@media only screen and (max-width: 767px) { .con-outline .box-trinity li:not(:first-child) { border-left: none; border-top: 1px solid #6E7283; } }
.con-outline .box-trinity li h3 { text-align: center; margin-bottom: 48px; }
@media only screen and (max-width: 767px) { .con-outline .box-trinity li h3 { width: 50%; text-align: left; margin-bottom: 24px; } }
.con-outline .box-trinity li h3 span { display: block; line-height: 1; letter-spacing: 0.08em; font-weight: normal; }
.con-outline .box-trinity li h3 span.en { font-family: "Marcellus", serif; font-weight: 400; font-style: normal; color: #90825D; text-transform: uppercase; margin-bottom: 13px; }
.con-outline .box-trinity li h3 span.jp { line-height: 1; font-size: 3.2rem; }
@media only screen and (max-width: 767px) { .con-outline .box-trinity li h3 span.jp { font-size: 2.6rem; } }
.con-outline .box-trinity li .img { text-align: center; margin-bottom: 48px; }
@media only screen and (max-width: 767px) { .con-outline .box-trinity li .img { width: 50%; margin-bottom: 24px; } }
.con-outline .box-trinity li .img img { -webkit-border-radius: 9999px; -moz-border-radius: 9999px; -ms-border-radius: 9999px; border-radius: 9999px; }
.con-outline .box-trinity li .txt { letter-spacing: 0.08em; }
.con-outline .box-trinity li .txt em { color: #D4C8A6; }

/* ----------------------------------------------------------- .con-performance
----------------------------------------------------------- */
.con-performance { margin: 240px auto; border-bottom: 1px solid #292929; }
@media only screen and (max-width: 767px) { .con-performance { margin: 120px auto; } }
.con-performance .title-basic { margin-bottom: 80px; }
@media only screen and (max-width: 767px) { .con-performance .title-basic { margin-bottom: 40px; } }
.con-performance .box-performance { position: relative; display: -webkit-flex; display: flex; }
.con-performance .box-performance:before { content: ""; width: 0; height: 1px; background-color: #292929; position: absolute; top: 0; left: 0; -webkit-transition: 0.8s; -moz-transition: 0.8s; -ms-transition: 0.8s; -o-transition: 0.8s; transition: 0.8s; }
.con-performance .box-performance .txt-deco { width: 80px; position: relative; text-align: center; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-performance .box-performance .txt-deco { width: 56px; } }
@media only screen and (max-width: 767px) { .con-performance .box-performance .txt-deco { -webkit-align-items: flex-start; align-items: flex-start; width: 24px; } }
.con-performance .box-performance .txt-deco:before { content: ""; width: 1px; height: 0; background-color: #292929; position: absolute; top: 0; right: 0; -webkit-transition: 0.8s; -moz-transition: 0.8s; -ms-transition: 0.8s; -o-transition: 0.8s; transition: 0.8s; }
.con-performance .box-performance .txt-deco span { writing-mode: tb-rl; writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -o-writing-mode: vertical-rl; -webkit-writing-mode: vertical-rl; text-align: left; display: inline-block; font-family: "Marcellus", serif; font-weight: 400; font-style: normal; font-size: 1.4rem; letter-spacing: 0.08em; line-height: 1; }
@media only screen and (max-width: 767px) { .con-performance .box-performance .txt-deco span { font-size: 1.2rem; } }
.con-performance .box-performance .item-performance { width: calc(100% - 80px); padding: 120px 7.9vw 160px; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-performance .box-performance .item-performance { width: calc(100% - 56px); } }
@media only screen and (max-width: 767px) { .con-performance .box-performance .item-performance { width: calc(100% - 24px); padding: 7.9vw 7.9vw 16vw; } }
.con-performance .box-performance .item-performance .img { margin-left: auto; max-width: 640px; }
.con-performance .box-performance .item-performance .img.video { overflow: hidden; aspect-ratio: 4 / 3; }
.con-performance .box-performance .item-performance .img.video video { width: 100%; height: 100%; object-fit: cover; }
@media only screen and (min-width: 1025px) { .con-performance .box-performance .item-performance .box-txt { margin-top: -40px; } }
@media print { .con-performance .box-performance .item-performance .box-txt { margin-top: -40px; } }
.ie8 .con-performance .box-performance .item-performance .box-txt { margin-top: -40px; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-performance .box-performance .item-performance .box-txt { margin-top: 120px; } }
@media only screen and (max-width: 767px) { .con-performance .box-performance .item-performance .box-txt { margin-top: 64px; } }
.con-performance .box-performance .item-performance .box-txt .title-en { color: #90825D; font-family: "Marcellus", serif; font-weight: 400; font-style: normal; text-transform: uppercase; line-height: 1; font-size: 1.4rem; letter-spacing: 0.14em; margin-bottom: 16px; }
.con-performance .box-performance .item-performance .box-txt h2 { font-weight: 400; line-height: 1.3; font-size: 3.2rem; margin-bottom: 40px; }
@media only screen and (max-width: 767px) { .con-performance .box-performance .item-performance .box-txt h2 { font-size: 2.4rem; margin-bottom: 32px; } }
.con-performance .box-performance .item-performance .box-txt .txt { line-height: 2; letter-spacing: 0.08em; }
.con-performance .box-performance .item-performance .list-insulation { margin-top: 64px; }
.con-performance .box-performance .item-performance .list-insulation li { border-top: 1px solid #DEDEDE; }
@media only screen and (min-width: 768px) { .con-performance .box-performance .item-performance .list-insulation li { display: -webkit-flex; display: flex; padding: 64px 0; gap: 0 64px; } }
@media print { .con-performance .box-performance .item-performance .list-insulation li { display: -webkit-flex; display: flex; padding: 64px 0; gap: 0 64px; } }
.ie8 .con-performance .box-performance .item-performance .list-insulation li { display: -webkit-flex; display: flex; padding: 64px 0; gap: 0 64px; }
@media only screen and (max-width: 767px) { .con-performance .box-performance .item-performance .list-insulation li { padding: 40px 0; } }
@media only screen and (min-width: 768px) { .con-performance .box-performance .item-performance .list-insulation li .img-insulation { width: 320px; } }
@media print { .con-performance .box-performance .item-performance .list-insulation li .img-insulation { width: 320px; } }
.ie8 .con-performance .box-performance .item-performance .list-insulation li .img-insulation { width: 320px; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-performance .box-performance .item-performance .list-insulation li .img-insulation { width: 30%; } }
@media only screen and (max-width: 767px) { .con-performance .box-performance .item-performance .list-insulation li .img-insulation { text-align: center; margin-bottom: 32px; } }
.con-performance .box-performance .item-performance .list-insulation li .img-insulation img { -webkit-border-radius: 9999px; -moz-border-radius: 9999px; -ms-border-radius: 9999px; border-radius: 9999px; }
@media only screen and (min-width: 768px) { .con-performance .box-performance .item-performance .list-insulation li .box-detail { padding-top: 24px; width: calc(100% - 384px); } }
@media print { .con-performance .box-performance .item-performance .list-insulation li .box-detail { padding-top: 24px; width: calc(100% - 384px); } }
.ie8 .con-performance .box-performance .item-performance .list-insulation li .box-detail { padding-top: 24px; width: calc(100% - 384px); }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-performance .box-performance .item-performance .list-insulation li .box-detail { width: calc(70% - 64px); } }
.con-performance .box-performance .item-performance .list-insulation li .box-detail h3 { font-size: 2.4rem; font-weight: normal; line-height: 1; letter-spacing: 0.08em; margin-bottom: 24px; }
@media only screen and (max-width: 767px) { .con-performance .box-performance .item-performance .list-insulation li .box-detail h3 { text-align: center; font-size: 1.8rem; } }
.con-performance .box-performance .item-performance .list-insulation li .box-detail .txt { letter-spacing: 0.08em; }
.con-performance .box-performance .item-performance .box-airtight { background-color: #E8E0D7; padding: 64px; margin-top: 80px; }
@media only screen and (min-width: 768px) { .con-performance .box-performance .item-performance .box-airtight { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 0 56px; } }
@media print { .con-performance .box-performance .item-performance .box-airtight { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 0 56px; } }
.ie8 .con-performance .box-performance .item-performance .box-airtight { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 0 56px; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-performance .box-performance .item-performance .box-airtight { -webkit-align-items: flex-start; align-items: flex-start; padding: 48px; } }
@media only screen and (max-width: 767px) { .con-performance .box-performance .item-performance .box-airtight { padding: 32px 24px; margin-top: 64px; } }
@media only screen and (min-width: 768px) { .con-performance .box-performance .item-performance .box-airtight .img-airtight { width: 320px; } }
@media print { .con-performance .box-performance .item-performance .box-airtight .img-airtight { width: 320px; } }
.ie8 .con-performance .box-performance .item-performance .box-airtight .img-airtight { width: 320px; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-performance .box-performance .item-performance .box-airtight .img-airtight { width: 30%; } }
@media only screen and (max-width: 767px) { .con-performance .box-performance .item-performance .box-airtight .img-airtight { text-align: center; margin-bottom: 32px; } }
.con-performance .box-performance .item-performance .box-airtight .img-airtight img { -webkit-border-radius: 9999px; -moz-border-radius: 9999px; -ms-border-radius: 9999px; border-radius: 9999px; }
@media only screen and (min-width: 768px) { .con-performance .box-performance .item-performance .box-airtight .box-detail { width: calc(100% - 376px); } }
@media print { .con-performance .box-performance .item-performance .box-airtight .box-detail { width: calc(100% - 376px); } }
.ie8 .con-performance .box-performance .item-performance .box-airtight .box-detail { width: calc(100% - 376px); }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-performance .box-performance .item-performance .box-airtight .box-detail { width: calc(70% - 56px); } }
.con-performance .box-performance .item-performance .box-airtight .box-detail h3 { font-weight: normal; font-size: 2.4rem; line-height: 1; letter-spacing: 0.08em; margin-bottom: 24px; }
@media only screen and (max-width: 767px) { .con-performance .box-performance .item-performance .box-airtight .box-detail h3 { font-size: 1.8rem; text-align: center; } }
.con-performance .box-performance .item-performance .box-airtight .box-detail .txt-detail { letter-spacing: 0.08em; line-height: 2; }
@media only screen and (max-width: 767px) { .con-performance .box-performance .item-performance .box-airtight .box-detail .txt-detail { line-height: 1.75; } }
@media only screen and (min-width: 1025px) { .con-performance .box-performance .item-performance .box-ventilation { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 0 64px; } }
@media print { .con-performance .box-performance .item-performance .box-ventilation { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 0 64px; } }
.ie8 .con-performance .box-performance .item-performance .box-ventilation { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; gap: 0 64px; }
@media only screen and (min-width: 1025px) { .con-performance .box-performance .item-performance .box-ventilation .img-ventilation { width: 45.3%; order: 2; } }
@media print { .con-performance .box-performance .item-performance .box-ventilation .img-ventilation { width: 45.3%; order: 2; } }
.ie8 .con-performance .box-performance .item-performance .box-ventilation .img-ventilation { width: 45.3%; order: 2; }
@media only screen and (max-width: 1024px) { .con-performance .box-performance .item-performance .box-ventilation .img-ventilation { margin: 2em 0; } }
@media only screen and (min-width: 1025px) { .con-performance .box-performance .item-performance .box-ventilation .box-detail { width: calc(54.7% - 64px); order: 1; } }
@media print { .con-performance .box-performance .item-performance .box-ventilation .box-detail { width: calc(54.7% - 64px); order: 1; } }
.ie8 .con-performance .box-performance .item-performance .box-ventilation .box-detail { width: calc(54.7% - 64px); order: 1; }
.con-performance .box-performance .item-performance .box-ventilation .box-detail dl { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin-top: 2em; }
.con-performance .box-performance .item-performance .box-ventilation .box-detail dl dt { position: relative; padding-left: 10px; width: 6.5em; margin-bottom: 2em; }
.con-performance .box-performance .item-performance .box-ventilation .box-detail dl dt:before { content: ""; background-color: #90825D; width: 6px; height: 6px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; position: absolute; top: 0.75em; left: 0; }
.con-performance .box-performance .item-performance .box-ventilation .box-detail dl dt em { color: #90825D; }
.con-performance .box-performance .item-performance .box-ventilation .box-detail dl dd { width: calc(100% - 6.5em); margin-bottom: 2em; }
.con-performance .box-performance.even .txt-deco { order: 2; }
@media only screen and (max-width: 767px) { .con-performance .box-performance.even .txt-deco { -webkit-align-items: flex-end; align-items: flex-end; } }
.con-performance .box-performance.even .txt-deco:before { right: auto; left: 0; }
@media only screen and (min-width: 768px) { .con-performance .box-performance:last-child .item-performance { display: -webkit-flex; display: flex; padding: 0; } }
@media print { .con-performance .box-performance:last-child .item-performance { display: -webkit-flex; display: flex; padding: 0; } }
.ie8 .con-performance .box-performance:last-child .item-performance { display: -webkit-flex; display: flex; padding: 0; }
.con-performance .box-performance:last-child .item-performance .img { overflow: hidden; }
@media only screen and (min-width: 768px) { .con-performance .box-performance:last-child .item-performance .img { width: 44.8%; } }
@media print { .con-performance .box-performance:last-child .item-performance .img { width: 44.8%; } }
.ie8 .con-performance .box-performance:last-child .item-performance .img { width: 44.8%; }
.con-performance .box-performance:last-child .item-performance .img img { width: 100%; height: 100%; object-fit: cover; max-width: none; }
@media only screen and (min-width: 768px) { .con-performance .box-performance:last-child .item-performance .box-txt { width: 55.2%; padding: 187px 7.9vw; } }
@media print { .con-performance .box-performance:last-child .item-performance .box-txt { width: 55.2%; padding: 187px 7.9vw; } }
.ie8 .con-performance .box-performance:last-child .item-performance .box-txt { width: 55.2%; padding: 187px 7.9vw; }
.con-performance .box-performance.js-inview-in:before { width: 100%; transition-delay: .8s; }
.con-performance .box-performance.js-inview-in .txt-deco:before { height: 100%; transition-delay: .8s; }

/* ----------------------------------------------------------- .con-costper
----------------------------------------------------------- */
.con-costper { padding-bottom: 240px; }
@media only screen and (max-width: 767px) { .con-costper { padding-bottom: 120px; } }
.con-costper .box-costper { border: 1px solid #292929; padding: 7.9vw; }
@media only screen and (max-width: 767px) { .con-costper .box-costper { padding: 40px 24px; } }
@media only screen and (min-width: 1025px) { .con-costper .box-costper .box-detail { display: -webkit-flex; display: flex; margin-bottom: 64px; } }
@media print { .con-costper .box-costper .box-detail { display: -webkit-flex; display: flex; margin-bottom: 64px; } }
.ie8 .con-costper .box-costper .box-detail { display: -webkit-flex; display: flex; margin-bottom: 64px; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-costper .box-costper .box-detail { margin-bottom: 48px; } }
@media only screen and (max-width: 767px) { .con-costper .box-costper .box-detail { margin-bottom: 24px; } }
.con-costper .box-costper .box-detail h3 { font-size: 2.6rem; font-weight: normal; line-height: 1.5; }
@media only screen and (min-width: 1025px) { .con-costper .box-costper .box-detail h3 { width: 35%; } }
@media print { .con-costper .box-costper .box-detail h3 { width: 35%; } }
.ie8 .con-costper .box-costper .box-detail h3 { width: 35%; }
@media only screen and (min-width: 768px) and (max-width: 1024px) { .con-costper .box-costper .box-detail h3 { font-size: 2.2rem; margin-bottom: 24px; text-align: center; } }
@media only screen and (max-width: 767px) { .con-costper .box-costper .box-detail h3 { font-size: 1.8rem; margin-bottom: 24px; text-align: center; } }
.con-costper .box-costper .box-detail .txt { line-height: 2; letter-spacing: 0.08em; }
@media only screen and (min-width: 1025px) { .con-costper .box-costper .box-detail .txt { width: 65%; padding-left: 5%; } }
@media print { .con-costper .box-costper .box-detail .txt { width: 65%; padding-left: 5%; } }
.ie8 .con-costper .box-costper .box-detail .txt { width: 65%; padding-left: 5%; }
.con-costper .box-costper .box-img { background-color: #FBF9F7; padding: 40px 5vw; text-align: center; overflow: hidden; }
@media only screen and (max-width: 767px) { .con-costper .box-costper .box-img { padding: 5vw; } }
