@charset "UTF-8";
.paragraph-visuals--pagination {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

.paragraph-visuals--items {
  width: 100%; }
  .paragraph-visuals--items .content-visual {
    position: relative; }

.paragraph-visuals--nav {
  position: absolute;
  bottom: 2.25rem;
  left: 50%;
  -ms-transform: translateX(-50%);
      transform: translateX(-50%);
  text-align: center;
  z-index: 33; }
  @media (max-width: 767px) {
    .paragraph-visuals--nav {
      bottom: 20px; } }

.paragraph-visuals .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin: 5px 7px;
  transition: opacity .2s ease;
  border-radius: 30px;
  opacity: .5;
  background-color: #FFFFFF;
  margin-right: 0; }
  @media (max-width: 767px) {
    .paragraph-visuals .swiper-pagination-bullet {
      margin: 0 3px; } }
  .paragraph-visuals .swiper-pagination-bullet-active {
    width: 70px;
    height: 4px;
    opacity: 1;
    background: transparent linear-gradient(92deg, #007CBA 0%, #62B5E5 100%);
    transition: .2s; }
  .paragraph-visuals .swiper-pagination-bullet:hover {
    background-color: #869690;
    transition: .3s; }

.paragraph-visual {
  position: relative; }
  .paragraph-visual h1 {
    font-weight: normal;
    font-size: 3.75rem;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #FFF;
    padding-bottom: 2.38rem;
    max-width: 100%; }
    @media (max-width: 767px) {
      .paragraph-visual h1 {
        padding-bottom: 20px;
        line-height: 1.2;
        font-weight: 400;
        font-size: 30px;
        text-align: center;
        max-width: 100%; } }
  .paragraph-visual--content--content-text {
    position: absolute;
    width: 100%;
    top: 50%;
    -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    z-index: 2; }
    @media (max-width: 767px) {
      .paragraph-visual--content--content-text {
        top: 16%;
        -ms-transform: none;
            transform: none; } }
    .paragraph-visual--content--content-text .contentText {
      position: relative;
      display: inline-block;
      max-width: 60%; }
      @media (max-width: 767px) {
        .paragraph-visual--content--content-text .contentText {
          width: 100%;
          max-width: none; } }
  .paragraph-visual--title {
    font-size: 3.75rem;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #FFF;
    padding-bottom: 2.38rem;
    max-width: 100%; }
    @media (max-width: 767px) {
      .paragraph-visual--title {
        padding-bottom: 20px;
        text-align: center;
        max-width: 100%;
        line-height: 1.2;
        font-weight: 400;
        font-size: 30px; } }
  .paragraph-visual--link.cta {
    text-transform: none; }
  .paragraph-visual--link a {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    text-decoration: none;
    color: #FFF;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 1rem;
    background: transparent;
    border: none;
    padding: 0; }
    @media (max-width: 767px) {
      .paragraph-visual--link a {
        -ms-flex-pack: center;
            justify-content: center; } }
    .paragraph-visual--link a:after {
      content: "";
      display: block;
      margin-left: 10px;
      font-size: 30px;
      color: #FFF;
      font-family: 'doBankIcon';
      font-weight: 400; }
  .paragraph-visual--text {
    font-size: 1.13rem;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.44;
    letter-spacing: normal;
    color: #FFF;
    padding-bottom: 2.5rem;
    max-width: 40%; }
    @media (max-width: 767px) {
      .paragraph-visual--text {
        font-size: 16px;
        text-align: center;
        max-width: 100%;
        padding-bottom: 10px; } }
  .paragraph-visual--sub-title {
    font-size: 1.13rem;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: 0.9px;
    color: #FFF;
    padding-bottom: 0.81rem; }
    @media (max-width: 767px) {
      .paragraph-visual--sub-title {
        font-size: 16px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.13;
        letter-spacing: 1px;
        text-align: left;
        padding-bottom: 0; } }
  .paragraph-visual--image-mobile {
    display: none; }
    @media (max-width: 767px) {
      .paragraph-visual--image-mobile {
        display: block; } }
    .paragraph-visual--image-mobile img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: absolute;
      top: 0;
      left: 0; }
  @media (max-width: 767px) {
    .paragraph-visual--image {
      display: none; }
      .visual-mob-none .paragraph-visual--image {
        display: block; } }
  .paragraph-visual--image .fitImage {
    padding-bottom: 40.8%; }
    .donext .paragraph-visual--image .fitImage {
      padding-bottom: 40.8%; }
      @media (max-width: 767px) {
        .donext .paragraph-visual--image .fitImage {
          padding-bottom: 70%; } }
    @media (max-width: 767px) {
      .paragraph-visual--image .fitImage {
        padding-bottom: 70%; } }
  .paragraph-visual--image img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    position: absolute; }
  .paragraph-visual--image-mobile {
    display: none; }
    @media (max-width: 767px) {
      .paragraph-visual--image-mobile {
        display: -ms-flexbox;
        display: flex;
        padding-bottom: 100%; } }