@charset "UTF-8";
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 10px 0; }
  .slick-list:focus {
    outline: none; }
  .slick-list.dragging {
    cursor: pointer;
    cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
  zoom: 1; }
  .slick-track:before, .slick-track:after {
    content: "";
    display: table; }
  .slick-track:after {
    clear: both; }
  .slick-loading .slick-track {
    visibility: hidden; }

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none; }
  [dir="rtl"] .slick-slide {
    float: right; }
  .slick-slide img {
    display: block; }
  .slick-slide.slick-loading img {
    display: none; }
  .slick-slide.dragging img {
    pointer-events: none; }
  .slick-initialized .slick-slide {
    display: block; }
  .slick-loading .slick-slide {
    visibility: hidden; }
  .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent; }

.slick-arrow.slick-hidden {
  display: none; }

/* Slider */
.slick-loading .slick-list {
  background: #fff url("/build/2000/smbc-reference/kojin/special/app/tlb/css/ajax-loader.gif") center center no-repeat; }

/* Icons */
@font-face {
  font-family: "slick";
  src: url("/build/2000/smbc-reference/kojin/special/app/tlb/css/fonts/slick.eot");
  src: url("/build/2000/smbc-reference/kojin/special/app/tlb/css/fonts/slick.eot#iefix") format("embedded-opentype"), url("/build/2000/smbc-reference/kojin/special/app/tlb/css/fonts/slick.woff") format("woff"), url("/build/2000/smbc-reference/kojin/special/app/tlb/css/fonts/slick.ttf") format("truetype"), url("/build/2000/smbc-reference/kojin/special/app/tlb/css/fonts/slick.svg#slick") format("svg");
  font-weight: normal;
  font-style: normal; }

/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none; }
  .slick-prev:hover, .slick-prev:focus,
  .slick-next:hover,
  .slick-next:focus {
    outline: none;
    background: transparent;
    color: transparent; }
    .slick-prev:hover:before, .slick-prev:focus:before,
    .slick-next:hover:before,
    .slick-next:focus:before {
      opacity: 1; }
  .slick-prev.slick-disabled:before,
  .slick-next.slick-disabled:before {
    opacity: 0.25; }
  .slick-prev:before,
  .slick-next:before {
    font-family: "slick";
    font-size: 20px;
    line-height: 1;
    color: white;
    opacity: 0.75;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }

.slick-prev {
  left: -25px; }
  [dir="rtl"] .slick-prev {
    left: auto;
    right: -25px; }
  .slick-prev:before {
    content: "←"; }
    [dir="rtl"] .slick-prev:before {
      content: "→"; }

.slick-next {
  right: -25px; }
  [dir="rtl"] .slick-next {
    left: -25px;
    right: auto; }
  .slick-next:before {
    content: "→"; }
    [dir="rtl"] .slick-next:before {
      content: "←"; }

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px; }

.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%; }
  .slick-dots li {
    position: relative;
    display: inline-block;
    height: 20px;
    width: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer; }
    .slick-dots li button {
      border: 0;
      background: transparent;
      display: block;
      height: 20px;
      width: 20px;
      outline: none;
      line-height: 0px;
      font-size: 0px;
      color: transparent;
      padding: 5px;
      cursor: pointer; }
      .slick-dots li button:hover, .slick-dots li button:focus {
        outline: none; }
        .slick-dots li button:hover:before, .slick-dots li button:focus:before {
          opacity: 1; }
      .slick-dots li button:before {
        position: absolute;
        top: 0;
        left: 0;
        content: "•";
        width: 20px;
        height: 20px;
        font-family: "slick";
        font-size: 6px;
        line-height: 20px;
        text-align: center;
        color: black;
        opacity: 0.25;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale; }
    .slick-dots li.slick-active button:before {
      color: black;
      opacity: 0.75; }

#wrap #mainArea {
  margin: 0;
  width: auto;
  font-family: Hiragino Sans, "ヒラギノ角ゴシック", Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ ProN W3", Roboto, "Droid Sans", YuGothic, "游ゴシック", Meiryo, "メイリオ", Verdana, "ＭＳ Ｐゴシック", sans-serif; }

#headerGroup ul {
  box-sizing: border-box; }

.main {
  overflow: hidden; }

.hide-sp {
  display: inline-block; }

.hide-pc {
  display: none; }

@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W0);
  font-weight: 100; }

@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W1);
  font-weight: 200; }

@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W2);
  font-weight: 300; }

@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W3);
  font-weight: 400; }

@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W4);
  font-weight: 500; }

@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W5);
  font-weight: 600; }

@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W6);
  font-weight: 700; }

@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W7);
  font-weight: 800; }

@font-face {
  font-family: "Hiragino Sans";
  src: local(HiraginoSans-W8);
  font-weight: 900; }

@font-face {
  font-family: "Hiragino Sans W9";
  src: local(HiraginoSans-W9);
  font-weight: 900; }

#intro_btn {
  opacity: 0;
  transition: all 1s ease; }
  #intro_btn.fadeIn {
    opacity: 1; }

#phone-move {
  opacity: 0;
  margin-top: 20px;
  transition: opacity 1s ease, margin .5s ease; }
  #phone-move.fadeIn {
    opacity: 1;
    margin-top: 0; }
  #phone-move.fadeOut {
    opacity: 0; }

.capture__item {
  opacity: 1;
  transition: opacity 1s cubic-bezier(0.215, 0.61, 0.355, 1); }
  .capture__item.fadeOut {
    opacity: 0; }
  .capture__item01 {
    z-index: 1; }
  .capture__item02 {
    z-index: 0; }

.article__header {
  max-width: 1440px;
  margin: 0 auto;
  padding: 30px 40px; }

