html {
  scroll-behavior: smooth; }

p {
  margin-bottom: 0;
  font-size: 15px; }

.description {
  color: #444444; }
  .description--extra {
    color: #666666; }
  .description--size {
    display: inline-block;
    font-size: 14px;
    color: #FF4C79; }

.brand-content {
  max-width: 1200px;
  margin: 0 auto; }

.brand-resources {
  color: #222222; }

.brand-hero {
  position: relative;
  height: 450px;
  color: #FFFFFF;
  background: url("/static/img/brand-resources/brand-resource-bg.png?b1495f88a477"), linear-gradient(68deg, #4c75fc 17%, #4C57FD 50%, #5d4cfc 83%);
  background-position: center;
  background-size: cover;
  border-radius: 0 0 0 12.5vw;
  word-break: keep-all;
  word-wrap: break-all; }
  .brand-hero__text {
    height: 100%;
    padding: 0 15px;
    text-align: center;
    color: #FFFFFF;
    display: -webkit-box;
    /* Old - iOS 6-, Safari 3.1~6, Blackberry 7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* New - Safari 6.1+. iOS 7.1+, Blackberry 10 */
    display: -moz-flex;
    display: flex;
    /* New, Spec - Firefox, Chrome, Opera */
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    /* Safari 7.0+, Chrome 21.0+ */
    -moz-align-items: center;
    align-items: center;
    /* Firefox 20.0+, IE11+, Opera 12.10 */
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    /* Chrome 21+, Safari Not supported. */
    -moz-justify-content: center;
    /* Chrome 21+, Safari Not supported. */
    justify-content: center;
    /* Firefox 20+, Opera 12.10, IE Not supported. */ }
  .brand-hero__headline h1 {
    margin: 0;
    font-size: 39px;
    font-weight: bold;
    text-align: center;
    color: #FFFFFF; }
  .brand-hero__headline .sub-title {
    font-size: 26px; }
    @media screen and (max-width: 991px) {
      .brand-hero__headline .sub-title {
        font-size: 24px; } }
  .brand-hero__headline .main-title {
    font-size: 42px; }
    @media screen and (max-width: 991px) {
      .brand-hero__headline .main-title {
        font-size: 38px; } }
  .brand-hero__description {
    margin-top: 40px; }
  .brand-hero--scroll-arrow {
    position: absolute;
    left: 50%;
    bottom: 30px;
    background: none;
    border: none;
    transform: translate(-50%, 0); }
    .brand-hero--scroll-arrow img {
      width: 22px;
      height: 20px; }

.brand-logo, .brand-symbol {
  color: #222222; }

.brand-logo {
  margin-top: 90px; }

.brand-symbol {
  margin-top: 120px; }

.img-ex--space__wrapper {
  padding-top: 20px; }

.card__container .row {
  padding-top: 60px; }
  @media screen and (max-width: 991px) {
    .card__container .row {
      padding-top: 0px; } }
  .card__container .row:first-child {
    padding-top: 30px; }
    @media screen and (max-width: 991px) {
      .card__container .row:first-child {
        padding-top: 0px; }
        .card__container .row:first-child .card--avoid:first-child {
          padding-top: 30px; } }

.card--img-wrapper.white {
  background-color: #FFFFFF; }

.card--img-wrapper.gray {
  background-color: #EEEEEE; }

.card--img-wrapper.black {
  background-color: #222222; }

.card--img-wrapper.background-white {
  background: url("/static/img/brand-resources/img-ex-10.jpg?b1495f88a477"); }

.card--img-wrapper.background-black {
  background: url("/static/img/brand-resources/img-ex-11.jpg?b1495f88a477"); }

.card--img-wrapper.background-white, .card--img-wrapper.background-black {
  background-position: center;
  background-size: cover; }
  .card--img-wrapper.background-white img, .card--img-wrapper.background-black img {
    padding: 22.22222% 28.54701%;
    border: none; }
    @media screen and (max-width: 991px) {
      .card--img-wrapper.background-white img, .card--img-wrapper.background-black img {
        padding: 22.17391% 28.26087%; } }

.card--img-wrapper img {
  padding: 12.10526% 17.36842%; }
  @media screen and (max-width: 991px) {
    .card--img-wrapper img {
      padding: 12.17391% 17.10145%; } }

.card__item img {
  border: 1px solid #EEEEEE;
  width: 100%; }

@media screen and (max-width: 991px) {
  .card--brand {
    padding-top: 30px; } }

@media screen and (max-width: 991px) {
  .card--avoid {
    padding-top: 45px; } }

.card--avoid__text {
  margin-top: 20px; }

.card--avoid--title {
  margin-bottom: 6px;
  font-size: 16px;
  font-weight: bold;
  color: #cc3e3e; }

.card--avoid--description {
  margin-top: 6px;
  font-size: 14px;
  color: #444444; }

.definition .title {
  font-size: 36px;
  font-weight: bold; }
  @media screen and (max-width: 991px) {
    .definition .title {
      font-size: 28px; } }
  .definition .title .underline-unit {
    top: 58%;
    height: 46.15385%; }

.definition .description {
  margin: 30px 0 20px 0; }

.definition-img-wrapper {
  margin-top: 20px;
  padding: 8.5% 25%;
  border: 1px solid #EEEEEE;
  display: -webkit-box;
  /* Old - iOS 6-, Safari 3.1~6, Blackberry 7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* New - Safari 6.1+. iOS 7.1+, Blackberry 10 */
  display: -moz-flex;
  display: flex;
  /* New, Spec - Firefox, Chrome, Opera */
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  /* Safari 7.0+, Chrome 21.0+ */
  -moz-align-items: center;
  align-items: center;
  /* Firefox 20.0+, IE11+, Opera 12.10 */
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  /* Chrome 21+, Safari Not supported. */
  -moz-justify-content: center;
  /* Chrome 21+, Safari Not supported. */
  justify-content: center;
  /* Firefox 20+, Opera 12.10, IE Not supported. */ }
  @media screen and (max-width: 991px) {
    .definition-img-wrapper {
      margin-top: 30px;
      padding: 15.94203% 13.62319%; } }
  .definition-img-wrapper img {
    width: 100%; }
  .definition-img-wrapper--symbol {
    width: 48.33333%;
    padding: 8.33333% 17.5%; }
    @media screen and (max-width: 991px) {
      .definition-img-wrapper--symbol {
        width: 100%;
        padding: 17.97101% 35.50725%; } }

.usage {
  margin-top: 90px; }
  .usage .title {
    margin-bottom: 0;
    padding-bottom: 8px;
    font-size: 28px;
    font-weight: bold;
    border-bottom: 2px solid #222222; }
    @media screen and (max-width: 991px) {
      .usage .title {
        font-size: 22px; } }

.subject {
  padding: 60px 0;
  border-bottom: 1px solid #EEEEEE; }
  .subject__title {
    margin: 0;
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: bold; }

.subject--min-size--title {
  padding-bottom: 10px; }
  @media screen and (max-width: 991px) {
    .subject--min-size--title {
      padding-bottom: 20px; } }

.subject--min-size--printing .horizontal {
  padding-top: 48px; }

@media screen and (max-width: 991px) {
  .subject--min-size--printing {
    margin-top: 30px; }
    .subject--min-size--printing .vertical img {
      width: 73px; }
    .subject--min-size--printing .horizontal {
      padding-top: 0; }
      .subject--min-size--printing .horizontal img {
        width: 173px; } }

@media screen and (max-width: 991px) {
  .subject--min-size--digital .vertical img {
    width: 102px; }
  .subject--min-size--digital .horizontal img {
    width: 241px; } }

.download {
  margin-bottom: 20px; }
  .download__btn {
    display: inline-block;
    padding: 15px 18px 16px 18px;
    font-size: 18px;
    font-weight: bold;
    color: #3399FF;
    border: 1px solid #c2e0ff;
    border-radius: 4px; }
    @media screen and (max-width: 991px) {
      .download__btn {
        padding: 11px 13px 12px 12px;
        font-size: 16px; } }
    @media (hover: hover), screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      .download__btn:hover {
        color: #FFFFFF;
        border: 1px solid #3399FF;
        background-color: #3399FF; } }
  .download--ic {
    display: inline-block;
    margin-left: 10px; }
    @media screen and (max-width: 991px) {
      .download--ic {
        margin-left: 9px; } }
    .download--ic svg {
      width: 16px;
      height: 16px; }
      @media screen and (max-width: 991px) {
        .download--ic svg {
          width: 14px;
          height: 14px; } }

.brand-rule {
  margin-top: 60px;
  color: #666666; }
  .brand-rule p {
    font-size: 14px; }