#main-header { max-width: none; padding: 0 28px; transition: padding .2s; }

#help-body_box { transition: padding .2s; }

#help-nav_frame { position: fixed; width: 300px; height: calc(100% - 57px); top: 57px; border-right: 1px solid #e2e2e2; background-color: #ffffff; box-sizing: border-box; z-index: 1; overflow: auto; transition: left .2s; -webkit-overflow-scrolling: touch; }

#help-nav_box { padding: 28px; top: 0; }

#help-body_box { overflow: hidden; }

#help-body { margin: 0 auto; box-sizing: border-box; transition: max-width .2s; }

.help-nav-title { padding-bottom: 18px; font-size: 1.6rem; font-weight: 600; color: #454545; word-break: break-all; }

.help-nav + .help-nav-title { padding-top: 28px; }

.help-nav-items + .help-nav-items { padding-top: 18px; }

.help-nav-items_inner:not(.is_active) { font-size: 1.4rem; font-weight: 400; color: #999999; word-break: break-all; }

.help-nav-items_inner.is_active { font-size: 1.4rem; font-weight: 400; color: #3A84FA; word-break: break-all; }

.document-section { margin-top: 0; padding-top: 32px; }

.icon-items { display: inline; width: 1em; }

@media screen and (max-width: 879px) { #main-header { padding: 0 18px; }
  #help-body_box { padding-left: 0; }
  #help-body { max-width: none; padding: 8px 18px 40px; }
  #help-nav_frame { left: -300px; } }

@media screen and (min-width: 880px) { #help-body_box { padding-left: 300px; }
  #help-body { max-width: 680px; padding: 8px 40px 40px; }
  #help-nav_frame { left: 0; } }