/* ------------------------------
 Vars
------------------------------ */
/* ------------------------------
 MIXIN
------------------------------ */
/* ------------------------------
 Service
------------------------------ */
#service-page #case {
  margin: 60px auto; }
  @media screen and (max-width: 979px) {
    #service-page #case {
      margin: 40px auto; } }
  @media screen and (max-width: 600px) {
    #service-page #case {
      margin: 8% auto 12% auto; } }
  #service-page #case .sec-headline {
    text-align: center;
    margin: auto;
    font-size: 3.2em;
    line-height: 1.4;
    font-weight: 600;
    color: #333;
    display: table;
    margin-bottom: 1em; }
    #service-page #case .sec-headline > * {
      display: table-cell;
      text-align: left;
      vertical-align: middle;
      padding: 0 1em; }
      #service-page #case .sec-headline > *.caption {
        font-size: 50%;
        font-weight: 400;
        padding: 0.5em 2em;
        margin-left: 2em;
        color: #333;
        border-left: 1px solid #d2d2d2;
        line-height: 1.6; }
    @media screen and (max-width: 979px) {
      #service-page #case .sec-headline {
        display: block; }
        #service-page #case .sec-headline > * {
          display: inline-block;
          padding: 0; }
          #service-page #case .sec-headline > *.caption {
            display: block;
            text-align: center;
            border-left: 0;
            padding: 0;
            margin: 1em auto -0.5em auto;
            font-size: 45%; } }
    @media screen and (max-width: 979px) {
      #service-page #case .sec-headline span {
        text-align: center; } }
    @media screen and (max-width: 600px) {
      #service-page #case .sec-headline {
        font-size: 2.6em; } }
    #service-page #case .sec-headline .caption {
      max-width: 27em;
      border-left: none; }
  #service-page #case .carousel-wrap {
    position: relative; }
    #service-page #case .carousel-wrap:before {
      content: '';
      position: absolute;
      top: 50px;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: #f5ecf4; }
    #service-page #case .carousel-wrap .more-button {
      text-align: right;
      margin: 0 8%; }
      #service-page #case .carousel-wrap .more-button .box-button {
        margin: 1.5em 0 -1em 0; }
      @media screen and (max-width: 600px) {
        #service-page #case .carousel-wrap .more-button {
          text-align: center;
          font-size: 0.8em; } }
  #service-page #case .slick-slider .slick-slide {
    outline: 0; }
    #service-page #case .slick-slider .slick-slide img {
      -webkit-transition: opacity 0.5s;
              transition: opacity 0.5s; }
    #service-page #case .slick-slider .slick-slide.slick-current {
      pointer-events: none; }
    #service-page #case .slick-slider .slick-slide:not(.slick-current) {
      cursor: pointer; }
  #service-page #case #case-carousel-main {
    position: relative; }
    #service-page #case #case-carousel-main .slick-arrow {
      position: absolute;
      display: block;
      overflow: hidden;
      text-indent: 200%;
      white-space: nowrap;
      background-repeat: no-repeat;
      background-position: 50% 50%;
      background-size: contain;
      top: 50%;
      margin-top: -22px;
      z-index: 1000;
      width: 45px;
      height: 45px;
      border: solid #ae5da1; }
      #service-page #case #case-carousel-main .slick-arrow.slick-prev {
        left: 13%;
        border-width: 0 0 4px 4px;
        -webkit-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
                transform: rotate(45deg); }
      #service-page #case #case-carousel-main .slick-arrow.slick-next {
        right: 13%;
        border-width: 0 4px 4px 0;
        -webkit-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
                transform: rotate(-45deg); }
      @media screen and (max-width: 979px) {
        #service-page #case #case-carousel-main .slick-arrow.slick-prev {
          left: 3%; }
        #service-page #case #case-carousel-main .slick-arrow.slick-next {
          right: 3%; } }
      @media screen and (max-width: 767px) {
        #service-page #case #case-carousel-main .slick-arrow {
          width: 30px;
          height: 30px;
          margin-top: -15px; }
          #service-page #case #case-carousel-main .slick-arrow.slick-prev {
            border-width: 0 0 2px 2px; }
          #service-page #case #case-carousel-main .slick-arrow.slick-next {
            border-width: 0 2px 2px 0; } }
    #service-page #case #case-carousel-main .slick-slide {
      margin: 15px;
      background: #FFF;
      position: relative; }
      #service-page #case #case-carousel-main .slick-slide span {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        overflow: hidden;
        display: block;
        background: rgba(0, 0, 0, 0.6);
        color: #FFF;
        font-size: 1.3em;
        line-height: 1.5;
        padding: 0.5em 1em;
        opacity: 0;
        -webkit-transition: opacity 1s;
                transition: opacity 1s; }
      #service-page #case #case-carousel-main .slick-slide.slick-center span {
        opacity: 1; }
      #service-page #case #case-carousel-main .slick-slide:not(.slick-center) img {
        opacity: 0.4; }
      @media screen and (max-width: 979px) {
        #service-page #case #case-carousel-main .slick-slide {
          margin: 7px; } }
      @media screen and (max-width: 600px) {
        #service-page #case #case-carousel-main .slick-slide span {
          position: static;
          background: #FFF;
          color: #333;
          font-size: 2.6vw;
          height: 4.5em; } }
  #service-page #case #case-carousel-thumb {
    position: relative;
    margin-top: 5px; }
    #service-page #case #case-carousel-thumb .slick-slide {
      border: 2px solid transparent;
      margin: 0 2px;
      -webkit-transition: border-color 0.5s;
              transition: border-color 0.5s; }
      #service-page #case #case-carousel-thumb .slick-slide.slick-current, #service-page #case #case-carousel-thumb .slick-slide.slick-center {
        background: #FFF;
        border: 2px solid #ae5da1; }
        #service-page #case #case-carousel-thumb .slick-slide.slick-current img, #service-page #case #case-carousel-thumb .slick-slide.slick-center img {
          opacity: 0.3; }
