/* Shared page frame and logo lockup for the website, access and maintenance pages. */
html{scrollbar-gutter:stable}
.container,.maintenance-header,.maintenance-main,.maintenance-footer,
.welcome-header,.welcome-main,.welcome-footer{
  width:min(1240px,calc(100% - 112px));
  margin-inline:auto;
}
.header-inner,.maintenance-header,.welcome-header{
  height:105px;
  min-height:105px;
  flex-shrink:0;
  display:flex;
  align-items:center;
}
.maintenance-header,.welcome-header{border-bottom:0;box-shadow:0 1px 0 #d8d8cf}
.brand{display:flex;align-items:center;gap:14px;flex-shrink:0;text-decoration:none}
.brand img{display:block;max-width:100%}
.brand .brand-symbol{width:65px;height:62px;object-fit:contain}
.brand-type{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.brand .brand-title{width:140px;height:auto;object-fit:contain}
.brand .brand-subline{width:160px;height:auto;object-fit:contain}
@media(max-width:1100px){
  .container,.maintenance-header,.maintenance-main,.maintenance-footer,
  .welcome-header,.welcome-main,.welcome-footer{width:calc(100% - 64px)}
}
@media(min-width:761px) and (max-width:1000px){
  .brand{gap:9px}
  .brand .brand-symbol{width:49px;height:50px}
  .brand .brand-title{width:122px}
  .brand .brand-subline{width:140px}
}
@media(max-width:760px){
  .container,.maintenance-header,.maintenance-main,.maintenance-footer,
  .welcome-header,.welcome-main,.welcome-footer{width:calc(100% - 40px)}
  .header-inner,.maintenance-header,.welcome-header{height:84px;min-height:84px}
  .brand{gap:10px}
  .brand .brand-symbol{width:43px;height:45px}
  .brand-type{gap:5px}
  .brand .brand-title{width:114px}
  .brand .brand-subline{width:132px}
}
@media(max-width:360px){
  .brand{gap:7px}
  .brand .brand-symbol{width:37px;height:40px}
}