body{ background-color: var( --color-gray-484848)}
.explanationTemplate{ width: 63%; margin: 0 auto; padding-top: 1.2rem; color: var(--color-gray-dcdcde);}
 .breadcrumb {
  padding: 1.5rem 0 0.6rem;
}
 .breadcrumb * {
  font-size:var(--font-size-3);
  color:var(--color-gray-484848);
}
 .breadcrumb a {
  color: var(--color-gray-484848);
}
 .breadcrumb a.current {  
  color: var(--color-yellow);
}
.explanationTemplate .content{
  padding-bottom: 1.5rem;
   font-size:var(--font-size-3);
   line-height: 2;
}
.explanationTemplate .content .bigTitle{
  font-size: var(--font-size-12);
  font-weight: bold;
  margin-bottom: 0.12rem;
}
.explanationTemplate .content h4{
  margin-top: 0.4rem;
    font-size: var(--font-size-5);
    position: relative;
    padding: 0.2rem 0;
}
.explanationTemplate .content p{
 margin-top: 0.32rem;
 text-align: justify;
}
.explanationTemplate .content a{
  color: var(--color-yellow);
}
.explanationTemplate .content .imgScroll{
  width: 100%;
  margin-top: 0.2rem;
}
.explanationTemplate .content img{
  width: 100%;
}
/* .menu .primary-nav .bg{
  background-color: rgba(-255, -255, -255, 0.8);
} */
@media screen and (max-width: 1024px) {
  
}

@media screen and (max-width: 768px) {

 .explanationTemplate{ width: 90%; margin: 0 auto;}
 .explanationTemplate .content .imgScroll{ overflow: scroll;}
 .explanationTemplate .content .imgScroll img{ width:var(--width) ;}
}

