.color-line
  display inline
  word-break break-word
  position relative
  left 15px


  &-wrapper
    //max-width calc(100vw - 70px)
    padding-bottom 20px
    padding-right 29px
    &--custom
      .color-line-label
        display none
      @media (max-width: mobile-upper-limit)
        .rt-font-banner-label
          display: none
        .rt-price
          color b2c-white

  &--is-paragraph
    display flex
    flex-wrap wrap
    padding-right horizontal-space * .75
    position relative

    &:before,
    &:after
      content ""
      order 1
      width 100%

    @media (max-width: mobile-upper-limit)
      margin-right horizontal-space * 1.5
      left 0
      .color-line-text
        color b2c-white

  &-paragraph-icon
    width 41px
    height 21px
    overflow visible
    position absolute
    bottom -20px
    right -20px
    fill b2c-orange
    @media (max-width: tablet-upper-limit)
      height 19px
      bottom -18px
      right -22px
    @media (max-width: mobile-upper-limit)
    //  width 22px
    //  height 10px
      bottom -19px
    //  right -20px

    &--fill-dark-state
      .color-line-paragraph-icon__background
        fill b2b-dark-state

    &--dark-state
      fill b2b-dark-state

    &--fill-purple
      .color-line-paragraph-icon__background
        fill b2c-purple

    &--purple
      fill b2c-purple

    &--fill-purple-low
      .color-line-paragraph-icon__background
        fill b2c-purple-low

    &--purple-low
      fill b2c-purple-low

    &--fill-purple-high
      .color-line-paragraph-icon__background
        fill b2c-purple-high

    &--purple-high
      fill b2c-purple-high

    &--fill-red
      .color-line-paragraph-icon__background
        fill b2c-red

    &--red
      fill b2c-red

    &--fill-red-low
      .color-line-paragraph-icon__background
        fill b2c-red-low

    &--red-low
      fill b2c-red-low

    &--fill-red-high
      .color-line-paragraph-icon__background
        fill b2c-red-high

    &--red-high
      fill b2c-red-high

    &--fill-dark-blue
      .color-line-paragraph-icon__background
        fill b2c-dark-blue

    &--dark-blue
      fill b2c-dark-blue

    &--fill-dark-blue-low
      .color-line-paragraph-icon__background
        fill b2c-dark-blue-low

    &--dark-blue-low
      fill b2c-dark-blue-low

    &--fill-dark-blue-high
      .color-line-paragraph-icon__background
        fill b2c-dark-blue-high

    &--dark-blue-high
      fill b2c-dark-blue-high

    &--fill-light-blue
      .color-line-paragraph-icon__background
        fill b2c-light-blue

    &--light-blue
      fill b2c-light-blue

    &--fill-light-blue-low
      .color-line-paragraph-icon__background
        fill b2c-light-blue-low

    &--light-blue-low
      fill b2c-light-blue-low

    &--fill-light-blue-high
      .color-line-paragraph-icon__background
        fill b2c-light-blue-high

    &--light-blue-high
      fill b2c-light-blue-high

    &--fill-yellow
      .color-line-paragraph-icon__background
        fill b2c-yellow

    &--yellow
      fill b2c-yellow

    &--fill-yellow-low
      .color-line-paragraph-icon__background
        fill b2c-yellow-low

    &--yellow-low
      fill b2c-yellow-low

    &--fill-yellow-high
      .color-line-paragraph-icon__background
        fill b2c-yellow-high

    &--yellow-high
      fill b2c-yellow-high

    &--fill-orange
      .color-line-paragraph-icon__background
        fill b2c-orange

    &--orange
      fill b2c-orange

    &--fill-orange-low
      .color-line-paragraph-icon__background
        fill b2c-orange-low

    &--orange-low
      fill b2c-orange-low

    &--fill-orange-high
      .color-line-paragraph-icon__background
        fill b2c-orange-high

    &--orange-high
      fill b2c-orange-high

    &--fill-pink
      .color-line-paragraph-icon__background
        fill b2c-pink

    &--pink
      fill b2c-pink

    &--fill-pink-low
      .color-line-paragraph-icon__background
        fill b2c-pink-low

    &--pink-low
      fill b2c-pink-low

    &--fill-pink-high
      .color-line-paragraph-icon__background
        fill b2c-pink-high

    &--pink-high
      fill b2c-pink-high

    &--fill-green
      .color-line-paragraph-icon__background
        fill b2c-green

    &--green
      fill b2c-green

    &--fill-green-low
      .color-line-paragraph-icon__background
        fill b2c-green-low

    &--green-low
      fill b2c-green-low

    &--fill-green-high
      .color-line-paragraph-icon__background
        fill b2c-green-high

    &--green-high
      fill b2c-green-high

    &--fill-black
      .color-line-paragraph-icon__background
        fill main-color

    &--black
      fill main-color

    &--white
      fill b2c-white

  &-text
    border-right 2px solid white
    position relative
    display inline
    color main-color
    background-color #fff
    box-decoration-break clone
    box-shadow 15px 0 0 #fff, -15px 0 0 #fff
    .color-line--is-paragraph &
      @media (max-width: mobile-upper-limit)
        box-shadow none!important
        background-color: transparent!important
        border-right-color transparent!important

    br
      @media (max-width: mobile-upper-limit)
        display none

    .color-line--is-paragraph &
      border-radius 0 5px 0 0
      padding-top vertical-space * .25
      padding-bottom vertical-space * .25
      @media (max-width: mobile-upper-limit)
        padding vertical-space 0

    &--dark-state
      background-color b2b-dark-state
      border-right 2px solid b2b-dark-state
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2b-dark-state, -1 * horizontal-space * .75 0 0 b2b-dark-state

    &--purple
      background-color b2c-purple
      border-right 2px solid b2c-purple
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-purple, -1 * horizontal-space * .75 0 0 b2c-purple

    &--purple-low
      background-color b2c-purple-low
      border-right 2px solid b2c-purple-low
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-purple-low, -1 * horizontal-space * .75 0 0 b2c-purple-low

    &--purple-high
      background-color b2c-purple-high
      border-right 2px solid b2c-purple-high
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-purple-high, -1 * horizontal-space * .75 0 0 b2c-purple-high

    &--red
      background-color b2c-red
      border-right 2px solid b2c-red
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-red, -1 * horizontal-space * .75 0 0 b2c-red

    &--red-low
      background-color b2c-red-low
      border-right 2px solid b2c-red-low
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-red-low, -1 * horizontal-space * .75 0 0 b2c-red-low

    &--red-high
      background-color b2c-red-high
      border-right 2px solid b2c-red-high
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-red-high, -1 * horizontal-space * .75 0 0 b2c-red-high

    &--dark-blue
      background-color b2c-dark-blue
      border-right 2px solid b2c-dark-blue
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-dark-blue, -1 * horizontal-space * .75 0 0 b2c-dark-blue

    &--dark-blue-low
      background-color b2c-dark-blue-low
      border-right 2px solid b2c-dark-blue-low
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-dark-blue-low, -1 * horizontal-space * .75 0 0 b2c-dark-blue-low

    &--dark-blue-high
      background-color b2c-dark-blue-high
      border-right 2px solid b2c-dark-blue-high
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-dark-blue-high, -1 * horizontal-space * .75 0 0 b2c-dark-blue-high

    &--light-blue
      background-color b2c-light-blue
      border-right 2px solid b2c-light-blue
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-light-blue, -1 * horizontal-space * .75 0 0 b2c-light-blue

    &--light-blue-low
      background-color b2c-light-blue-low
      border-right 2px solid b2c-light-blue-low
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-light-blue-low, -1 * horizontal-space * .75 0 0 b2c-light-blue-low

    &--light-blue-high
      background-color b2c-light-blue-high
      border-right 2px solid b2c-light-blue-high
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-light-blue-high, -1 * horizontal-space * .75 0 0 b2c-light-blue-high

    &--yellow
      background-color b2c-yellow
      border-right 2px solid b2c-yellow
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-yellow, -1 * horizontal-space * .75 0 0 b2c-yellow

    &--yellow-low
      background-color b2c-yellow-low
      border-right 2px solid b2c-yellow-low
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-yellow-low, -1 * horizontal-space * .75 0 0 b2c-yellow-low

    &--yellow-high
      background-color b2c-yellow-high
      border-right 2px solid b2c-yellow-high
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-yellow-high, -1 * horizontal-space * .75 0 0 b2c-yellow-high

    &--orange
      background-color b2c-orange
      border-right 2px solid b2c-orange
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-orange, -1 * horizontal-space * .75 0 0 b2c-orange

    &--orange-low
      background-color b2c-orange-low
      border-right 2px solid b2c-orange-low
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-orange-low, -1 * horizontal-space * .75 0 0 b2c-orange-low

    &--orange-high
      background-color b2c-orange-high
      border-right 2px solid b2c-orange-high
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-orange-high, -1 * horizontal-space * .75 0 0 b2c-orange-high

    &--pink
      background-color b2c-pink
      border-right 2px solid b2c-pink
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-pink, -1 * horizontal-space * .75 0 0 b2c-pink

    &--pink-low
      background-color b2c-pink-low
      border-right 2px solid b2c-pink-low
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-pink-low, -1 * horizontal-space * .75 0 0 b2c-pink-low

    &--pink-high
      background-color b2c-pink-high
      border-right 2px solid b2c-pink-high
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-pink-high, -1 * horizontal-space * .75 0 0 b2c-pink-high

    &--green
      background-color b2c-green
      border-right 2px solid b2c-green
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-green, -1 * horizontal-space * .75 0 0 b2c-green

    &--green-low
      background-color b2c-green-low
      border-right 2px solid b2c-green-low
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-green-low, -1 * horizontal-space * .75 0 0 b2c-green-low

    &--green-high
      background-color b2c-green-high
      border-right 2px solid b2c-green-high
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 b2c-green-high, -1 * horizontal-space * .75 0 0 b2c-green-high

    &--black
      background-color main-color
      border-right 2px solid main-color
      box-decoration-break clone
      box-shadow horizontal-space * .75 0 0 main-color, -1 * horizontal-space * .75 0 0 main-color

