#container { padding-bottom: 5rem; background: #fff; color: #000; }

.emb_ttl { margin-top: 5rem; }
.emb_ttl .txt { font-family: "Noto Serif JP", serif; -webkit-font-smoothing: antialiased; font-weight: 300; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; color: #C29647; font-size: 3rem; line-height: 1; letter-spacing: .1em; font-weight: bold; }

h3.main_copy { color: #000; margin-top: 80px; }

.eq-item .img-box .note { margin-top: 5px; }
.eq-item .waku { border: solid 1px #222; padding: 5px; }

.li-ttl { font-family: "Noto Serif JP", serif; -webkit-font-smoothing: antialiased; font-weight: 300; font-size: 2rem; line-height: 1.4; border-bottom: 1px solid; padding-bottom: 10px; }
.li-ttl .txt-s { font-size: 80%; display: inline-block; }

.li-txt { font-family: "Noto Serif JP", serif; -webkit-font-smoothing: antialiased; font-weight: 300; font-size: 1.4rem; line-height: 1.8; }
.li-txt .note { margin-top: 1rem; }

.img-box .img { margin: auto; }

#eq01-01 ul, #eq02-01 ul, #eq03-01 ul { display: grid; gap: 40px 80px; }
#eq01-01 ul li, #eq02-01 ul li, #eq03-01 ul li { display: grid; gap: 15px; grid-template-rows: subgrid; grid-row: span 4; grid-template-areas: "ttl" "txt" "img"; }
#eq01-01 .li-ttl, #eq02-01 .li-ttl, #eq03-01 .li-ttl { grid-area: ttl; }
#eq01-01 .li-txt, #eq02-01 .li-txt, #eq03-01 .li-txt { grid-area: txt; }
#eq01-01 .img-box, #eq02-01 .img-box, #eq03-01 .img-box { grid-area: img; }
#eq01-01 .img-box .img .cap, #eq02-01 .img-box .img .cap, #eq03-01 .img-box .img .cap { padding-top: 5px; text-align: right; }
#eq01-01 .img-box .img .cap.in, #eq02-01 .img-box .img .cap.in, #eq03-01 .img-box .img .cap.in { padding-top: 0; }

#eq01-01 ul { grid-template-columns: repeat(2, 1fr); }
@media screen and (max-width: 639px) { #eq01-01 ul { grid-template-columns: 1fr; } }

#eq02-01 ul { grid-template-columns: repeat(2, 1fr); }
#eq02-01 .eq2-5 .cap { display: block; }
#eq02-01 .eq2-5 .cap1, #eq02-01 .eq2-5 .cap2 { display: inline-block; width: 50%; }
#eq02-01 .eq2-6 .img-box .img { width: 80%; max-width: 400px; }
#eq02-01 .eq2-9 .img-box .img { width: 80%; max-width: 400px; }
@media screen and (max-width: 639px) { #eq02-01 ul { grid-template-columns: 1fr; } }

#eq03-01 ul { grid-template-columns: repeat(2, 1fr); }
#eq03-01 .eq3-1 .img-box .img { width: 80%; max-width: 400px; }
#eq03-01 .eq3-2 .img-box .img { width: 80%; max-width: 400px; }
#eq03-01 .eq3-5 .img-box .img { width: 80%; max-width: 400px; }
@media screen and (max-width: 639px) { #eq03-01 ul { grid-template-columns: 1fr; } }

#eq04 { /**************************************************************************************/ /**************************************************************************************/ /* SP Site*/ /**************************************************************************************/ /**************************************************************************************/ /* fade */ /* fade */ /* zoom */ /* zoom */ }
#eq04 #contents { padding-top: 5rem; }
#eq04 #contents .caption { max-height: 100%; font-size: 10px; color: #231815; text-align: left; line-height: 15px; margin: 0; }
#eq04 #contents .inner { position: relative; width: 960px; margin-left: auto; margin-right: auto; color: #000; }
#eq04 #contents .imgBox { position: relative; }
#eq04 #contents .imgBox .imgCaption { position: absolute; right: 5px; bottom: 5px; font-size: 12px; }
#eq04 #contents #about { margin-top: 60px; }
#eq04 #contents #about p { font-size: 20px; line-height: 1.8; text-align: center; }
#eq04 #contents #definition { margin: 80px auto 0; width: 800px; }
#eq04 #contents #definition .housing { background: #EEF5E3; padding: 25px; position: relative; }
#eq04 #contents #definition .housing::after { content: ''; width: 100%; height: 52px; background: url("../../images/zeh_m/arrow.svg") top center no-repeat; background-size: cover; position: absolute; left: 0; top: 100%; }
#eq04 #contents #definition .housing h4 { color: #00693E; font-size: 30px; font-weight: bold; text-align: center; position: relative; z-index: 1; }
#eq04 #contents #definition .housing .tableTitle { font-size: 16px; position: relative; z-index: 1; }
#eq04 #contents #definition table { border: 2px solid #0E5D35; width: 100%; }
#eq04 #contents #definition table th, #eq04 #contents #definition table td { padding: 5px 10px; text-align: center; }
#eq04 #contents #definition table th:not(:first-child), #eq04 #contents #definition table td:not(:first-child) { border-left: 1px solid #0E5D35; }
#eq04 #contents #definition table th { background: #00933C; border-bottom: 1px solid #0E5D35; color: #FFF; }
#eq04 #contents #definition table td { background: #FFF; }
#eq04 #contents #definition table + .caption { margin-top: 10px; }
#eq04 #contents #definition .housing .caption { position: relative; z-index: 1; }
#eq04 #contents #definition .factorWrap { width: 100%; margin: 40px auto 0; display: flex; justify-content: space-between; align-items: flex-start; }
#eq04 #contents #definition .factorItem { width: 50%; }
#eq04 #contents #definition .factor { width: 278px; margin: 0 auto; }
#eq04 #contents #definition .factor .factorTitle { font-size: 26px; font-weight: bolder; border-bottom: 1px solid #000; text-align: center; padding-bottom: 15px; margin-bottom: 15px; }
#eq04 #contents #definition .factor .factorCopy { font-size: 18px; font-weight: bolder; text-align: center; }
#eq04 #contents #definition .factorImg { margin: 20px auto 0; }
#eq04 #contents #definition .factorImg img { max-width: 100%; }
#eq04 #contents #definition #energy1 .puton { position: absolute; top: 0; left: 0; }
#eq04 #contents #definition #energy1 .factorImg .base { animation: insulation 4s linear infinite; }
@keyframes insulation { 0%,40% { opacity: 1; }
  20% { opacity: 0; } }
#eq04 #contents #definition .summary { margin-top: 40px; padding-bottom: 15px; border-bottom: 2px solid #7BC27C; }
#eq04 #contents #definition .summary .txtBox p { text-align: center; font-size: 21px; line-height: 1.8; }
#eq04 #contents #definition .summary h3 { color: #00693E; font-size: 50px; font-weight: bold; text-align: center; line-height: 1.2; margin-top: 20px; text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2); letter-spacing: 2px; }
#eq04 #contents #definition .summary h3 .harfsize { font-size: 28px; }
#eq04 #contents #bels { margin-top: 80px; }
#eq04 #contents #bels #belsContents { background: #EEF5E3; padding: 22px; }
#eq04 #contents #bels #belsContents .belsbody::after { display: block; clear: both; content: ''; }
#eq04 #contents #bels #belsContents .boxleft { float: left; width: 406px; }
#eq04 #contents #bels #belsContents .boxright { float: right; width: 490px; }
#eq04 #contents #bels #belsContents p.belscopy { font-size: 18px; line-height: 1.4; text-align: justify; }
#eq04 #contents #bels #belsContents .belscaption { width: 100%; margin-top: 10px; }
@media screen and (max-width: 640px) { #eq04 #contents .inner { width: 90%; }
  #eq04 #contents #about { margin-top: 50px; }
  #eq04 #contents #about p { text-align: justify; font-size: 3.5vw; }
  #eq04 #contents #about p br { display: none; }
  #eq04 #contents #definition { width: 100%; margin-top: 65px; }
  #eq04 #contents #definition .housing { padding: 15px; }
  #eq04 #contents #definition .housing h4 { font-size: 5.5vw; }
  #eq04 #contents #definition .housing h4 span { display: inline-block; }
  #eq04 #contents #definition .housing .tableTitle, #eq04 #contents #definition table th, #eq04 #contents #definition table td { font-size: 3.0vw; }
  #eq04 #contents #definition table th, #eq04 #contents #definition table td { width: 33.33%; }
  #eq04 #contents #definition table td span { display: inline-block; }
  #eq04 #contents #definition .housing::after { height: 30px; }
  #eq04 #contents #definition .factorWrap { justify-content: center; flex-wrap: wrap; }
  #eq04 #contents #definition .factorItem { width: 70%; max-width: 400px; }
  #eq04 #contents #definition .factorItem:not(:first-child) { margin-top: 50px; }
  #eq04 #contents #definition .factor { width: 100%; }
  #eq04 #contents #definition .factor .factorTitle { font-size: 5.0vw; padding-bottom: 10px; margin-bottom: 10px; }
  #eq04 #contents #definition .factor .factorCopy { font-size: 3.5vw; }
  #eq04 #contents #definition .summary .txtBox p { font-size: 4.5vw; }
  #eq04 #contents #definition .summary .ibspan { display: inline-block; }
  #eq04 #contents #definition .summary h3 { font-size: 9.0vw; }
  #eq04 #contents #definition .summary h3 .harfsize { font-size: 6.0vw; }
  #eq04 #contents #bels #belsContents .boxleft, #eq04 #contents #bels #belsContents .boxright { width: 100%; float: none; }
  #eq04 #contents #bels #belsContents .boxright { margin: 20px auto 0; width: 100%; max-width: 490px; } }
#eq04 .delighter { transition-duration: 1s; }
#eq04 .delighter[data-ani^="fade"], #eq04 .delighter[data-ani^="zoom"] { opacity: 0; transition-property: opacity,transform; }
#eq04 .delighter[data-ani="fade-up"] { transform: translate3d(0, 100px, 0); }
#eq04 .delighter[data-ani="fade-down"] { transform: translate3d(0, -100px, 0); }
#eq04 .delighter[data-ani="fade-right"] { transform: translate3d(-100px, 0, 0); }
#eq04 .delighter[data-ani="fade-left"] { transform: translate3d(100px, 0, 0); }
#eq04 .delighter.started[data-ani="fade-up"], #eq04 .delighter.started[data-ani="fade-down"], #eq04 .delighter.started[data-ani="fade-right"], #eq04 .delighter.started[data-ani="fade-left"] { opacity: 1; transform: translateZ(0); }
#eq04 .delighter[data-ani="zoom-in"] { transform: scale(0.6); }
#eq04 .delighter[data-ani="zoom-out"] { transform: scale(1.2); }
#eq04 .delighter.started[data-ani="zoom-in"], #eq04 .delighter.started[data-ani="zoom-ont"] { opacity: 1; transform: translateZ(0) scale(1); }
#eq04 #pagetop { display: none; }