.article--1st {
  position: relative;
  background-color: #f6fffc;
  background-image: url(/build/2000/smbc-reference/kojin/special/app/tlb/images/bg_green.png);
  background-size: 100% 88%;
  background-repeat: no-repeat;
  background-position: top center;
  color: #FFF;
  z-index: 2; }
  .article--1st .container {
    padding: 120px 12.5%;
    margin: 0 auto;
    position: relative;
    max-width: inherit; }
    .article--1st .container__img {
      width: 283px;
      position: absolute;
      right: 50%;
      top: 19.69697%;
      text-align: center;
      -webkit-transform: translate3d(155%, 0, 0);
              transform: translate3d(155%, 0, 0);
      z-index: 10;
      box-shadow: 0 12px 154px 0 rgba(0, 51, 40, 0.35); }
  .article--1st .section {
    padding: 37px 0 0 0;
    max-width: 960px;
    width: 100%;
    margin: 0 auto;
    opacity: 0;
    -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
            transform: translateY(20px);
    transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); }
    .article--1st .section.fadeIn {
      opacity: 1;
      -webkit-transform: translateY(0);
          -ms-transform: translateY(0);
              transform: translateY(0); }
    .article--1st .section__header h2 {
      font-size: 52px;
      color: #fff; }
    .article--1st .section__body {
      color: rgba(255, 255, 255, 0.9);
      line-height: 2;
      padding: 25px 0 40px; }
      .article--1st .section__body p {
        padding-bottom: 30px;
        letter-spacing: 0.5px; }
    .article--1st .section .qr {
      display: inline-block;
      padding: 20px 32px;
      background: #fff;
      border-radius: 10PX;
      max-width: 350px;
      box-sizing: border-box; }
      .article--1st .section .qr__list {
        -js-display: flex;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
                justify-content: space-between; }
      .article--1st .section .qr__item {
        text-align: center;
        color: #0d0e0e;
        font-weight: bold;
        font-size: 13px;
        margin-right: 50px; }
        .article--1st .section .qr__item:last-child {
          margin-right: 0; }
      .article--1st .section .qr__caution {
        color: #005A3E;
        font-size: 12px;
        line-height: 1.5;
        letter-spacing: 0.5px;
        padding-left: 1em;
        text-indent: -1em;
        display: inline-block;
        font-weight: normal; }

.article--2nd {
  background: #f6fffc;
  padding-top: 200px;
  overflow: hidden;
  z-index: 1; }
  .article--2nd .container {
    padding: 0 0 0 12.5%;
    margin-bottom: 160px; }
    .article--2nd .container .section ._toFade {
      -webkit-transform: translate3d(0, 100px, 0);
              transform: translate3d(0, 100px, 0);
      transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
      opacity: 0; }
      .article--2nd .container .section ._toFade.fadeIn {
        -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);
        opacity: 1; }
    .article--2nd .container--1st {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center; }
      .article--2nd .container--1st .container__img {
        width: 40%;
        position: absolute;
        right: 50%;
        top: 30%;
        text-align: center;
        -webkit-transform: translateX(100%) translateY(-50%);
            -ms-transform: translateX(100%) translateY(-50%);
                transform: translateX(100%) translateY(-50%);
        z-index: 2;
        opacity: 0; }
        .article--2nd .container--1st .container__img.show {
          opacity: 1; }
        .article--2nd .container--1st .container__img--phone {
          opacity: 0;
          width: 19%;
          -webkit-transform: translate3d(155%, -50%, 0);
                  transform: translate3d(155%, -50%, 0); }
        .article--2nd .container--1st .container__img--card {
          width: 357px;
          z-index: 1;
          right: 0;
          -webkit-transform: translate3d(100%, -80%, 0) rotate(0);
                  transform: translate3d(100%, -80%, 0) rotate(0);
          opacity: 0;
          transition: opacity 1s ease, -webkit-transform .5s ease-out;
          transition: opacity 1s ease, transform .5s ease-out;
          transition: opacity 1s ease, transform .5s ease-out, -webkit-transform .5s ease-out; }
          .article--2nd .container--1st .container__img--card img {
            width: 100%; }
          .article--2nd .container--1st .container__img--card.fadeIn {
            -webkit-transform: translate3d(10%, -80%, 0) rotate(-30deg);
                    transform: translate3d(10%, -80%, 0) rotate(-30deg);
            opacity: 1; }
    .article--2nd .container--2nd {
      padding: 60px 0;
      box-sizing: border-box;
      margin-bottom: 0;
      display: block;
      text-align: center; }
      .article--2nd .container--2nd .section {
        padding: 0 20px 0 40px; }
      .article--2nd .container--2nd .container__img {
        text-align: center;
        z-index: 2;
        display: block; }
        .article--2nd .container--2nd .container__img img {
          width: 512px; }
        .article--2nd .container--2nd .container__img.ie9 {
          display: none; }
          .article--2nd .container--2nd .container__img.ie9._toFade {
            transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
            -webkit-transform: translateY(100px);
                -ms-transform: translateY(100px);
                    transform: translateY(100px);
            opacity: 0; }
            .article--2nd .container--2nd .container__img.ie9._toFade.fadeIn {
              opacity: 1;
              -webkit-transform: translateY(0);
                  -ms-transform: translateY(0);
                      transform: translateY(0); }
          .article--2nd .container--2nd .container__img.ie9 img {
            width: 100%;
            position: absolute;
            left: 0;
            top: 50%;
            -webkit-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                    transform: translateY(-50%); }
        .article--2nd .container--2nd .container__img .graph__bar img {
          width: 100%; }
    .article--2nd .container--3rd {
      padding: 0 12.5%;
      margin-bottom: 40px;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center; }
      .article--2nd .container--3rd .section {
        width: 50%; }
      .article--2nd .container--3rd .container__img {
        width: 50%;
        height: 320px;
        position: relative;
        text-align: center; }
        .article--2nd .container--3rd .container__img img {
          position: absolute; }
        .article--2nd .container--3rd .container__img .card__img {
          top: 20px;
          left: 20%;
          opacity: 0;
          visibility: hidden;
          transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
          margin-top: -10px; }
          .article--2nd .container--3rd .container__img .card__img.active {
            opacity: 1;
            visibility: visible;
            margin-top: 0; }
          .article--2nd .container--3rd .container__img .card__img-01 {
            -webkit-transform: translate3d(0, 0, 0);
                    transform: translate3d(0, 0, 0); }
          .article--2nd .container--3rd .container__img .card__img-02 {
            -webkit-transform: translate3d(6%, 25%, 0);
                    transform: translate3d(6%, 25%, 0); }
          .article--2nd .container--3rd .container__img .card__img-03 {
            -webkit-transform: translate3d(12%, 50%, 0);
                    transform: translate3d(12%, 50%, 0); }
        .article--2nd .container--3rd .container__img .alert-img {
          right: 0;
          top: 0;
          -webkit-transform: translate3d(50%, 50%, 0) scale(1);
                  transform: translate3d(50%, 50%, 0) scale(1);
          transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
          opacity: 0; }
          .article--2nd .container--3rd .container__img .alert-img.active {
            opacity: 1;
            -webkit-transform: translate3d(50%, -10%, 0) scale(1);
                    transform: translate3d(50%, -10%, 0) scale(1); }

