/* ==========================================================================
   c5-mar/c5-pad
   ========================================================================== */
.c5-marTop--0 {
  margin-top: 0px !important; }

.c5-marTop--5 {
  margin-top: 5px !important; }

.c5-marTop--10 {
  margin-top: 10px !important; }

.c5-marTop--20 {
  margin-top: 20px !important; }

.c5-marTop--30 {
  margin-top: 30px !important; }

.c5-marTop--40 {
  margin-top: 40px !important; }

.c5-marTop--50 {
  margin-top: 50px !important; }

.c5-marTop--60 {
  margin-top: 60px !important; }

.c5-marTop--70 {
  margin-top: 70px !important; }

.c5-marTop--80 {
  margin-top: 80px !important; }

.c5-marTop--90 {
  margin-top: 90px !important; }

.c5-marTop--100 {
  margin-top: 100px !important; }

.c5-marBtm--0 {
  margin-bottom: 0px !important; }

.c5-marBtm--5 {
  margin-bottom: 5px !important; }

.c5-marBtm--10 {
  margin-bottom: 10px !important; }

.c5-marBtm--20 {
  margin-bottom: 20px !important; }

.c5-marBtm--30 {
  margin-bottom: 30px !important; }

.c5-marBtm--40 {
  margin-bottom: 40px !important; }

.c5-marBtm--50 {
  margin-bottom: 50px !important; }

.c5-marBtm--60 {
  margin-bottom: 60px !important; }

.c5-marBtm--70 {
  margin-bottom: 70px !important; }

.c5-marBtm--80 {
  margin-bottom: 80px !important; }

.c5-marBtm--90 {
  margin-bottom: 90px !important; }

.c5-marBtm--100 {
  margin-bottom: 100px !important; }

.c5-padTop--0 {
  padding-top: 0px !important; }

.c5-padTop--5 {
  padding-top: 5px !important; }

.c5-padTop--10 {
  padding-top: 10px !important; }

.c5-padTop--20 {
  padding-top: 20px !important; }

.c5-padTop--30 {
  padding-top: 30px !important; }

.c5-padTop--40 {
  padding-top: 40px !important; }

.c5-padTop--50 {
  padding-top: 50px !important; }

.c5-padTop--60 {
  padding-top: 60px !important; }

.c5-padTop--70 {
  padding-top: 70px !important; }

.c5-padTop--80 {
  padding-top: 80px !important; }

.c5-padTop--90 {
  padding-top: 90px !important; }

.c5-padTop--100 {
  padding-top: 100px !important; }

.c5-padBtm--0 {
  padding-bottom: 0px !important; }

.c5-padBtm--5 {
  padding-bottom: 5px !important; }

.c5-padBtm--10 {
  padding-bottom: 10px !important; }

.c5-padBtm--20 {
  padding-bottom: 20px !important; }

.c5-padBtm--30 {
  padding-bottom: 30px !important; }

.c5-padBtm--40 {
  padding-bottom: 40px !important; }

.c5-padBtm--50 {
  padding-bottom: 50px !important; }

.c5-padBtm--60 {
  padding-bottom: 60px !important; }

.c5-padBtm--70 {
  padding-bottom: 70px !important; }

.c5-padBtm--80 {
  padding-bottom: 80px !important; }

.c5-padBtm--90 {
  padding-bottom: 90px !important; }

.c5-padBtm--100 {
  padding-bottom: 100px !important; }

