@charset "utf-8";

/* PDU renewal page - desktop layout only */
#pduRenewal {
  width: 650px;
  margin: 0 15px 38px;
  color: #202426;
  font-family: Meiryo, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}
#pduRenewal * { box-sizing: border-box; }
#pduRenewal .pdu-main { margin: 0 0 20px; }
#pduRenewal .pdu-main img { display: block; width: 650px; height: 230px; }
#pduRenewal .pdu-section { margin: 0; padding: 0 10px 25px; }
#pduRenewal .pdu-section-no { margin: 0 0 3px; color: #727b7e; font-size: 14px; line-height: 1.4; }
#pduRenewal .pdu-section h3 { margin: 0 0 7px; color: #101314; font-size: 23px; line-height: 1.35; }
#pduRenewal .pdu-intro { margin: 0; color: #6f777a; font-size: 14px; }

/* Lineup */
#pduRenewal .pdu-card-list { margin: 20px -3px 0; }
#pduRenewal .pdu-card {
  position: relative;
  float: left;
  width: 309px;
  height: 340px;
  margin: 0 3px 8px;
  padding: 14px 13px 10px;
  overflow: hidden;
  border: 1px solid #cdd2d4;
  border-top: 5px solid #777d80;
  border-radius: 10px;
  background: #fff;
}
#pduRenewal .pdu-card-en { margin: 0 0 5px; color: #737b7e; font-size: 14px; }
#pduRenewal .pdu-card h4 { margin: 0 0 17px; color: #171a1b; font-size: 18px; line-height: 1.4; }
#pduRenewal .pdu-card-copy { min-height: 64px; margin: 0; color: #5d6467; font-size: 14px; line-height: 1.8; }
#pduRenewal .pdu-feature-list { margin: 14px 0 0; padding: 10px 0 0; border-top: 1px solid #d9dddf; }
#pduRenewal .pdu-feature-list li { position: relative; margin: 0; padding: 6px 0 6px 26px; color: #c7ccce; font-size: 14px; }
#pduRenewal .pdu-feature-list li:before {
  position: absolute;
  top: 6px;
  left: 1px;
  width: 14px;
  height: 14px;
  border: 1px solid #d2d7d9;
  border-radius: 50%;
  content: "";
}
#pduRenewal .pdu-feature-list li.is-on { color: #5a6265; }
#pduRenewal .pdu-feature-list li.is-on:before { border-color: #777d80; background: #777d80; content: "✓"; color: #fff; text-align: center; font-size: 9px; line-height: 14px; }
#pduRenewal .pdu-metered { border-top-color: #2b9b25; }
#pduRenewal .pdu-metered .pdu-card-en { color: #2b9b25; }
#pduRenewal .pdu-metered li.is-on:before { border-color: #2b9b25; background: #2b9b25; }
#pduRenewal .pdu-monitored { border-top-color: #0e95b7; }
#pduRenewal .pdu-monitored .pdu-card-en { color: #0e95b7; }
#pduRenewal .pdu-monitored li.is-on:before { border-color: #0e95b7; background: #0e95b7; }
#pduRenewal .pdu-switched { border-top-color: #ff8509; }
#pduRenewal .pdu-switched .pdu-card-en { color: #ef7500; }
#pduRenewal .pdu-switched li.is-on:before { border-color: #ff8509; background: #ff8509; }
#pduRenewal .pdu-note { margin: 2px 0 0; color: #687174; font-size: 12px; }

/* Installation type */
#pduRenewal .pdu-installation { padding: 20px 10px 22px; background: #f2f5f3; }
#pduRenewal .pdu-install-card {
  width: 100%;
  min-height: 150px;
  margin: 14px 0 0;
  padding: 10px 20px;
  border: 1px solid #d8dddf;
  border-radius: 8px;
  background: #fff;
}
#pduRenewal .pdu-install-image {
  position: relative;
  float: left;
  width: 165px;
  height: 128px;
  overflow: hidden;
  border: 1px dashed #bdc4c6;
  border-radius: 5px;
  background: #fafbfb;
  color: #929a9d;
  text-align: center;
  font-size: 14px;
  line-height: 128px;
}
#pduRenewal .pdu-install-image img { position: absolute; z-index: 2; top: 0; left: 0; width: 165px; height: 128px; object-fit: contain; background: #fff; }
#pduRenewal .pdu-install-text { float: right; width: 375px; padding-top: 17px; }
#pduRenewal .pdu-install-text h4 { margin: 0 0 15px; color: #111516; font-size: 18px; }
#pduRenewal .pdu-install-text h4 span { margin-left: 12px; font-size: 11px; font-weight: normal; }
#pduRenewal .pdu-install-text p { margin: 0; color: #5e676a; font-size: 12px; line-height: 1.9; }