.article--3rd {
  background-image: url(/build/2000/smbc-reference/kojin/special/app/tlb/images/bg_green.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
  position: relative;
  color: #FFF; }
  .article--3rd-card {
    background-image: none; }
  .article--3rd .slick__card {
    width: 400px;
    height: 575px;
    max-width: 400px;
    overflow: hidden;
    box-shadow: 0 62px 60px 0 rgba(22, 74, 67, 0.15);
    border-radius: 63px 63px 0 0;
    position: relative;
    margin: 0 auto; }
    .article--3rd .slick__card:before {
      content: '';
      display: block;
      width: 98%;
      height: 100%;
      position: absolute;
      border-radius: 20% 20% 0 0;
      top: 1%;
      left: 1%;
      background-color: #098664;
      background: linear-gradient(180deg, #098664, #004831);
      z-index: -1; }
  .article--3rd .slick__frame {
    width: 100%;
    z-index: 2;
    box-shadow: inset 0 -3px 10px 2px rgba(22, 123, 72, 0.2), inset 1px 2px 7px 0 rgba(181, 181, 181, 0.09); }
  .article--3rd .card__header {
    position: absolute;
    width: 85%;
    left: 50%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    top: 8%;
    z-index: 1; }
  .article--3rd .card__list {
    position: absolute;
    top: 25%;
    left: 50%;
    width: 85%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    overflow: hidden; }
    .article--3rd .card__list .slick-list {
      padding: 0; }
  .article--3rd .card__item {
    margin-bottom: 5px;
    overflow: hidden; }
    .article--3rd .card__item img {
      height: 210px; }
  .article--3rd .container {
    padding: 144px 0;
    max-width: 1168px;
    margin: 0 auto; }
    .article--3rd .container--1st {
      padding: 144px 0 0;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-align-items: flex-start;
          -ms-flex-align: start;
              align-items: flex-start;
      background: #fff; }
      .article--3rd .container--1st .section {
        padding: 0 20px 0 40px; }
        .article--3rd .container--1st .section ._toFade {
          -webkit-transform: translate3d(0, 100px, 0);
                  transform: translate3d(0, 100px, 0);
          transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
          opacity: 0; }
          .article--3rd .container--1st .section ._toFade.fadeIn {
            -webkit-transform: translate3d(0, 0, 0);
                    transform: translate3d(0, 0, 0);
            opacity: 1; }
        .article--3rd .container--1st .section__header h2 {
          color: #0d0e0e; }
        .article--3rd .container--1st .section__body {
          color: #0d0e0e;
          white-space: nowrap;
          padding-top: 20px; }
      .article--3rd .container--1st .container__img {
        width: 57%;
        text-align: center;
        z-index: 1;
        position: relative;
        height: 575px; }
      .article--3rd .container--1st .e-money {
        position: absolute;
        left: 40%;
        bottom: 4%;
        width: 208.33333%;
        height: 180px; }
        .article--3rd .container--1st .e-money__item {
          width: 180px;
          z-index: 1;
          transition: left 1s linear;
          margin-right: 20px;
          box-shadow: 0 5px 17px 0 rgba(86, 118, 94, 0.3); }
          .article--3rd .container--1st .e-money__item.flip {
            -webkit-transform: rotateY(180deg) translate3d(10%, 0, 0) scale(0.8);
                    transform: rotateY(180deg) translate3d(10%, 0, 0) scale(0.8);
            transition: opacity 0.5s ease, visibility 0.5s ease, -webkit-transform 0.5s ease;
            transition: transform 0.5s ease, opacity 0.5s ease, visibility 0.5s ease;
            transition: transform 0.5s ease, opacity 0.5s ease, visibility 0.5s ease, -webkit-transform 0.5s ease;
            -webkit-transform-style: preserve-3d;
                    transform-style: preserve-3d;
            opacity: 0; }
          .article--3rd .container--1st .e-money__item.after {
            box-shadow: none; }
    .article--3rd .container--2nd .section {
      width: 100%; }
      .article--3rd .container--2nd .section__header {
        text-align: center; }
        .article--3rd .container--2nd .section__header._toFade {
          -webkit-transform: translate3d(0, 100px, 0);
                  transform: translate3d(0, 100px, 0);
          opacity: 0;
          transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); }
        .article--3rd .container--2nd .section__header.fadeIn {
          -webkit-transform: translate3d(0, 0, 0);
                  transform: translate3d(0, 0, 0);
          opacity: 1; }
      .article--3rd .container--2nd .section__body._toFade {
        transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
        -webkit-transform: translate3d(0, 100px, 0);
                transform: translate3d(0, 100px, 0);
        opacity: 0; }
      .article--3rd .container--2nd .section__body.fadeIn {
        -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);
        opacity: 1; }
  .article--3rd .section._toFade {
    transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 100px, 0);
            transform: translate3d(0, 100px, 0);
    opacity: 0; }
  .article--3rd .section.fadeIn {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1; }
  .article--3rd .section__header h2 {
    color: #fff; }
  .article--3rd .section__body {
    color: #fff; }
  .article--3rd .func__list {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -js-display: flex;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between; }
  .article--3rd .func__img {
    height: 215px;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -js-display: flex;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    max-width: 220px;
    margin: 0 auto; }
  .article--3rd .func__item {
    width: 340px; }
    .article--3rd .func__item-content {
      text-align: center; }
    .article--3rd .func__item-title {
      font-size: 20px;
      font-weight: bold;
      padding-bottom: 20px; }
    .article--3rd .func__item-text {
      font-size: 16px;
      color: rgba(255, 255, 255, 0.8);
      line-height: 2; }

.article--last {
  background: #e1f7f1; }
  .article--last .container {
    -js-display: flex;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
    padding: 150px 0 100px;
    max-width: 1120px; }
    .article--last .container__img._toFade {
      transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
      -webkit-transform: translate3d(0, 100px, 0);
              transform: translate3d(0, 100px, 0);
      opacity: 0; }
    .article--last .container__img.fadeIn {
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
      opacity: 1; }
  .article--last .section {
    text-align: center; }
    .article--last .section__header h2 {
      color: #0d0e0e;
      white-space: nowrap; }
    .article--last .section._toFade {
      transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
      -webkit-transform: translate3d(0, 100px, 0);
              transform: translate3d(0, 100px, 0);
      opacity: 0; }
    .article--last .section.fadeIn {
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
      opacity: 1; }
    .article--last .section__body {
      padding-top: 20px; }
      .article--last .section__body .caution {
        font-size: 11px;
        color: rgba(13, 14, 14, 0.5);
        width: 390px;
        margin: 20px auto 0 10px;
        text-align: left; }
  .article--last .app {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 12px 17px 0 rgba(86, 118, 94, 0.1), 0 0 30px 0 rgba(108, 115, 111, 0.06);
    margin: 40px auto 0;
    padding: 32px;
    width: 372px;
    box-sizing: border-box; }
    .article--last .app__list {
      -js-display: flex;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex; }
    .article--last .app__item:first-child {
      margin-right: 32px; }
    .article--last .app__item a {
      display: inline-block; }
    .article--last .app__item dl dt {
      margin-bottom: 10px; }
    .article--last .app__caution {
      color: #005A3E;
      font-size: 12px;
      line-height: 1.5;
      letter-spacing: 0.5px;
      display: inline-block;
      font-weight: normal;
      text-align: left;
      width: 100%;
      padding-top: 20px; }
  .article--last .footer {
    -js-display: flex;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    max-width: 1440px;
    margin: 0 auto;
    padding: 40px; }
    .article--last .footer__copy {
      font-size: 13px;
      color: #0d0e0e; }
  .article--last-link {
    padding-top: 35px; }
    .article--last-link img {
      border-radius: 100%;
      margin-left: 10px;
      box-shadow: 0 12px 17px 0 rgba(86, 118, 94, 0.1), 0 0 9px 2px rgba(108, 115, 111, 0.12); }
    .article--last-link a {
      text-decoration: none;
      color: #0d0e0e;
      font-size: 15px;
      font-weight: bold; }

.aside {
  background-image: url(/build/2000/smbc-reference/kojin/special/app/tlb/images/bg_yellow.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  text-align: center;
  min-height: 467px;
  font-size: 36px;
  font-weight: 200;
  color: #005a3e; }
  .aside .container {
    min-height: inherit;
    height: 100%;
    display: inherit;
    padding: 0; }
    .aside .container ._toFade {
      -webkit-transform: translate3d(0, 100px, 0);
              transform: translate3d(0, 100px, 0);
      opacity: 0;
      transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); }
      .aside .container ._toFade.fadeIn {
        -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);
        opacity: 1; }
  .aside .section {
    padding: 144px 0 90px; }
    .aside .section__header h2 {
      color: #005a3e; }
    .aside .section__body {
      max-width: 916px;
      margin: 0 auto;
      padding: 50px 0 40px; }
    .aside .section__footer-caution {
      font-size: 15px;
      color: #0d0e0e;
      font-weight: normal;
      padding-top: 30px;
      max-width: 770px;
      margin: 0 auto;
      text-align: left; }
  .aside .campaign__date {
    -js-display: flex;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    padding-top: 20px; }
    .aside .campaign__date dt {
      background: #005a3e;
      color: #fff;
      border-radius: 2px;
      font-size: 12px;
      font-weight: bold;
      padding: 5px 17.5px; }
    .aside .campaign__date dd {
      font-size: 20px;
      padding-left: 20px;
      font-weight: bold; }
  .aside .campaign__detail {
    text-align: left;
    color: #005A3E; }
  .aside .campaign__title {
    font-size: 17px;
    font-weight: bold; }
  .aside .campaign__content {
    font-size: 13px; }
  .aside .campaign__copy {
    position: absolute;
    right: 10px;
    bottom: 10px;
    color: rgba(123, 157, 28, 0.6);
    font-size: 11px; }

.grid {
  overflow: hidden; }
  .grid__item {
    background-blend-mode: soft-light;
    background-color: rgba(255, 255, 255, 0.4);
    padding: 40px 20px;
    box-sizing: border-box; }
  .grid__large {
    width: 36.57205%;
    height: 368px;
    float: left; }
    .grid__large .grid__figure {
      width: 80%;
      margin: 0 auto 20px;
      display: block; }
    .grid__large .campaign__detail {
      text-align: center; }
  .grid__col {
    width: 59.9345%;
    float: right; }
  .grid__row {
    position: relative;
    padding: 32px 48px;
    display: table;
    width: 100%;
    height: 168px;
    margin-bottom: 30px; }
    .grid__row:last-child {
      margin: 0; }
    .grid__row .campaign__detail {
      padding-left: 45px;
      display: table-cell;
      vertical-align: middle; }
    .grid__row .grid__figure {
      width: 34.60838%; }
  .grid__figure {
    display: table-cell; }
    .grid__figure img {
      box-shadow: 0 12px 14px 0 rgba(100, 92, 38, 0.15); }

.button {
  display: inline-block;
  text-decoration: none;
  background-color: #c5d701;
  background-image: linear-gradient(51deg, #c5d701, #edfb53);
  box-shadow: 0 2px 50px 9px rgba(230, 249, 24, 0.1);
  font-size: 16px;
  font-weight: 500;
  color: #024830;
  letter-spacing: 0.98px;
  text-align: center;
  width: 304px;
  max-width: 100%;
  height: 63px;
  box-sizing: border-box;
  padding: 21px 0; }
  .button:link, .button:visited {
    color: #024830; }
  .button-area {
    display: none;
    background: #F6FFFC; }
  .button--campaign {
    color: #fff;
    border-radius: 51px;
    box-shadow: 0 13px 20px 0 rgba(22, 49, 2, 0.25);
    background-color: #007a50;
    background-image: linear-gradient(83deg, #007a50, #099e52);
    font-size: 24px;
    font-weight: bold;
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    vertical-align: middle;
    padding: 21px 0;
    height: auto; }
    .button--campaign:link, .button--campaign:visited {
      color: #fff; }
    .button--campaign:before {
      content: '';
      display: inline-block;
      width: 28px;
      height: 27px;
      margin-right: 15px;
      background-image: url(/build/2000/smbc-reference/tlb/images/icon_campaign.png);
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat; }

.capture {
  border-radius: 45px 45px 50px 50px;
  overflow: hidden; }
  .capture__frame {
    z-index: 2; }
  .capture__list {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -1;
    background: #efefef; }
  .capture__item {
    box-sizing: border-box;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    padding: 6.66667% 5.33333%; }
    .capture__item img {
      width: 100%;
      height: auto; }
    .capture__item01 {
      z-index: 3; }
    .capture__item02 {
      z-index: 2; }
    .capture__item03 {
      z-index: 1; }

.container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 40px;
  box-sizing: border-box;
  min-height: 600px;
  padding: 0 12.5%;
  position: relative; }
  .container .section {
    transition: all .5s ease; }

.graph {
  position: relative;
  padding-top: 35.24186%;
  width: 70.34722%;
  margin: 0 auto; }
  .graph__bar {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 52.81343%;
    height: 81.23249%;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-transform: translate3d(-50%, -50%, 10px);
            transform: translate3d(-50%, -50%, 10px);
    z-index: 1; }
    .graph__bar img {
      width: 100%;
      position: absolute;
      top: 50%;
      left: 0;
      -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
              transform: translateY(-50%); }
    .graph__bar-list {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 52.81343%;
      height: 81.23249%;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-justify-content: space-between;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-transform: translate3d(-50%, -50%, 0);
              transform: translate3d(-50%, -50%, 0); }
    .graph__bar-item {
      width: 3.73832%;
      height: 100%;
      position: relative; }
      .graph__bar-item span {
        height: 0;
        width: 100%;
        display: block;
        position: absolute;
        left: 0;
        top: 50%;
        transition: height 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
        box-shadow: 0 15px 10px 6px rgba(154, 206, 139, 0.12); }
      .graph__bar-item.active.graph__bar-item01 .graph__bar-green {
        height: 50%; }
      .graph__bar-item.active.graph__bar-item01 .graph__bar-blue {
        height: 40%; }
      .graph__bar-item.active.graph__bar-item02 .graph__bar-green {
        height: 30%; }
      .graph__bar-item.active.graph__bar-item02 .graph__bar-blue {
        height: 25%; }
      .graph__bar-item.active.graph__bar-item03 .graph__bar-green {
        height: 30%; }
      .graph__bar-item.active.graph__bar-item03 .graph__bar-blue {
        height: 40%; }
      .graph__bar-item.active.graph__bar-item04 .graph__bar-green {
        height: 30%; }
      .graph__bar-item.active.graph__bar-item04 .graph__bar-blue {
        height: 15%; }
      .graph__bar-item.active.graph__bar-item05 .graph__bar-green {
        height: 30%; }
      .graph__bar-item.active.graph__bar-item05 .graph__bar-blue {
        height: 20%; }
      .graph__bar-item.active.graph__bar-item06 .graph__bar-green {
        height: 30%; }
      .graph__bar-item.active.graph__bar-item06 .graph__bar-blue {
        height: 30%; }
    .graph__bar-green {
      background: #B7E71C;
      border-radius: 50px 50px 0 0;
      -webkit-transform: translateY(-100%);
          -ms-transform: translateY(-100%);
              transform: translateY(-100%);
      height: 0; }
    .graph__bar-blue {
      background: #67C9E3;
      border-radius: 0 0 50px 50px;
      height: 0; }
  .graph__icon {
    position: absolute;
    width: 14%;
    z-index: 2;
    transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
    visibility: hidden;
    opacity: 0; }
    .graph__icon01 {
      top: 10%;
      left: 0;
      -webkit-transform: translate3d(50px, 50px, 0) rotate(60deg) scale(0.5);
              transform: translate3d(50px, 50px, 0) rotate(60deg) scale(0.5); }
    .graph__icon02 {
      top: 40.61625%;
      left: 16%;
      -webkit-transform: translate3d(50px, 50px, 0) rotate(60deg) scale(0.5);
              transform: translate3d(50px, 50px, 0) rotate(60deg) scale(0.5); }
    .graph__icon03 {
      top: 10%;
      right: 0;
      -webkit-transform: translate3d(-50px, -50px, 0) rotate(-60deg) scale(0.5);
              transform: translate3d(-50px, -50px, 0) rotate(-60deg) scale(0.5); }
    .graph__icon04 {
      top: 35.01401%;
      right: 12%;
      -webkit-transform: translate3d(-50px, -50px, 0) rotate(-60deg) scale(0.5);
              transform: translate3d(-50px, -50px, 0) rotate(-60deg) scale(0.5); }
    .graph__icon05 {
      top: 70.02801%;
      right: 5%;
      -webkit-transform: translate3d(-50px, -50px, 0) rotate(-60deg) scale(0.5);
              transform: translate3d(-50px, -50px, 0) rotate(-60deg) scale(0.5); }
    .graph__icon.active {
      visibility: visible;
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0) rotate(0) scale(1);
              transform: translate3d(0, 0, 0) rotate(0) scale(1); }
  .graph_bar_after {
    opacity: 0;
    transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1); }
    .graph_bar_after.fadeIn {
      opacity: 1; }
  .graph_bar_before {
    opacity: 1;
    transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1); }
    .graph_bar_before.fadeOut {
      opacity: 0; }

.section__header h2 {
  font-weight: 300;
  font-size: 36px;
  color: #0d0e0e; }

.section__body {
  font-size: 16px;
  font-weight: normal;
  color: rgba(13, 14, 14, 0.9);
  padding: 40px 0 0; }
  .section__body p {
    line-height: 2; }
    .section__body p.caution {
      font-size: 12px; }

.ie .section__header h2 {
  font-weight: normal; }

.ie .section__body {
  font-weight: normal; }

@media all and (min-width: 0\0) and (min-resolution: 0.001dpcm) {
    #phone-move {
      opacity: 1;
      -webkit-transform: translateX(140%) translateY(0);
          -ms-transform: translateX(140%) translateY(0);
              transform: translateX(140%) translateY(0); }
        .article--1st .container__img {
          -webkit-transform: translateX(-155%);
              -ms-transform: translateX(-155%);
                  transform: translateX(-155%); }
      .article--1st .section {
        opacity: 1;
        -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
                transform: translateY(0); }
    .article--2nd {
      padding-top: 260px; }
            .article--2nd .container--1st .container__img--phone {
              opacity: 1;
              width: 283px;
              -webkit-transform: translateX(140%) translateY(-50%);
                  -ms-transform: translateX(140%) translateY(-50%);
                      transform: translateX(140%) translateY(-50%); }
              .article--2nd .container--1st .container__img--phone img {
                width: 100%; }
            .article--2nd .container--1st .container__img--card {
              -webkit-transform: translateX(10%) translateY(-120%) rotate(-30deg);
                  -ms-transform: translateX(10%) translateY(-120%) rotate(-30deg);
                      transform: translateX(10%) translateY(-120%) rotate(-30deg);
              opacity: 1; }
          .article--2nd .container--2nd .container__img {
            display: none; }
            .article--2nd .container--2nd .container__img.ie9 {
              display: block; }
        .article--2nd .container--3rd {
          display: table;
          width: 100%; }
          .article--2nd .container--3rd .section {
            display: table-cell;
            vertical-align: middle; }
          .article--2nd .container--3rd .container__img {
            display: table-cell;
            vertical-align: middle;
            position: relative;
            -webkit-transform: none;
                -ms-transform: none;
                    transform: none;
            left: auto;
            right: auto; }
            .article--2nd .container--3rd .container__img .card__img {
              opacity: 1;
              visibility: visible;
              margin-top: 0;
              -webkit-transform: none;
                  -ms-transform: none;
                      transform: none; }
              .article--2nd .container--3rd .container__img .card__img-01 {
                top: 180px;
                left: 0; }
              .article--2nd .container--3rd .container__img .card__img-02 {
                top: 250px;
                left: 30px; }
              .article--2nd .container--3rd .container__img .card__img-03 {
                top: 320px;
                left: 60px; }
            .article--2nd .container--3rd .container__img .alert-img {
              opacity: 1;
              -webkit-transform: none;
                  -ms-transform: none;
                      transform: none;
              right: -150px;
              top: 150px; }
      .article--3rd .slick__card {
        width: 400px;
        height: 575px;
        -webkit-transform: translateX(0);
            -ms-transform: translateX(0);
                transform: translateX(0);
        top: 0; }
        .article--3rd .container--1st {
          padding: 144px 0 0;
          display: table;
          vertical-align: top;
          overflow: visible; }
          .article--3rd .container--1st .section {
            display: table-cell;
            vertical-align: top; }
          .article--3rd .container--1st .container__img {
            display: table-cell;
            vertical-align: top; }
          .article--3rd .container--1st .e-money {
            width: 208.33333%; }
    .article--3rd .section {
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
      opacity: 1; }
      .article--last .container__img {
        -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);
        opacity: 1; }
        .aside .container ._toFade {
          -webkit-transform: translate3d(0, 0, 0);
                  transform: translate3d(0, 0, 0);
          opacity: 1; }
      .grid__large {
        height: 100%; }
      .grid__row {
        margin-bottom: 28px; }
        .grid__row .campaign__detail {
          padding-left: 35px; }
      .capture__item {
        padding: 0; }
        .capture__item img {
          width: auto;
          height: 100%; }
        .graph__bar-item.graph__bar-item01 .graph__bar-green {
          height: 50%; }
        .graph__bar-item.graph__bar-item01 .graph__bar-blue {
          height: 40%; }
        .graph__bar-item.graph__bar-item02 .graph__bar-green {
          height: 30%; }
        .graph__bar-item.graph__bar-item02 .graph__bar-blue {
          height: 25%; }
        .graph__bar-item.graph__bar-item03 .graph__bar-green {
          height: 30%; }
        .graph__bar-item.graph__bar-item03 .graph__bar-blue {
          height: 40%; }
        .graph__bar-item.graph__bar-item04 .graph__bar-green {
          height: 30%; }
        .graph__bar-item.graph__bar-item04 .graph__bar-blue {
          height: 15%; }
        .graph__bar-item.graph__bar-item05 .graph__bar-green {
          height: 30%; }
        .graph__bar-item.graph__bar-item05 .graph__bar-blue {
          height: 20%; }
        .graph__bar-item.graph__bar-item06 .graph__bar-green {
          height: 30%; }
        .graph__bar-item.graph__bar-item06 .graph__bar-blue {
          height: 30%; }
      .graph__icon {
        visibility: visible;
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0) rotate(0) scale(1);
                transform: translate3d(0, 0, 0) rotate(0) scale(1); }
      .graph_bar_after {
        opacity: 1; }
      .graph_bar_before {
        opacity: 0; } }

@media screen and (max-width: 768px) {
    .slick-list {
      padding: 10px 0 15px; } }

@media screen and (max-width: 767px) {
    .hide-sp {
      display: none; }
    .hide-pc {
      display: inline-block; }
    .article__header {
      padding: 16px; }
    .article--1st {
      background-size: cover;
      background-position: top center; }
      .article--1st .container {
        padding: 0 16px 300px;
        display: block; }
        .article--1st .container__img {
          height: 305px;
          width: 145px;
          right: inherit;
          top: inherit;
          -webkit-transform: translateX(-50%);
              -ms-transform: translateX(-50%);
                  transform: translateX(-50%);
          margin: 0 auto;
          left: 50%;
          bottom: -50px; }
          .article--1st .container__img img {
            height: 100%;
            width: auto; }
      .article--1st .section {
        padding: 20% 0 0; }
      .article--1st .section__header {
        padding: 0; }
        .article--1st .section__header h2 {
          font-size: 33px;
          text-align: center; }
        .article--1st .section__body {
          padding: 20px 0 0; }
          .article--1st .section__body p {
            padding: 0; }
        .article--1st .section .qr {
          display: none; }
    .article--2nd {
      padding-top: 0; }
      .article--2nd .container {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-flow: column;
            -ms-flex-flow: column;
                flex-flow: column;
        padding: 0 16px;
        margin-bottom: 100px; }
        .article--2nd .container--1st .section__header {
          padding-top: 40px; }
        .article--2nd .container--1st .section__body {
          padding: 20px 0; }
          .article--2nd .container--1st .container__img {
            position: static;
            height: 305px;
            width: 145px;
            margin-top: 40px;
            -webkit-transform: translate3d(0, 0, 0);
                    transform: translate3d(0, 0, 0);
            top: 50%; }
            .article--2nd .container--1st .container__img--phone {
              opacity: 1;
              width: 46.66667%;
              height: 97.33333%;
              border-radius: 30px;
              box-shadow: 0 14px 30px 10px rgba(41, 99, 83, 0.2); }
              .article--2nd .container--1st .container__img--phone img {
                width: 100%; }
            .article--2nd .container--1st .container__img--card {
              position: absolute;
              width: 50%;
              -webkit-transform: translate3d(100%, 0, 0) rotate(45deg);
                      transform: translate3d(100%, 0, 0) rotate(45deg); }
              .article--2nd .container--1st .container__img--card.fadeIn {
                -webkit-transform: translate3d(50%, 0, 0) rotate(-30deg);
                        transform: translate3d(50%, 0, 0) rotate(-30deg); }
          .article--2nd .container--2nd .section {
            -webkit-order: 1;
                -ms-flex-order: 1;
                    order: 1;
            padding: 0 0 20px; }
          .article--2nd .container--2nd .container__img {
            -webkit-flex-flow: column;
                -ms-flex-flow: column;
                    flex-flow: column;
            -webkit-order: 2;
                -ms-flex-order: 2;
                    order: 2; }
          .article--2nd .container--3rd .section {
            width: 100%; }
          .article--2nd .container--3rd .container__img {
            position: static;
            -webkit-transform: translate3d(0, 0, 0);
                    transform: translate3d(0, 0, 0);
            width: 100%;
            padding-top: 80%;
            height: auto; }
            .article--2nd .container--3rd .container__img .card__img {
              top: 0;
              left: 20px;
              width: 75%; }
              .article--2nd .container--3rd .container__img .card__img-01 {
                -webkit-transform: translate3d(10%, 10%, 0);
                        transform: translate3d(10%, 10%, 0); }
              .article--2nd .container--3rd .container__img .card__img-02 {
                -webkit-transform: translate3d(18%, 35%, 0);
                        transform: translate3d(18%, 35%, 0); }
              .article--2nd .container--3rd .container__img .card__img-03 {
                -webkit-transform: translate3d(26%, 60%, 0);
                        transform: translate3d(26%, 60%, 0); }
            .article--2nd .container--3rd .container__img .alert-img {
              width: 100%;
              right: inherit;
              left: 50%;
              bottom: 0;
              top: inherit;
              -webkit-transform: translate3d(-50%, -50%, 0);
                      transform: translate3d(-50%, -50%, 0); }
              .article--2nd .container--3rd .container__img .alert-img.active {
                -webkit-transform: translate3d(-50%, 40%, 0);
                        transform: translate3d(-50%, 40%, 0); }
    .article--3rd {
      background: none; }
      .article--3rd-card .container--1st {
        background-image: none; }
      .article--3rd .slick__card {
        height: 100%;
        width: 60%;
        border-radius: 40px 40px 0 0;
        position: absolute;
        left: 50%;
        top: 0;
        -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
                transform: translateX(-50%); }
        .article--3rd .card__item img {
          height: auto; }
      .article--3rd .container {
        background-image: url(/build/2000/smbc-reference/kojin/special/app/tlb/images/bg_green.png);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat; }
        .article--3rd .container--1st {
          -webkit-flex-flow: column;
              -ms-flex-flow: column;
                  flex-flow: column;
          padding: 0;
          margin: 0;
          background: #f6fffc; }
          .article--3rd .container--1st .section {
            -webkit-order: 1;
                -ms-flex-order: 1;
                    order: 1;
            padding: 0 16px;
            width: 100%;
            box-sizing: border-box; }
            .article--3rd .container--1st .section__body {
              white-space: normal; }
          .article--3rd .container--1st .container__img {
            position: relative;
            -webkit-order: 2;
                -ms-flex-order: 2;
                    order: 2;
            width: 100%;
            bottom: 0;
            padding-top: 86.66667%;
            height: auto; }
          .article--3rd .container--1st .e-money {
            position: absolute;
            width: 90%;
            bottom: 0;
            -webkit-flex-wrap: wrap;
                -ms-flex-wrap: wrap;
                    flex-wrap: wrap;
            -webkit-justify-content: center;
                -ms-flex-pack: center;
                    justify-content: center;
            margin: 0 auto;
            height: auto; }
            .article--3rd .container--1st .e-money__item {
              left: 50%;
              width: 96px;
              margin: 0 5px;
              box-sizing: border-box;
              margin-right: 0;
              visibility: visible; }
              .article--3rd .container--1st .e-money__item img {
                width: 100%; }
              .article--3rd .container--1st .e-money__item.flip {
                -webkit-transform: rotateY(180deg) translate3d(10%, 50%, 0) scale(0.8);
                        transform: rotateY(180deg) translate3d(10%, 50%, 0) scale(0.8); }
      .article--3rd .container--2nd {
        padding: 0 16px; }
        .article--3rd .container--2nd .section {
          padding-top: 40px; }
        .article--3rd .container--2nd .section__body {
          padding-top: 60px; }
      .article--3rd .func__list {
        display: block; }
      .article--3rd .func__img {
        display: none;
        width: 40%;
        height: auto; }
        .article--3rd .func__img img {
          width: 90%; }
      .article--3rd .func__item {
        width: 100%;
        -webkit-align-items: center;
            -ms-flex-align: center;
                align-items: center;
        margin-bottom: 60px; }
        .article--3rd .func__item-content {
          text-align: left; }
        .article--3rd .func__item-title {
          font-size: 17px;
          padding-bottom: 0px;
          -js-display: flex;
          display: -webkit-flex;
          display: -ms-flexbox;
          display: flex;
          -webkit-align-items: center;
              -ms-flex-align: center;
                  align-items: center; }
          .article--3rd .func__item-title:before {
            content: '';
            display: block;
            width: 50%;
            padding-top: 40%;
            background-repeat: no-repeat;
            background-size: 70%;
            background-position: center; }
        .article--3rd .func__item-title01:before {
          background-image: url(/build/2000/smbc-reference/kojin/special/app/tlb/images/func_img01.png); }
        .article--3rd .func__item-title02:before {
          background-image: url(/build/2000/smbc-reference/kojin/special/app/tlb/images/func_img02.png); }
        .article--3rd .func__item-title03:before {
          background-image: url(/build/2000/smbc-reference/kojin/special/app/tlb/images/func_img03.png); }
        .article--3rd .func__item-text {
          font-size: 15px; }
      .article--last .container {
        -webkit-flex-flow: column;
            -ms-flex-flow: column;
                flex-flow: column;
        padding: 90px 0 0; }
      .article--last .container__img {
        width: 90%;
        margin: 0 auto;
        padding-left: 30px;
        box-sizing: border-box; }
      .article--last .section__header {
        width: 100%;
        box-sizing: border-box;
        padding: 0 16px; }
        .article--last .section__header h2 {
          font-size: 25px; }
          .article--last .section__body .caution {
            width: 100%;
            box-sizing: border-box;
            padding: 0 16px;
            margin: 20px 0 0; }
      .article--last .app {
        background: none;
        box-shadow: none;
        margin: 40px auto;
        padding: 0 40px;
        width: 100%; }
        .article--last .app__list {
          display: block;
          width: 60.53333%;
          margin: 0 auto; }
      .article--last .app__item {
        width: 100%; }
        .article--last .app__item a {
          display: block; }
        .article--last .app__item img {
          width: 100%; }
        .article--last .app__item:first-child {
          margin: 0 0 16px; }
        .article--last .app__caution {
          padding-left: 1em;
          text-indent: -1em; }
      .article--last .footer {
        padding: 20px 10px; }
      .article--last .footer__logo {
        display: none; }
        .article--last .footer__copy {
          font-size: 9px; }
      .article--last-link {
        padding-bottom: 80px; }
    .aside {
      font-size: 24px; }
      .aside .section {
        padding: 40px 0; }
      .aside .section__header {
        padding: 40px 16px 0; }
        .aside .section__header h2 {
          font-size: 25px; }
        .aside .section__footer-caution {
          font-size: 15px;
          padding: 30px 16px 0;
          text-align: left; }
      .aside .campaign__date {
        display: block; }
        .aside .campaign__date dt {
          display: inline-block;
          margin-bottom: 20px; }
        .aside .campaign__date dd {
          font-size: 14px;
          padding-left: 0; }
      .aside .campaign__detail {
        width: 47.45763%; }
      .aside .campaign__title {
        font-size: 17px;
        white-space: nowrap; }
      .aside .campaign__content {
        font-size: 12px;
        font-weight: 500;
        white-space: nowrap; }
    .grid {
      display: block;
      padding: 0 16px; }
      .grid__item {
        margin-bottom: 16px; }
      .grid__large {
        width: 100%;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -js-display: flex;
        -webkit-align-items: center;
            -ms-flex-align: center;
                align-items: center;
        padding: 24px;
        height: auto; }
        .grid__large .grid__figure {
          margin-bottom: 0;
          width: 45.42373%; }
        .grid__large .campaign__detail {
          text-align: left;
          padding-left: 5.42373%; }
      .grid__col {
        width: 100%; }
      .grid__row {
        padding: 24px 32px 32px;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex; }
        .grid__row .campaign__detail {
          padding-left: 11.52542%; }
        .grid__row .grid__figure {
          width: 40.81633%; }
      .grid__figure {
        width: 45.42373%; }
      .button-area {
        display: block;
        min-height: 120px; }
    .button-wrap {
      text-align: center;
      width: 100%;
      padding-top: 20px;
      margin-top: 50px;
      z-index: 10;
      transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
      position: fixed;
      width: 100%;
      -webkit-transform: translateY(120%);
          -ms-transform: translateY(120%);
              transform: translateY(120%);
      bottom: 0;
      left: 0; }
      .button-wrap.fadeOut {
        -webkit-transform: translateY(120%);
            -ms-transform: translateY(120%);
                transform: translateY(120%); }
      .button-wrap.hasFixed {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        display: block;
        -webkit-transform: translateY(0);
            -ms-transform: translateY(0);
                transform: translateY(0); }
      .button-wrap .button {
        width: 100%;
        transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
        font-weight: bold; }
      .button--campaign {
        font-size: 18px;
        font-weight: bold;
        width: 90%;
        padding: 18px 0; }
        .button--campaign:before {
          width: 22px;
          height: 22px; }
    .capture {
      border-radius: 15px; }
      .capture__item {
        padding: 6.2069% 2.66667%; }
        .capture__item img {
          width: 100%; }
        .capture__item02 {
          background: #efefef; }
        .capture__item02 img {
          width: 100%; }
    .container {
      min-height: auto; }
    .graph {
      padding-top: 76.19048%;
      width: 100%; }
      .graph__bar {
        width: 66.94678%;
        height: 36.41457%; }
        .graph__bar-list {
          width: 66.94678%;
          height: 58.82353%; }
        .graph__bar-item {
          width: 4.1841%; }
      .graph__icon {
        width: 24%; }
        .graph__icon01 {
          top: 0;
          left: -10%; }
        .graph__icon02 {
          top: 40.61625%;
          left: 0.28011%; }
        .graph__icon03 {
          top: -5%;
          right: 0.28011%; }
        .graph__icon04 {
          right: -10%; }
        .graph__icon05 {
          top: 80%;
          right: 14.0056%; }
  .section__header {
    text-align: center;
    padding: 40px 0 0; }
    .section__header h2 {
      font-size: 25px; }
    .section__body {
      text-align: center;
      font-size: 15px;
      padding: 20px 0; }
        .section__body p.caution {
          font-size: 11px; } }

@media screen and (max-width: 320px) {
      .article--1st .container {
        padding: 0 10px 300px; }
        .aside .campaign__date dd {
          font-size: 13px;
          padding: 0 5px; }
    .section__header h2 {
      font-size: 24px; } }

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