@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;600;700&family=Noto+Serif+JP:wght@400;600;700&family=Oswald&family=Questrial&familyEB+Garamond:ital,wght@0,400..800;1,400..800&display=swap");
.img03 { padding: 3rem 0; background: #f5f2ec; }
.img03 .img { display: block; width: 90%; max-width: 600px; margin: 0 auto; mix-blend-mode: multiply; }
.img03 .note { width: 94%; max-width: 1000px; margin-right: auto; margin-left: auto; margin-top: 3rem; }

.floor { background: #512a0f; color: #fff; padding: 5rem 0; }
.floor .grid { display: grid; gap: 5rem 3rem; grid-template-columns: repeat(2, 1fr); grid-template-areas: "f-resi f1" "f-resi f3" "note note"; }
.floor .f-ttl { color: #CB9364; font-size: 3rem; letter-spacing: .1em; line-height: 1; border-bottom: solid 1px #CB9364; }
.floor .f-item { margin-top: 2rem; }
.floor .f-item .img + .f-midashi { margin-top: 2rem; }
.floor .f-item .f-midashi { font-size: 1.8rem; letter-spacing: .05em; line-height: 2; }
.floor .f-item .f-midashi + .img { margin-top: 2rem; }
.floor .f-item .lead { margin-top: 2rem; font-size: 1.3rem; line-height: 2; }
.floor .f-item .note { margin-top: 2rem; }
.floor .f-item.f-item2 { position: relative; padding-bottom: 10rem; }
.floor .f-item.f-item2 .img { width: calc(40% + 1rem); position: relative; z-index: 2; }
.floor .f-item.f-item2 .txt-box { position: absolute; bottom: 0; right: 0; background: rgba(195, 136, 86, 0.3); padding: 2rem; width: 60%; }
.floor .f-resi { grid-area: f-resi; }
.floor .f-1 { grid-area: f1; }
.floor .f-2 { grid-area: f2; }
.floor .f-3 { grid-area: f3; }
.floor .note { grid-area: note; }
@media screen and (max-width: 768px) { .floor .grid { grid-template-columns: 1fr; grid-template-areas: "f-resi" "f1" "f3" "note"; } }

#publicspace .lead + .note { margin-top: 2rem; }

#resi-design .inner .note { text-align: left; padding-top: 1rem; }
