@charset "utf-8";
             
.btn-description {display:inline-block;vertical-align:bottom;margin-left:5px;width:16px;height:16px;background:url('../img/common_icon_help01.png') no-repeat center center;background-size:contain;}
.btn-description-cont {z-index:200;position:absolute;top:100px;left:50%;transform:translateX(-50%);display:block;padding:20px 30px 20px 20px;width:70%;border:1px solid #999;font-size:14px;line-height:18px;word-break:keep-all;background-color:#fff;}
.btn-description-cont .btn-close {position:absolute;right:0;top:0;display:block;width:30px;height:30px;background:url('../img/layout_head_close.png') no-repeat center center;background-size:auto 10px;}

.date-pick {padding-right:20px;font-size:inherit;background:url('../img/common_icon_calendar01.png') no-repeat right center;background-size:auto 50%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-tap-highlight-color:transparent;}

dl.select {position:relative;display:block;white-space:nowrap;}
dl.select > dt {padding-right:18px;background:url('../img/common_icon_select01.png') no-repeat right center;background-size:auto 6px;}
dl.select > dd {display:none;position:absolute;left:0;top:100%;min-width:100%;background-color:#fff;border:1px solid #cecece;}
dl.select.on > dd {display:block;padding:5px 0;}
dl.select > dd > ul {font-size:0.9em;line-height:2.5em;}
dl.select > dd > ul > li {}
dl.select > dd > ul > li > a {display:block;padding:0 15px;}
dl.select > dd > ul > li > a.cur,
dl.select > dd > ul > li > a.on {background-color:#f2f2f2;}

.bottom-btn-area {z-index:100;position:fixed;left:0;right:0;bottom:0;line-height:50px;font-size:16px;text-align:center;font-family:'OneShinhanMedium';}
.bottom-btn-area > a {display:block;color:#fff;background-color:#0f51ca;}
.bottom-btn-area > a.disabled {color:#999;background-color:#dbdbdb;}


.keypad {z-index:110;position:fixed;left:0;right:0;bottom:0;text-align:center;transform:translateY(100%);opacity:0;transition:all .3s;}
.keypad.on {transform:translateY(0);opacity:1;}
.keypad ul.quick {padding:3px;font-size:13px;line-height:34px;background-color:#d2d5da;}
.keypad ul.quick:after {display:block;content:"";clear:both;}
.keypad ul.quick > li {float:left;width:calc((100% - (3px * 4))/5);margin-left:3px;border-radius:3px;overflow:hidden;}
.keypad ul.quick > li:first-child {margin-left:0;}
.keypad ul.quick > li > a {display:block;background-color:#fff;}
.keypad ul.num {width:calc(100% + 2px);margin:-2px 0 0 -2px;padding:0 2px 2px 2px;font-size:22px;line-height:50px;background-color:#d2d5da;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.keypad ul.num:after {display:block;content:"";clear:both;}
.keypad ul.num > li {float:left;width:calc((100% - (2px * 3))/3);margin:2px 0 0 2px;}
.keypad ul.num > li > a {display:block;background-color:#fff;font-family:'OneShinhanMedium';}
.keypad ul.num > li > a.back {font-size:0;background:#fff url('../img/common_keypad_back01.png') no-repeat center center;background-size:auto 40%;}
.keypad ul.num > li > a.done {font-size:16px;color:#fff;background-color:#3671d7;font-family:'OneShinhanLight';}
.keypad .password {padding:50px 0 35px;color:#fff;text-align:center;background-color:#0f51ca;border-radius:10px 10px 0 0;}
.keypad .password > .msg {line-height:16px;font-size:14px;}
.keypad .password > .dot {margin-top:20px;display:inline-block;}
.keypad .password > .dot:after {display:block;content:"";clear:both;}
.keypad .password > .dot > li {float:left;margin-left:15px;width:10px;height:10px;border-radius:50%;background-color:rgba(255,255,255,0.3);}
.keypad .password > .dot > li:first-child {margin-left:0;}
.keypad .password > .dot > li.on {background-color:#fff;}

.keypad.full {display:none;top:0;transform:none;opacity:1;transition:none;}
.keypad.full > .dim {position:absolute;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,0.5);opacity:0;transition:all .3s;}
.keypad.full > .pop {position:absolute;left:0;right:0;bottom:0;transform:translateY(30%);opacity:0;transition:all .3s;}
.keypad.full > .pop > .close {position:absolute;display:block;right:0;top:0;width:40px;height:40px;font-size:0;background:url('../img/common_icon_close01.png') no-repeat center center;background-size:13px 13px;}

.keypad.full.ing {display:block;}
.keypad.full.on {transform:none;opacity:1;}
.keypad.full.on > .dim {opacity:1;}
.keypad.full.on > .pop {transform:translateY(0);opacity:1;}

/*
 * 로그인, 회원가입
 */

.member-visual {position:relative;background-color:#00b9ef;padding:100px 0 60px;}
.member-visual:after {position:absolute;left:0;right:0;bottom:0;height:13px;transform:translateY(100%);display:block;content:"";background:url('../img/subGU20_bullet01.png') no-repeat center top;background-size:contain;}
.member-visual > img {display:block;}
.member-visual > img.logo {position:absolute;left:15px;top:15px;height:45px;}
.member-visual > img.img {width:65%;margin:0 auto;}
.member-visual > .tit {margin-top:25px;font-size:22px;text-align:center;color:#fff;font-family:'OneShinhanMedium';}

form.member {padding:60px 0 100px;background-color:#f2f2f2;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
form.member > .wrapper > dl {margin-top:15px;padding:15px 20px;line-height:30px;font-size:16px;background-color:#fff;border-radius:10px;font-family:'OneShinhanMedium';
    -webkit-box-shadow: 0px 0px 10px 0px rgba(110,110,110,0.27); 
            box-shadow: 0px 0px 10px 0px rgba(110,110,110,0.27);}
form.member > .wrapper > dl:first-child {margin-top:0;}
form.member > .wrapper > dl:after {display:block;content:"";clear:both;}
form.member > .wrapper > dl > dt {float:left;width:80px;color:#1784bd;}
form.member > .wrapper > dl > dd {position:relative;float:right;width:calc(100% - 80px);}
form.member > .wrapper > dl > dd > .btn {position:absolute;right:0;top:50%;transform:translateY(-50%);padding:8px 12px;line-height:12px;font-size:12px;color:#fff;background-color:#1784bd;border-radius:3px;}
form.member > .wrapper > dl > dd > input {width:100%;height:30px;border:0;outline:none;}
form.member > .wrapper > dl.check {padding:20px 0;line-height:22px;font-size:14px;text-align:center;}
form.member > .wrapper > dl.check > dt {float:none;width:auto;}
form.member > .wrapper > dl.check > dt > label {display:block;}
form.member > .wrapper > dl.check > dt > label > input {display:block;margin:0 auto;width:20px;height:20px;}
form.member > .wrapper > dl.check > dd {float:none;width:auto;margin-top:15px;}
form.member > .wrapper > .lnk {margin-top:15px;padding:0 10px;font-size:15px;font-family:'OneShinhanMedium';}
form.member > .wrapper > .lnk > a {}
form.member > .wrapper > .lnk > label {color:#1784bd;}
form.member > .wrapper > .lnk > label > input[type=checkbox] {display:inline-block;margin-right:5px;width:16px;height:16px;vertical-align:middle;}
form.member > .wrapper > .btn {display:block;width:100%;margin-top:40px;padding:15px 0;line-height:16px;font-size:16px;color:#fff;text-align:center;border:0;background-color:#1251c5;}

.mGU1000 .member-visual {padding:70px 0 30px;}
.mGU1000 .member-visual > img.img {width:40%;margin:0 auto;}
.mGU1000 form.member {padding:40px 0 60px;}

/*
 * 전체계좌조회
 */
 
.h101010 {/*background-color:#f8f8f8;*/}
.m101010 #LAYOUT_BODY {padding-bottom:0;}
.m101010 section {padding:30px 0;border-top:1px solid #e8e8e8;/*background-color:#f8f8f8;*/background-image:linear-gradient(to bottom, #f8f8f8, #fff);}
.m101010 section:first-child {border-top:0;/*background-color:#fdfdfd;*/}
.m101010 .btn-add {display:block;margin-top:20px;padding:15px 0;font-size:14px;text-align:center;background-color:#f8f8f8;border:1px solid #e7e4e4;border-radius:10px;background:#f8f8f8 url('../img/common_icon_add01.png') no-repeat calc(50% + 40px) center;background-size:auto 14px;}

.account-summary {margin-bottom:20px;padding:0 5px;line-height:16px;font-size:16px;}
.account-summary .p2 {margin-top:10px;}
.account-summary > .fl > .p1 {font-size:15px;}
.account-summary > .fl > .p2 {font-family:'OneShinhanMedium';}
.account-summary > .fr {text-align:right;}
.account-summary strong {color:#1251c5;}
.account-summary .btn-description {}

.account-list {}
.account-list > .itm {margin-top:15px;border-radius:10px;background-color:#fff;overflow:hidden;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(110,110,110,0.27); 
            box-shadow: 0px 0px 5px 0px rgba(110,110,110,0.27);}
.account-list > .itm > .inf {padding:15px;}
.account-list > .itm > .inf > .account {padding-left:24px;background:url('../img/common_icon_bank_sh.png') no-repeat left top;background-size:auto 19px;}
.account-list > .itm > .inf > .account > .tit {line-height:19px;font-size:15px;font-family:'OneShinhanMedium';}
.account-list > .itm > .inf > .account > .dsc {margin-top:5px;line-height:13px;font-size:13px;}
.account-list > .itm > .inf > .account > .dsc > .btn-copy {display:inline-block;margin-left:2px;vertical-align:bottom;width:13px;height:13px;font-size:0;background:url('../img/common_icon_copy01.png') no-repeat center center;background-size:contain;}
.account-list > .itm > .inf > .amt {margin-top:10px;text-align:right;font-size:18px;}
.account-list > .itm > .inf > .amt > strong {font-size:20px;}
.account-list > .itm > .lnk {background-color:#f3f4f6;padding-top:1px;font-size:15px;text-align:center;line-height:40px;}
.account-list > .itm > .lnk:after {display:block;content:"";clear:both;}
.account-list > .itm > .lnk > a {float:left;display:block;width:calc((100% - 1px)/2);background-color:#fff;}
.account-list > .itm > .lnk > a:last-child {float:right;}

.account-list > .itm.t01 {background-color:#eaf7ff;}
.account-list > .itm.t01 > .lnk {background-color:#d2e4fc;}
.account-list > .itm.t01 > .lnk > a {background-color:#eaf7ff;}

.account-list > .itm.nodata {margin:0;padding:30px 0;font-size:14px;color:#999;text-align:center;background-color:transparent;-webkit-box-shadow:none;box-shadow:none;}

.m101010 .foot {padding:40px 0 0;}
.m101010 .foot > img {display:block;margin:0 auto;width:100%;}

/*
 * 전체계좌조회 > 계좌상세조회
 */
 
.account-detail {padding:20px 0 30px;color:#fff;background-color:#4a9cd4;}
.account-detail > .wrapper > .inf {padding-left:24px;background:url('../img/common_icon_bank_sh.png') no-repeat left top;background-size:auto 19px;}
.account-detail > .wrapper > .inf > .tit {line-height:19px;font-size:16px;}
.account-detail > .wrapper > .inf > .dsc {display:inline-block;vertical-align:bottom;margin-top:5px;padding-right:20px;line-height:13px;font-size:13px;background:url('../img/common_icon_select99.png') no-repeat right center;background-size:auto 50%;}
.account-detail > .wrapper > .amt {margin-top:10px;text-align:right;line-height:14px;font-size:14px;}
.account-detail > .wrapper > .amt > .p1 {}
.account-detail > .wrapper > .amt > .p1 > strong {line-height:22px;font-size:22px;}
.account-detail > .wrapper > .amt > .p2 {margin-top:10px;}

.account-search {margin-top:20px;}
.account-search > .tab {line-height:36px;font-size:14px;text-align:center;}
.account-search > .tab:after {display:block;content:"";clear:both;}
.account-search > .tab > a {float:left;display:block;margin-left:5px;width:calc((100% - (5px * 3) - 0.1px)/4);background-color:#f2f2f2;}
.account-search > .tab > a:first-child {margin-left:0;}
.account-search > .tab > a.on {color:#fff;background-color:#3789db;}
.account-search > .detail {max-height:0;opacity:0;overflow:hidden;transition:all .3s;line-height:36px;font-size:14px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.account-search > .detail.ing {display:block;}
.account-search > .detail.on {max-height:155px;opacity:1;padding-top:15px;}
.account-search > .detail.done {overflow:visible;}
.account-search > .detail input[type=number],
.account-search > .detail input[type=text] {width:100%;height:36px;display:block;border:0;border-bottom:1px solid #c5d5ee;}
.account-search > .detail .period {position:relative;}
.account-search > .detail .period:after {display:block;content:"";clear:both;}
.account-search > .detail .period > span {position:absolute;left:50%;top:0;transform:translateX(-50%);color:#989898;}
.account-search > .detail .period > input {width:calc((100% - 30px)/2);}
.account-search > .detail .period > input:first-child {float:left;}
.account-search > .detail .period > input:last-child  {float:right;}
.account-search > .detail .date-pick {font-family:'OneShinhanMedium';background-size:auto 45%;}
.account-search > .detail > .period {}
.account-search > .detail > .cond {margin-top:10px;}
.account-search > .detail > .cond:after {display:block;content:"";clear:both;}
.account-search > .detail > .cond > dl.select {float:left;width:80px;border:0;border-bottom:1px solid #c5d5ee;}
.account-search > .detail > .cond > .fr {float:right;width:calc(100% - 80px - 20px);}
.account-search > .detail > .cond > .fr > .stx {}
.account-search > .detail > .cond > .fr > .period {display:none;}
.account-search > .detail > .cond > .fr > .period > input {text-align:center;}
.account-search > .detail > input[type=submit] {display:block;margin-top:20px;padding:8px 0;width:100%;color:#fff;text-align:center;border:0;background-color:#0f51ca;}

.account-history {margin-top:20px;}
.account-history > .head {line-height:26px;font-size:15px;}
.account-history > .head:after {display:block;content:"";clear:both;}
.account-history > .head > .fl {}
.account-history > .head > .fl:after {display:block;content:"";clear:both;}
.account-history > .head > .fl > a.order {float:left;display:block;padding:0 13px;color:#2175c6;border-radius:13px;border:1px solid #d3d3d3;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.account-history > .head > .fl > dl.select {float:left;margin-left:10px;}
.account-history > .head > .fl > dl.select > dt {color:#2175c6;}
.account-history > .head > .fl > dl.select > dd > ul > li > a.cur,
.account-history > .head > .fl > dl.select > dd > ul > li > a.on {background-color:#f2f2f2;}
.account-history > .head > .fl > .cnt {float:left;display:block;margin-left:15px;}
.account-history > .head > .fr {}
.account-history > .head > .fr > a.toggle {position:relative;display:block;padding:0 7px 0 30px;font-size:13px;color:#fff;border-radius:14px;border:1px solid #838282;background-color:#959595;transition:all .2s;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
.account-history > .head > .fr > a.toggle:after {position:absolute;left:0;top:0;display:block;content:"";width:26px;height:26px;border-radius:13px;background-color:#fff;transition:all .2s;}
.account-history > .head > .fr > a.toggle.on {padding:0 30px 0 7px;border:1px solid #1b71c5; background-color:#3789db;}
.account-history > .head > .fr > a.toggle.on:after {left:100%;transform:translateX(-100%);border-color:#1b71c5;}
.account-history > ul.list {margin-top:15px;line-height:14px;font-size:14px;}
.account-history > ul.list > li {}
.account-history > ul.list > li.date {padding:10px 0;background-color:#f2f2f2;}
.account-history > ul.list > li.itm {border-bottom:1px solid #ebebeb;}
.account-history > ul.list > li.itm > a {display:block;}
.account-history > ul.list > li.itm .wrapper {display:block;padding:15px 0;}
.account-history > ul.list > li.itm .wrapper p {line-height:22px;}
.account-history > ul.list > li.itm .wrapper > .fl {}
.account-history > ul.list > li.itm .wrapper > .fl > .p1 {color:#777777;}
.account-history > ul.list > li.itm .wrapper > .fl > .p2 {font-size:15px;}
.account-history > ul.list > li.itm .wrapper > .fl > .p3 {font-size:15px;padding-left:22px;background:no-repeat left center;background-size:auto 17px;}
.account-history > ul.list > li.itm .wrapper > .fl > .p3.usd {background-image:url('../img/common_icon_flag01_usd.png');}
.account-history > ul.list > li.itm .wrapper > .fl > .p3.jpy {background-image:url('../img/common_icon_flag01_jpy.png');}
.account-history > ul.list > li.itm .wrapper > .fl > .p3.cny {background-image:url('../img/common_icon_flag01_cny.png');}
.account-history > ul.list > li.itm .wrapper > .fr {text-align:right;font-size:15px;}
.account-history > ul.list > li.itm .wrapper > .fr > .p1 {color:#1871d0;font-family:'OneShinhanMedium';}
.account-history > ul.list > li.itm .wrapper > .fr > .p2 {color:#257cd4;font-family:'OneShinhanMedium';}
.account-history > ul.list > li.itm .wrapper > .fr > .p2 > strong {font-size:18px;}
.account-history > ul.list > li.itm .wrapper > .fr > .p3 {margin-top:5px;font-size:14px;}
.account-history > ul.list > li.itm .wrapper > .fr > .p3 > strong {}
.account-history > ul.list > li.itm.deposit .wrapper > .fr > .p1 {color:#f02a40;}
.account-history > ul.list > li.itm.deposit .wrapper > .fr > .p2 {color:#f02a40;}
.account-history > ul.list > li.nodata {padding:50px 0;color:#999;text-align:center;}

.my-account-list {z-index:200;position:fixed;left:0;right:0;bottom:0;top:0;display:none;}
.my-account-list > .dim {position:absolute;left:0;right:0;bottom:0;top:0;background-color:rgba(0,0,0,0.5);opacity:0;transition:all .3s;}
.my-account-list > .pop {position:absolute;left:0;right:0;bottom:0;min-height:40%;max-height:100%;line-height:16px;font-size:16px;background-color:#fff;opacity:0;transform:translateY(50%);transition:all .3s;}
.my-account-list > .pop > .head {padding:15px 0;border-bottom:1px solid #f0f0f0;}
.my-account-list > .pop > .head > .wrapper:after {display:block;content:"";clear:both;}
.my-account-list > .pop > .head > .wrapper > .tit {float:left;font-family:'OneShinhanMedium';}
.my-account-list > .pop > .head > .wrapper > .close {float:right;display:block;font-size:0;width:16px;background:url('../img/layout_head_close.png') no-repeat center center;background-size:contain;}
.my-account-list > .pop > .lst {}
.my-account-list > .pop > .lst > li {border-bottom:1px solid #f0f0f0;}
.my-account-list > .pop > .lst > li > a {display:block;padding:20px 0;}
.my-account-list > .pop > .lst > li > a > .wrapper {padding-left:47px;background:url('../img/common_icon_bank_sh02.png') no-repeat left center;background-size:contain;}
.my-account-list > .pop > .lst > li > a > .wrapper > .tit {font-size:15px;}
.my-account-list > .pop > .lst > li > a > .wrapper > .num {margin-top:5px;font-size:14px;color:#686868;}

.my-account-list.ing {display:block;}
.my-account-list.on > .dim {opacity:1;}
.my-account-list.on > .pop {opacity:1;transform:translateY(0);}

/*
 * 계좌이체
 */

@keyframes blink-cursor {
    50% {padding-right:1.5px;border-right:0;}
}

.transfer-head {padding:20px 0;line-height:30px;font-size:15px;background-color:#f3f3f3;}
.transfer-head p {}
.transfer-head > .wrapper > .fl {}
.transfer-head > .wrapper > .fr.info {text-align:right;}
.transfer-head > .wrapper > .fr.info a {border-bottom:1px solid #8a8a8a;}
.transfer-head > .wrapper > .fr.info strong {font-size:16px;}
.transfer-head > .wrapper > .fr.edit {display:none;}

.transfer-head.edit {line-height:17px;}
.transfer-head.edit > .wrapper > .fl p {margin-top:11px;padding:8px 0;}
.transfer-head.edit > .wrapper > .fl p:first-child {margin-top:0;}
.transfer-head.edit > .wrapper > .fr.info {display:none;}
.transfer-head.edit > .wrapper > .fr.edit {display:block;width:60%;}
.transfer-head.edit > .wrapper > .fr.edit > .inp {position:relative;display:block;margin-top:10px;padding:8px 0;border-bottom:1px solid #dfdfdf;}
.transfer-head.edit > .wrapper > .fr.edit > .inp:first-child {margin-top:0;}
.transfer-head.edit > .wrapper > .fr.edit > .inp:after {display:block;content:"";clear:both;}
.transfer-head.edit > .wrapper > .fr.edit > .inp > .hld {position:absolute;left:0;top:0;padding:8px 0;color:#b1b1b1;display:none;}
.transfer-head.edit > .wrapper > .fr.edit > .inp > .num {float:left;display:block;height:17px;padding-right:1.5px;font-weight:bold;letter-spacing:-0.05em;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.transfer-head.edit > .wrapper > .fr.edit > .inp > .dsp {float:left;display:block;font-size:13px;}
.transfer-head.edit > .wrapper > .fr.edit > .inp.focus {color:#0d4bbf;border-color:#0d4bbf;}
.transfer-head.edit > .wrapper > .fr.edit > .inp.focus > .num {padding-right:0;border-right:1.5px solid #262626;animation:blink-cursor 1s step-end infinite;}
.transfer-head.edit > .wrapper > .fr.edit > .inp.warn {color:#f02a40;border-color:#f02a40;}
.transfer-head.edit > .wrapper > .fr.edit > .dsc {margin-top:10px;line-height:12px;font-size:12px;color:#f02a40;display:none;}

.transfer-sect {margin-top:40px;}
.transfer-sect > h3 {font-size:22px;}
.transfer-sect > h4 {font-size:16px;}
.transfer-sect > .input-amount {margin-top:20px;}
.transfer-sect > .input-amount > .txt {height:13px;line-height:13px;font-size:13px;color:#999;}
.transfer-sect > .input-amount > .dsc {margin-top:15px;line-height:14px;font-size:14px;color:#f02a40;}
.transfer-sect > .input-amount > .inp {position:relative;margin-top:15px;padding-bottom:10px;line-height:26px;color:#0d4bbf;border-bottom:1px solid #0d4bbf;}
.transfer-sect > .input-amount > .inp:after {display:block;content:"";clear:both;}
.transfer-sect > .input-amount > .inp > .hld {z-index:-1;position:absolute;left:0;top:0;color:#ddd;font-size:18px;}
.transfer-sect > .input-amount > .inp > .num {float:left;display:block;padding-right:1.5px;height:26px;font-size:24px;font-family:'OneShinhanBold';letter-spacing:-0.05em;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.transfer-sect > .input-amount > .inp.focus > .num {padding-right:0;border-right:1.5px solid #262626;animation:blink-cursor 1s step-end infinite;}
.transfer-sect > .input-amount > .inp > .dsp {float:left;display:none;font-size:22px;}
.transfer-sect > .input-amount > .inp.warn {color:#f02a40;border-color:#f02a40;}

@media (max-width:374px) /* 해상도 낮은 Mobile */
{
    .transfer-sect > .input-amount,
    .transfer-sect > .input-account {margin-bottom:170px;}
}

.transfer-sect > .input-account {margin-top:20px;}
.transfer-sect > .input-account:after {display:block;content:"";clear:both;}
.transfer-sect > .input-account > dl.select {float:left;width:35%;}
.transfer-sect > .input-account > dl.select > dt {padding-bottom:10px;border-bottom:1px solid #262626;}
.transfer-sect > .input-account > dl.select.on {color:#1251c5;}
.transfer-sect > .input-account > dl.select.on > dt {border-color:#1251c5;}
.transfer-sect > .input-account > .inp {float:right;width:calc(65% - 20px);}
.transfer-sect > .input-account > .inp > input {display:block;width:100%;padding-bottom:10px;border:0;border-bottom:1px solid #262626;font-family:'OneShinhanMedium';}
.transfer-sect > .input-account > .inp > input:focus {color:#1251c5;border-color:#1251c5;}
.transfer-sect > .input-account > .inp > .dsc {display:none;margin-top:10px;font-size:13px;color:#f02a40;}
.transfer-sect > .input-account > .inp.warn > input {color:#f02a40 !important;border-color:#f02a40 !important;}
.transfer-sect > .input-account > .inp.warn > .dsc {display:block;}
.transfer-sect > .input-account > .inp > .lnk {margin-top:10px;text-align:right;}
.transfer-sect > .input-account > .inp > .lnk a {display:inline-block;font-size:13px;border-bottom:1px solid #8a8a8a;}

.trans-account-list {display:none;z-index:200;position:fixed;left:0;right:0;bottom:0;height:calc(100% - 330px);max-height:50%;background-color:#fff;padding-top:10px;border-radius:10px 10px 0 0;
    opacity:0;transform:translateY(50%);transition:all .3s;
    -webkit-box-shadow: 0px 0px 20px 3px rgba(110,110,110,0.4); 
            box-shadow: 0px 0px 20px 3px rgba(110,110,110,0.4);}
.trans-account-list > .tab {border-bottom:1px solid #efefef;}
.trans-account-list > .tab > .wrapper:after {display:block;content:"";clear:both;}
.trans-account-list > .tab > .wrapper > a {position:relative;float:left;display:block;padding:10px 20px 15px;line-height:16px;font-size:16px;color:#acacac;font-family:'OneShinhanBold';-webkit-tap-highlight-color:transparent;}
.trans-account-list > .tab > .wrapper > a:before {position:absolute;left:0;top:10px;display:block;content:"";height:16px;width:1px;background-color:#e3e3e3;}
.trans-account-list > .tab > .wrapper > a:first-child:before {display:none;content:none;}
.trans-account-list > .tab > .wrapper > a.on {color:#0c26db;}
.trans-account-list > .tab > .wrapper > a.on:after {position:absolute;left:50%;right:0;bottom:-1px;transform:translateX(-50%);width:60%;height:3px;display:block;content:"";background-color:#0c26db;border-radius:1.5px;}
.trans-account-list > .tab-cont {display:none;height:calc(100% - 42px);overflow-y:auto;}
.trans-account-list > .tab-cont.on {display:block;}
.trans-account-list ul.lst {line-height:16px;}
.trans-account-list ul.lst > li {border-bottom:1px solid #f0f0f0;}
.trans-account-list ul.lst > li.skeleton {display:none;}
.trans-account-list ul.lst > li > a {position:relative;display:block;padding:15px 0;}
.trans-account-list ul.lst > li > a > .info {padding-left:47px;background:url('../img/common_icon_bank_sh02.png') no-repeat left center;background-size:contain;}
.trans-account-list ul.lst > li > a > .date {position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:14px;color:#a7a7a7;}
.trans-account-list ul.lst > li > a .tit {font-size:15px;font-family:'OneShinhanMedium';}
.trans-account-list ul.lst > li > a .num {margin-top:5px;font-size:14px;color:#686868;}
.trans-account-list .search {padding:15px 0 10px;}
.trans-account-list .search > .inp {padding-bottom:2px;}
.trans-account-list .search > .inp > input {position:relative;padding:0 15px;height:44px;width:100%;border:1px solid #bfbfbf;background-color:#efefef;border-radius:5px;color:#1251c5;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.trans-account-list .search > .inp.focus {padding-bottom:1px;border-bottom:1px solid #1251c5;}
.trans-account-list .search > .inp.focus > input {border-color:#1251c5;background-color:#fff;}
.trans-account-list .search > .dsc {margin-top:15px;font-size:14px;line-height:15px;color:#666;text-align:center;}
 
.trans-account-list.ing {display:block;}
.trans-account-list.on {opacity:1;transform:translateY(0);}

@media (max-width:374px) /* 해상도 낮은 Mobile */
{
    .trans-account-list {min-height:50%;}
}


.transfer-memo {margin-top:30px;padding:20px 20px 60px;line-height:30px;font-size:14px;background-color:#fafafa;}
.transfer-memo > dl {margin-top:10px;}
.transfer-memo > dl:first-child {margin-top:0;}
.transfer-memo > dl:after {display:block;content:"";clear:both;}
.transfer-memo > dl > dt {float:left;width:110px;color:#747474;}
.transfer-memo > dl > dd {float:right;width:calc(100% - 110px);}
.transfer-memo > dl > dd > input {display:block;height:30px;width:100%;border:0;border-bottom:1px solid #ccc;background-color:transparent;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.transfer-memo.dsc {padding:20px;}
.transfer-memo.dsc > dl > dd {text-align:right;}
.transfer-memo.t2 {border:1px solid #9db5e7;background-color:#fff;}
.transfer-memo.t2 > dl > dt {color:inherit;}
.transfer-memo.t3 {padding-left:0;padding-right:0;}
.transfer-memo.t3 > dl {margin:0 20px;}
.transfer-memo.t3 > dl.sum {margin:0;padding:10px 20px;background-color:#f2f7fd;}
.transfer-memo.t3 > dl.sum > dd {color:#063ebf;}

.transfer-summary {margin-top:30px;line-height:32px;font-size:15px;}
.transfer-summary:after {display:block;content:"";clear:both;}
.transfer-summary > dt {float:left;display:block;width:80px;}
.transfer-summary > dd {float:left;display:block;width:calc(100% - 80px);text-align:right;}
.transfer-summary > dd.amount {font-size:16px;}
.transfer-summary > dd.amount > strong {font-size:18px;font-weight:normal;font-family:'OneShinhanBold';}
.transfer-summary > dd > .bank {display:inline-block;font-size:14px;font-weight:bold;letter-spacing:-0.05em;}
.transfer-summary > dd > .bank.SH {padding-left:20px;background:url('../img/common_icon_bank_sh.png') no-repeat left center;background-size:auto 16px;}

.message-area {margin-top:20px;line-height:20px;font-size:13px;color:#999;text-align:center;word-break:keep-all;}
.message-area ul.lst {line-height:18px;font-size:14px;text-align:left;}
.message-area ul.lst > li {position:relative;margin-top:5px;padding-left:13px;}
.message-area ul.lst > li:first-child {margin-top:0;}
.message-area ul.lst > li:after {position:absolute;left:0;top:7.5px;display:block;content:"";width:3px;height:3px;border-radius:50%;background-color:#666;}

/*
 * 작업완료 페이지
 */
 
.process-done {z-index:90;position:fixed;left:0;right:0;top:0;bottom:0;padding:50px 0;/*display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:space-between;*/}
.process-done:before {display:block;content:"";height:50%;background:url('../img/common_icon_done01.png') no-repeat center center;background-size:70px auto;}
.process-done > .inf {}
.process-done > .inf > .txt {line-height:17px;font-size:17px;}
.process-done > .inf > .dsc {line-height:14px;font-size:14px;color:#747474;margin-top:10px;}
.process-done > .inf > .amt {line-height:32px;font-size:28px;margin-top:15px;}
.process-done > .inf > .amt > strong {font-size:32px;font-weight:normal;font-family:'OneShinhanBold';}
.process-done > .inf > .msg {line-height:20px;font-size:20px;color:#2790fb;margin-top:10px;}
.process-done > .btn-area {/*margin-bottom:30px;*/position:absolute;left:0;right:0;bottom:80px;}
.process-done > .btn-area:after {display:block;content:"";clear:both;}
.process-done > .btn-area > a {float:left;display:block;margin-left:10px;padding:10px 0;width:calc((100% - 10px)/2);font-size:14px;text-align:center;border:1px solid #d6d5d5;border-radius:5px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.process-done > .btn-area > a:first-child {margin-left:0;}

@media (max-width:374px)
{
    .process-done {}
    .process-done:before {height:40%;background-size:50px auto;}
    .process-done > .inf > .txt {line-height:16px;font-size:16px;}
    .process-done > .inf > .dsc {line-height:13px;font-size:13px;}
    .process-done > .inf > .amt {line-height:28px;font-size:24px;}
    .process-done > .inf > .amt > strong {font-size:28px;}
    .process-done > .inf > .msg {line-height:18px;font-size:18px;}
    .process-done > .btn-area {bottom:60px;}
}

/*
 * 계좌비밀번호 재등록
 */
 
.password-reset {padding-top:20px;}
.password-reset a.chk {display:block;padding:10px 0 10px 30px;font-size:16px;background:url('../img/common_icon_check01.png') no-repeat left center;background-size:auto 22px;-webkit-tap-highlight-color:transparent;}
.password-reset a.chk.on {background-image:url('../img/common_icon_check01_on.png')}
.password-reset a.chk > .txt {font-size:15px;}
.password-reset a.chk > .dsc {font-size:15px;color:#5e5e5e;}
.password-reset > .head {}
.password-reset > .head > .tit {padding-bottom:10px;line-height:16px;font-size:16px;font-family:'OneShinhanMedium';}
.password-reset > .list {border-top:1px solid #4b4b4b;}
.password-reset > .list > a {padding-left:40px;background-position:left 10px center;border-top:1px solid #efefef;}
.password-reset > .list > a:first-child {border-top:0;}
 
.toggle-box {margin-top:20px;border-top:5px solid #f2f2f2;}
.toggle-box > h3 {line-height:40px;font-size:15px;color:#3889db;font-weight:normal;font-family:'OneShinhanMedium';}
.toggle-box > .tit {position:relative;display:block;line-height:40px;font-size:15px;font-family:'OneShinhanMedium';-webkit-tap-highlight-color:transparent;}
.toggle-box > .tit:after {position:absolute;top:0;right:0;display:block;content:"";width:40px;height:100%;transform:rotate(0);transition:all .3s;background:url('../img/common_icon_toggle01.png') no-repeat center center;background-size:35%;}
.toggle-box > .tit.none:after {display:none;content:none;}
.toggle-box > .cnt {padding-top:5px;transform:scaleY(0);opacity:0;transform-origin:top center;transition:all .3s;}
.toggle-box > .cnt ul.lst {line-height:18px;font-size:13px;color:#5e5e5e;}
.toggle-box > .cnt ul.lst > li {position:relative;margin-top:10px;padding-left:8px;}
.toggle-box > .cnt ul.lst > li:after {position:absolute;left:0;top:7.5px;display:block;content:"";width:3px;height:3px;background-color:#5e5e5e;border-radius:50%;}
.toggle-box > .cnt ul.lst > li:first-child {margin-top:0;}
.toggle-box.on > .tit:after {transform:rotate(180deg);}
.toggle-box.on > .cnt {transform:scaleY(1);opacity:1;}

/*
 * 계좌개설 > 상품선택
 */

.m401000 {background-color:#e4e4e4;}
.m401000 section {padding:30px 0 50px;}
.m401000 section.t01 {background-color:#d3f2fa;}
.m401000 section.t02 {background-color:#e4e4e4;}
.m401000 section h3 {font-size:20px;font-weight:normal;font-family:'OneShinhanMedium';}
.m401000 section .list {margin-top:20px;}
.m401000 section .list > a {position:relative;margin-top:30px;height:130px;text-align:center;background-color:#fff;border-radius:10px;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:center;align-items:center;-webkit-tap-highlight-color:transparent;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(110,110,110,0.27); 
            box-shadow: 0px 0px 10px 0px rgba(110,110,110,0.27);}
.m401000 section .list > a:first-child {margin-top:0;}
.m401000 section .list > a:after {position:absolute;display:block;content:"";height:100%;background:no-repeat center bottom;background-size:contain;}
.m401000 section .list > a.t01:after {background-image:url('../img/sub4010_img01.png');width:30%;bottom:-6px;right:10px;}
.m401000 section .list > a.t02:after {background-image:url('../img/sub4010_img02.png');width:20%;bottom:-10px;left:3%;}
.m401000 section .list > a.t03:after {background-image:url('../img/sub4010_img03.png');width:22%;bottom:-15px;right:2%;}
.m401000 section .list > a > .tit {line-height:18px;font-size:18px;font-weight:normal;font-family:'OneShinhanMedium';}
.m401000 section .list > a > .dsc {margin-top:10px;line-height:13px;font-size:13px;color:#5a5959;}
.m401000 section .list > a > .lnk {display:inline-block;margin-top:15px;padding:0 15px;line-height:26px;font-size:13px;color:#1251c5;border:1.5px solid #1251c5;border-radius:13px;font-family:'OneShinhanMedium';}
.m401000 section .list > a:hover > .lnk {color:#fff;background-color:#1251c5;}
 
/*
 * 계좌개설 > 약관동의
 */

.h402010, 
.h403020 {background-color:#eeede9;}
.agreement {}
.agreement > .head {padding:20px 0;background-color:#fff;}
.agreement > .head h3 {line-height:18px;font-size:18px;font-weight:normal;font-family:'OneShinhanMedium';}
.agreement > .head h4 {line-height:16px;font-size:16px;font-weight:normal;margin-top:15px;}
.agreement > .cont {padding:20px 0;background-color:#eeede9;}
.agreement > .cont > .box {border:2px solid #000;}
.agreement > .cont > .box > .check-all {display:block;padding:10px 15px;font-size:18px;padding-left:45px;border:1px solid #ddd;background:#f8f8f8 url('../img/common_icon_check01.png') no-repeat left 15px center;background-size:auto 22px;-webkit-tap-highlight-color:transparent;}
.agreement > .cont > .box > .check-all.on {background-image:url('../img/common_icon_check01_on.png');}
.agreement > .cont > .box > .list {padding:20px 15px 80px;background-color:#fff;}
.agreement > .cont > .box > .list > .check {display:block;line-height:22px;font-size:15px;margin-top:20px;padding-left:30px;background:url('../img/common_icon_check01.png') no-repeat left top 1px;background-size:auto 22px;-webkit-tap-highlight-color:transparent;}
.agreement > .cont > .box > .list > .check:first-child {margin-top:0;}
.agreement > .cont > .box > .list > .check.on {background-image:url('../img/common_icon_check01_on.png');}
 
/*
 * 계좌개설 > 완료페이지
 */
.h402020 #LAYOUT_BODY {padding-bottom:20px;}
.register-done {position:relative;min-height:500px;}
.register-done > .msg {padding-top:120px;line-height:30px;font-size:22px;text-align:center;background:url('../img/common_img_done01.png') no-repeat center top 40px;background-size:auto 65px;}
.register-done > .msg strong {color:#257cd4;}
.register-done > .inf {margin-top:40px;padding:15px 15px;line-height:32px;font-size:15px;border:1px solid #262626;border-left:0;border-right:0;}
.register-done > .inf:after {display:block;content:"";clear:both;}
.register-done > .inf > dt {float:left;width:110px;color:#5e5e5e;}
.register-done > .inf > dd {float:left;width:calc(100% - 110px);text-align:right;}
.register-done > .tip {margin-top:60px;}
.register-done > .tip > .txt {position:relative;padding:15px 0;margin:0 auto;width:80%;line-height:26px;font-size:16px;text-align:center;border:2px solid #262626;border-radius:15px;
    -webkit-box-shadow: 3px 3px 0px 2px rgba(237,236,236,1); 
            box-shadow: 3px 3px 0px 2px rgba(237,236,236,1);}
.register-done > .tip > .txt:after {position:absolute;left:50%;bottom:0;transform:translate(-50%, 100%);display:block;content:"";width:24px;height:24px;background:url('../img/sub4022_bullet01.png') no-repeat center top;background-size:contain;}
.register-done > .tip > .txt strong {color:#257cd4;font-weight:normal;font-family:'OneShinhanMedium';}
.register-done > .tip > .txt > span {display:block;}
.register-done > .tip > img {display:block;width:70%;margin:35px 2% 0 auto;}
 
/*
 * 계좌개설 > 적금상품 > 상품소개
 */
 
.h403010 {background-color:#f4f3f1;}
.p403010 > .tit {margin-top:50px;text-align:center;}
.p403010 > .tit > .dsc {line-height:16px;font-size:16px;color:#3789db;}
.p403010 > .tit > h3 {margin-top:15px;line-height:68px;font-size:68px;color:#171717;letter-spacing:-0.06em;}
.p403010 > img.visual {display:block;width:100%;margin-top:50px;}
.p403010 > .inf {margin-top:30px;padding:10px 20px;text-align:center;border:1px solid #333;border-radius:10px;background-color:#fff;}
.p403010 > .inf:after {display:block;content:"";clear:both;}
.p403010 > .inf > li {float:left;width:50%;padding:15px 0;border-top:1px solid #bebebe;border-left:1px solid #bebebe;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.p403010 > .inf > li:nth-child(1),
.p403010 > .inf > li:nth-child(2) {border-top:0;}
.p403010 > .inf > li:nth-child(2n+1) {border-left:0;}
.p403010 > .inf > li > .p1 {line-height:13px;font-size:13px;}
.p403010 > .inf > li > .p2 {line-height:16px;font-size:16px;margin-top:5px;color:#3789db;font-family:'OneShinhanMedium';}
.p403010 > .btns {margin-top:40px;}
.p403010 > .btns > a {display:block;margin:0 auto;width:66%;padding:8px 0;font-size:18px;color:#fff;text-align:center;background-color:#0f51ca;}
.p403010 > .btns > a.t2 {color:#fff;background-color:#999;}
.p403010 > .btns.n02 {}
.p403010 > .btns.n02:after {display:block;content:"";clear:both;}
.p403010 > .btns.n02 > a {float:left;width:calc((100% - 5px)/2);margin-left:5px;}
.p403010 > .btns.n02 > a:first-child {margin-left:0;}

/*
 * 계좌개설 > 적금상품 > 출금계좌 선택
 */

.pair-list {padding:25px 0;}
.pair-list.bd1 {border-bottom:1px solid #e1e1e1;}
.pair-list.split {border-bottom:5px solid #f2f2f2;}
.pair-list.split.upper {border-bottom:0;border-top:5px solid #f2f2f2;}
.pair-list > dt {line-height:16px;font-size:16px;color:#3889db;font-family:'OneShinhanMedium';}
.pair-list > dd {margin-top:10px;}
.pair-list > dd.h3 {line-height:20px;font-size:20px;font-family:'OneShinhanMedium';}
.pair-list > dd.trans {}
.pair-list > dd.trans:after {display:block;content:"";clear:both;}
.pair-list > dd.trans > dl {float:left;margin-left:20px;width:calc((100% - 20px)/2);padding:10px 0;line-height:18px;text-align:center;border-bottom:1px solid #dce4ec;}
.pair-list > dd.trans > dl:first-child {margin-left:0;}
.pair-list > dd.trans > dl:after {display:block;content:"";clear:both;}
.pair-list > dd.trans > dl > dt {float:left;width:70%;font-size:18px;font-family:'OneShinhanMedium';}
.pair-list > dd.trans > dl > dd {float:left;width:30%;font-size:16px;}
.pair-list > dd.accounts {}
.pair-list > dd.accounts > a {display:block;padding:10px 0;line-height:16px;font-size:16px;background:url('../img/common_icon_select01.png') no-repeat right top 14px;background-size:auto 8px;}
.pair-list > dd.accounts > a.dsp {background:none;}
.pair-list > dd.accounts > a > .tit {font-family:'OneShinhanMedium';}
.pair-list > dd.accounts > a > .dsc {margin-top:10px;color:#696969;}
.pair-list > dd.accounts > .amt {margin-top:10px;font-size:15px;text-align:right;}
 
/*
 * 환전
 */
 
.exchange-step {padding:13px 0;border-bottom:1px solid #e1e1e1;line-height:22px;}
.exchange-step > .wrapper:after {display:block;content:"";clear:both;}
.exchange-step .tit {float:left;font-size:15px;font-family:'OneShinhanMedium';}
.exchange-step .step {float:right;}
.exchange-step .step:after {display:block;content:"";clear:both;}
.exchange-step .step > a {float:left;display:block;margin-left:5px;width:22px;height:22px;font-size:12px;color:#929292;text-align:center;border:1px solid #929292;border-radius:50%;}
.exchange-step .step > a:first-child {margin-left:0;}
.exchange-step .step > a.on {color:#fff;border-color:#3889db;background-color:#3889db;}
.exchange-step .step > a.done {font-size:0;border-color:#3889db;background:#3889db url('../img/common_icon_check02_white.png') no-repeat left 6px top 6px;background-size:auto 11px;}
 
.exchange-input {margin-top:20px;}
.exchange-input > .tit {margin-bottom:15px;line-height:15px;font-size:15px;color:#3889db;font-weight:normal;font-family:'OneShinhanMedium';}
.exchange-input > .eql {padding:10px 0;font-size:13px;color:#3889db;text-align:right;background:url('../img/common_icon_equal01.png') no-repeat center center;background-size:auto 25%;}
.exchange-input > .inp {padding:20px 15px;border:1px solid #dcdcdc;line-height:20px;}
.exchange-input > .inp:after {display:block;content:"";clear:both;}
.exchange-input > .inp > a {float:left;display:block;font-size:16px;font-family:'OneShinhanMedium';background:no-repeat left center;background-size:contain;-webkit-tap-highlight-color:transparent;}
.exchange-input > .inp > a.sel {position:relative;padding-right:25px;}
.exchange-input > .inp > a.sel:after {position:absolute;right:0;top:50%;transform:translateY(-50%);display:block;content:"";width:20px;height:20px;background:url('../img/common_icon_select01.png') no-repeat right center;background-size:auto 35%;}
.exchange-input > .inp > a.usd {padding-left:25px;background-image:url('../img/common_icon_flag01_usd.png');}
.exchange-input > .inp > a.jpy {padding-left:25px;background-image:url('../img/common_icon_flag01_jpy.png');}
.exchange-input > .inp > a.cny {padding-left:25px;background-image:url('../img/common_icon_flag01_cny.png');}
.exchange-input > .inp > a.krw {padding-left:25px;background-image:url('../img/common_icon_flag01_krw.png');}
.exchange-input > .inp > input {float:right;display:block;width:65%;padding:0;height:20px;font-size:15px;text-align:right;border:0;}
.exchange-input > .msg {display:none;margin-top:15px;line-height:18px;font-size:14px;color:#f02a40;}
.exchange-input > .msg.on {display:block;}
 
.currency-list {z-index:200;position:fixed;left:0;right:0;bottom:0;top:0;display:none;}
.currency-list > .dim {position:absolute;left:0;right:0;bottom:0;top:0;background-color:rgba(0,0,0,0.5);opacity:0;transition:all .3s;}
.currency-list > .pop {position:absolute;left:0;right:0;bottom:0;max-height:100%;line-height:16px;font-size:16px;background-color:#fff;opacity:0;transform:translateY(50%);transition:all .3s;}
.currency-list > .pop > .head {padding:15px 0;border-bottom:1px solid #f0f0f0;}
.currency-list > .pop > .head > .wrapper:after {display:block;content:"";clear:both;}
.currency-list > .pop > .head > .wrapper > .tit {float:left;font-family:'OneShinhanMedium';}
.currency-list > .pop > .head > .wrapper > .close {float:right;display:block;font-size:0;width:16px;background:url('../img/layout_head_close.png') no-repeat center center;background-size:contain;}
.currency-list > .pop > .lst {padding:20px 0;}
.currency-list > .pop > .lst > li {border:1px solid #dbdbdb;border-top:0;background-color:#fafafa;}
.currency-list > .pop > .lst > li:first-child {border-top:1px solid #dbdbdb;}
.currency-list > .pop > .lst > li > a {display:block;padding:15px 20px 15px 50px;background:no-repeat left 20px center;background-size:auto 20px;}
.currency-list > .pop > .lst > li > a.usd {background-image:url('../img/common_icon_flag01_usd.png');}
.currency-list > .pop > .lst > li > a.jpy {background-image:url('../img/common_icon_flag01_jpy.png');}
.currency-list > .pop > .lst > li > a.cny {background-image:url('../img/common_icon_flag01_cny.png');}

.currency-list.ing {display:block;}
.currency-list.on > .dim {opacity:1;}
.currency-list.on > .pop {opacity:1;transform:translateY(0);}

.popup {z-index:105;position:fixed;left:0;right:0;top:0;bottom:0;background-color:#fff;display:none;transform:translateX(70%);opacity:0;transition:all .3s;}
.popup.ing {display:block;}
.popup.on {transform:translateX(0);opacity:1;}
.popup > .head {line-height:50px;font-size:18px;font-family:'OneShinhanMedium';text-align:center;border-bottom: 1px solid #ddd;}
.popup > .head > .wrapper {position:relative;}
.popup > .head a.close {position:absolute;top:0;right:0;display:block;width:50px;height:50px;font-size:0;background:url('../img/layout_head_close.png') no-repeat center center;background-size:auto 18px;}
.popup > .body {padding:30px 0;height:calc(100% - 51px);overflow-y:auto;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}

.exchange-detail {margin-top:30px;}
.exchange-detail:first-child {margin-top:0;}
.exchange-detail > .tit {padding-bottom:10px;line-height:15px;font-size:15px;font-family:'OneShinhanMedium';}
.exchange-detail > dl.inf {line-height:18px;font-size:14px;border-top:1px solid #333;}
.exchange-detail > dl.inf:after {display:block;content:"";clear:both;}
.exchange-detail > dl.inf > dt {float:left;width:40%;padding:10px 5px;border-bottom:1px solid #e8e8e8;color:#666;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.exchange-detail > dl.inf > dd {float:left;width:60%;padding:10px 5px;border-bottom:1px solid #e8e8e8;font-family:'OneShinhanMedium';text-align:right;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.exchange-detail > dl.inf > dd.forex {}
.exchange-detail > dl.inf > dd.forex.usd {}
.exchange-detail > dl.inf > dd.forex.jpy {}
.exchange-detail > dl.inf > dd.forex.cny {}

/*================================================================================================
 * Tablet & Mobile 공용 : ~ 1023px
 *================================================================================================*/
@media (max-width:1023px) /* (max-width:1025px) */
{
}

/*================================================================================================
 * Tablet : 638px~1023px 해상도에서 해석하는 코드 
 *================================================================================================*/
@media (min-width:638px) and (max-width:1023px) /* (max-width:1025px) */
{   
}

/*================================================================================================
 * Mobile : 637px 이하 해상도에서 해석하는 코드
 *================================================================================================*/
@media(max-width:637px)
{
}

/*================================================================================================
 * Mobile : ~379px 해상도에서 해석하는 코드 (해상도 낮은 Mobile)
 *================================================================================================*/
@media (max-width:379px) /* (max-width:1025px) */
{
}