/* Life at mazrica - page-specific node CSS.
   Generic legacy chrome (inner, btn, mdl-flex, footer-link, conversion band,
   ttl-min-jp, ttl-txt) and the mdl-3col-list container + mdl-3col-img come from
   the .recruit-legacy bundle. Gap added here: title block, the legacy
   mdl-3col-list li grid sizing, and mdl-3col-txt. */
.recruit-legacy .lower-main-ttl { margin: 90px 0 90px; text-align: center; }
.recruit-legacy .lower-industry { font-size: 40px; line-height: 1.5; margin-bottom: 2px; }
.recruit-legacy .lower-industry img { height: 45px; max-width: 100%; }

.recruit-legacy .mdl-3col-list > li { display: inline-block; width: calc((99.9% - 80px) / 3); position: relative; }
.recruit-legacy .mdl-3col-list > li + li { margin-left: 40px; }
.recruit-legacy .mdl-3col-list > li:nth-child(3n+1) { margin-left: 0; }
.recruit-legacy .mdl-3col-list > li:nth-child(n+4) { margin-top: 54px; }
.recruit-legacy .mdl-3col-img img { width: 100%; }
/* live renders card descriptions at 14px with a 1.7 line-height (inherited from the
   legacy body); mz-core would otherwise leave them at 16px with line-height 1. */
.recruit-legacy .mdl-3col-txt { font-size: 14px; line-height: 1.7; margin-top: 8px; }

@media screen and (max-width: 768px) {
  .recruit-legacy .lower-main-ttl { margin: 60px 0 60px; }
  .recruit-legacy .mdl-3col-list > li { width: 100%; margin: 0; }
  .recruit-legacy .mdl-3col-list > li + li { margin: 0; }
  .recruit-legacy .mdl-3col-list > li:nth-child(n+2) { margin-top: 40px; }
}