@media screen and (max-width: 639px) {
  .c5-marTopMQ--0 {
    margin-top: 0px !important; }

  .c5-marTopMQ--5 {
    margin-top: 5px !important; }

  .c5-marTopMQ--10 {
    margin-top: 10px !important; }

  .c5-marTopMQ--20 {
    margin-top: 20px !important; }

  .c5-marTopMQ--30 {
    margin-top: 30px !important; }

  .c5-marTopMQ--40 {
    margin-top: 40px !important; }

  .c5-marTopMQ--50 {
    margin-top: 50px !important; }

  .c5-marTopMQ--60 {
    margin-top: 60px !important; }

  .c5-marTopMQ--70 {
    margin-top: 70px !important; }

  .c5-marTopMQ--80 {
    margin-top: 80px !important; }

  .c5-marTopMQ--90 {
    margin-top: 90px !important; }

  .c5-marTopMQ--100 {
    margin-top: 100px !important; }

  .c5-marBtmMQ--0 {
    margin-bottom: 0px !important; }

  .c5-marBtmMQ--5 {
    margin-bottom: 5px !important; }

  .c5-marBtmMQ--10 {
    margin-bottom: 10px !important; }

  .c5-marBtmMQ--20 {
    margin-bottom: 20px !important; }

  .c5-marBtmMQ--30 {
    margin-bottom: 30px !important; }

  .c5-marBtmMQ--40 {
    margin-bottom: 40px !important; }

  .c5-marBtmMQ--50 {
    margin-bottom: 50px !important; }

  .c5-marBtmMQ--60 {
    margin-bottom: 60px !important; }

  .c5-marBtmMQ--70 {
    margin-bottom: 70px !important; }

  .c5-marBtmMQ--80 {
    margin-bottom: 80px !important; }

  .c5-marBtmMQ--90 {
    margin-bottom: 90px !important; }

  .c5-marBtmMQ--100 {
    margin-bottom: 100px !important; }

  .c5-padTopMQ--0 {
    padding-top: 0px !important; }

  .c5-padTopMQ--5 {
    padding-top: 5px !important; }

  .c5-padTopMQ--10 {
    padding-top: 10px !important; }

  .c5-padTopMQ--20 {
    padding-top: 20px !important; }

  .c5-padTopMQ--30 {
    padding-top: 30px !important; }

  .c5-padTopMQ--40 {
    padding-top: 40px !important; }

  .c5-padTopMQ--50 {
    padding-top: 50px !important; }

  .c5-padTopMQ--60 {
    padding-top: 60px !important; }

  .c5-padTopMQ--70 {
    padding-top: 70px !important; }

  .c5-padTopMQ--80 {
    padding-top: 80px !important; }

  .c5-padTopMQ--90 {
    padding-top: 90px !important; }

  .c5-padTopMQ--100 {
    padding-top: 100px !important; }

  .c5-padBtmMQ--0 {
    padding-bottom: 0px !important; }

  .c5-padBtmMQ--5 {
    padding-bottom: 5px !important; }

  .c5-padBtmMQ--10 {
    padding-bottom: 10px !important; }

  .c5-padBtmMQ--20 {
    padding-bottom: 20px !important; }

  .c5-padBtmMQ--30 {
    padding-bottom: 30px !important; }

  .c5-padBtmMQ--40 {
    padding-bottom: 40px !important; }

  .c5-padBtmMQ--50 {
    padding-bottom: 50px !important; }

  .c5-padBtmMQ--60 {
    padding-bottom: 60px !important; }

  .c5-padBtmMQ--70 {
    padding-bottom: 70px !important; }

  .c5-padBtmMQ--80 {
    padding-bottom: 80px !important; }

  .c5-padBtmMQ--90 {
    padding-bottom: 90px !important; }

  .c5-padBtmMQ--100 {
    padding-bottom: 100px !important; } }
/* .c5-item1
   .c5-inStoreFeaturesItem1B
   ========================================================================== */
