@charset "UTF-8";

/*서브페이지 상단 공통*/
#sub-top {position:relative;display:flex;flex-flow:column;justify-content:flex-end;min-height:700px;height:700px;background:url(./img/sub_top_bg.jpg) no-repeat center / cover;transform: scale(1.2);opacity:0;transition: all 4s;}
#sub-top.on {transform:scale(1);opacity:1;}
#sub-top:before,
#sub-top:after {
    content:'';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    background: rgba(255,255,255,0.3);
    z-index: 5;
}

#sub-top.on:before {animation: move_blind 2s;animation-fill-mode: forwards;}
#sub-top.on:after {animation: move_blind 2s;animation-fill-mode: forwards;animation-delay: .5s;}

@keyframes move_blind {
    0% {width: 100%; background: rgba(255,255,255,0.3);}
    100% {width: 0;background: rgba(255,255,255,0);}
}

#sub-top .sub-title {position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:100%;max-width:400px;text-align: center;}
#sub-top .sub-title h1 {font-size:70px;font-weight:900;letter-spacing:-2.4px;color:#fff;}
#sub-top .sub-title p {font-size:20px;font-weight:300;letter-spacing:-0.66px;line-height:1.5;color:#D9D9D9;margin-top:40px;}

#sub-top .sub-menu {border-top:1px solid #858585;}
#sub-top .sub-menu .menu-wr {display:flex;align-items:center;justify-content:center;height:120px;max-width:1460px;padding: 0 30px;margin: 0 auto;}
#sub-top .sub-menu .menu-wr ul {display:inline-flex;height:100%;}
#sub-top .sub-menu .menu-wr ul li {position:relative;display:inline-flex;align-items:center;justify-content:center;padding:0 35px;}
#sub-top .sub-menu .menu-wr ul li a {font-size:18px;letter-spacing:-0.54px;font-weight:300;color:#d9d9d9;}

#sub-top .sub-menu .menu-wr ul li.on:after {content:'';position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:calc(100% - 70px);height:2px;background: #fff;}
#sub-top .sub-menu .menu-wr ul li.on a {font-weight:bold;color:#fff;}

#sub-wr .section-tit {max-width:1460px;text-align: center;padding: 0 30px;margin:105px auto 70px;}
#sub-wr .section-tit h1 {font-family:GmarketSansBold;font-size:40px;line-height:1.5;}
#sub-wr .section-tit p {font-size:30px;letter-spacing:-0.9px;line-height:1.5;color:#555;margin:70px auto;}

#sub-wr .section .section-con {max-width:1460px;padding:0 30px;margin:70px auto 100px;}