/* Specifications */
#pduRenewal .pdu-specification { padding: 22px 10px 8px; background: #151a1c; color: #d6dcde; }
#pduRenewal .pdu-specification .pdu-section-no { color: #7b8589; }
#pduRenewal .pdu-specification h3 { color: #fff; }
#pduRenewal .pdu-spec-intro { margin: 0 0 19px; color: #9ca6aa; font-size: 12px; }
#pduRenewal .pdu-spec-row { min-height: 77px; padding: 17px 0; border-top: 1px solid #596367; }
#pduRenewal .pdu-spec-label { float: left; width: 172px; padding-top: 4px; }
#pduRenewal .pdu-spec-label strong { display: block; color: #f3f5f6; font-size: 12px; }
#pduRenewal .pdu-spec-label span { display: block; margin-top: 4px; color: #778286; font-size: 10px; }
#pduRenewal .pdu-value-list { float: right; width: 438px; padding-top: 3px; }
#pduRenewal .pdu-value-list li { float: left; min-width: 43px; margin-right: 7px; padding: 10px 8px; border-radius: 5px; background: #2b3339; color: #bdc6ca; text-align: center; font-weight: bold; font-size: 10px; }
#pduRenewal .pdu-voltage-list li { min-width: 83px; }
#pduRenewal .pdu-image-row { min-height: 150px; }
#pduRenewal .pdu-connector-list { float: right; width: 438px; }
#pduRenewal .pdu-connector-list li { float: left; width: 82px; margin-right: 5px; text-align: center; }
#pduRenewal .pdu-connector-image { position: relative; display: block; width: 54px; height: 54px; margin: 30px auto 8px; overflow: hidden;/* border-radius: 50%;*/ /*background: #2b3339;*/ color: #758084; }
#pduRenewal .pdu-connector-image b { display: block; padding: 17px 7px 0; font-size: 7px; line-height: 1.35; }
#pduRenewal .pdu-connector-image img { position: absolute; z-index: 2; top: 0; left: 0; width: 54px; height: 54px; object-fit: contain;/* background: #2b3339;*/ }
#pduRenewal .pdu-connector-list em { display: block; color: #899498; font-size: 10px; line-height: 1.35; }

/* Contact */
#pduRenewal .pdu-contact { margin-top: 18px; overflow: hidden; border: 1px solid #d4d9db; border-radius: 7px; background: #fff; }
#pduRenewal .pdu-contact h3 { margin: 0; padding: 12px 20px; background: #192022; color: #fff; font-size: 18px; }
#pduRenewal .pdu-contact-body { padding: 19px 21px 22px; }
#pduRenewal .pdu-contact-label { margin: 0 0 6px; color: #32383a; font-size: 15px; font-weight: bold; }
#pduRenewal .pdu-contact-phone { margin: 0; color: #192022; font-size: 24px; font-weight: bold; letter-spacing: 1px; }
#pduRenewal .pdu-contact-phone span { margin-left: 12px; color: #8b9396; font-size: 13px; font-weight: normal; letter-spacing: 0; }
#pduRenewal .pdu-contact-copy { margin: 9px 0 18px; color: #747d80; font-size: 13px; }
#pduRenewal .pdu-web-label { margin-top: 0; }
#pduRenewal a.pdu-contact-button,
#pduRenewal a.pdu-contact-button:link,
#pduRenewal a.pdu-contact-button:visited {
  display: block;
  padding: 15px;
  border-radius: 6px;
  background: #ff830c;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-size: 12px;
  font-weight: bold;
}
#pduRenewal a.pdu-contact-button:hover { background: #ef7200; }
#pduRenewal .pdu-contact-button span { display: block; margin-top: 2px; font-size: 12px; font-weight: normal; }