section.c5-item1 {
  display: block; }
  section.c5-item1.c5-item1--borderTop {
    margin: 30px 0 0 0;
    padding: 30px 0 0 0;
    border-top: 1px solid #000; }
  section.c5-item1.c5-item1--imgLeft .c5-item1__multiCol {
    direction: ltr !important; }
    section.c5-item1.c5-item1--imgLeft .c5-item1__multiCol .c5-item1__imgCol {
      padding-left: 0;
      padding-right: 15px; }
    section.c5-item1.c5-item1--imgLeft .c5-item1__multiCol .c5-item1__textCol {
      padding-right: 0;
      padding-left: 15px; }

.c5-item1__multiCol {
  display: table;
  width: 100%; }

.c5-item1__multiCol {
  direction: rtl;
  table-layout: fixed; }

.c5-item1__textCol {
  direction: ltr;
  vertical-align: top;
  box-sizing: border-box;
  display: table-cell;
  width: 32%; }
  .c5-item1__textCol:after {
    content: '';
    display: block;
    width: 262px;
    height: 0; }

.c5-item1--solid .c5-item1__textCol {
  width: 100%; }

.c5-item1__imgCol + .c5-item1__textCol {
  width: 50%; }

.c5-item1__imgCol img, .c5-item2__imgCol img {
  width: 100%; }

.c5-item1__textCol {
  padding-right: 15px; }

.c5-item1__imageCol {
  direction: ltr;
  vertical-align: top;
  box-sizing: border-box;
  display: table-cell;
  width: 68%; }

.c5-item1--solid .c5-item1__imageCol {
  width: 1%; }

.c5-item1__imageCol,
.c5-item1__imgCol {
  padding-left: 15px; }

.c5-item1__imgCol, .c5-item2__imgCol {
  direction: ltr;
  vertical-align: top;
  box-sizing: border-box;
  display: table-cell;
  width: 50%; }

.c5-item2__imgCol {
  float: right;
  width: 370px;
  padding: 0 0 0 15px; }

.c5-item1__text + .c5-item1__aside {
  margin-top: -15px; }

@media screen and (max-width: 639px) {
  .c5-item1__multiCol {
    display: block;
    width: auto; }

  .c5-item1__textCol {
    display: block;
    width: auto;
    padding: 0 !important; }
    .c5-item1__textCol:after {
      content: none; }

  .c5-item1__imgCol + .c5-item1__textCol {
    width: auto; }

  .c5-item1__imageCol,
  .c5-item1--solid .c5-item1__imageCol,
  .c5-item1--liquid .c5-item1__imageCol {
    display: block;
    width: auto;
    padding: 0; }

  .c5-item1__imgCol {
    display: block;
    width: auto;
    padding: 0 !important; }

  .c5-item2__imgCol {
    text-align: center;
    float: none;
    display: block;
    width: auto;
    padding: 0 15px 15px 15px; }

  .c5-item1--borderBottom {
    margin: 30px 0 30px 0;
    padding: 0 0 20px 0;
    border-bottom: 1px solid #000; } }
/* ==========================================================================
   c5-map
   ========================================================================== */
.c5-map__inner.c5-map__inner--left {
  padding: 0 15px 0 0; }
  @media screen and (max-width: 639px) {
    .c5-map__inner.c5-map__inner--left {
      padding: 0; } }
.c5-map__inner.c5-map__inner--center {
  padding: 0 7px; }
  @media screen and (max-width: 639px) {
    .c5-map__inner.c5-map__inner--center {
      padding: 0; } }
.c5-map__inner.c5-map__inner--right {
  padding: 0 0 0 15px; }
  @media screen and (max-width: 639px) {
    .c5-map__inner.c5-map__inner--right {
      padding: 0; } }
.c5-map__inner .pic img {
  width: 100% !important; }
.c5-map__inner img {
  width: auto !important; }

/* ==========================================================================
   c5-leftIconRightText
   ========================================================================== */
.c5-leftIconRightText + .c5-leftIconRightText {
  margin: 10px 0 0 0; }

.c5-leftIconRightText {
  background: #f3f4f6; }
  .c5-leftIconRightText .c5-leftIconRightText__inner {
    display: table;
    table-layout: fixed; }
    .c5-leftIconRightText .c5-leftIconRightText__inner .c5-leftIconRightText__innerLeft {
      display: table-cell;
      padding: 15px 0 15px 15px;
      width: 100px;
      text-align: center;
      vertical-align: middle; }
      @media screen and (max-width: 639px) {
        .c5-leftIconRightText .c5-leftIconRightText__inner .c5-leftIconRightText__innerLeft {
          padding-top: 15px; } }
      .c5-leftIconRightText .c5-leftIconRightText__inner .c5-leftIconRightText__innerLeft .c5-leftIconRightText__innerLeftIcon img {
        width: 50px; }
      .c5-leftIconRightText .c5-leftIconRightText__inner .c5-leftIconRightText__innerLeft .c5-leftIconRightText__innerLeftIcon.c5-leftIconRightText__innerLeftIcon--w120 img {
        width: 120px; }
    .c5-leftIconRightText .c5-leftIconRightText__inner .c5-leftIconRightText__innerRight {
      display: table-cell;
      vertical-align: top;
      padding: 15px; }
      @media screen and (max-width: 639px) {
        .c5-leftIconRightText .c5-leftIconRightText__inner .c5-leftIconRightText__innerRight {
          display: block; } }
  .c5-leftIconRightText .c5-lefttextRightimg__inner {
    display: block;
    table-layout: fixed; }
    .c5-leftIconRightText .c5-lefttextRightimg__inner .c5-lefttextRightimg__innerLeft {
      padding: 15px 0 0 15px;
      text-align: left;
      vertical-align: middle;
      overflow: hidden; }
      .c5-leftIconRightText .c5-lefttextRightimg__inner .c5-lefttextRightimg__innerLeft.c5-lefttextRightimg__innerLeft--border {
        border-bottom: 1px #fff solid;
        background: #eceef1; }
      @media screen and (max-width: 639px) {
        .c5-leftIconRightText .c5-lefttextRightimg__inner .c5-lefttextRightimg__innerLeft {
          padding-top: 15px; } }
      .c5-leftIconRightText .c5-lefttextRightimg__inner .c5-lefttextRightimg__innerLeft .c5-lefttextRightimg__innerLeftIcon {
        float: left;
        margin-right: 10px; }
        .c5-leftIconRightText .c5-lefttextRightimg__inner .c5-lefttextRightimg__innerLeft .c5-lefttextRightimg__innerLeftIcon img {
          width: 50px; }
      .c5-leftIconRightText .c5-lefttextRightimg__inner .c5-lefttextRightimg__innerLeft span {
        height: 55px;
        line-height: 55px; }
    .c5-leftIconRightText .c5-lefttextRightimg__inner .c5-lefttextRightimg__innerRight {
      vertical-align: top;
      padding: 20px;
      overflow: hidden; }
      @media screen and (max-width: 639px) {
        .c5-leftIconRightText .c5-lefttextRightimg__inner .c5-lefttextRightimg__innerRight {
          display: block; } }

/* ==========================================================================
   c5-label
   ========================================================================== */
span.c5-label {
  color: #fff;
  font-size: 10px;
  font-size: 0.625rem;
  line-height: 1.2;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  padding: 2px 5px 1px;
  border: 1px solid #db4a39;
  background: #db4a39; }
  span.c5-label.c5-label--whiteRed {
    color: #DB4A39;
    border-color: #f5c0b9;
    background-color: #ffffff; }
  span.c5-label.c5-label--blue {
    border-color: #5b9cc6;
    background-color: #5b9cc6; }

/* ==========================================================================
   original
   ========================================================================== */
.c5-Text--bgGray {
  background: #eceef1;
  padding: 20px; }

.c5-bannerWidth370 {
  width: 100%;
  max-width: 370px; }

@media screen and (max-width: 639px) {
  .s5-promotionA__mainDefault:not(:last-child), .s5-promotionB__mainDefault:not(:last-child), .s5-promotionC__mainDefault:not(:last-child), .s5-promotionD__mainDefault:not(:last-child), .s5-promotionE__mainDefault:not(:last-child), .s5-promotionF__mainDefault:not(:last-child), .s5-promotionG__mainDefault:not(:last-child), .s5-promotionH__mainDefault:not(:last-child) {
    display: block; } }
.c5-item1__textCol--w100 {
  width: auto; }

.c5-item1__imgCol--RightAuto {
  float: right;
  width: auto;
  padding: 0 0 0 15px; }
  .c5-item1__imgCol--RightAuto img {
    width: 100%; }

.c5-item1__imgCol--LeftAuto {
  float: left;
  width: auto;
  padding: 0 15px 0 0; }
  .c5-item1__imgCol--LeftAuto img {
    width: 100%; }

.c5-item1__imgCol--Left30 {
  width: 30%;
  float: left;
  padding: 0 15px 0 0; }
  .c5-item1__imgCol--Left30 img {
    width: 100%; }

.c5-item1__text--marginLeft30 {
  margin-left: 32%;
  padding: 0 0 0 15px; }

  .c5-item1__text--marginLeft40 {
  margin-left: 40%;
  padding: 0 0 0 15px; }

@media screen and (max-width: 639px) {
  .c5-item1__imgCol--RightAuto {
    float: none;
    width: auto;
    margin-top: 20px;
    padding: 0 0 15px 0;
    text-align: center; }
    .c5-item1__imgCol--RightAuto img {
      width: auto; }

  .c5-item1__imgCol--LeftAuto,
  .c5-item1__imgCol--Left30 {
    float: none;
    width: auto;
    margin-top: 20px;
    padding: 0 0 15px 0;
    text-align: center; }
    .c5-item1__imgCol--LeftAuto img,
    .c5-item1__imgCol--Left30 img {
      width: 100%; }

  .c5-item1__text--marginLeft30 {
    margin-left: 0;
    padding: 0 0 0 0; } }

  .c5-item1__text--marginLeft40 {
    margin-left: 0;
    padding: 0 0 0 0; } }

.c5-item2__imgCol--w300 {
  float: right;
  width: 300px;
  padding: 0 0 0 15px; }
  .c5-item2__imgCol--w300 img {
    width: 100%; }

@media screen and (max-width: 639px) {
  .c5-item2__imgCol--w300 {
    float: none;
    width: auto;
    padding: 0 0 15px 0; } }
.c5-item2__imgCol--w130 {
  float: right;
  width: 130px;
  padding: 0 0 0 15px; }
  .c5-item2__imgCol--w130 img {
    width: 100%; }

@media screen and (max-width: 639px) {
  .c5-item2__imgCol--w130 {
    float: none;
    width: auto;
    padding: 0 0 15px 0; } }
.mapDisp {
  height: 200px; }

.c5-item3__imgCol {
  direction: ltr;
  vertical-align: top;
  box-sizing: border-box;
  width: 100%;
  text-align: center; }
  @media screen and (max-width: 979px) {
    .c5-item3__imgCol {
      display: block;
      width: auto; }
      .c5-item3__imgCol img {
        width: 100%; } }

.c5-item1__imgCol--w400 {
  text-align: right;
  width: 400px;
  padding-left: 0; }
  .c5-item1__imgCol--w400 img {
    width: 400px; }
  @media screen and (max-width: 979px) {
    .c5-item1__imgCol--w400 {
      width: 50%; }
      .c5-item1__imgCol--w400 img {
        width: 100%; } }
  @media screen and (max-width: 639px) {
    .c5-item1__imgCol--w400 {
      width: 100%; } }

.c5-item1__textCol--w60percent {
  width: 62% !important; }
  @media screen and (max-width: 979px) {
    .c5-item1__textCol--w60percent {
      width: 50%;
      display: table-cell; } }
  @media screen and (max-width: 639px) {
    .c5-item1__textCol--w60percent {
      width: 100%; } }

.c5-item1__imgCol--w45Left {
  width: 45%;
  border-right: dotted 1px #000; }
  @media screen and (max-width: 979px) {
    .c5-item1__imgCol--w45Left {
      width: 100%;
      border-right: none; } }

.c5-item1__imgCol--w45Right {
  width: 45%;
  padding-right: 0 !important;
  padding-left: 15px !important; }
  @media screen and (max-width: 979px) {
    .c5-item1__imgCol--w45Right {
      width: 100%;
      border-right: none;
      padding-right: 0 !important;
      padding-left: 0 !important; } }

@media screen and (max-width: 979px) {
  .c5-bannerimg img {
    width: 100%; } }

.c5--borderedDotted {
  border-bottom: dotted 1px;
  padding-bottom: 8px; }



.c5-item1__imgCol--w20 {
  width: 20%; }
  .c5-item1__imgCol--w20 img {
    width: 100%; }
  @media screen and (max-width: 979px) {
    .c5-item1__imgCol--w20 {
      width: 50%; }
      .c5-item1__imgCol--w20 img {
        width: 100%; } }
  @media screen and (max-width: 639px) {
    .c5-item1__imgCol--w20 {
      width: 100%; } }






/* ==========================================================================
   c5-table__style1
   ========================================================================== */

.c5-table__style1{
  margin-top: 20px;
}

.c5-table__style1 dt{
  float: left;
  width: 100px;
}

.c5-table__style1 dd{
  margin-left: 100px;
}


.c5-table__style2{
  margin-top: 20px;
}

.c5-table__style2 dt{
  float: left;
  width: 50px;
}

.c5-table__style2 dd{
  margin-left: 50px;
  margin-bottom: 10px;
}



.c5-table__style3{
  margin-top: 20px;
}

.c5-table__style3 dt{
  float: left;
  width: auto;
  font-weight: bold;
}

.c5-table__style3 dd{
  margin-left: 50px;
  margin-bottom: 10px;
}



.c5-table__style4{
  margin-top: 20px;
}

.c5-table__style4 dt{
  width: auto;
  font-weight: bold;
}

.c5-table__style4 dd{
  margin-left: 0px;
  margin-bottom: 10px;
}


.c5-table__style5{
  margin-top: 20px;
}

.c5-table__style5 dt{
  float: left;
  width: auto;
  font-weight: bold;

}



.c5-table__style5 dd{
  margin-left: 50px;
  margin-bottom: 10px;
}


@media screen and (max-width: 639px) {
  .c5-table__style5 dt{
    float: none;
    width: auto;
    font-weight: bold;
  }

  .c5-table__style5 dd{
    float: none;
    margin-left: 0px;
    margin-bottom: 10px;
  }
}



.c5-font__normal{
  font-weight: normal !important;
}



.c5-pc{
}

.c5-sp_450{
  display: none;

}


.c5-header__ribbon{

}


.c5-header__ribbon {
  display:block;
  width:100%;
  text-align: center;
  /*font-size: 14px;*/
  line-height: 28px;
  color: #000;
  margin: 20px auto;
  font-family: arial, verdana;
  outline: none;
  padding: 14px 30px;
  position: relative;
  /*background-color:#ad975a;*/
  /*text-transform: uppercase;*/
  /*A little shadow for 3d effect*/
  /*Finally another shadow to negate some aspects of the :after element to complete the effect. This drops a shrinked shadow over the :after element with the same color like that of the background. The shadow is shrinked by the same offset amount = 18. And it is moved down by twice the offset amount to cover the entire height of the :after element*/
  box-shadow:
    0 0 30px 0 rgba(0, 0, 0, 0.1),
    0 36px 0 -18px #fff;
}
.c5-header__ribbon span{
  display:block;
  padding:10px;
}
/*The ribbon ends*/
.c5-header__ribbon:before {
  content: '';
  position: absolute;
  top: 18px;
  left: -5%;
  z-index: -1;
  width: 110%;
  /*We will be using the triangle logic - 2 sided borders and 0 height. That will create negative triangles on the left and right*/
  height: 0;
  border: 38px solid rgba(0, 0, 0, 0);
  border-left: 38px solid #fff;
  border-right: 38px solid #fff;
  /*Same color as the container which is the body in this case*/
}

/*The after pseudo element will negatve the bottom part of the ribbon completing the effect*/
.c5-header__ribbon:after {
  content: '';
  width: 100%;
  height: 0;
  position: absolute;
  top: 100%; left: 0;
  z-index: -1;
  /*The height of the top border is same as width of the left/right borders for the smoothest effect. The height of the top border is also the same as the offset the :before element has from the top*/
  border-top: 18px solid #ad975a;
  border-left: 18px solid transparent;
  border-right: 18px solid transparent;
}

.c5-header__ribbon, .c5-header__ribbon:before {
  /*Some cool multi-background - we will use a combination of 4 backgrounds to create a cool effect*/
  background-image:
    linear-gradient(
      transparent 8%,
      rgba(0, 0, 0, 0.1) 8%,
      rgba(0, 0, 0, 0.1) 14%,
      transparent 14%,
      transparent 86%,
      rgba(0, 0, 0, 0.1) 86%,
      rgba(0, 0, 0, 0.1) 92%,
      transparent 92%
    ),
    linear-gradient(
      rgba(255, 255, 255, 0.9),
      rgba(255, 255, 255, 0)
    ),
    linear-gradient(#ad975a, #e5c46c);
}

.c5-header__ribbon, .c5-header__ribbon:before, .c5-header__ribbon:after {
  box-sizing: border-box;
  /*Fix to make the borders appear on the ribbon ends also*/
  background-origin: border-box;
}




.c5-header__ribbon2{

}


.c5-header__ribbon2 {
  display:block;
  width:100%;
  text-align: center;
  /*font-size: 14px;*/
  line-height: 28px;
  color: #000;
  margin: 20px auto;
  font-family: arial, verdana;
  outline: none;
  padding: 14px 30px;
  position: relative;
  /*background-color:#ad975a;*/
  /*text-transform: uppercase;*/
  /*A little shadow for 3d effect*/
  /*Finally another shadow to negate some aspects of the :after element to complete the effect. This drops a shrinked shadow over the :after element with the same color like that of the background. The shadow is shrinked by the same offset amount = 18. And it is moved down by twice the offset amount to cover the entire height of the :after element*/
  box-shadow:
    0 0 30px 0 rgba(0, 0, 0, 0.1),
    0 36px 0 -18px #fff;
}
.c5-header__ribbon2 span{
  display:block;
  padding:10px;
}
/*The ribbon ends*/
.c5-header__ribbon2:before {
  content: '';
  position: absolute;
  top: 18px;
  left: -5%;
  z-index: -1;
  width: 110%;
  /*We will be using the triangle logic - 2 sided borders and 0 height. That will create negative triangles on the left and right*/
  height: 0;
  border: 38px solid rgba(0, 0, 0, 0);
  border-left: 38px solid #fff;
  border-right: 38px solid #fff;
  /*Same color as the container which is the body in this case*/
}

/*The after pseudo element will negatve the bottom part of the ribbon completing the effect*/
.c5-header__ribbon2:after {
  content: '';
  width: 100%;
  height: 0;
  position: absolute;
  top: 100%; left: 0;
  z-index: -1;
  /*The height of the top border is same as width of the left/right borders for the smoothest effect. The height of the top border is also the same as the offset the :before element has from the top*/
  border-top: 18px solid #e44e75;
  border-left: 18px solid transparent;
  border-right: 18px solid transparent;
}

.c5-header__ribbon2, .c5-header__ribbon2:before {
  /*Some cool multi-background - we will use a combination of 4 backgrounds to create a cool effect*/
  background-image:
    linear-gradient(
      transparent 8%,
      rgba(0, 0, 0, 0.1) 8%,
      rgba(0, 0, 0, 0.1) 14%,
      transparent 14%,
      transparent 86%,
      rgba(0, 0, 0, 0.1) 86%,
      rgba(0, 0, 0, 0.1) 92%,
      transparent 92%
    ),
    linear-gradient(
      rgba(255, 255, 255, 0.9),
      rgba(255, 255, 255, 0)
    ),
    linear-gradient(#ffa0c8, #ff88a7);
}

.c5-header__ribbon2, .c5-header__ribbon2:before, .c5-header__ribbon2:after {
  box-sizing: border-box;
  /*Fix to make the borders appear on the ribbon ends also*/
  background-origin: border-box;
}

@media screen and (max-width: 640px) {



    .c5-header__ribbon {
     padding: 0;
    }
    .c5-header__ribbon span{
      padding:20px 10px;
    }
    .c5-header__ribbon:before {
      border-top: none;
      border-left: none;
      border-right: none;
    }

    /*The after pseudo element will negatve the bottom part of the ribbon completing the effect*/
    .c5-header__ribbon:after {
      content: '';
      width: 100%;
      height: 0;
      position: absolute;
      top: 100%; left: 0;
      z-index: -1;
      /*The height of the top border is same as width of the left/right borders for the smoothest effect. The height of the top border is also the same as the offset the :before element has from the top*/
      border-top: none;
      border-left: none;
      border-right: none;
    }

    .c5-header__ribbon, .c5-header__ribbon:before, .c5-header__ribbon:after {
      box-sizing: border-box;
      background-origin: initial;
    }



    .c5-header__ribbon2 {
     padding: 0;
    }
    .c5-header__ribbon2 span{
      padding:20px 10px;
    }

  .c5-header__ribbon2:before {
    content: '';
    position: absolute;
    top: 18px;
    left: -5%;
    z-index: -1;
    width: 110%;
    height: 0;
    border-top: none;
    border-left: none;
    border-right: none;
  }

  .c5-header__ribbon2:after {
    border-top: none;
    border-left: none;
    border-right: none;
  }

  .c5-header__ribbon2, .c5-header__ribbon2:before, .c5-header__ribbon2:after {
    box-sizing: border-box;
    background-origin: initial;
  }


}


@media screen and (max-width: 450px) {
  .c5-pc{
    display: none;
  }

  .c5-sp_450{
    display: block;
  }
}



/* ==========================================================================
   c5-vote
   ========================================================================== */
.c5-vote{
  padding:40px;
  background: #fbfbfd; 
}

  .c5-vote .s5-inStoreFeatures{
    padding:0; 
    margin: 0;
  }
  .c5-vote .s5-inStoreFeaturesItem3__image{
        margin-bottom: 10px;
  }


.c5--colorBgRed{
  background-color: #eee8aa;
  padding:5px 10px;
  /*color: #fff;*/
  display: inline-block;
  margin-bottom: 10px;
}
.c5--colorBgOrange{
  background-color: #c0c0c0;
  padding:5px 10px;
  display: inline-block;
  /*color: #fff;*/
  margin-bottom: 10px;
}



/* ==========================================================================
   c5-box
   ========================================================================== */
.c5-box{
  padding:20px;
  border: 1px solid #e4e7ec;
}