.colored-blue {color:#1A18C7;}
.colored-red {color:#EE0101;}

.con-tit {display:flex;align-items: center;}
.con-tit img {width:34px; height:34px;margin-right:15px;}
.con-tit span {font-size:30px;font-weight:bold;letter-spacing: -0.9px;color:#000;}

.text-list {margin-top:30px;}
.text-list ul {}
.text-list ul li {margin-bottom:15px;}
.text-list ul li:last-of-type {margin-bottom:0;}
.text-list ul li span {position:relative;font-size:18px;font-weight:500;line-height:1.5;letter-spacing: -0.54px;color:#555;padding-left:15px;display:inline-block;word-break: keep-all;}
.text-list ul li span:before {content:'';position:absolute;width:6px;height:6px;background:#1A18C7;top:10.5px;left:0;}
.text-list ul li .tel {font-family: GmarketSansBold;font-size:22px;letter-spacing: -0.66px;color:#000;margin-left:5px;vertical-align: baseline;}


@media (max-width:1400px) {
    #sub-top {min-height:500px;height:500px;}
    #sub-top .sub-title {padding: 0 20px;}
    #sub-top .sub-title h1 {font-size:40px;letter-spacing:-1.2px;line-height: 1.4;}
    #sub-top .sub-title p {font-size:13px;letter-spacing: -0.39px;margin-top:15px;}
    #sub-top .sub-menu .menu-wr {height:auto;padding:20px;}
    #sub-top .sub-menu .menu-wr ul {width:100%;justify-content: center;flex-flow:wrap;}
    #sub-top .sub-menu .menu-wr ul li {width:33.333%;padding: 10px;}
    #sub-top .sub-menu .menu-wr ul li a {font-size:16px;letter-spacing: -0.48px;}

    #sub-top .sub-menu .menu-wr ul li.on:after {display:none;}

    #mobile-menu{display:none;}

    #sub-wr .section-tit {padding: 0 20px;margin:50px auto 30px;}
    #sub-wr .section-tit h1 {font-size:20px;letter-spacing:-0.6px;line-height:1.5;}
    #sub-wr .section-tit p {font-size:20px;letter-spacing:-0.6px;line-height:1.5;margin-top:30px;}

    #sub-wr .section .section-con {padding: 0 20px;margin:30px auto 80px;}

    .con-tit {}
    .con-tit img {width:25px; height:25px;margin-right:7px;}
    .con-tit span {font-size:20px;letter-spacing: -0.6px;}

    .text-list {margin-top:25px;}
    .text-list ul {}
    .text-list ul li {margin-bottom:15px;}
    .text-list ul li:last-of-type {margin-bottom:0;}
    .text-list ul li span {font-size:16px;letter-spacing: -0.48px;padding-left:15px;}
    .text-list ul li span:before {top:9.5px;}
    .text-list ul li .tel {font-size:18px;letter-spacing: -0.54px;margin-left:5px;}

}
@media (max-width:768px) {
    #sub-top {height:253px;}
    #sub-top .sub-title {}
    #sub-top .sub-title h1 {font-size:30px;}
    #sub-top .sub-title p {font-size:13px;}

    #sub-top .sub-menu .menu-wr {}
    #sub-top .sub-menu .menu-wr ul {}
    #sub-top .sub-menu .menu-wr ul li {}
    #sub-top .sub-menu .menu-wr ul li a {font-size:14px;letter-spacing: -0.42px;}
}


/*menu10*/
.progress-list {padding:30px 0 150px;}
.progress-list ul {display:flex;align-items: flex-start;}
.progress-list ul li {width:25%;}

.progress-list ul li .img-wr {position:relative;height:200px;display:flex;flex-flow:column;align-items: center;justify-content: center;}
.progress-list ul li .img-wr img {width:42px;}
.progress-list ul li .img-wr .num {font-family:GmarketSansMedium;font-size:15px;letter-spacing:-0.45px;color:#fff;margin:20px auto 10px;}
.progress-list ul li .img-wr p {font-size:20px;font-weight:500;letter-spacing: -0.6px;color:#fff;}

.progress-list ul li .img-wr:after {content:'';position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:0;height:0;border:20px solid transparent;border-right-width:0;border-left-color:inherit;}
.progress-list ul li:last-of-type .img-wr:after {display: none;}
.progress-list ul li:nth-of-type(1) .img-wr {background:#A3A2E9;border-color:#A3A2E9;z-index: 4;}
.progress-list ul li:nth-of-type(2) .img-wr {background:#7574DD;border-color:#7574DD;z-index: 3;}
.progress-list ul li:nth-of-type(3) .img-wr {background:#4746D2;border-color:#4746D2;z-index: 2;}
.progress-list ul li:nth-of-type(4) .img-wr {background:#1A18C7;border-color:#1A18C7;z-index: 1;}

.progress-list ul li .text-wr {padding:20px 0 0;}
.progress-list ul li .text-wr p {font-size:18px;font-weight:500;letter-spacing: -0.54px;line-height:1.5;color:#555;text-align: center;}

.application-download {padding:40px 0 150px;}
.application-download ul {display:flex;align-items: flex-start;}
.application-download ul li {width:20%;padding: 0 45px;}
.application-download ul li .img-wr {}
.application-download ul li .img-wr img {width:100%;}
.application-download ul li .img-wr p {font-size:22px;font-weight:bold;letter-spacing: -0.66px;color:#000;padding:30px 0;text-align: center;}
.application-download ul li .btn-download {display:flex;align-items:center;justify-content:center;width:100%;height:60px;background:#fff url(./img/btn_arrow2.png) no-repeat 80% 55% / 6px;border:1px solid #1A18C7;border-radius:50px;margin: 0 auto;}
.application-download ul li .btn-download span {font-size:17px;letter-spacing: -0.51px;color:#1A18C7;padding-right:25px;}
.application-download ul li .btn-download:hover {background:#1A18C7 url(./img/btn_arrow.png) no-repeat 80% 55% / 6px;}
.application-download ul li .btn-download:hover span {color:#fff;}

.online-deposit {padding:30px 0 0;}
.online-deposit ul {display:flex;align-items: flex-start;justify-content: space-between;padding:28px 0 27px;background:#F1F1F6;}
.online-deposit ul li {display:inline-flex;align-items:flex-start;width:50%;padding:10px;border-right:1px solid #BCBBC8;}
.online-deposit ul li:last-of-type {border-right:0;}
.online-deposit ul li .img-wr {width:40%;text-align: center;}
.online-deposit ul li .img-wr img {height:35px;}
.online-deposit ul li .text-wr {width:60%;}
.online-deposit ul li .text-wr ul {flex-flow:column;padding:0;margin-top:8px;}
.online-deposit ul li .text-wr ul li {display:block;width:100%;padding:0;border-right:0;margin-bottom:10px;}
.online-deposit ul li .text-wr ul li span {display:inline-block;min-width:85px;font-size:18px;font-weight:500;line-height:1.5;letter-spacing: -0.54px;color:#555;}
.online-deposit ul li .text-wr ul li .account {display:inline-block;width:calc(100% - 88px);font-family:GmarketSansBold;font-size:25px;line-height:1.5;letter-spacing: -0.75px;color:#000;vertical-align: top;}

@media (max-width:1400px) {
    /*menu10*/
    .progress-list {padding:30px 0 60px;}
    .progress-list ul {display:flex;align-items: flex-start;flex-wrap: wrap;}
    .progress-list ul li {width:calc(50% - 20px);margin-right:40px;}
    .progress-list ul li:nth-of-type(2n) {margin-right:0;}

    .progress-list ul li .img-wr {height:194px;}
    .progress-list ul li .img-wr img {width:40px;}
    .progress-list ul li .img-wr .num {margin:15px auto 7px}
    .progress-list ul li .img-wr p {}

    .progress-list ul li .img-wr:after {display: none;}

    .progress-list ul li .text-wr {padding:20px 0 40px;}
    .progress-list ul li .text-wr p {font-size:16px;letter-spacing: -0.48px;}


    .application-download {padding:30px 0 60px;}
    .application-download ul {flex-wrap:wrap;}
    .application-download ul li {width:calc(50% - 20px);padding: 0;margin-right:40px;margin-bottom:40px;}
    .application-download ul li:nth-of-type(2n) {margin-right:0;}
    .application-download ul li .img-wr {}
    .application-download ul li .img-wr img {width:100%;}
    .application-download ul li .img-wr p {font-size:18px;letter-spacing: -0.54px;padding:20px 0;}
    .application-download ul li .btn-download {max-width:130px;height:45px;background:#fff url(./img/btn_arrow2.png) no-repeat 87% 53% / 6px;}
    .application-download ul li .btn-download span {font-size:15px;letter-spacing: -0.45px;padding-right:15px;}
    .application-download ul li .btn-download:hover {background:#1A18C7 url(./img/btn_arrow.png) no-repeat 87% 53% / 6px;}
    .application-download ul li .btn-download:hover span {color:#fff;}


    .online-deposit {padding:30px 0 0;}
    .online-deposit ul {flex-flow:column;align-items: flex-start;justify-content: space-between;padding:28px 0 27px;background:#F1F1F6;}
    .online-deposit ul li {flex-flow:column;align-items:flex-start;width:100%;padding:0 20px;border-right:0;}
    .online-deposit > ul > li:last-of-type {border-right:0;margin-top:20px;}
    .online-deposit ul li .img-wr {width:100%;text-align: left;margin-bottom:20px;}
    .online-deposit ul li .img-wr img {}
    .online-deposit ul li .text-wr {width:100%;}
    .online-deposit ul li .text-wr ul {flex-flow:column;padding:0;margin-top:0;}
    .online-deposit ul li .text-wr ul li {flex-flow:row;width:100%;}
    .online-deposit ul li .text-wr ul li span {min-width:85px;font-size:16px;letter-spacing: -0.54px;}
    .online-deposit ul li .text-wr ul li .account {font-size:18px;letter-spacing: -0.54px;}

}
@media (max-width:768px) {
    .progress-list ul li {width:100%;margin-right:0;}
    .progress-list ul li .img-wr {height:160px;}
    .progress-list ul li .img-wr .num {margin:10px auto 5px;}
    .progress-list ul li .text-wr {padding:20px 0 30px;}

    .application-download ul li {width:calc(50% - 10px);margin-right:20px;}

    .online-deposit ul li .text-wr ul li span {min-width:80px;}
}