@charset "UTF-8";
/*
마이뱅크
write : gray
since : 2019-10-18
*/
@import url(SpoqaHanSans/SpoqaHanSans.css);
@import url(NotoSansKR/NotoSansKR.css);
/*STR default*/
/*END default*/
* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  word-break: keep-all;
  -webkit-text-size-adjust: none;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
}

html {
  overflow-x: hidden;
  overflow-y: scroll;
  font-size: 16px;
}

body {
  line-height: 1.5;
  font-family: "Spoqa Han Sans", Malgun Gothic, "맑은 고딕", dotum, "돋움", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color: #777;
}

nav, ol, ul {
  list-style: none;
}

label, input, button, select, img {
  vertical-align: middle;
}

input, button, textarea, select {
  margin: 0;
  padding: 0;
  -moz-border-radius: 0;
       border-radius: 0;
  font-family: "Spoqa Han Sans", Malgun Gothic, "맑은 고딕", dotum, "돋움", -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: 1rem;
}

button, label {
  cursor: pointer;
}

button * {
  vertical-align: middle;
}

h1, h2, h3, h4, h5, h6, b, strong {
  font-weight: 700;
}

address, cite, em, i {
  font-style: normal;
}

a:link, a:visited {
  color: inherit;
  text-decoration: none;
}

a:hover, a:focus, a:active {
  color: inherit;
  background-color: transparent;
  text-decoration: none;
}

table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

caption, legend {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  font-size: 1px;
  text-indent: -20000px;
}

.wrap {
  padding-bottom: 70px;
}
@media (min-width: 601px) {
  .wrap {
    max-width: 480px;
    margin: auto;
    -webkit-box-shadow: 0 3px 24px 0 rgba(0, 0, 0, 0.09);
       -moz-box-shadow: 0 3px 24px 0 rgba(0, 0, 0, 0.09);
            box-shadow: 0 3px 24px 0 rgba(0, 0, 0, 0.09);
  }
}

.visual img {
  width: 100%;
}

.divider {
  height: 6px;
  background: #f0f0f0;
  border-top: 1px solid #e3e3e3;
  border-bottom: 1px solid #e3e3e3;
}

.introduce {
  padding-left: 30px;
}
.introduce ul {
  padding: 45px 0 55px;
}
.introduce li {
  letter-spacing: -0.8px;
}
.introduce i {
  font-size: 20px;
  line-height: 2.3;
}
.introduce p {
  font-size: 24px;
  color: #1c1c1c;
  padding-right: 20px;
}
.introduce span {
  display: block;
  padding-right: 20px;
  font-size: 16px;
  line-height: 1.6;
  letter-spacing: -0.6px;
}
.introduce .type_1 li {
  padding-bottom: 40px;
  border-width: 0 0 1px 0;
  border-style: solid;
}
.introduce .type_1 li:nth-child(n+2) {
  margin-top: 35px;
}
.introduce .type_1 li:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.introduce .type_1 span {
  margin: 20px 0 0 10px;
}
.introduce .type_2 li:nth-child(n+2) {
  margin-top: 50px;
}
.introduce .type_2 p {
  padding-bottom: 14px;
  border-width: 0 0 1px 0;
  border-style: solid;
}
.introduce .type_2 span {
  margin: 25px 0 0 16px;
}

.btn_area {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 70px;
  background: #fff;
  text-align: center;
  z-index: 10;
}

.btn_down {
  font-size: 18px;
  color: #fff;
  display: block;
  width: 100%;
  height: 100%;
  border: none;
  line-height: 70px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  outline: none;
  margin: 0 auto;
}
.btn_down:link, .btn_down:visited, .btn_down:active {
  color: #fff;
}
@media (min-width: 601px) {
  .btn_down {
    max-width: 480px;
  }
}

.ios {
  padding-bottom: -moz-calc(constant(safe-area-inset-bottom) + 70px);
  padding-bottom: calc(constant(safe-area-inset-bottom) + 70px);
  padding-bottom: -moz-calc(env(safe-area-inset-bottom) + 70px);
  padding-bottom: calc(env(safe-area-inset-bottom) + 70px);
}
.ios .btn_area {
  height: -moz-calc(constant(safe-area-inset-bottom) + 70px);
  height: calc(constant(safe-area-inset-bottom) + 70px);
  height: -moz-calc(env(safe-area-inset-bottom) + 70px);
  height: calc(env(safe-area-inset-bottom) + 70px);
}