#service-page #points {
  margin: 60px auto;
  padding: 0 2%;
  max-width: 1366px;
  overflow: hidden; }
  @media screen and (max-width: 979px) {
    #service-page #points {
      margin: 6% auto; } }
  #service-page #points .points-sec {
    width: 48.5%;
    margin: 0 auto 40px auto; }
    #service-page #points .points-sec:nth-child(odd) {
      float: left; }
    #service-page #points .points-sec:nth-child(even) {
      float: right; }
    #service-page #points .points-sec .sec-headline {
      font-size: 2.6em;
      font-weight: 600;
      line-height: 1.4;
      margin-left: 7%;
      margin-bottom: -0.6em; }
      #service-page #points .points-sec .sec-headline small {
        display: block; }
      #service-page #points .points-sec .sec-headline br {
        display: none; }
      @media screen and (max-width: 979px) {
        #service-page #points .points-sec .sec-headline br {
          display: inline; } }
    #service-page #points .points-sec .text-wrap {
      padding: 7% 7% 5% 7%; }
      #service-page #points .points-sec .text-wrap p {
        font-size: 1.4em;
        line-height: 1.8;
        margin-top: 1em; }
      #service-page #points .points-sec .text-wrap ul {
        font-size: 1.6em;
        margin-top: 1em; }
        #service-page #points .points-sec .text-wrap ul li {
          font-weight: 500;
          line-height: 1.5;
          margin-top: 0.3em;
          padding-left: 1em;
          position: relative; }
          #service-page #points .points-sec .text-wrap ul li:before {
            content: '\2022';
            position: absolute;
            left: 0.1em;
            top: -0.3em;
            font-size: 1.5em; }
    #service-page #points .points-sec#ordermade {
      margin-top: 10%;
      margin-bottom: 6%; }
      #service-page #points .points-sec#ordermade .text-wrap li:before {
        color: #448aca; }
    @media screen and (max-width: 767px) {
      #service-page #points .points-sec {
        float: none !important;
        width: auto;
        max-width: 600px;
        margin: 0 auto 8% auto !important; } }
    @media screen and (max-width: 480px) {
      #service-page #points .points-sec .sec-headline {
        font-size: 2.4em; }
      #service-page #points .points-sec .text-wrap {
        padding: 8% 4% 6% 4%; } }
  #service-page #points .other-button {
    display: table;
    font-size: 2em;
    line-height: 1.4;
    background-color: #f6f2ed;
    color: #333;
    margin-bottom: 15px;
    position: relative; }
    @media screen and (max-width: 979px) {
      #service-page #points .other-button {
        font-size: 1.8em; } }
    @media screen and (max-width: 600px) {
      #service-page #points .other-button {
        font-size: 1.4em; } }
    #service-page #points .other-button > * {
      display: table-cell;
      vertical-align: middle; }
    #service-page #points .other-button > figure {
      width: 40%; }
    #service-page #points .other-button > p {
      padding: 0 2em 0 1em; }
    #service-page #points .other-button:after {
      font-family: 'icomoon' !important;
      speak: none;
      font-style: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      line-height: 1;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      position: absolute;
      top: 50%;
      margin-top: -0.5em;
      content: '\e906';
      right: 0.3em;
      color: #a6937c; }

/*# sourceMappingURL=service.css.map */