.banner-page__content .banner-page__before-title
  display none

.banner-page__content .promo__title .wrap
  font-size 48px !important
  line-height 60px !important
  margin 0
  padding 0

.banner-page__content .wrap
  border none !important
  box-shadow -15px 0 0 #fff

.banner-page__content .text
  box-shadow 15px 0 0 #fff
  margin 0
  padding 0

.banner-page__content .promo__desc
  padding-top 0 !important
  padding-bottom 5px !important

.banner-page__content .promo__desc .text
  border-radius 0 5px 0 0 !important
  padding-top 5px !important
  padding-bottom 5px !important

.banner-page__content .banner-promo__tonque
  right -15px !important

@media (max-width: mobile-upper-limit)
  .color-line--is-paragraph
    color main-color

  .color-block
    &--dark-state,
    &--purple,
    &--purple-low,
    &--purple-high,
    &--red,
    &--red-low,
    &--red-high,
    &--dark-blue,
    &--dark-blue-low,
    &--dark-blue-high,
    &--light-blue,
    &--light-blue-low,
    &--light-blue-high,
    &--yellow,
    &--yellow-low,
    &--yellow-high,
    &--orange,
    &--orange-low,
    &--orange-high,
    &--pink,
    &--pink-low,
    &--pink-high,
    &--green,
    &--green-low,
    &--green-high,
    &--black,
    &--main-color,
    &--light-grey,
    &--rule-color,
    &--rule-color,
    &--game-promo-color
      .color-line--is-paragraph
        color b2c-white