body {
    font-family: noto-sans-cjk-jp, sans-serif;
}

/* margin */
.margin-top-50 {
    margin-top: 50px;
}

/* 背景色 */
.bg-main-color {
    background-color: #1a1459;
}
.bg-gray-color {
    background-color: #F9F9F9;
}
.bg-white-color {
    background-color: #FFF;
}
.bg-subwhite-color {
    background-color: #FBFBFB;
}
.bg-kv {
    background: #F2F6FA;
}

.text-main-color {
    color: #1A1459;
}
  
.text-main-color2 {
    color: #56AFFE;
}
  
.text-main-color3 {
    color: #C161DC;
}
  
.text-main-color4 {
    color: #808080;
}
  
.text-main-color5 {
    color: #4143DB;
}
  
.text-gray-color1 {
    color: #CCC;
}
  
.text-gray-color2 {
    color: #666;
}
  
.text-gray-color3 {
    color: #ECECEC;
}
  
.text-gray-color4 {
    color: #333;
}
  
.bg-main-color {
    background: #1A1459;
}
  
.bg-main-color2 {
    background: #56AFFE;
}
  
.bg-main-color3 {
    background: #C161DC;
}
  
.bg-main-color4 {
    background: #808080;
}
  
.bg-main-color5 {
    background: #4143DB;
}
  
.bg-main-color6 {
    background: #F2F6FA;
}
  
.bg-gray-color1 {
    background: #CCC;
}
  
.bg-gray-color2 {
    background: #666;
}
  
.bg-gray-color3 {
    background: #ECECEC;
}
  
.bg-gray-color4 {
    background: #333;
}
  
.bg-gray-color5 {
    background: #FBFBFB;
}
  

/* 文字色 */
.text-main-color {
    color: #1a1459;
}
.text-blue-color {
    color: #56AFFE;
}
.text-gray-color {
    color: #999999;
}
.text-gray-light-color {
    color: #666666;
}
.text-gray-blight-color {
    color: #333333;
}
.text-pink-color {
    color: #C363DE;
}

/* 文字の高さ */
.line-height-18 {
    line-height: 18px !important;
}
.line-height-22 {
    line-height: 22px !important;
}
.line-height-26 {
    line-height: 26px !important;
}

/* border-radius */
.border-radius-13 {
    border-radius: 13px;
}

/* 円 */
.white-circle {
    background: #FFF;
    border-radius: 50%;
}

/* 下線 */
.border-bottom-white {
    border-bottom: solid 1px #FFF;
}
.border-bottom-gray {
    border-bottom: solid 1px #ECECEC;
}

.border-top-gray {
    border-top: solid 1px #ECECEC;
}

.swiper-pagination {
    position: relative;
  }
  
  .swiper-pagination-bullet {
    background-color: #1A1459;
    margin: 0 4px;
  }

  .swiper-slide{ height: auto; }


  .border-small-main-btn {
    border: 1px solid #1A1459;
    color: #1A1459;
    padding: 6px 20px;
    border-radius: 50px;
    cursor: pointer;
  }
  .border-small-main-btn:hover {
    background: #1A1459;
    color: #fff;
  }
  .border-small-main-btn:hover path {
    fill: #fff;
  }
  
  .border-regular-main-btn {
    border: 1px solid #1A1459;
    color: #1A1459;
    padding: 12px 20px;
    border-radius: 50px;
    cursor: pointer;
  }
  .border-regular-main-btn:hover {
    background: #1A1459;
    color: #fff;
  }
  .border-regular-main-btn:hover path {
    fill: #fff;
  }
  
  .border-large-main-btn {
    border: 1px solid #1A1459;
    color: #1A1459;
    padding: 12px 32px;
    border-radius: 50px;
    cursor: pointer;
  }
  .border-large-main-btn:hover {
    background: #1A1459;
    color: #fff;
  }
  .border-large-main-btn:hover path {
    fill: #fff;
  }
  
  .small-main-btn {
    background: #1A1459;
    color: #fff;
    padding: 6px 20px;
    position: relative;
    border-radius: 50px;
    cursor: pointer;
  }
  .small-main-btn:hover {
    opacity: 0.8;
  }
  
  .regular-main-btn {
    background: #1A1459;
    color: #fff;
    padding: 12px 20px;
    position: relative;
    border-radius: 50px;
    cursor: pointer;
  }
  .regular-main-btn:hover {
    opacity: 0.8;
  }
  
  .small-main-btn2 {
    background: #56AFFE;
    color: #fff;
    padding: 6px 20px;
    position: relative;
    border-radius: 50px;
    cursor: pointer;
  }
  .small-main-btn2:hover {
    opacity: 0.8;
  }
  
  .regular-main-btn2 {
    background: #56AFFE;
    color: #fff;
    padding: 12px 20px;
    position: relative;
    border-radius: 50px;
    cursor: pointer;
  }
  .regular-main-btn2:hover {
    opacity: 0.8;
  }
  
  .small-main-btn3 {
    background: #C161DC;
    color: #fff;
    padding: 6px 20px;
    position: relative;
    border-radius: 50px;
    cursor: pointer;
  }
  .small-main-btn3:hover {
    opacity: 0.8;
  }
  
  .regular-main-btn3 {
    background: #C161DC;
    color: #fff;
    padding: 12px 20px;
    position: relative;
    border-radius: 50px;
    cursor: pointer;
  }
  .regular-main-btn3:hover {
    opacity: 0.8;
  }
  
  .small-main-btn4 {
    background: #808080;
    color: #fff;
    padding: 6px 20px;
    position: relative;
    border-radius: 50px;
    cursor: pointer;
  }
  .small-main-btn4:hover {
    opacity: 0.8;
  }
  
  .regular-main-btn4 {
    background: #808080;
    color: #fff;
    padding: 12px 20px;
    position: relative;
    border-radius: 50px;
    cursor: pointer;
  }
  .regular-main-btn4:hover {
    opacity: 0.8;
  }
  
  .small-main-btn5 {
    background: #4143DB;
    color: #fff;
    padding: 6px 20px;
    position: relative;
    border-radius: 50px;
    cursor: pointer;
  }
  .small-main-btn5:hover {
    opacity: 0.8;
  }
  
  .regular-main-btn5 {
    background: #4143DB;
    color: #fff;
    padding: 12px 20px;
    position: relative;
    border-radius: 50px;
    cursor: pointer;
  }
  .regular-main-btn5:hover {
    opacity: 0.8;
  }


@media screen and (min-width: 880px) {
  .block-880 {
        display: block !important;
  }
}

@media screen and (min-width: 480px) {
  .block-480 {
        display: block !important;
  }

  .w-384-480 {
        width: 384px !important;
  }
}