.mi_banners {
  padding: 40px 0 45px;
}
.mi_banners h3 {
  font-size: 24px;
  color: #1c1c1c;
  margin-bottom: 14px;
  padding-left: 30px;
  font-weight: normal;
}
.mi_banners .swiper-container {
  margin-left: 30px;
}
.mi_banners .swiper-slide {
  width: 300px;
  height: 200px;
  -moz-border-radius: 10px;
       border-radius: 10px;
  overflow: hidden;
}
@media (max-width: 359px) {
  .mi_banners .swiper-slide {
    width: 250px;
    height: 200px;
  }
}
.mi_banners a {
  display: block;
  width: 100%;
  height: 100%;
  padding: 30px 0 0 30px;
  background-repeat: no-repeat;
  background-position: right bottom;
  -moz-background-size: auto 200px;
       background-size: auto 200px;
}
@media (max-width: 359px) {
  .mi_banners a {
    padding-left: 20px;
  }
}
.mi_banners a h4 {
  font-size: 13px;
  color: #fff;
  font-weight: normal;
  line-height: 19px;
}
.mi_banners a p {
  font-size: 18px;
  color: #fff;
  margin-top: 15px;
  line-height: 26px;
}
.mi_banners a p span {
  color: #ffd481;
}
@media (max-width: 359px) {
  .mi_banners a p .block {
    display: block;
  }
}
.mi_banners .air {
  background-color: #08907f;
  background-image: url("/dev-img/landing-new/brand/banner_air.png");
}
.mi_banners .exchange {
  background-color: #4d79cf;
  background-image: url("/dev-img/landing-new/brand/banner_exchange.png");
}
.mi_banners .deposit {
  background-color: #515151;
  background-image: url("/dev-img/landing-new/brand/banner_deposit.png");
}
.mi_banners .travel {
  background-color: #238cc8;
  background-image: url("/dev-img/landing-new/brand/banner_travel.png");
}
.mi_banners .pet {
  background-color: #5551cf;
  background-image: url("/dev-img/landing-new/brand/banner_pet.png");
}
.mi_banners .group {
  background-color: #20389d;
  background-image: url("/dev-img/landing-new/brand/banner_group.png");
}
.mi_banners .golf {
  background-color: #04764d;
  background-image: url("/dev-img/landing-new/brand/banner_golf.png");
}
.mi_banners .mountain {
  background-image: url("/dev-img/landing-new/brand/banner_mountain.png");
  background-position: left bottom;
}
.mi_banners .mountain h4 {
  color: #888;
}
.mi_banners .mountain .desc {
  color: #1c1c1c;
}
.mi_banners .mountain span {
  color: #007637;
}

.airport .introduce i,
.airport .introduce span {
  color: #00b19a;
}
.airport .type_1 li,
.airport .type_2 p {
  border-color: #00b19a;
}
.airport .btn_down {
  background: #019884;
}
.airport .btn_down:link, .airport .btn_down:visited, .airport .btn_down:active {
  background: #019884;
}

.exchange .introduce i,
.exchange .introduce span {
  color: #cb3333;
}
.exchange .type_1 li,
.exchange .type_2 p {
  border-color: #6e6e6e;
}
.exchange .btn_down {
  background: #373737;
}
.exchange .btn_down:link, .exchange .btn_down:visited, .exchange .btn_down:active {
  background: #373737;
}

.misaving .introduce i,
.misaving .introduce span {
  color: #2f7fbc;
}
.misaving .type_1 li,
.misaving .type_2 p {
  border-color: #2f7fbc;
}
.misaving .btn_down {
  background: #04497e;
}
.misaving .btn_down:link, .misaving .btn_down:visited, .misaving .btn_down:active {
  background: #04497e;
}

.mitravel .introduce i,
.mitravel .introduce span {
  color: #5889c8;
}
.mitravel .type_1 li,
.mitravel .type_2 p {
  border-color: #5889c8;
}
.mitravel .btn_down {
  background: #004bab;
}
.mitravel .btn_down:link, .mitravel .btn_down:visited, .mitravel .btn_down:active {
  background: #004bab;
}

.mipet .introduce i,
.mipet .introduce span {
  color: #5551cf;
}
.mipet .type_1 li,
.mipet .type_2 p {
  border-color: #5551cf;
}
.mipet .btn_down {
  background: #2521a2;
}
.mipet .btn_down:link, .mipet .btn_down:visited, .mipet .btn_down:active {
  background: #2521a2;
}

.migroup .introduce i,
.migroup .introduce span {
  color: #2761ad;
}
.migroup .type_1 li,
.migroup .type_2 p {
  border-color: #2761ad;
}
.migroup .btn_down {
  background: #0b1a5a;
}
.migroup .btn_down:link, .migroup .btn_down:visited, .migroup .btn_down:active {
  background: #0b1a5a;
}
.migroup .introduce p {
  font-size: 21px;
}

.migolf .introduce i,
.migolf .introduce span {
  color: #04764d;
}
.migolf .type_1 li,
.migolf .type_2 p {
  border-color: #04764d;
}
.migolf .btn_down {
  background: #025235;
}
.migolf .btn_down:link, .migolf .btn_down:visited, .migolf .btn_down:active {
  background: #025235;
}

.mimountain .introduce i,
.mimountain .introduce span {
  color: #007637;
}
.mimountain .type_1 li,
.mimountain .type_2 p {
  border-color: #007637;
}
.mimountain .btn_down {
  background: #0d6901;
}
.mimountain .btn_down:link, .mimountain .btn_down:visited, .mimountain .btn_down:active {
  background: #0d6901;
}